.elco-popup-overlay, #popup-overlay { display: none; position: fixed; inset: 0; z-index: 1000000000; background: rgba(4, 8, 18, 0.72); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); opacity: 0; transition: opacity 0.25s ease; } .elco-popup-overlay.is-visible, #popup-overlay.is-visible { display: block; opacity: 1; } .elco-response-box, #response-box { display: none; position: fixed; left: 50%; top: 50%; z-index: 1000000001; width: min(92vw, 420px); transform: translate(-50%, -50%) scale(0.94); opacity: 0; direction: rtl; border: none; background: transparent; padding: 0; box-shadow: none; transition: opacity 0.25s ease, transform 0.25s ease; } .elco-response-box.is-visible, #response-box.is-visible { display: block; opacity: 1; transform: translate(-50%, -50%) scale(1); } .elco-response-box__panel { position: relative; overflow: hidden; padding: 1.75rem 1.5rem 1.35rem; text-align: center; border-radius: 18px; border: 1px solid rgba(72, 96, 140, 0.28); background: #ffffff; box-shadow: 0 18px 48px rgba(0, 0, 0, 0.28); } .elco-response-box__icon { display: inline-grid; place-items: center; width: 3.25rem; height: 3.25rem; margin: 0 auto 1rem; border-radius: 50%; font-size: 1.65rem; line-height: 1; } .elco-response-box__message, #response-box .response-message { margin: 0 0 1.25rem; color: #1a2236; font-size: 1.05rem; font-weight: 500; line-height: 1.75; word-wrap: break-word; } .elco-response-box__actions { display: flex; flex-wrap: wrap; gap: 0.65rem; justify-content: center; align-items: center; } .elco-response-box__btn, #response-box-close-btn { min-width: 7.5rem; margin: 0; padding: 0.65rem 1.35rem; font-weight: 600; border-radius: 10px; } .elco-response-box.success .elco-response-box__panel, #response-box.success .elco-response-box__panel { border-top: 3px solid #22c55e; } .elco-response-box.success .elco-response-box__icon, #response-box.success .elco-response-box__icon { color: #16a34a; background: rgba(34, 197, 94, 0.12); } .elco-response-box.warning .elco-response-box__panel, #response-box.warning .elco-response-box__panel { border-top: 3px solid #f59e0b; } .elco-response-box.warning .elco-response-box__icon, #response-box.warning .elco-response-box__icon { color: #d97706; background: rgba(245, 158, 11, 0.14); } .elco-response-box.error .elco-response-box__panel, #response-box.error .elco-response-box__panel { border-top: 3px solid #ef4444; } .elco-response-box.error .elco-response-box__icon, #response-box.error .elco-response-box__icon { color: #dc2626; background: rgba(239, 68, 68, 0.12); } .elco-response-box .popup-buttons { width: 100%; justify-content: center !important; } .elco-response-box .popup-buttons .btn { min-width: 6.5rem; border-radius: 10px; font-weight: 600; } body.elco-theme-premium .elco-response-box__panel, body.elco-theme-premium #response-box .elco-response-box__panel { color-scheme: dark; color: rgba(255, 255, 255, 0.9); background: radial-gradient(ellipse 70% 80% at 50% 100%, rgba(212, 175, 55, 0.12), transparent 72%), linear-gradient( 160deg, rgba(22, 34, 64, 0.98) 0%, rgba(15, 26, 50, 0.99) 52%, rgba(10, 18, 36, 0.99) 100% ); border: 1px solid rgba(212, 175, 55, 0.38); border-bottom-color: transparent; box-shadow: 0 0 36px rgba(212, 175, 55, 0.14), 0 22px 56px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.05); backdrop-filter: blur(16px) saturate(1.1); -webkit-backdrop-filter: blur(16px) saturate(1.1); } body.elco-theme-premium .elco-response-box__panel::before { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: var(--elco-tile-line-layer-thin); background-clip: border-box; } body.elco-theme-premium .elco-response-box__message, body.elco-theme-premium #response-box .response-message { color: rgba(255, 255, 255, 0.92); } body.elco-theme-premium .elco-response-box.success .elco-response-box__icon, body.elco-theme-premium #response-box.success .elco-response-box__icon { color: #86efac; background: rgba(34, 197, 94, 0.16); box-shadow: 0 0 18px rgba(34, 197, 94, 0.2); } body.elco-theme-premium .elco-response-box.warning .elco-response-box__icon, body.elco-theme-premium #response-box.warning .elco-response-box__icon { color: #fcd34d; background: rgba(245, 158, 11, 0.18); box-shadow: 0 0 18px rgba(245, 158, 11, 0.18); } body.elco-theme-premium .elco-response-box.error .elco-response-box__icon, body.elco-theme-premium #response-box.error .elco-response-box__icon { color: #fca5a5; background: rgba(239, 68, 68, 0.16); box-shadow: 0 0 18px rgba(239, 68, 68, 0.18); } body.elco-theme-premium .elco-popup-overlay, body.elco-theme-premium #popup-overlay { background: rgba(4, 8, 18, 0.78); } body.elco-theme-premium .elco-response-box .btn { min-height: 42px; font-weight: 700; } body.elco-theme-premium .elco-response-box .btn-primary { color: #14100a; } body.elco-theme-premium .elco-response-box .btn-primary::after { background: var(--btn-primary-bg); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.24), inset 0 -1px 0 rgba(100, 78, 32, 0.22); } body.elco-theme-premium .elco-response-box .btn-outline-secondary { color: #f2e8c8; } body.elco-theme-premium .elco-response-box .btn-outline-secondary::after { background: var(--btn-secondary-bg); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03); } body.elco-theme-premium .elco-response-box .btn .btn-shine-inner, body.elco-theme-premium .elco-response-box .btn > * { position: relative; z-index: 4; } body.elco-theme-premium .elco-response-box .btn-primary .btn-shine-inner, body.elco-theme-premium .elco-response-box .btn-primary > * { color: #14100a; } body.elco-theme-premium .elco-response-box .btn-outline-secondary .btn-shine-inner, body.elco-theme-premium .elco-response-box .btn-outline-secondary > * { color: #f2e8c8; } body.elco-theme-premium .elco-response-box .btn-primary:hover, body.elco-theme-premium .elco-response-box .btn-primary:focus { color: #14100a; } body.elco-theme-premium .elco-response-box .btn-outline-secondary:hover, body.elco-theme-premium .elco-response-box .btn-outline-secondary:focus { color: #fff; } body.elco-popup-open { overflow: hidden; } html[data-color-scheme="light"] body.elco-theme-premium .elco-response-box__panel, html[data-color-scheme="light"] body.elco-theme-premium #response-box .elco-response-box__panel { color-scheme: light; color: #1a2236; background: radial-gradient(ellipse 70% 80% at 50% 100%, rgba(201, 162, 39, 0.08), transparent 72%), linear-gradient(165deg, #ffffff 0%, #f5f8fc 100%); border-color: rgba(197, 160, 89, 0.32); border-bottom-color: transparent; box-shadow: 0 0 24px rgba(197, 160, 89, 0.1), 0 18px 40px rgba(15, 26, 50, 0.12); } html[data-color-scheme="light"] body.elco-theme-premium .elco-response-box__message, html[data-color-scheme="light"] body.elco-theme-premium #response-box .response-message { color: #1a2236; } html[data-color-scheme="light"] body.elco-theme-premium .elco-response-box .btn-primary, html[data-color-scheme="light"] body.elco-theme-premium #response-box .btn-primary { color: #ffffff !important; box-shadow: 0 4px 14px rgba(12, 18, 36, 0.18) !important; } html[data-color-scheme="light"] body.elco-theme-premium .elco-response-box .btn-primary::after, html[data-color-scheme="light"] body.elco-theme-premium #response-box .btn-primary::after { background: var(--btn-primary-bg) !important; } html[data-color-scheme="light"] body.elco-theme-premium .elco-response-box .btn-primary .btn-shine-inner, html[data-color-scheme="light"] body.elco-theme-premium .elco-response-box .btn-primary > *, html[data-color-scheme="light"] body.elco-theme-premium #response-box .btn-primary .btn-shine-inner, html[data-color-scheme="light"] body.elco-theme-premium #response-box .btn-primary > * { color: #ffffff !important; } html[data-color-scheme="light"] body.elco-theme-premium .elco-response-box .btn-primary:hover, html[data-color-scheme="light"] body.elco-theme-premium .elco-response-box .btn-primary:focus, html[data-color-scheme="light"] body.elco-theme-premium #response-box .btn-primary:hover, html[data-color-scheme="light"] body.elco-theme-premium #response-box .btn-primary:focus { color: #ffffff !important; } html[data-color-scheme="light"] body.elco-theme-premium .elco-response-box .btn-primary:hover::after, html[data-color-scheme="light"] body.elco-theme-premium .elco-response-box .btn-primary:focus::after, html[data-color-scheme="light"] body.elco-theme-premium #response-box .btn-primary:hover::after, html[data-color-scheme="light"] body.elco-theme-premium #response-box .btn-primary:focus::after { background: var(--btn-primary-bg-hover) !important; } html[data-color-scheme="light"] body.elco-theme-premium .elco-response-box .btn-outline-secondary { color: #0f1a32 !important; } html[data-color-scheme="light"] body.elco-theme-premium .elco-response-box .btn-outline-secondary::after { background: #ffffff !important; } html[data-color-scheme="light"] body.elco-theme-premium .elco-response-box .btn-outline-secondary .btn-shine-inner, html[data-color-scheme="light"] body.elco-theme-premium .elco-response-box .btn-outline-secondary > * { color: #0f1a32 !important; } @media (max-width: 576px) { .elco-response-box__panel { padding: 1.5rem 1.15rem 1.15rem; } .elco-response-box__message, #response-box .response-message { font-size: 0.98rem; } .elco-response-box__btn, #response-box-close-btn { min-width: 6.5rem; padding: 0.55rem 1.1rem; font-size: 0.92rem; } } @media (prefers-reduced-motion: reduce) { .elco-popup-overlay, #popup-overlay, .elco-response-box, #response-box { transition: none; } }