.epse {
    position: relative;
    max-width: 700px;
    width: 100%;
    margin: 0 auto;

    & > p {
        display: none;
    }

    strong {
        font-weight: 700;
    }

    .epse__input {
        width:100%;
        padding:8px;
        border:1px solid #ccc;
        border-radius:4px;
    }

    .epse__section-title {
        font-weight: bold;
        text-transform: uppercase;
    }

    .epse__header {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .epse__grid {
        display: grid;
        grid-template-columns: auto 1fr;
    }

    .epse__results {
        display:none;
        position:absolute;
        top:100%;
        left:0;
        width:100%;
        background:#fff;
        border:1px solid #ddd;
        box-shadow:0 2px 6px rgba(0,0,0,.1);
        padding:12px;
        z-index:999;
    }

    .epse__post-results {
        min-width: 200px;
    }

    .epse__product-results {
        grid-column: 2/3;
    }

    .epse__product-results,
    .epse__post-results {

        a {
            font-size: 1rem;
            line-height: 1.1;
        }
        
    }

    .epse__meta {
        ul {
            list-style: none;
            margin: 0;
            padding: 0;
            font-size: 0.8rem;
        }
    }

    .epse__topbar {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 6px 10px;
        border-bottom: 1px solid #ddd;
        background: #f9f9f9;
        font-weight: bold;
    }

    .epse__title {
        font-size: 1rem;
    }

    .epse__close {
        background: transparent;
        border: none;
        font-size: 1.2rem;
        cursor: pointer;
        line-height: 1;
        color: #333;
    }

    .epse__tabs {
        display: flex;
        gap: 10px;
        border-bottom: 1px solid #ddd;
        margin-top: 5px;
        padding: 0 10px;
    }

    .epse__tab {
        background: none;
        border: none;
        padding: 8px 12px;
        cursor: pointer;
        font-weight: 600;
        font-size: 0.9rem;
        color: var(--ep-color-dark, #333);
        border-radius: 0;
    }

    .epse__tab.active {
        border-bottom: 2px solid #333;
        color: #333;
    }

    .epse__tabcontent {
        padding: 10px;
    }


    .epse-products {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
        gap: 0.5rem;
    }

    .product {
        border:1px solid #ddd;
        padding: 0.5rem;
        .product__image {   
            display: inline-block;
            img {
                max-width: 100%;
            }
        }
    }
}

.epse-overlay {
    background: rgba(0,0,0,0.4);
    position: fixed;
    z-index: 998;
    inset: 0;
    display: none;
}