/* ============================================================ Elanlar v4.6.3 — Compact promotion popup + stacking fix ============================================================ */ /* Promotion popup is intentionally global because JS moves it to to escape theme stacking contexts. */ #elan-promote-modal{ position:fixed!important; inset:0!important; z-index:2147483600!important; display:flex; align-items:center!important; justify-content:center!important; padding:20px!important; background:rgba(15,23,42,.66)!important; backdrop-filter:blur(9px)!important; -webkit-backdrop-filter:blur(9px)!important; isolation:isolate!important; } #elan-promote-modal[style*="display: none"], #elan-promote-modal[style*="display:none"]{display:none!important} #elan-promote-modal .elan-modal__backdrop{ position:absolute!important; inset:0!important; z-index:0!important; background:transparent!important; backdrop-filter:none!important; -webkit-backdrop-filter:none!important; } #elan-promote-modal .elan-modal__box{ --promo-blue:#0067ed; --promo-text:#111827; --promo-muted:#64748b; --promo-line:#e3eaf3; position:relative!important; z-index:2!important; display:flex!important; flex-direction:column!important; width:min(720px,calc(100vw - 40px))!important; max-width:720px!important; max-height:min(88dvh,820px)!important; margin:0!important; overflow:hidden!important; border:1px solid rgba(226,232,240,.96)!important; border-radius:20px!important; background:#fff!important; box-shadow:0 30px 90px rgba(2,12,27,.34)!important; color:var(--promo-text)!important; } #elan-promote-modal .elan-modal__header{ flex:0 0 auto!important; display:flex!important; align-items:center!important; justify-content:space-between!important; min-height:58px!important; padding:15px 18px 8px!important; border:0!important; background:#fff!important; } #elan-promote-modal .elan-modal__header h3{ margin:0!important; color:var(--promo-text)!important; font-size:20px!important; line-height:1.2!important; font-weight:600!important; letter-spacing:-.035em!important; } #elan-promote-modal .elan-modal__header h3 svg{display:none!important} #elan-promote-modal .elan-modal__close{ all:unset!important; box-sizing:border-box!important; display:inline-flex!important; align-items:center!important; justify-content:center!important; flex:0 0 34px!important; width:34px!important; height:34px!important; border:1px solid #dce5ef!important; border-radius:50%!important; background:#fff!important; color:#526176!important; cursor:pointer!important; box-shadow:0 3px 10px rgba(15,23,42,.06)!important; font:500 18px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important; } #elan-promote-modal .elan-modal__close:hover{ border-color:#cbd5e1!important; background:#f8fafc!important; color:#dc2626!important; } #elan-promote-modal .elan-modal__subtitle{ flex:0 0 auto!important; margin:0!important; padding:0 18px 13px!important; border:0!important; border-bottom:1px solid #edf2f7!important; background:#fff!important; color:var(--promo-muted)!important; font-size:12px!important; line-height:1.45!important; font-weight:500!important; } #elan-promote-modal .elan-packages-grid{ flex:1 1 auto!important; min-height:0!important; display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; align-content:start!important; gap:12px!important; margin:0!important; padding:14px 16px 12px!important; overflow:auto!important; overscroll-behavior:contain!important; scrollbar-width:thin!important; background:#fff!important; } #elan-promote-modal .elan-pkg-card{ position:relative!important; display:flex!important; flex-direction:column!important; min-width:0!important; min-height:220px!important; margin:0!important; padding:0!important; overflow:hidden!important; border:1px solid #dce5ef!important; border-radius:13px!important; background:#fff!important; box-shadow:0 3px 12px rgba(15,23,42,.045)!important; cursor:pointer!important; transform:none!important; transition:border-color .15s,box-shadow .15s!important; } #elan-promote-modal .elan-pkg-card::before{ content:""!important; position:absolute!important; left:0!important; right:0!important; top:0!important; height:2px!important; background:var(--pkg-color,#0067ed)!important; } #elan-promote-modal .elan-pkg-card:hover{ border-color:color-mix(in srgb,var(--pkg-color,#0067ed) 55%,#dce5ef)!important; box-shadow:0 7px 20px rgba(15,23,42,.075)!important; transform:none!important; } #elan-promote-modal .elan-pkg-card.selected{ border-color:var(--pkg-color,#0067ed)!important; box-shadow:0 0 0 2px color-mix(in srgb,var(--pkg-color,#0067ed) 12%,transparent)!important; } #elan-promote-modal .elan-pkg-card__icon{display:none!important} #elan-promote-modal .elan-pkg-card__header{ display:grid!important; grid-template-columns:minmax(0,1fr) auto!important; align-items:start!important; gap:8px!important; padding:12px 12px 9px!important; border:0!important; border-bottom:1px solid #edf2f7!important; background:#fff!important; } #elan-promote-modal .elan-pkg-card__header>div{min-width:0!important} #elan-promote-modal .elan-pkg-card__header h4{ margin:0 0 2px!important; color:var(--promo-text)!important; font-size:13px!important; line-height:1.2!important; font-weight:600!important; letter-spacing:-.015em!important; } #elan-promote-modal .elan-pkg-card__duration{ display:block!important; color:#7b8aa0!important; font-size:9px!important; line-height:1.2!important; font-weight:600!important; } #elan-promote-modal .elan-pkg-card__price{ margin:0!important; color:var(--pkg-color,#0067ed)!important; font-size:14px!important; line-height:1.15!important; font-weight:600!important; white-space:nowrap!important; } #elan-promote-modal .elan-pkg-card__features{ flex:1 1 auto!important; list-style:none!important; margin:0!important; padding:9px 12px 6px!important; } #elan-promote-modal .elan-pkg-card__features li{ position:relative!important; margin:0!important; padding:3px 0 3px 17px!important; color:#526176!important; font-size:10.5px!important; line-height:1.35!important; font-weight:600!important; } #elan-promote-modal .elan-pkg-card__features li:nth-child(n+5){display:none!important} #elan-promote-modal .elan-pkg-card__features li::before{ content:"✓"!important; position:absolute!important; left:0!important; top:3px!important; display:flex!important; align-items:center!important; justify-content:center!important; width:11px!important; height:11px!important; border-radius:50%!important; background:var(--pkg-color,#0067ed)!important; color:#fff!important; box-shadow:none!important; font-size:7px!important; line-height:1!important; font-weight:600!important; } #elan-promote-modal .elan-pkg-select-btn{ all:unset!important; box-sizing:border-box!important; display:flex!important; align-items:center!important; justify-content:center!important; min-height:35px!important; margin:7px 10px 10px!important; padding:0 12px!important; border-radius:9px!important; background:#0067ed!important; color:#fff!important; box-shadow:0 5px 13px rgba(0,103,237,.16)!important; cursor:pointer!important; font-size:10.5px!important; line-height:1!important; font-weight:600!important; } #elan-promote-modal .elan-pkg-select-btn:hover{background:#005bd4!important} #elan-promote-modal .elan-promo-trust{ flex:0 0 auto!important; display:flex!important; align-items:center!important; justify-content:center!important; gap:8px!important; min-height:40px!important; padding:8px 14px 11px!important; border-top:1px solid #edf2f7!important; background:#fff!important; color:#7b8aa0!important; font-size:10px!important; line-height:1.2!important; font-weight:600!important; } #elan-promote-modal .elan-promo-trust__item{display:inline-flex!important;align-items:center!important;gap:5px!important} #elan-promote-modal .elan-promo-trust__item svg{color:#0067ed!important} #elan-promote-modal .elan-promo-trust__dot{color:#c3cedb!important} #elan-promote-modal #elan-promote-loading{flex:1 1 auto!important;min-height:180px!important} /* While the modal is open it must own the whole visual layer. */ html.elan-promo-modal-open, body.elan-promo-modal-open{overflow:hidden!important} body.elan-promo-modal-open #elan-promote-modal{pointer-events:auto!important} @media(max-width:640px){ #elan-promote-modal{ align-items:flex-end!important; padding:8px 8px calc(8px + env(safe-area-inset-bottom))!important; background:rgba(15,23,42,.68)!important; } #elan-promote-modal .elan-modal__box{ width:100%!important; max-width:none!important; max-height:calc(100dvh - 16px - env(safe-area-inset-bottom))!important; border-radius:18px!important; } #elan-promote-modal .elan-modal__header{ min-height:52px!important; padding:13px 14px 6px!important; } #elan-promote-modal .elan-modal__header h3{font-size:17px!important} #elan-promote-modal .elan-modal__subtitle{ padding:0 14px 10px!important; font-size:10.5px!important; } #elan-promote-modal .elan-packages-grid{ grid-template-columns:1fr!important; gap:8px!important; padding:10px!important; } #elan-promote-modal .elan-pkg-card{ min-height:0!important; border-radius:12px!important; } #elan-promote-modal .elan-pkg-card__header{padding:10px 11px 8px!important} #elan-promote-modal .elan-pkg-card__header h4{font-size:12px!important} #elan-promote-modal .elan-pkg-card__price{font-size:13px!important} #elan-promote-modal .elan-pkg-card__features{padding:7px 11px 4px!important} #elan-promote-modal .elan-pkg-card__features li{font-size:9.5px!important;padding-top:2px!important;padding-bottom:2px!important} #elan-promote-modal .elan-pkg-card__features li::before{top:2px!important} #elan-promote-modal .elan-pkg-select-btn{ min-height:32px!important; margin:5px 9px 9px!important; font-size:10px!important; } #elan-promote-modal .elan-promo-trust{min-height:34px!important;padding:6px 10px 8px!important;font-size:9px!important} } @media(max-width:380px){ #elan-promote-modal{padding:4px 4px calc(4px + env(safe-area-inset-bottom))!important} #elan-promote-modal .elan-modal__box{max-height:calc(100dvh - 8px - env(safe-area-inset-bottom))!important} #elan-promote-modal .elan-packages-grid{padding:8px!important;gap:7px!important} }