/* =========================================
   IMEI CHECKER MODAL
========================================= */
#vouch-imei-checker * { box-sizing: border-box; font-family: 'Satoshi', sans-serif; }
#vouch-imei-checker .overlay { position: fixed; inset: 0; background: rgba(0,0,0,.45); display: flex; align-items: center; justify-content: center; z-index: 99999; padding: 16px; opacity: 0; pointer-events: none; transition: opacity .25s; }
#vouch-imei-checker .overlay.active { opacity: 1; pointer-events: all; }
#vouch-imei-checker .modal { background: #fff; border-radius: 20px; padding: 48px 40px 40px; width: 100%; max-width: 580px; position: relative; transform: translateY(20px); transition: transform .25s; text-align: center; box-shadow: 0 10px 40px rgba(0,0,0,0.1); }
#vouch-imei-checker .overlay.active .modal { transform: translateY(0); }
#vouch-imei-checker .close-btn { position: absolute; top: 16px; right: 16px; background: none; border: none; cursor: pointer; color: #333; padding: 6px; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: background .15s; }
#vouch-imei-checker .close-btn:hover { background: #f0f0f0; }
#vouch-imei-checker .close-btn svg { width: 22px; height: 22px; }
#vouch-imei-checker .modal h1 { font-family: "Clash Display", Sans-serif; font-size: 28px; font-weight: 800; color: #1a1a2e; margin: 0 0 16px 0; line-height: 1.2; }
#vouch-imei-checker .modal p { font-size: 16px; color: #555; line-height: 1.6; margin: 0 0 28px 0; }
#vouch-imei-checker .input-wrap { position: relative; margin-bottom: 8px; text-align: left; }
#vouch-imei-checker .input-wrap input { width: 100%; padding: 18px 20px; border: 1.5px solid #dde3ea; border-radius: 12px; font-size: 16px; color: #1a1a2e; outline: none; transition: border-color .2s, box-shadow .2s; letter-spacing: .5px; background: #fff; }
#vouch-imei-checker .input-wrap input:focus { border-color: #2cbfb1; box-shadow: 0 0 0 3px rgba(44,191,177,.12); }
#vouch-imei-checker .char-count { text-align: right; font-size: 13px; color: #999; margin-bottom: 20px; }
#vouch-imei-checker .check-btn { width: 100%; padding: 18px; border: none; border-radius: 50px; font-size: 17px; font-weight: 700; cursor: pointer; transition: background .2s, transform .1s; background: #d5d9df; color: #a0a8b0; pointer-events: none; }
#vouch-imei-checker .check-btn.ready { background: #2cbfb1; color: #fff; pointer-events: all; }
#vouch-imei-checker .check-btn.ready:hover { background: #24a89b; transform: translateY(-1px); }
#vouch-imei-checker .check-btn.ready:active { transform: translateY(0); }
#vouch-imei-checker .check-btn.loading { background: #2cbfb1; color: #fff; pointer-events: none; opacity: .8; }
#vouch-imei-checker .imei-link { display: inline-block; margin-top: 20px; color: #2cbfb1; font-weight: 700; font-size: 15px; text-decoration: none; cursor: pointer; transition: color .15s; }
#vouch-imei-checker .imei-link:hover { color: #24a89b; text-decoration: underline; }
#vouch-imei-checker .result { margin-top: 24px; padding: 18px 20px; border-radius: 12px; font-weight: 700; font-size: 15px; display: none; align-items: center; gap: 12px; text-align: left; }
#vouch-imei-checker .result.show { display: flex; }
#vouch-imei-checker .result-icon { font-size: 24px; flex-shrink: 0; }
#vouch-imei-checker .result.compatible { background: #e6faf8; color: #1a7a6e; border: 1.5px solid #9de8e0; }
#vouch-imei-checker .result.incompatible { background: #fff0f0; color: #8b1a1a; border: 1.5px solid #f5a0a0; }
#vouch-imei-checker .result.error { background: #fff8e6; color: #7a5a00; border: 1.5px solid #f5d97a; }
#vouch-imei-checker .result-text small { display: block; font-weight: 400; margin-top: 4px; opacity: .85; }
@keyframes spin { to { transform: rotate(360deg); } }
#vouch-imei-checker .spinner { display: inline-block; width: 18px; height: 18px; border: 2.5px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; animation: spin .7s linear infinite; vertical-align: middle; margin-right: 8px; }
#vouch-imei-checker .tooltip-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.45); display: flex; align-items: center; justify-content: center; z-index: 110000; padding: 16px; opacity: 0; pointer-events: none; transition: opacity .2s; }
#vouch-imei-checker .tooltip-overlay.active { opacity: 1; pointer-events: all; }
#vouch-imei-checker .tooltip-modal { background: #fff; border-radius: 16px; padding: 36px 32px; max-width: 460px; width: 100%; position: relative; text-align: left; box-shadow: 0 10px 40px rgba(0,0,0,0.1); }
#vouch-imei-checker .tooltip-modal h2 { font-size: 20px; font-weight: 800; color: #1a1a2e; margin: 0 0 12px 0; }
#vouch-imei-checker .tooltip-modal p { font-size: 14px; color: #555; line-height: 1.7; margin: 0 0 10px 0; }
#vouch-imei-checker .tooltip-modal code { background: #f4f6f8; padding: 2px 6px; border-radius: 4px; font-family: monospace; }

