/* Store Hours Locker — Frontend v2.2.0 */

.shl-status { visibility:hidden; }
.shl-status[data-shl-ready="1"] { visibility:visible; }

.shl-closed-notice { margin-top:14px; padding:12px 16px; border-radius:8px; background:#fef3c7; border:1px solid #f59e0b; color:#92400e; font-size:14px; line-height:1.5; }
.shl-btn-disabled { opacity:0.5 !important; pointer-events:none !important; cursor:not-allowed !important; }

/* ── Overlay ─────────────────────────────── */
.shl-popup-overlay {
    position:fixed; inset:0; z-index:999999;
    display:none; align-items:center; justify-content:center;
    padding:16px;
    background:var(--shl-popup-overlay,rgba(0,0,0,0.6));
    -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
    opacity:0; transition:opacity .3s ease;
}
.shl-popup-overlay.shl-popup--visible { display:flex; opacity:1; }
.shl-popup-overlay.shl-popup--hiding { display:flex; opacity:0; }

/* ── Popup Box ───────────────────────────── */
.shl-popup-box {
    position:relative !important; width:100%;
    max-width:var(--shl-popup-width,640px);
    background:var(--shl-popup-bg,#fff);
    border-radius:var(--shl-popup-radius,16px);
    padding:48px 40px 36px; text-align:center;
    box-shadow:0 25px 60px rgba(0,0,0,.15),0 8px 20px rgba(0,0,0,.1);
    transform:scale(.92) translateY(20px); opacity:0;
    transition:transform .35s cubic-bezier(.34,1.56,.64,1),opacity .3s ease;
    max-height:90vh; overflow-y:auto; -webkit-overflow-scrolling:touch;
}
.shl-popup--visible .shl-popup-box { transform:scale(1) translateY(0); opacity:1; }
.shl-popup-overlay[data-animation="slideUp"] .shl-popup-box { transform:translateY(40px); }
.shl-popup-overlay[data-animation="slideUp"].shl-popup--visible .shl-popup-box { transform:translateY(0); }
.shl-popup-overlay[data-animation="fadeIn"] .shl-popup-box { transform:none; }

/* ── Close Button ────────────────────────── */
#shl-popup-close.shl-popup-close {
    position:absolute !important;
    top:16px !important;
    right:16px !important;
    left:auto !important;
    bottom:auto !important;
    width:40px !important;
    height:40px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    border:1px solid rgba(0,0,0,.1) !important;
    background:rgba(255,255,255,.95) !important;
    color:var(--shl-popup-close-color,#6b7280) !important;
    cursor:pointer !important;
    border-radius:50% !important;
    transition:background .2s ease,color .2s ease,box-shadow .2s ease;
    padding:0 !important;
    margin:0 !important;
    z-index:100 !important;
    box-shadow:0 2px 8px rgba(0,0,0,.1) !important;
    line-height:1 !important;
    float:none !important;
    transform:none !important;
    opacity:1 !important;
    min-width:0 !important;
    max-width:none !important;
    text-indent:0 !important;
    font-size:0 !important;
}
#shl-popup-close.shl-popup-close svg {
    display:block !important;
    width:20px !important;
    height:20px !important;
    pointer-events:none;
    color:inherit;
    stroke:currentColor;
}
#shl-popup-close.shl-popup-close:hover,
#shl-popup-close.shl-popup-close:focus {
    background:#fff !important;
    color:#111827 !important;
    box-shadow:0 2px 12px rgba(0,0,0,.15) !important;
    outline:none !important;
}
#shl-popup-close.shl-popup-close:active {
    transform:scale(.92) !important;
}

/* ── Lottie Icon ─────────────────────────── */
.shl-popup-icon {
    display:flex; justify-content:center; margin-bottom:20px;
    position:relative; z-index:1;
}

/* ── Title ───────────────────────────────── */
.shl-popup-title {
    margin:0 0 12px;
    font-size:var(--shl-popup-title-size,24px);
    font-weight:var(--shl-popup-title-weight,700);
    color:var(--shl-popup-title-color,#111827);
    line-height:1.3;
}

/* ── Content ─────────────────────────────── */
.shl-popup-content {
    margin:0;
    font-size:var(--shl-popup-text-size,16px);
    font-weight:var(--shl-popup-text-weight,400);
    color:var(--shl-popup-text-color,#4b5563);
    line-height:1.6;
}
.shl-popup-content p { margin:0 0 8px; }
.shl-popup-content p:last-child { margin-bottom:0; }

/* ── Mobile ──────────────────────────────── */
@media (max-width:600px) {
    .shl-popup-overlay { padding:16px; }
    .shl-popup-box {
        max-width:100%;
        max-height:85vh;
        border-radius:var(--shl-popup-radius,16px);
        padding:40px 24px 28px;
    }
    .shl-popup-title { font-size:var(--shl-popup-title-size-m,20px); }
    .shl-popup-content { font-size:var(--shl-popup-text-size-m,14px); }
    #shl-popup-close.shl-popup-close { top:12px !important; right:12px !important; width:36px !important; height:36px !important; }
    #shl-popup-close.shl-popup-close svg { width:18px !important; height:18px !important; }
}

body.shl-popup-open { overflow:hidden !important; }
