:root {
    --cab-blue: #123f86;
    --cab-blue-2: #0b2f66;
    --cab-red: #d71920;
    --cab-red-2: #a90f18;
    --cab-bg: #f4f7fb;
    --cab-card: #ffffff;
    --cab-muted: #64748b;
    --cab-border: rgba(18, 63, 134, .12);
    --cab-shadow: 0 18px 45px rgba(15, 23, 42, .10);
}

* { box-sizing: border-box; }

body.app-body {
    min-height: 100vh;
    background:
        radial-gradient(circle at top left, rgba(215,25,32,.12), transparent 28rem),
        radial-gradient(circle at top right, rgba(18,63,134,.14), transparent 30rem),
        var(--cab-bg);
    color: #122033;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.app-navbar {
    background: rgba(255,255,255,.88);
    backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--cab-border);
    box-shadow: 0 10px 28px rgba(15,23,42,.06);
}

.brand-logo {
    width: 48px;
    height: 48px;
    object-fit: contain;
    filter: drop-shadow(0 6px 12px rgba(18,63,134,.16));
}

.brand-text {
    font-weight: 900;
    color: var(--cab-blue);
    letter-spacing: -.02em;
}

.nav-link { color: #26364a; font-weight: 650; }
.nav-link:hover, .nav-link:focus { color: var(--cab-red); }
.navbar-toggler { border: 0; box-shadow: none !important; }

.user-pill {
    background: rgba(18,63,134,.08);
    border-radius: 999px;
    padding-inline: .95rem !important;
}

.app-main { min-height: calc(100vh - 130px); }
.app-footer { color: var(--cab-muted); font-size: .9rem; }
.footer-dot { margin: 0 .5rem; color: var(--cab-red); }

.hero-card, .app-card {
    background: rgba(255,255,255,.92);
    border: 1px solid var(--cab-border);
    border-radius: 28px;
    box-shadow: var(--cab-shadow);
}

.hero-card {
    overflow: hidden;
    position: relative;
}

.hero-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(135deg, rgba(18,63,134,.10), transparent 35%),
        linear-gradient(45deg, transparent 70%, rgba(215,25,32,.10));
    pointer-events: none;
}

.hero-content { position: relative; z-index: 1; }
.logo-hero {
    width: 110px;
    height: 110px;
    object-fit: contain;
    background: #fff;
    border-radius: 999px;
    padding: 6px;
    box-shadow: 0 18px 34px rgba(18,63,134,.20);
}

.title-gradient {
    font-weight: 950;
    letter-spacing: -.05em;
    color: var(--cab-blue);
}

.text-muted-soft { color: var(--cab-muted); }

.btn-cab {
    --bs-btn-bg: var(--cab-blue);
    --bs-btn-border-color: var(--cab-blue);
    --bs-btn-hover-bg: var(--cab-blue-2);
    --bs-btn-hover-border-color: var(--cab-blue-2);
    --bs-btn-color: #fff;
    --bs-btn-hover-color: #fff;
    border-radius: 999px;
    font-weight: 800;
    padding: .8rem 1.2rem;
    box-shadow: 0 12px 24px rgba(18,63,134,.22);
}

.btn-red {
    --bs-btn-bg: var(--cab-red);
    --bs-btn-border-color: var(--cab-red);
    --bs-btn-hover-bg: var(--cab-red-2);
    --bs-btn-hover-border-color: var(--cab-red-2);
    --bs-btn-color: #fff;
    --bs-btn-hover-color: #fff;
    border-radius: 999px;
    font-weight: 800;
}

.btn-outline-cab {
    --bs-btn-color: var(--cab-blue);
    --bs-btn-border-color: rgba(18,63,134,.35);
    --bs-btn-hover-bg: var(--cab-blue);
    --bs-btn-hover-border-color: var(--cab-blue);
    --bs-btn-hover-color: #fff;
    border-radius: 999px;
    font-weight: 750;
}

.form-control, .form-select {
    border-radius: 16px;
    border: 1px solid rgba(18,63,134,.18);
    padding: .8rem .95rem;
}
.form-control:focus, .form-select:focus {
    border-color: rgba(18,63,134,.5);
    box-shadow: 0 0 0 .25rem rgba(18,63,134,.12);
}

.search-shell {
    max-width: 980px;
    margin: 0 auto;
}
.search-box {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--cab-border);
    box-shadow: 0 18px 40px rgba(15,23,42,.08);
    padding: .75rem;
    display: flex;
    gap: .65rem;
    align-items: center;
}
.search-box i { color: var(--cab-red); font-size: 1.4rem; margin-left: .5rem; }
.search-box input { border: 0; box-shadow: none !important; font-size: 1.05rem; padding: .8rem .4rem; }
.search-box input:focus { border: 0; }