/* =========================================
   COVERAGE CHECKER MODAL
========================================= */
#vouch-coverage-checker * { box-sizing: border-box; font-family: 'Satoshi', sans-serif; }
#vouch-coverage-checker .overlay { position: fixed; inset: 0; background: rgba(0,0,0,.45); display: flex; align-items: center; justify-content: center; z-index: 99999; padding: 16px; opacity: 0; pointer-events: none; transition: opacity .25s; }
#vouch-coverage-checker .overlay.active { opacity: 1; pointer-events: all; }
#vouch-coverage-checker .modal { background: #fff; border-radius: 20px; padding: 48px 40px 40px; width: 100%; max-width: 580px; position: relative; transform: translateY(20px); transition: transform .25s; text-align: center; box-shadow: 0 10px 40px rgba(0,0,0,0.1); }
#vouch-coverage-checker .overlay.active .modal { transform: translateY(0); }
#vouch-coverage-checker .close-btn { position: absolute; top: 16px; right: 16px; background: none; border: none; cursor: pointer; color: #333; padding: 6px; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: background .15s; }
#vouch-coverage-checker .close-btn:hover { background: #f0f0f0; }
#vouch-coverage-checker .close-btn svg { width: 22px; height: 22px; }
#vouch-coverage-checker .modal h1 { font-family: "Clash Display", Sans-serif; font-size: 28px; font-weight: 800; color: #1a1a2e; margin: 0 0 12px 0; line-height: 1.2; }
#vouch-coverage-checker .modal p { font-size: 16px; color: #555; line-height: 1.6; margin: 0 0 32px 0; }
#vouch-coverage-checker .input-wrap { position: relative; text-align: left; margin-bottom: 24px; }
#vouch-coverage-checker .input-label { position: absolute; top: -10px; left: 16px; background: #fff; padding: 0 8px; font-size: 13px; color: #333; z-index: 2; }
#vouch-coverage-checker .input-wrap input { width: 100%; padding: 20px; border: 1px solid #dde3ea; border-radius: 10px; font-size: 16px; color: #1a1a2e; outline: none; transition: border-color .2s; }
#vouch-coverage-checker .input-wrap input:focus { border-color: #2cbfb1; }
#vouch-coverage-checker .autocomplete-dropdown { display: none; position: absolute; top: calc(100% - 4px); left: 0; right: 0; background: #fff; border: 1px solid #dde3ea; border-top: none; border-radius: 0 0 10px 10px; box-shadow: 0 10px 20px rgba(0,0,0,0.05); z-index: 10; max-height: 250px; overflow-y: auto; }
#vouch-coverage-checker .autocomplete-dropdown.active { display: block; }
#vouch-coverage-checker .dropdown-item { padding: 14px 20px; display: flex; align-items: center; gap: 12px; cursor: pointer; border-bottom: 1px solid #f0f0f0; font-size: 15px; color: #555; transition: background .15s; }
#vouch-coverage-checker .dropdown-item:last-child { border-bottom: none; }
#vouch-coverage-checker .dropdown-item:hover { background: #f8fcfb; }
#vouch-coverage-checker .dropdown-item strong { color: #1a1a2e; font-weight: 700; }
#vouch-coverage-checker .pin-icon { width: 18px; height: 18px; color: #a0a8b0; flex-shrink: 0; }
#cov-step-loading { flex-direction: column; align-items: center; justify-content: center; padding: 40px 0; }
#cov-step-loading h2 { font-size: 20px; color: #1a1a2e; margin: 20px 0 8px; }
@keyframes spin { to { transform: rotate(360deg); } }
#vouch-coverage-checker .spinner-large { width: 48px; height: 48px; border: 4px solid rgba(44,191,177,.2); border-top-color: #2cbfb1; border-radius: 50%; animation: spin .8s linear infinite; }
#vouch-coverage-checker .success-icon { margin: 0 auto 24px; width: 64px; height: 64px; }
#vouch-coverage-checker .wifi-row { display: flex; justify-content: center; gap: 24px; margin: 32px 0; flex-wrap: wrap; }
#vouch-coverage-checker .wifi-col { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
#vouch-coverage-checker .wifi-icon { width: 48px; height: 48px; }
#vouch-coverage-checker .wifi-col span { font-size: 15px; color: #555; font-weight: 500; }
#vouch-coverage-checker .check-btn { display: inline-block; width: 100%; padding: 18px; border: none; border-radius: 50px; font-size: 17px; font-weight: 700; cursor: pointer; text-decoration: none; transition: background .2s, transform .1s; text-align: center; }
#vouch-coverage-checker .check-btn.ready { background: #2cbfb1; color: #fff; justify-content: center; }
#vouch-coverage-checker .check-btn.ready:hover { background: #24a89b; transform: translateY(-1px); }
#vouch-coverage-checker .check-again-btn { display: inline-block; margin-top: 20px; color: #2cbfb1; font-weight: 700; font-size: 16px; background: none; border: none; cursor: pointer; transition: color .15s; }
#vouch-coverage-checker .check-again-btn:hover { color: #24a89b; text-decoration: underline; }