/* ============================================================
   KQXS Đài Loan Pro — Advanced CSS
   Multi-checker · Dark Mode · Archive · Compact
   ============================================================ */

/* ── Multi-checker ─────────────────────────────────────────── */
.kqxs-multi-wrap {
    font-family: var(--kq-font, 'Lexend', 'Segoe UI', sans-serif);
    background: var(--kq-card, #fff);
    border-radius: 14px;
    max-width: 640px;
    margin: 24px auto;
    box-shadow: 0 8px 32px rgba(15,23,42,.10);
    overflow: hidden;
}
.kqxs-multi-header {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 20px 24px 16px;
    background: linear-gradient(135deg, #1e3a5f, #0f172a);
    color: #fff;
}
.kqxs-multi-icon { font-size: 28px; }
.kqxs-multi-title { font-size: 16px; font-weight: 700; }
.kqxs-multi-sub   { font-size: 12px; color: rgba(255,255,255,.6); margin-top:2px; }

.kqxs-multi-body { padding: 20px 20px 24px; display:flex; flex-direction:column; gap:16px; }
.kqxs-multi-controls { display:flex; flex-direction:column; gap:14px; }
.kqxs-multi-input-block label {
    display: block; font-size:12px; font-weight:600; text-transform:uppercase;
    letter-spacing:.08em; color:#6b7280; margin-bottom:6px;
}
.kqxs-multi-textarea {
    width: 100%; padding: 10px 14px;
    border: 1.5px solid #e2e8f0; border-radius: 8px;
    font-family: var(--kq-font, 'Lexend', monospace);
    font-size: 15px; line-height: 1.7;
    letter-spacing: .12em; color: #0f172a; resize: vertical;
    transition: border-color .2s, box-shadow .2s;
    box-sizing: border-box;
}
.kqxs-multi-textarea:focus {
    outline: none; border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37,99,235,.12);
}

/* Results */
.kqxs-multi-result-header {
    display: flex; align-items:center; justify-content:space-between;
    padding: 10px 0; margin-bottom: 10px;
    font-size: 13px; font-weight: 600; color: #0f172a;
    border-bottom: 2px solid #f1f5f9;
}
.kqxs-multi-won-badge  { background:#dcfce7; color:#16a34a; border-radius:999px; padding:3px 10px; font-size:12px; }
.kqxs-multi-fail-badge { background:#fef2f2; color:#dc2626; border-radius:999px; padding:3px 10px; font-size:12px; }

.kqxs-multi-table-wrap { overflow-x:auto; }
.kqxs-multi-table {
    width:100%; border-collapse:collapse; font-size:13px;
    border-radius:8px; overflow:hidden;
}
.kqxs-multi-table th {
    background:#f8fafc; padding:8px 12px; text-align:left;
    font-weight:600; font-size:11px; text-transform:uppercase;
    letter-spacing:.05em; color:#6b7280; border-bottom:1px solid #e2e8f0;
}
.kqxs-multi-table td { padding: 9px 12px; border-bottom:1px solid #f3f4f6; }
.kqxs-multi-table tr:last-child td { border-bottom:none; }
.kqxs-multi-won-row { background: #f0fdf4; }
.kqxs-multi-tag { display:inline-block; border-radius:999px; padding:2px 8px; font-size:11px; font-weight:600; }
.kqxs-multi-tag-win  { background:#dcfce7; color:#16a34a; }
.kqxs-multi-tag-fail { background:#fef2f2; color:#dc2626; }

/* ── Dark Mode (auto via prefers-color-scheme) ─────────────── */
@media (prefers-color-scheme: dark) {
    :root {
        --kq-bg:    #0f172a;
        --kq-card:  #1e293b;
        --kq-navy:  #e2e8f0;
        --kq-muted: #94a3b8;
        --kq-border:#334155;
    }

    .kqxs-checker-root,
    .kqxs-multi-wrap {
        background: #1e293b;
        color: #e2e8f0;
        box-shadow: 0 8px 32px rgba(0,0,0,.4);
    }
    .kqxs-body { background: #1e293b; }
    .kqxs-select-group select,
    .kqxs-input-row input[type="tel"],
    .kqxs-multi-textarea {
        background: #0f172a; color: #e2e8f0; border-color: #334155;
    }
    .kqxs-chain-row { background:#0f172a; border-color:#334155; }
    .kqxs-chain-row .kqxs-chain-digit { background:#1e293b; color:#e2e8f0; border-color:#334155; }
    .kqxs-chain-row .kqxs-chain-digit.done { background:#1e3a5f; color:#93c5fd; border-color:#1e40af; }
    .kqxs-btn-reset { background:#1e293b; border-color:#334155; color:#e2e8f0; }

    .kqxs-multi-table th { background:#0f172a; border-color:#334155; }
    .kqxs-multi-table td { border-color:#1e293b; }
    .kqxs-multi-won-row { background:#052e16; }

    .kqxs-popup-card { background:#1e293b; color:#e2e8f0; }
    .kqxs-popup-actions .btn-close { background:#334155; color:#e2e8f0; }

    .kqxs-print-target,
    .kqxs-compact-card,
    .kqxs-archive-row { background:#1e293b; border-color:#334155; color:#e2e8f0; }
    .kqxs-archive-summary { color:#e2e8f0; }
    .kqxs-arc-title { color:#e2e8f0; }
    .kqxs-arc-page { background:#1e293b; border-color:#334155; color:#e2e8f0; }
    .kqxs-arc-page.active { background:#2563eb; border-color:#2563eb; }
    .kqxs-widget-item { background:#1e293b; border-color:#334155; }

    .kqxs-result-table,
    .kqxs-result-table th,
    .kqxs-result-table td { border-color:#334155; }
    .kqxs-result-table th { background:#0f172a; color:#e2e8f0; }
    .kqxs-print-target { background:#1e293b; }
    .kqxs-block-site-name { color:#e2e8f0; }
    .kqxs-block-draw-title { color:#94a3b8; }
    .kqxs-block-footer { color:#475569; }
}