/* A small, non-blocking custom-design invitation for the Naqshat storefront. */
.nq-custom-design-sheet {
    --nq-lime: #c6ff2a;
    --nq-olive: #172c0a;
    position: fixed;
    inset: auto 24px 24px auto;
    z-index: 1005;
    width: min(408px, calc(100vw - 48px));
    box-sizing: border-box;
    padding: 23px 24px 18px;
    overflow: hidden;
    color: #f9f9f2;
    text-align: start;
    background:
        radial-gradient(circle at 98% 1%, rgba(198,255,42,.34), transparent 31%),
        radial-gradient(circle at 5% 96%, rgba(198,255,42,.16), transparent 35%),
        linear-gradient(135deg, #203b0f 0%, var(--nq-olive) 68%);
    border: 1px solid rgba(198,255,42,.5);
    border-radius: 24px;
    box-shadow: 0 20px 58px rgba(11,25,4,.31), 0 4px 14px rgba(0,0,0,.16);
    opacity: 0;
    pointer-events: none;
    transform: translate3d(0, 22px, 0) scale(.98);
    transition: opacity .28s ease, transform .34s cubic-bezier(.2,.8,.2,1);
}
.nq-custom-design-sheet[hidden] { display: none; }
.nq-custom-design-sheet.is-open { opacity: 1; pointer-events: auto; transform: translate3d(0, 0, 0) scale(1); }
.nq-custom-design-sheet__handle { display: none; }
.nq-custom-design-sheet__spark { position:absolute; inset:11px 44px auto auto; color:var(--nq-lime); font-size:20px; line-height:1; text-shadow:0 0 18px rgba(198,255,42,.65); }
[dir="rtl"] .nq-custom-design-sheet { inset: auto auto 24px 24px; }
[dir="rtl"] .nq-custom-design-sheet__spark { inset:11px auto auto 44px; }
.nq-custom-design-sheet__close {
    position:absolute; inset:12px 12px auto auto;
    display:grid; width:34px; height:34px; padding:0; place-items:center;
    color:#fff; font:300 28px/1 Arial,sans-serif; cursor:pointer;
    background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.16); border-radius:50%;
}
[dir="rtl"] .nq-custom-design-sheet__close { inset:12px auto auto 12px; }
.nq-custom-design-sheet__close:hover, .nq-custom-design-sheet__close:focus-visible { background:rgba(255,255,255,.2); outline:2px solid var(--nq-lime); outline-offset:2px; }
.nq-custom-design-sheet__eyebrow { margin:0 44px 8px 0; color:var(--nq-lime); font-size:12px; font-weight:800; letter-spacing:.02em; }
[dir="rtl"] .nq-custom-design-sheet__eyebrow { margin:0 0 8px 44px; }
.nq-custom-design-sheet h2 { max-width:310px; margin:0 0 8px; color:#fff; font-size:23px; font-weight:850; line-height:1.3; }
.nq-custom-design-sheet__copy { max-width:352px; margin:0 0 16px; color:rgba(255,255,255,.8); font-size:14px; line-height:1.7; }
.nq-custom-design-sheet__cta { display:flex; min-height:48px; align-items:center; justify-content:center; gap:9px; padding:10px 16px; color:#122506 !important; font-size:14px; font-weight:850; text-decoration:none; background:var(--nq-lime); border-radius:14px; box-shadow:0 9px 22px rgba(0,0,0,.17); transition:transform .18s ease, box-shadow .18s ease; }
.nq-custom-design-sheet__cta:hover, .nq-custom-design-sheet__cta:focus-visible { color:#122506 !important; transform:translateY(-2px); box-shadow:0 12px 25px rgba(0,0,0,.24); outline:2px solid #fff; outline-offset:2px; }
.nq-custom-design-sheet__cta svg { width:20px; height:20px; flex:0 0 auto; fill:currentColor; }
.nq-custom-design-sheet__later { display:block; width:max-content; margin:12px auto 0; padding:4px 7px; color:rgba(255,255,255,.74); font:600 12px/1.4 inherit; cursor:pointer; background:transparent; border:0; border-bottom:1px solid transparent; }
.nq-custom-design-sheet__later:hover, .nq-custom-design-sheet__later:focus-visible { color:#fff; border-bottom-color:currentColor; outline:none; }
@media (max-width: 1199px) {
    .nq-custom-design-sheet {
        inset:auto 0 calc(var(--nq-mobile-toolbar-height, 70px) + env(safe-area-inset-bottom, 0px)) 0;
        width:100%; max-width:none; padding:10px 24px 18px; border-radius:24px 24px 0 0;
        transform:translate3d(0, 105%, 0);
    }
    [dir="rtl"] .nq-custom-design-sheet { inset:auto 0 calc(var(--nq-mobile-toolbar-height, 70px) + env(safe-area-inset-bottom, 0px)) 0; }
    .nq-custom-design-sheet__handle { display:flex; height:21px; align-items:center; justify-content:center; margin:-5px 0 4px; touch-action:none; }
    .nq-custom-design-sheet__handle span { width:42px; height:4px; background:rgba(255,255,255,.42); border-radius:99px; }
    .nq-custom-design-sheet h2 { max-width:calc(100% - 35px); font-size:21px; }
    .nq-custom-design-sheet__copy { max-width:100%; margin-bottom:14px; }
}
@media (prefers-reduced-motion: reduce) {
    .nq-custom-design-sheet, .nq-custom-design-sheet__cta { transition:none; }
}
