/* HeliTool Flight Deck 2.0 - site-wide shell and base component theme.
   Tokens: design-tokens.css. Map-page UI: flightdeck.css. */

/* ── Icons ───────────────────────────────────────────────────────────────── */
.fd-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.fd-ic {
    width: 20px;
    height: 20px;
    flex: none;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.75;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* ── Base theme (Bootstrap 5.1 overrides) ────────────────────────────────── */
:root {
    --bs-primary: #1e3a8a;
    --bs-primary-rgb: 30, 58, 138;
}
body {
    font-family: var(--fd-font);
    color: var(--fd-text);
    background-color: var(--fd-bg);
}
a { color: var(--fd-brand); }
a:hover { color: var(--fd-brand-dark); }

.bg-primary { background-color: var(--fd-brand) !important; }
.text-primary { color: var(--fd-brand) !important; }
.border-primary { border-color: var(--fd-brand) !important; }

.btn {
    padding: .5rem 1rem;
    border-radius: var(--fd-radius);
    font-weight: 600;
    transition: background-color .12s, border-color .12s, color .12s;
}
.btn:hover { transform: none; box-shadow: none; }
.btn-sm { padding: .25rem .65rem; border-radius: 6px; }
.btn-lg { padding: .7rem 1.4rem; border-radius: 10px; }
.btn-primary { background: var(--fd-brand); border: 1px solid var(--fd-brand); color: #fff; }
.btn-primary:hover, .btn-primary:focus, .btn-primary:active { background: var(--fd-brand-dark); border-color: var(--fd-brand-dark); color: #fff; }
.btn-outline-primary { color: var(--fd-brand); border-color: var(--fd-brand); background: transparent; }
.btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active { background: var(--fd-brand); border-color: var(--fd-brand); color: #fff; }
.btn-secondary { background: #475569; border: 1px solid #475569; color: #fff; }
.btn-secondary:hover { background: #334155; border-color: #334155; color: #fff; }
.btn-success { background: var(--fd-success); border: 1px solid var(--fd-success); color: #fff; }
.btn-success:hover { background: #12853c; border-color: #12853c; color: #fff; }
.btn-info { background: #0284c7; border: 1px solid #0284c7; color: #fff; }
.btn-info:hover { background: #026aa2; border-color: #026aa2; color: #fff; }
.btn-warning { background: var(--fd-warning); border: 1px solid var(--fd-warning); color: #1b2433; }
.btn-warning:hover { background: #d98a06; border-color: #d98a06; color: #1b2433; }
.btn-danger { background: var(--fd-danger); border: 1px solid var(--fd-danger); color: #fff; }
.btn-danger:hover { background: #b92d3b; border-color: #b92d3b; color: #fff; }
.btn:focus-visible { outline: 2px solid var(--fd-active); outline-offset: 2px; box-shadow: none; }

.card {
    border: 1px solid var(--fd-border);
    border-radius: 12px;
    background: var(--fd-panel);
    box-shadow: 0 1px 2px rgba(11, 31, 56, .06);
    transition: none;
}
.card:hover { transform: none; box-shadow: 0 1px 2px rgba(11, 31, 56, .06); }
.card-header {
    background: var(--fd-navy-800);
    color: #fff;
    border-bottom: 0;
    font-weight: 600;
}
.card-header.bg-white, .card-header.bg-light, .card-header.bg-transparent { color: var(--fd-text); }

/* Hero and call-to-action cards carry per-page inline gradients (green, cyan, purple ...): one palette */
.card[style*="linear-gradient"] { background: var(--fd-navy-800) !important; }

.table th { background: var(--fd-navy-800); color: #fff; border: 0; font-weight: 600; }
.table td { border-color: var(--fd-border); }
.table-responsive { border-radius: 10px; }

.form-control, .form-select {
    padding: .5rem .75rem;
    border: 1px solid var(--fd-border);
    border-radius: var(--fd-radius);
    background-color: #fff;
    color: var(--fd-text);
}
.form-control:focus, .form-select:focus {
    border-color: var(--fd-active);
    box-shadow: 0 0 0 .2rem rgba(59, 130, 246, .2);
}
.form-label { margin-bottom: .35rem; font-weight: 600; color: var(--fd-text); }
.form-check-input:checked { background-color: var(--fd-brand); border-color: var(--fd-brand); }

.alert { border: 1px solid transparent; border-radius: 10px; box-shadow: none; font-weight: 500; }
.alert-success { background: #e8f6ee; border-color: #bfe5cf; color: #146c3a; }
.alert-danger  { background: #fdecee; border-color: #f4c3c9; color: #9b1c2c; }
.alert-info    { background: #e8f1fe; border-color: #c4d9fa; color: var(--fd-brand); }
.alert-warning { background: #fff4dd; border-color: #f6dba0; color: #92580a; }
.alert .alert-link { color: inherit; text-decoration: underline; }

.badge { padding: .35em .65em; border-radius: 999px; font-weight: 600; }

.page-link { color: var(--fd-brand); }
.page-item.active .page-link { background: var(--fd-brand); border-color: var(--fd-brand); color: #fff; }
.nav-pills .nav-link.active, .list-group-item.active { background: var(--fd-brand); border-color: var(--fd-brand); }
.progress-bar { background: var(--fd-brand); }
.dropdown-item:active { background: var(--fd-brand); }

.modal-content { border: 0; border-radius: 14px; box-shadow: 0 12px 40px rgba(11, 31, 56, .28); }
.modal-header { border-bottom: 1px solid var(--fd-border); }
.modal-header.bg-primary { border-bottom: 0; }
.modal-footer { border-top: 1px solid var(--fd-border); }

::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #b6c2d1; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* ── Site navigation ─────────────────────────────────────────────────────── */
.hs-nav {
    position: sticky;
    top: 0;
    z-index: 1030;
    display: flex;
    align-items: center;
    gap: 8px;
    height: var(--fd-nav-h);
    padding: 0 12px 0 16px;
    background: var(--fd-navy-800);
    color: #fff;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
    font-family: var(--fd-font);
    font-size: 13px;
}
.hs-brand {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-right: 6px;
    color: #fff;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: .01em;
    text-decoration: none;
}
.hs-brand:hover { color: #fff; }
.hs-brand img { display: block; height: 32px; width: auto; }

.hs-tabs { display: flex; gap: 2px; min-width: 0; }
.hs-tab {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    height: var(--fd-nav-h);
    padding: 0 14px;
    border: 0;
    background: none;
    color: #c4cfdd;
    font: 600 12px/1 var(--fd-font);
    letter-spacing: .07em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}
.hs-tab:hover { color: #fff; background: rgba(255, 255, 255, .06); }
.hs-tab.is-active, .hs-tab.show { color: #fff; }
.hs-tab.is-active::before {
    content: "";
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 0;
    height: 3px;
    border-radius: 3px 3px 0 0;
    background: var(--fd-active);
}
.hs-tab.dropdown-toggle::after { margin-left: 2px; border-top-width: .3em; border-right-width: .3em; border-left-width: .3em; }
.hs-tab:focus-visible, .hs-btn:focus-visible { outline: 2px solid var(--fd-active); outline-offset: -2px; }

.hs-right { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.hs-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 0 12px;
    border: 1px solid transparent;
    border-radius: var(--fd-radius);
    background: none;
    color: #dbe4ef;
    font: 600 12px var(--fd-font);
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}
.hs-btn:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.hs-btn.show { background: rgba(255, 255, 255, .16); color: #fff; }
.hs-btn-outline { border-color: rgba(255, 255, 255, .28); }
.hs-btn-primary { background: var(--fd-active); border-color: var(--fd-active); color: #fff; }
.hs-btn-primary:hover { background: #2f78e8; color: #fff; }
.hs-btn.dropdown-toggle::after { margin-left: 2px; }
.hs-btn-icon { width: 40px; padding: 0; justify-content: center; }
.hs-btn-icon.dropdown-toggle::after { display: none; }

.hs-menu {
    min-width: 230px;
    margin-top: 0;
    padding: 6px;
    border: 1px solid var(--fd-border);
    border-radius: 10px;
    background: #fff;
    box-shadow: var(--fd-shadow);
    font: 13px var(--fd-font);
}
.hs-nav .dropdown-menu { z-index: 1050; }
.hs-menu .dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 6px;
    color: var(--fd-text);
    font-weight: 500;
}
.hs-menu .dropdown-item:hover, .hs-menu .dropdown-item:focus { background: var(--fd-bg); color: var(--fd-brand); }
.hs-menu .dropdown-item i { width: 18px; color: var(--fd-text-2); text-align: center; }
.hs-menu .dropdown-item.is-active { color: var(--fd-brand); background: #eaf0fd; }
.hs-menu .dropdown-divider { margin: 4px 0; border-color: var(--fd-border); }
.hs-menu .dropdown-header { padding: 6px 10px; font: 700 11px var(--fd-font); letter-spacing: .08em; text-transform: uppercase; color: var(--fd-text-2); }
.hs-menu form { margin: 0; }
.hs-menu button.dropdown-item { width: 100%; background: none; border: 0; text-align: left; }
.hs-menu-ops { background: linear-gradient(90deg, #1a237e, #0d47a1); color: #fff !important; font-weight: 600; }
.hs-menu-ops i { color: #fff !important; }
.hs-menu-ops:hover { background: linear-gradient(90deg, #17206f, #0b3c8e) !important; }

/* ── Bottom navigation (phones) ──────────────────────────────────────────── */
.hs-bottomnav {
    display: none;
    position: fixed;
    inset: auto 0 0 0;
    z-index: 1030;
    height: calc(var(--fd-bn-h) + var(--fd-safe-b));
    padding-bottom: var(--fd-safe-b);
    background: var(--fd-navy-800);
    border-top: 1px solid rgba(255, 255, 255, .08);
}
.hs-bottomnav .hs-tab,
.hs-bottomnav .dropup { flex: 1 1 0; min-width: 0; }
.hs-bottomnav .hs-tab {
    width: 100%;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    padding: 0 2px;
    height: var(--fd-bn-h);
    font-size: 10px;
    letter-spacing: .03em;
}
.hs-bottomnav .hs-tab.is-active::before { top: 0; bottom: auto; border-radius: 0 0 3px 3px; }
.hs-bottomnav .hs-tab.dropdown-toggle::after { display: none; }
.hs-bottomnav .dropdown-menu { width: min(92vw, 320px); }

/* ── Two-factor auth pages (templates/two_factor/_base.html) ─────────────── */
main.tf-main {
    flex: 0 1 auto;
    width: min(460px, calc(100% - 2rem));
    margin: 2.5rem auto;
    padding: 1.75rem 1.75rem 1.5rem !important;
    background: var(--fd-panel);
    border: 1px solid var(--fd-border);
    border-radius: 14px;
    box-shadow: var(--fd-shadow);
}
.tf-main h1 { margin: 0 0 .75rem; font-size: 1.5rem; font-weight: 700; color: var(--fd-navy-800); }
.tf-main p { color: var(--fd-text-2); }
.tf-main table { width: 100%; margin-bottom: 1rem; }
.tf-main th { padding: .5rem 0 .25rem; font-size: 13px; font-weight: 600; color: var(--fd-text); text-align: left; }
.tf-main td { padding: 0 0 .5rem; }
.tf-main input[type="text"], .tf-main input[type="password"], .tf-main input[type="number"],
.tf-main input[type="email"], .tf-main select {
    width: 100%;
    padding: .5rem .75rem;
    border: 1px solid var(--fd-border);
    border-radius: var(--fd-radius);
    background: #fff;
    color: var(--fd-text);
}
.tf-main input:focus, .tf-main select:focus { outline: 0; border-color: var(--fd-active); box-shadow: 0 0 0 .2rem rgba(59, 130, 246, .2); }
.tf-main .errorlist { margin: 0 0 .5rem; padding: 0; list-style: none; color: var(--fd-danger); font-size: 13px; }
.tf-main .float-right { float: right; }
.tf-main .btn-block { display: block; width: 100%; margin-bottom: .5rem; }
.tf-main .btn-link { background: none; border: 0; color: var(--fd-brand); font-weight: 600; text-decoration: underline; }
.tf-main hr { border-color: var(--fd-border); }

/* ── Footer ──────────────────────────────────────────────────────────────── */
.hs-footer,
.main-footer.hs-footer {
    margin-top: 3rem;
    padding: 0;
    background: var(--fd-navy-900);
    color: #c4cfdd;
    font-size: 14px;
}
.hs-footer a { color: #c4cfdd; text-decoration: none; }
.hs-footer a:hover { color: #fff; text-decoration: underline; }
.hs-footer h4 {
    margin: 0 0 .75rem;
    color: #fff;
    font: 700 12px var(--fd-font);
    letter-spacing: .1em;
    text-transform: uppercase;
}
.hs-footer ul { margin: 0; padding: 0; list-style: none; }
.hs-footer li { margin-bottom: .45rem; }
.hs-footer li i { width: 18px; margin-right: 4px; color: #7f93ad; text-align: center; }
.hs-footer .hs-footer-brand { display: inline-flex; align-items: center; gap: 8px; margin-bottom: .75rem; color: #fff; font-size: 17px; font-weight: 700; }
.hs-footer .hs-footer-brand img { height: 28px; width: auto; }
.hs-footer .form-control { background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .22); color: #fff; }
.hs-footer .form-control::placeholder { color: #9fb0c6; }
.hs-footer .form-control:focus { background: rgba(255, 255, 255, .14); border-color: var(--fd-active); color: #fff; }
.hs-footer .btn-warning { background: var(--fd-active); border-color: var(--fd-active); color: #fff; }
.hs-footer .hs-footer-note { color: #9fb0c6; font-size: 12px; }
.hs-footer .hs-footer-bottom { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid rgba(255, 255, 255, .1); font-size: 13px; }
.hs-footer .hs-footer-bottom a { margin-left: .9rem; }
.hs-footer .text-muted, .hs-footer small.text-muted { color: #9fb0c6 !important; }
.hs-footer .border-top { border-color: rgba(255, 255, 255, .1) !important; }

/* ── Layout helpers ──────────────────────────────────────────────────────── */
body { display: flex; flex-direction: column; min-height: 100vh; }
.container-fluid { flex: 1; }
main { overflow-x: clip; }

/* Legacy map border (style.css) belongs to embedded maps only */
#map { border-width: 1px; border-radius: 12px; box-shadow: none; }

@media (max-width: 1023.98px) {
    .hs-brand span { display: none; }
    .hs-tab { padding: 0 11px; }
}

@media (max-width: 767.98px) {
    :root { --fd-nav-h: 48px; }
    .hs-brand span { display: inline; font-size: 16px; }
    .hs-tabs, .hs-desktop-only { display: none !important; }
    .hs-bottomnav { display: flex; }
    body.hs-site { padding-bottom: calc(var(--fd-bn-h) + var(--fd-safe-b)); }
    body.hs-site .cookie-settings-btn { bottom: calc(var(--fd-bn-h) + var(--fd-safe-b) + 36px) !important; }
}
@media (min-width: 768px) {
    .hs-phone-only { display: none !important; }
}
