/* ═══════════════════════════════════════════
   寻签 Design System
   Minimal overrides on top of DaisyUI + Tailwind
   ═══════════════════════════════════════════ */

[x-cloak] { display: none !important; }

/* ── DaisyUI Theme ── */
[data-theme="light"] {
    --p: 217 72% 50%;       /* primary: #2563eb */
    --pf: 217 72% 42%;      /* primary-focus */
    --pc: 0 0% 100%;        /* primary-content: white */
    --s: 215 20% 55%;       /* secondary: muted slate */
    --sf: 215 20% 45%;
    --sc: 0 0% 100%;
    --a: 217 72% 50%;       /* accent = primary */
    --af: 217 72% 42%;
    --ac: 0 0% 100%;
    --n: 220 14% 30%;       /* neutral */
    --nf: 220 14% 22%;
    --nc: 0 0% 100%;
    --b1: 0 0% 100%;        /* base-100 */
    --b2: 220 14% 96%;      /* base-200 */
    --b3: 220 14% 91%;      /* base-300 */
    --bc: 220 20% 12%;      /* base-content */
    --su: 160 50% 42%;      /* success: teal-green */
    --suc: 0 0% 100%;
    --wa: 36 80% 50%;       /* warning: amber */
    --wac: 0 0% 100%;
    --er: 0 65% 48%;        /* error: red */
    --erc: 0 0% 100%;
    --in: 217 72% 50%;      /* info = primary blue */
    --inc: 0 0% 100%;
    --rounded-btn: 0.375rem;
    --rounded-badge: 0.375rem;
    --rounded-box: 0.5rem;
}

/* ── Tokens ── */
.insurance-ui {
    --c-bg: #f0f2f5;
    --c-surface: #ffffff;
    --c-text: #1a1d23;
    --c-text-secondary: #5f6775;
    --c-text-muted: #8b919d;
    --c-border: #e2e5ea;
    --c-primary: #2563eb;
    --c-primary-hover: #1d4ed8;
    --c-primary-light: #eff4ff;
    --c-primary-muted: #93b4f8;
    --c-error: #c53030;
    background: var(--c-bg);
    color: var(--c-text);
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC",
                 "Helvetica Neue", "Noto Sans SC", sans-serif;
    font-size: 14px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

/* ── Nav ── */
.nav-brand {
    font-size: 16px;
    font-weight: 700;
    color: var(--color-primary);
    letter-spacing: -0.02em;
    display: flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
}

.nav-brand [data-lucide] {
    width: 20px;
    height: 20px;
    color: var(--color-primary) !important;
}

/* ── Icons ── */
.insurance-ui [data-lucide] {
    width: 16px;
    height: 16px;
    stroke-width: 1.8;
    color: var(--color-base-content, currentColor);
    opacity: 0.6;
}

.insurance-ui a [data-lucide],
.insurance-ui .alert [data-lucide],
.insurance-ui .badge [data-lucide],
.insurance-ui .btn-primary [data-lucide],
.insurance-ui .btn-error [data-lucide],
.insurance-ui .btn-neutral [data-lucide],
.insurance-ui .text-primary [data-lucide] {
    color: currentColor;
    opacity: 1;
}

/* ── Buttons ── */
.insurance-ui .btn {
    min-height: 32px;
    height: 32px;
    padding: 0 14px;
    font-size: 13px;
    font-weight: 600;
    transition: all .15s ease;
}

.insurance-ui .btn-sm,
.insurance-ui .btn-xs {
    min-height: 28px;
    height: 28px;
}

/* ── Inputs ── */
.insurance-ui .input,
.insurance-ui .select {
    min-height: 32px;
    height: 32px;
    font-size: 13px;
}

.insurance-ui .input:focus,
.insurance-ui .select:focus,
.insurance-ui .btn:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--color-primary) 25%, transparent);
    outline-offset: 1px;
}

/* ── Row / Track (scenario selector on submit page) ── */
.seg-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.seg-label {
    flex: 0 0 72px;
    font-size: 12px;
    font-weight: 600;
    opacity: 0.5;
}

.seg-track {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.seg-track .btn {
    min-width: 64px;
    justify-content: center;
}

/* ── Typography ── */
.insurance-ui .card-title {
    margin-bottom: 8px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.insurance-ui .table thead th {
    font-size: 12px;
    font-weight: 700;
}

/* ── Main content ── */
.insurance-main { max-width: 1120px; }

/* ── OCR preview ── */
.ocr-preview {
    background: color-mix(in srgb, var(--color-primary) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--color-primary) 15%, transparent);
    border-radius: 6px;
    padding: 8px 10px;
    margin-top: 6px;
    font-size: 12px;
}

.ocr-preview-row {
    display: flex;
    justify-content: space-between;
    padding: 2px 0;
}

.ocr-preview-label { opacity: 0.5; }
.ocr-preview-value { font-family: "SF Mono", "Menlo", monospace; }

/* ── Upload zone ── */
.upload-zone {
    border: 2px dashed var(--color-base-300);
    border-radius: 8px;
    background: var(--color-base-200);
    transition: all .2s ease;
    position: relative;
    overflow: hidden;
}

.upload-zone:hover {
    border-color: color-mix(in srgb, var(--color-primary) 40%, transparent);
    background: color-mix(in srgb, var(--color-primary) 10%, transparent);
}

/* ── Responsive ── */
@media (max-width: 768px) {
    .insurance-main { padding-left: 10px; padding-right: 10px; }
    .seg-label { flex-basis: 56px; font-size: 11px; }
    .seg-track {
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 2px;
        -webkit-overflow-scrolling: touch;
    }
}