.result-card {
    background: #fff;
    border: 1px solid var(--cab-border);
    border-radius: 24px;
    padding: 1rem;
    height: 100%;
    box-shadow: 0 12px 28px rgba(15,23,42,.06);
    transition: transform .18s ease, box-shadow .18s ease;
}
.result-card:hover { transform: translateY(-3px); box-shadow: 0 18px 36px rgba(15,23,42,.10); }
.result-title { color: #16243a; font-weight: 850; line-height: 1.25; word-break: break-word; }
.badge-folio { background: rgba(215,25,32,.10); color: var(--cab-red); border: 1px solid rgba(215,25,32,.18); }
.badge-cab { background: rgba(18,63,134,.09); color: var(--cab-blue); border: 1px solid rgba(18,63,134,.15); }

.stat-card {
    border: 1px solid var(--cab-border);
    border-radius: 24px;
    background: #fff;
    padding: 1.2rem;
    box-shadow: 0 14px 30px rgba(15,23,42,.06);
}
.stat-icon {
    width: 48px;
    height: 48px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: rgba(18,63,134,.10);
    color: var(--cab-blue);
    font-size: 1.35rem;
}
.stat-number { font-size: 1.8rem; font-weight: 950; color: var(--cab-blue); }

.table-modern {
    border-collapse: separate;
    border-spacing: 0 .55rem;
}
.table-modern tbody tr { background: #fff; box-shadow: 0 8px 18px rgba(15,23,42,.05); }
.table-modern td, .table-modern th { vertical-align: middle; padding: .9rem; }
.table-modern tbody td:first-child { border-radius: 16px 0 0 16px; }
.table-modern tbody td:last-child { border-radius: 0 16px 16px 0; }

.login-page {
    min-height: calc(100vh - 80px);
    display: grid;
    place-items: center;
}
.login-card { max-width: 460px; width: 100%; }

.spinner-small {
    width: 1.25rem;
    height: 1.25rem;
}

.sync-progress {
    height: 14px;
    border-radius: 999px;
    overflow: hidden;
    background: rgba(18,63,134,.12);
}

.dark-mode {
    --cab-bg: #0f172a;
    --cab-card: #111827;
    --cab-muted: #94a3b8;
    color: #e5e7eb;
}
.dark-mode .app-navbar, .dark-mode .app-card, .dark-mode .hero-card, .dark-mode .result-card, .dark-mode .stat-card, .dark-mode .search-box, .dark-mode .table-modern tbody tr {
    background: rgba(17,24,39,.92);
    color: #e5e7eb;
}
.dark-mode .form-control, .dark-mode .form-select { background: #0f172a; color: #fff; border-color: rgba(148,163,184,.35); }
.dark-mode .result-title, .dark-mode .title-gradient { color: #dbeafe; }
.dark-mode .nav-link { color: #e2e8f0; }

@media (max-width: 575.98px) {
    .brand-logo { width: 42px; height: 42px; }
    .title-gradient { font-size: 2rem; }
    .search-box { border-radius: 20px; }
    .footer-dot { display: none; }
    .app-footer span { display: block; }
}

.connection-status {
    border: 1px solid var(--cab-border);
    background: rgba(18,63,134,.04);
    border-radius: 24px;
    padding: 1rem;
}

.folder-list .list-group-item {
    border: 1px solid var(--cab-border);
    margin-bottom: .65rem;
    border-radius: 18px !important;
    box-shadow: 0 8px 18px rgba(15,23,42,.05);
}

.folder-icon {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: rgba(18,63,134,.10);
    color: var(--cab-blue);
    font-size: 1.25rem;
}

.mini-step {
    border: 1px solid var(--cab-border);
    border-radius: 22px;
    background: #fff;
    padding: 1rem;
    height: 100%;
    box-shadow: 0 10px 24px rgba(15,23,42,.05);
}

.mini-step span {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--cab-blue), var(--cab-red));
    color: #fff;
    font-weight: 900;
    margin-bottom: .75rem;
}

.mini-step strong,
.mini-step small { display: block; }
.mini-step small { color: var(--cab-muted); margin-top: .35rem; }

.dark-mode .mini-step,
.dark-mode .connection-status,
.dark-mode .folder-list .list-group-item,
.dark-mode .modal-content {
    background: rgba(17,24,39,.96);
    color: #e5e7eb;
    border-color: rgba(148,163,184,.22);
}
