/* ─── فونت ایران‌سنس ایکس ──────────────────────────────── */
        @font-face {
            font-family: 'IRANSansX';
            src: url('https://cdn.jsdelivr.net/gh/rastikerdar/iranxfont@v7.3.3/dist/font/woff2/IRANSansX-Regular.woff2') format('woff2');
            font-weight: 400; font-style: normal; font-display: swap;
        }
        @font-face {
            font-family: 'IRANSansX';
            src: url('https://cdn.jsdelivr.net/gh/rastikerdar/iranxfont@v7.3.3/dist/font/woff2/IRANSansX-Medium.woff2') format('woff2');
            font-weight: 500; font-style: normal; font-display: swap;
        }
        @font-face {
            font-family: 'IRANSansX';
            src: url('https://cdn.jsdelivr.net/gh/rastikerdar/iranxfont@v7.3.3/dist/font/woff2/IRANSansX-Bold.woff2') format('woff2');
            font-weight: 700; font-style: normal; font-display: swap;
        }

        /* ─── ریست فونت روی تمام المان‌های فرم ────────────────── */
        .otp-form-wrapper,
        .otp-form-wrapper * {
            font-family: 'IRANSansX', system-ui, sans-serif !important;
        }

        /* ─── Overlay ───────────────────────────────────────────── */
        .otp-modal-overlay {
            position: fixed;
            z-index: 2147483647;
            left: 50%;
            top: 0;
            width: min(100%, 504px);
            height: 100%;
            height: 100dvh;
            display: flex;
            justify-content: center;
            align-items: flex-end;
            transform: translateX(-50%);
            overflow: hidden;
            isolation: isolate;
            overscroll-behavior: contain;
        }

        /* ─── Backdrop ──────────────────────────────────────────── */
        .otp-backdrop {
            position: absolute;
            inset: 0;
            background: rgba(15,23,42,0.58);
            transform: translateZ(0);
            backface-visibility: hidden;
            -webkit-backface-visibility: hidden;
        }

        /* ─── Sheet اصلی ────────────────────────────────────────── */
        .otp-modal-content {
            position: relative;
            z-index: 1;
            background: #ffffff;
            width: 100%;
            max-width: 504px;
            padding: 10px 28px max(40px, calc(24px + env(safe-area-inset-bottom)));
            border: 1px solid #eef2f7;
            border-bottom: 0;
            border-radius: 28px 28px 0 0;
            box-shadow: 0 -18px 60px rgba(15,23,42,0.18);
            direction: rtl;
            text-align: center;
            animation: otp-slide-up 0.4s cubic-bezier(.32,1.2,.5,1) both;
            max-height: 90vh;
            max-height: 90dvh;
            overflow-y: auto;
            overscroll-behavior: contain;
            scrollbar-width: thin;
            box-sizing: border-box;
        }

        @keyframes otp-slide-up {
            from { transform: translateY(100%); opacity:0; }
            to   { transform: translateY(0);    opacity:1; }
        }

        /* ─── Drag handle ───────────────────────────────────────── */
        .otp-drag-handle {
            width: 40px;
            height: 4px;
            background: #e2e8f0;
            border-radius: 99px;
            margin: 0 auto 20px;
        }

        /* ─── دکمه بستن ─────────────────────────────────────────── */
        .otp-close-modal {
            position: absolute;
            left: 20px; top: 20px;
            width: 32px; height: 32px;
            display: flex; align-items: center; justify-content: center;
            font-size: 20px;
            cursor: pointer;
            color: #94a3b8;
            background: #f1f5f9;
            border-radius: 50%;
            line-height: 1;
            transition: none;
            border: 0;
            padding: 0;
        }
        .otp-close-modal:focus-visible,
        .otp-form-wrapper button:focus-visible,
        .otp-form-wrapper input:focus-visible,
        .otp-form-wrapper textarea:focus-visible {
            outline: 2px solid #befa00;
            outline-offset: 2px;
        }

        /* ─── Inline widget ─────────────────────────────────────── */
        .otp-inline-content {
            background: #ffffff;
            padding: 32px 28px 28px;
            border-radius: 20px;
            width: 100%;
            max-width: 504px;
            margin: 20px auto;
            border: 1px solid #e8edf3;
            direction: rtl;
            text-align: center;
            box-sizing: border-box;
            box-shadow: 0 4px 24px rgba(0,0,0,0.07);
        }

        /* ─── لوگو ──────────────────────────────────────────────── */
        .otp-logo-wrap {
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 24px;
        }
        .otp-logo-img {
            max-height: 48px;
            max-width: 160px;
            width: auto;
            object-fit: contain;
        }
        .otp-logo-text {
            font-size: 20px;
            font-weight: 700 !important;
            color: #1e293b;
        }

        /* ─── عنوان و زیرعنوان ──────────────────────────────────── */
        .otp-title {
            font-size: 19px;
            font-weight: 700 !important;
            color: #0f172a;
            margin: 0 0 6px;
            letter-spacing: -0.3px;
        }
        .otp-title-success { color: #16a34a !important; }
        .otp-subtitle {
            font-size: 13.5px;
            font-weight: 400 !important;
            color: #64748b;
            margin: 0 0 20px;
            line-height: 1.8;
        }

        /* ─── ورودی با آیکون ────────────────────────────────────── */
        .otp-input-group {
            position: relative;
            direction: rtl;
        }
        .otp-input-icon {
            position: absolute;
            right: 16px;
            top: 0; bottom: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #94a3b8;
            pointer-events: none;
        }
        .otp-phone-input {
            width: 100% !important;
            padding: 14px 48px 14px 16px !important;
            border: 1.5px solid #e2e8f0 !important;
            border-radius: 14px !important;
            text-align: center !important;
            font-size: 17px !important;
            font-weight: 500 !important;
            letter-spacing: 3px !important;
            background: #f8fafc !important;
            color: #0f172a !important;
            outline: none !important;
            transition: border-color .25s, box-shadow .25s, background .25s !important;
            box-sizing: border-box !important;
        }
        .otp-phone-input:focus, .otp-name-row input[type="text"]:focus, .otp-address-section input[type="text"]:focus, .otp-address-section textarea:focus {
            border-color: #befa00 !important;
            background: #fff !important;
            box-shadow: 0 0 0 4px rgba(190,250,0,0.18) !important;
        }

        /* ─── ورودی‌های نام ─────────────────────────────────────── */
        .otp-name-row {
            display: flex;
            gap: 10px;
            margin-bottom: 4px;
        }
        .otp-name-row input[type="text"] {
            flex: 1;
            padding: 13px 14px !important;
            margin: 8px 0 !important;
            border: 1.5px solid #e2e8f0 !important;
            border-radius: 14px !important;
            text-align: center !important;
            font-size: 14px !important;
            font-weight: 400 !important;
            letter-spacing: 0 !important;
            background: #f8fafc !important;
            color: #0f172a !important;
            outline: none !important;
            transition: border-color .25s, box-shadow .25s, background .25s !important;
            box-sizing: border-box !important;
        }

        /* ─── دکمه اصلی ─────────────────────────────────────────── */
        .otp-form-wrapper .otp-btn {
            width: 100%;
            padding: 14px;
            background: #befa00;
            color: #1a1a1a;
            font-weight: 700 !important;
            border: none;
            border-radius: 14px;
            cursor: pointer;
            font-size: 15px !important;
            transition: none;
            margin-top: 14px;
            box-sizing: border-box;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            letter-spacing: 0.2px;
        }

        /* دکمه ویرایش و ارسال مجدد */
        .otp-action-buttons {
            display: flex;
            gap: 10px;
            justify-content: center;
            margin-top: 12px;
        }
        .otp-form-wrapper .otp-edit-phone-btn,
        .otp-form-wrapper .otp-resend-btn {
            background: #f8fafc;
            color: #475569;
            font-weight: 500 !important;
            font-size: 13px !important;
            border: 1.5px solid #e2e8f0;
            padding: 9px 16px;
            width: auto;
            margin-top: 0;
            border-radius: 10px;
        }
        .otp-form-wrapper .otp-resend-btn {
            color: #16a34a; 
            border-color: #bbf7d0;
            background: #f0fdf4;
        }

        /* ─── پیام‌ها ─────────────────────────────────────────────── */
        .otp-form-wrapper .otp-msg {
            font-size: 12.5px;
            font-weight: 400 !important;
            color: #ef4444;
            margin-top: 8px;
            min-height: 18px;
            line-height: 1.6;
        }
        .otp-form-wrapper .otp-timer {
            font-size: 12.5px;
            font-weight: 400 !important;
            color: #94a3b8;
            margin-top: 12px;
        }
        .otp-form-wrapper .otp-timer span {
            font-weight: 600 !important;
            color: #64748b;
        }

        /* ─── بج موفقیت ─────────────────────────────────────────── */
        .otp-success-badge {
            width: 56px; height: 56px;
            background: #f0fdf4;
            border-radius: 50%;
            display: flex; align-items: center; justify-content: center;
            margin: 0 auto 12px;
            border: 2px solid #bbf7d0;
        }

        /* ─── جعبه‌های OTP ───────────────────────────────────────── */
        .otp-boxes-wrapper {
            position: relative;
            display: flex;
            justify-content: center;
            align-items: center;
            gap: clamp(6px, 2vw, 10px);
            margin: 18px 0 4px;
            direction: ltr;
            padding: 10px 0;
        }

        .otp-box-cell {
            position: relative;
            flex: 0 0 auto;
        }

        .otp-box {
            width: clamp(38px, calc((100vw - 96px) / 5), 54px) !important;
            height: clamp(38px, calc((100vw - 96px) / 5), 54px) !important;
            aspect-ratio: 1 / 1;
            padding: 0 !important;
            margin: 0 !important;
            border: 1.5px solid #dbe3ec !important;
            border-radius: 14px !important;
            font-size: clamp(20px, 5vw, 24px) !important;
            font-weight: 700 !important;
            line-height: 1 !important;
            letter-spacing: 0 !important;
            text-align: center !important;
            color: #0f172a !important;
            background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
            outline: none !important;
            caret-color: #befa00;
            box-shadow: 0 5px 14px rgba(15,23,42,0.055), inset 0 1px 0 rgba(255,255,255,0.9);
            transition: border-color .2s, box-shadow .2s, background .2s, transform .2s !important;
            z-index: 1;
            position: relative;
            box-sizing: border-box !important;
        }

        .otp-box:focus {
            border-color: #befa00 !important;
            background: #ffffff !important;
            box-shadow: 0 0 0 4px rgba(190,250,0,0.18), 0 7px 18px rgba(15,23,42,0.08) !important;
            transform: translateY(-1px);
        }

        .otp-box.filled {
            border-color: #cbd5e1 !important;
            background: #fff !important;
        }

        .otp-boxes-wrapper.state-error .otp-box {
            border-color: #fca5a5 !important;
            background: #fff5f5 !important;
            animation: otp-shake .35s ease;
        }

        .otp-boxes-wrapper.state-success .otp-box {
            border-color: #86efac !important;
            background: #f0fdf4 !important;
        }

        @keyframes otp-shake {
            0%,100% { transform: translateX(0); }
            20%      { transform: translateX(-5px); }
            40%      { transform: translateX(5px); }
            60%      { transform: translateX(-4px); }
            80%      { transform: translateX(4px); }
        }

        /* ─── نوار درخشان چرخنده ────────────────────────────────── */
        .otp-spinner-ring {
            display: none;
            position: absolute;
            inset: -6px;
            border-radius: 22px;
            pointer-events: none;
            z-index: 0;
            --ring-color: #ef4444;
            background: conic-gradient(
                from var(--ring-angle, 0deg),
                transparent 0%,
                var(--ring-color) 15%,
                rgba(255,255,255,.05) 30%,
                transparent 45%
            );
            -webkit-mask:
                linear-gradient(#fff 0 0) content-box,
                linear-gradient(#fff 0 0);
            -webkit-mask-composite: xor;
                    mask-composite: exclude;
            padding: 3px;
            animation: otp-ring-spin 1s linear infinite;
        }

        @property --ring-angle {
            syntax: '<angle>';
            inherits: false;
            initial-value: 0deg;
        }

        @keyframes otp-ring-spin {
            to { --ring-angle: 360deg; }
        }

        .otp-boxes-wrapper.state-success .otp-spinner-ring {
            --ring-color: #22c55e;
        }

        /* ─── خط جداکننده قوانین ────────────────────────────────── */
        .otp-legal-note {
            font-size: 11.5px !important;
            font-weight: 400 !important;
            color: #b0bec5;
            margin: 22px 0 0;
            line-height: 1.9;
            direction: rtl;
            padding-top: 18px;
            border-top: 1px solid #f1f5f9;
        }
        .otp-legal-link {
            color: #64748b !important;
            font-weight: 600 !important;
            text-decoration: underline;
            text-underline-offset: 2px;
            text-decoration-color: #befa00;
            transition: none;
        }

        .otp-logged-in-msg {
            font-size: 14px;
            color: #555;
            text-align: center;
            padding: 10px;
        }
        
        .leaflet-control-attribution { display: none !important; }


.otp-hidden { display: none; }
.otp-address-section { margin-top: 15px; text-align: right; }
.otp-map-label { font-size: 13px; color: #475569; display: block; margin-bottom: 8px; }
.otp-neshan-map { width: 100%; height: 200px; border-radius: 14px; margin-bottom: 15px; border: 1.5px solid #e2e8f0; }
.otp-full-address-field { width: 100%; padding: 10px 14px; border: 1.5px solid #e2e8f0; border-radius: 14px; box-sizing: border-box; font-family: 'IRANSansX'; font-size: 13px; resize: none; margin-bottom: 8px; }
.otp-address-mini-row { display: flex; gap: 10px; }
.otp-address-small-field { flex: 1; padding: 10px 14px; border: 1.5px solid #e2e8f0; border-radius: 14px; box-sizing: border-box; font-family: 'IRANSansX'; font-size: 13px; }
.otp-address-postal-field { flex: 2; padding: 10px 14px; border: 1.5px solid #e2e8f0; border-radius: 14px; box-sizing: border-box; font-family: 'IRANSansX'; font-size: 13px; }
.otp-complete-signup-btn-spaced { margin-top: 20px; }

/* Unified modal close icon — exact supplied SVG. */
html body .otp-close-modal.otp-close-modal.otp-close-modal {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 36px !important;
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    padding: 6px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2010%2010%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url%28%23clip0_386_40016%29%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M8.5526%208.55259C7.91958%209.18561%206.84713%209.5%205%209.5C3.15287%209.5%202.08042%209.18561%201.44741%208.55259C0.81439%207.91958%200.500001%206.84713%200.500001%205C0.500001%203.15287%200.81439%202.08042%201.44741%201.4474C2.08042%200.814389%203.15287%200.5%205%200.5C6.84713%200.5%207.91958%200.814389%208.5526%201.4474C9.18561%202.08042%209.5%203.15287%209.5%205C9.5%206.84713%209.18561%207.91958%208.5526%208.55259ZM5%2010C8.74973%2010%2010%208.74973%2010%205C10%201.25027%208.74973%201.54673e-08%205%206.18557e-08C1.25027%201.08244e-07%209.41619e-07%201.25027%209.05463e-07%205C8.69308e-07%208.74973%201.25027%2010%205%2010Z%22%20fill%3D%22%23B0B0B0%22%3E%3C%2Fpath%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M6.39211%203.60789C6.48974%203.70552%206.48974%203.86381%206.39211%203.96144L3.96155%206.392C3.86392%206.48963%203.70563%206.48963%203.608%206.392C3.51037%206.29437%203.51037%206.13608%203.608%206.03845L6.03856%203.60789C6.13619%203.51026%206.29448%203.51026%206.39211%203.60789Z%22%20fill%3D%22%23000000%22%3E%3C%2Fpath%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M6.39211%206.392C6.29448%206.48963%206.13619%206.48963%206.03856%206.392L3.608%203.96144C3.51037%203.86381%203.51037%203.70552%203.608%203.60789C3.70563%203.51026%203.86392%203.51026%203.96155%203.60789L6.39211%206.03845C6.48974%206.13608%206.48974%206.29437%206.39211%206.392Z%22%20fill%3D%22%23000000%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_386_40016%22%3E%3Crect%20width%3D%2210%22%20height%3D%2210%22%20fill%3D%22white%22%3E%3C%2Frect%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: 24px 24px !important;
    box-shadow: none !important;
    color: transparent !important;
    font-size: 0 !important;
    font-weight: 400 !important;
    line-height: 0 !important;
    text-align: center !important;
    text-decoration: none !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    cursor: pointer !important;
    overflow: hidden !important;
    user-select: none !important;
    -webkit-user-select: none !important;
    -webkit-tap-highlight-color: transparent !important;
}
html body .otp-close-modal.otp-close-modal.otp-close-modal::before,
html body .otp-close-modal.otp-close-modal.otp-close-modal::after {
    content: none !important;
    display: none !important;
}
html body .otp-close-modal.otp-close-modal.otp-close-modal:focus-visible {
    outline: 2px solid #000000 !important;
    outline-offset: 2px !important;
}