/* Nimbus Hire design tokens for the v2 application shell. Bootstrap 5 supplies
   components; these variables carry the Drift Nimbus brand (driftnimbus.com):
   deep navy, electric blue, a teal secondary from the logo mark, and the
   Lexend typeface. The product UI stays light for all-day readability; the
   navigation bar uses the brand's dark navy. */
@font-face {
    font-family: "Lexend";
    font-style: normal;
    font-weight: 300 700;
    font-display: swap;
    src: url("fonts/Lexend-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    /* Brand */
    --brand-navy: #01071a;
    --brand-navy-2: #0a1027;
    --brand-blue: #0b71d9;
    --brand-blue-dark: #0a5fb5;
    --brand-sky: #119cff;
    --brand-teal: #22b5ad;
    --brand-teal-soft: #e3f6f4;
    --brand-amber: #f58300;

    /* Bootstrap overrides */
    --bs-body-bg: #f3f6fb;
    --bs-body-color: var(--brand-navy-2);
    --bs-primary: var(--brand-blue);
    --bs-primary-rgb: 11, 113, 217;
    --bs-link-color: var(--brand-blue);
    --bs-link-color-rgb: 11, 113, 217;
    --bs-link-hover-color: var(--brand-blue-dark);
    --bs-border-color: #d9e0ea;
    --bs-font-sans-serif: "Lexend", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --app-surface: #ffffff;
    --app-muted: #5b6478;
}

body { letter-spacing: -0.005em; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { letter-spacing: -0.02em; font-weight: 600; }

.app-body { min-height: 100vh; display: flex; flex-direction: column; }
.app-main { max-width: 1280px; flex: 1 0 auto; }
.app-muted { color: var(--app-muted); }

/* Navigation: brand navy with the logo mark */
.app-navbar { background: var(--brand-navy); border-bottom: 1px solid rgba(255,255,255,0.08) !important; }
.app-navbar .navbar-brand { display: flex; align-items: center; gap: 0.55rem; color: #ffffff; font-weight: 600; letter-spacing: -0.02em; }
.app-navbar .navbar-brand img { height: 26px; width: auto; }
.app-navbar .nav-link { color: rgba(255,255,255,0.78); }
.app-navbar .nav-link:hover, .app-navbar .nav-link:focus { color: #ffffff; }
.app-navbar .nav-link.text-secondary { color: rgba(255,255,255,0.6) !important; }
.app-navbar .navbar-toggler { border-color: rgba(255,255,255,0.25); }
.app-navbar .navbar-toggler-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.8%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }
.app-navbar .dropdown-menu { border-color: var(--bs-border-color); box-shadow: 0 10px 30px rgba(1,7,26,0.15); }
.app-navbar .badge.text-bg-primary { background-color: var(--brand-sky) !important; }

.app-footer { color: var(--app-muted); font-size: 0.8rem; }
.app-footer a { color: var(--app-muted); text-decoration: none; }
.app-footer a:hover { color: var(--brand-blue); }

.btn-primary {
    --bs-btn-bg: var(--brand-blue);
    --bs-btn-border-color: var(--brand-blue);
    --bs-btn-hover-bg: var(--brand-blue-dark);
    --bs-btn-hover-border-color: var(--brand-blue-dark);
    --bs-btn-active-bg: var(--brand-blue-dark);
    --bs-btn-active-border-color: var(--brand-blue-dark);
}
.btn-outline-primary {
    --bs-btn-color: var(--brand-blue);
    --bs-btn-border-color: var(--brand-blue);
    --bs-btn-hover-bg: var(--brand-blue);
    --bs-btn-hover-border-color: var(--brand-blue);
    --bs-btn-active-bg: var(--brand-blue-dark);
    --bs-btn-active-border-color: var(--brand-blue-dark);
}
.btn { font-weight: 500; }

.card { background: var(--app-surface); border-color: var(--bs-border-color); border-radius: 0.6rem; }
.card-title { font-weight: 600; }

.form-control:focus, .form-select:focus { border-color: var(--brand-sky); box-shadow: 0 0 0 0.25rem rgba(17,156,255,0.2); }

.stat { font-variant-numeric: tabular-nums; font-size: 1.75rem; font-weight: 600; line-height: 1; letter-spacing: -0.03em; }
.stat-label { font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--app-muted); font-weight: 500; }

.htmx-request .htmx-indicator { display: inline-block; }
.htmx-indicator { display: none; }

/* Pipeline board */
.board-wrap { overflow-x: auto; padding-bottom: 0.5rem; }
.board { display: flex; gap: 1rem; align-items: flex-start; min-height: 60vh; }
.board-column { flex: 0 0 280px; background: #e9eef6; border-radius: 0.6rem; display: flex; flex-direction: column; max-height: calc(100vh - 220px); }
.board-column-hired { background: var(--brand-teal-soft); }
.board-column-head { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 0.9rem; border-bottom: 1px solid rgba(1,7,26,0.06); }
.board-column-body { padding: 0.6rem; overflow-y: auto; flex: 1 1 auto; min-height: 80px; }
.board-card { background: var(--app-surface); border: 1px solid var(--bs-border-color); border-radius: 0.5rem; padding: 0.6rem 0.75rem; margin-bottom: 0.6rem; cursor: grab; box-shadow: 0 1px 2px rgba(1,7,26,0.05); }
.board-card:active { cursor: grabbing; }
.board-card-ghost { opacity: 0.4; }
.board-card-drag { box-shadow: 0 8px 20px rgba(1,7,26,0.18); }
.board-card-pending { opacity: 0.6; }
.board-card-name { color: var(--bs-body-color); }
.board-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--brand-blue); margin-right: 0.4rem; vertical-align: middle; }
.board-column-hired .board-dot { background: var(--brand-teal); }
[x-cloak] { display: none !important; }

/* Ratings */
.rating-input { display: inline-flex; flex-direction: row-reverse; gap: 0.15rem; font-size: 1.6rem; line-height: 1; }
.rating-input input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.rating-star { cursor: pointer; color: #c9ced2; }
.rating-input input:checked ~ span, .rating-star:hover span, .rating-star:hover ~ .rating-star span,
.rating-star:has(input:checked) span, .rating-star:has(input:checked) ~ .rating-star span { color: var(--brand-amber); }
.rating-star:focus-within span { outline: 2px solid var(--brand-blue); outline-offset: 2px; border-radius: 2px; }

.notification-unread { background: #eef5fd; }

.form-check-input:checked { background-color: var(--brand-blue); border-color: var(--brand-blue); }

/* Reporting */
.sparkbars { display: flex; align-items: flex-end; gap: 3px; height: 72px; --max: 1; }
.sparkbar { flex: 1 1 0; min-width: 4px; background: var(--brand-blue); opacity: 0.85; border-radius: 2px 2px 0 0; height: calc(6px + 66px * var(--v) / var(--max)); }
.funnel-bar { background: #e9eef6; border-radius: 4px; height: 14px; overflow: hidden; }
.funnel-fill { height: 100%; background: var(--brand-blue); opacity: 0.85; border-radius: 4px; }
.funnel-fill-hired { background: var(--brand-teal); }
.progress-bar { background-color: var(--brand-blue); }

/* Legal pages */
.legal-text h2 { margin-top: 1.5rem; }
.legal-text p, .legal-text li { line-height: 1.65; }
