/* ==============================================
   AMP Core — Site Stylesheet
   Bootstrap 5 + Tom Select theming
   ============================================== */

/* ---- Base ---- */
html {
    font-size: 14px;
    position: relative;
    min-height: 100%;
}

@media (min-width: 768px) {
    html { font-size: 15px; }
}

body {
    margin-bottom: 56px; /* reserve space for absolute-positioned footer */
    background-color: #f8f9fa;
}

/* ---- Focus rings ---- */
.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    box-shadow: 0 0 0 0.15rem rgba(37, 140, 251, 0.30);
}

/* ============================================================
   THEME — User Area  (body.amp-theme-user)
   Navbar: deep navy  |  Body tint: pale blue
   ============================================================ */
body.amp-theme-user {
    background-color: #f0f6ff;
}

body.amp-theme-user .amp-navbar {
    background-color: #1e3a8a;
}

body.amp-theme-user .amp-navbar .navbar-brand,
body.amp-theme-user .amp-navbar .nav-link,
body.amp-theme-user .amp-navbar .amp-context-text,
body.amp-theme-user .amp-navbar .amp-username {
    color: #e0eaff;
}

body.amp-theme-user .amp-navbar .nav-link:hover,
body.amp-theme-user .amp-navbar .nav-link:focus {
    color: #ffffff;
    background-color: rgba(255, 255, 255, 0.08);
    border-radius: 0.25rem;
}

body.amp-theme-user .amp-navbar .nav-link.active {
    color: #ffffff;
    font-weight: 600;
    border-bottom: 2px solid #60a5fa;
    padding-bottom: calc(0.5rem - 2px);
}

/* ============================================================
   THEME — Admin Area  (body.amp-theme-admin)
   Navbar: deep crimson  |  Body tint: pale rose
   ============================================================ */
body.amp-theme-admin {
    background-color: #fff8f8;
}

body.amp-theme-admin .amp-navbar {
    background-color: #7f1d1d;
}

body.amp-theme-admin .amp-navbar .navbar-brand,
body.amp-theme-admin .amp-navbar .nav-link,
body.amp-theme-admin .amp-navbar .amp-context-text,
body.amp-theme-admin .amp-navbar .amp-username {
    color: #fee2e2;
}

body.amp-theme-admin .amp-navbar .nav-link:hover,
body.amp-theme-admin .amp-navbar .nav-link:focus {
    color: #ffffff;
    background-color: rgba(255, 255, 255, 0.10);
    border-radius: 0.25rem;
}

body.amp-theme-admin .amp-navbar .nav-link.active {
    color: #ffffff;
    font-weight: 600;
    border-bottom: 2px solid #fca5a5;
    padding-bottom: calc(0.5rem - 2px);
}

/* ============================================================
   NAVBAR LOGO
   ============================================================ */
.amp-navbar-logo {
    height:        40px;
    width:         auto;
    object-fit:    contain;
    border-radius: 4px;
    /* subtle drop-shadow so it pops on both dark navbars */
    filter:        drop-shadow(0 1px 3px rgba(0,0,0,0.55));
}

/* ============================================================
   LOGIN PAGE — stamp & card header
   ============================================================ */
.amp-login-logo {
    max-height:    160px;
    max-width:     100%;
    object-fit:    contain;
    filter:        drop-shadow(0 4px 12px rgba(0,0,0,0.25));
}

.amp-login-card-header {
    background: linear-gradient(135deg, #1e3a8a 0%, #1e40af 100%);
    border-bottom: none;
}

.ls-wide { letter-spacing: 0.08em; }

/* ============================================================
   NAVBAR — shared
   ============================================================ */
.amp-navbar {
    padding-top:    0.45rem;
    padding-bottom: 0.45rem;
}

.amp-navbar .navbar-brand {
    font-weight:    700;
    font-size:      1.15rem;
    letter-spacing: 0.03em;
    padding-top:    0;
    padding-bottom: 0;
}

/* Area badge ("Admin") shown next to brand */
.amp-area-badge {
    font-size:      0.6rem;
    font-weight:    700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    padding:        0.2em 0.5em;
    border-radius:  0.2rem;
    vertical-align: middle;
}

/* Right-side context info (AMO name, etc.) */
.amp-context-text {
    font-size:      0.8rem;
    max-width:      220px;
    overflow:       hidden;
    white-space:    nowrap;
    text-overflow:  ellipsis;
    opacity:        0.85;
}

/* Username link in navbar — explicit colour per theme (no opacity fade) */
.amp-username {
    font-size:       0.8rem;
    color:           rgba(255, 255, 255, 0.90); /* public dark navbar default */
    text-decoration: none;
}

a.amp-username:hover,
a.amp-username:focus {
    color:           #ffffff;
    text-decoration: underline;
}

.amp-navbar .vr {
    opacity:    0.30;
    align-self: stretch;
    height:     auto;
    min-height: 1em;
}

/* Hamburger icon on dark navbars */
.amp-navbar .navbar-toggler {
    border:  none;
    padding: 0.3rem 0.4rem;
}

.amp-navbar .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255,255,255,0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* ============================================================
   PAGE CONTENT
   ============================================================ */
.amp-content {
    padding-top:    1.25rem;
    padding-bottom: 2.5rem;
}

/* Standard page heading row */
.amp-page-heading {
    display:        flex;
    align-items:    baseline;
    gap:            0.75rem;
    padding-bottom: 0.75rem;
    margin-bottom:  1.25rem;
    border-bottom:  1px solid rgba(0, 0, 0, 0.09);
}

.amp-page-heading h2,
.amp-page-heading h3 {
    margin-bottom: 0;
}

/* ============================================================
   BREADCRUMB
   ============================================================ */
.amp-breadcrumb {
    font-size:     0.82rem;
    padding:       0.35rem 0 0.5rem;
    margin-bottom: 0.25rem;
}

.amp-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
    content:       "›";
    padding-right: 0.4rem;
}

/* ============================================================
   CARDS
   ============================================================ */
.card {
    border:        1px solid rgba(0, 0, 0, 0.075);
    border-radius: 0.5rem;
}

.card-header {
    font-weight:      600;
    font-size:        0.85rem;
    letter-spacing:   0.03em;
    background-color: rgba(0, 0, 0, 0.03);
    border-bottom:    1px solid rgba(0, 0, 0, 0.07);
}

/* ============================================================
   TABLES
   ============================================================ */
.table th {
    font-size:      0.78rem;
    font-weight:    600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color:          #6c757d;
}

.table-hover > tbody > tr:hover > * {
    background-color: rgba(0, 0, 0, 0.025);
}

/* ============================================================
   FORMS
   ============================================================ */
.form-label {
    font-weight:   500;
    font-size:     0.875rem;
    margin-bottom: 0.3rem;
}

.form-control,
.form-select {
    font-size: 0.9rem;
}

.form-text {
    font-size: 0.78rem;
}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn        { font-size: 0.875rem; }
.btn-sm     { font-size: 0.8rem;   }

/* ============================================================
   FOOTER
   ============================================================ */
.amp-footer {
    position:         absolute;
    bottom:           0;
    width:            100%;
    background-color: #f1f3f5;
    border-top:       1px solid #dee2e6;
    color:            #6c757d;
    font-size:        0.78rem;
    padding:          0.5rem 0;
    line-height:      1.2;
}

/* ============================================================
   TOM SELECT — Bootstrap 5 integration refinements
   (tom-select.bootstrap5.min.css is the base;
    these rules align sizing, shadow and focus to the site)
   ============================================================ */
.ts-wrapper { width: 100%; }

.ts-control {
    font-size:     0.9rem;
    padding:       0.375rem 0.75rem;
    border-color:  #ced4da;
    border-radius: 0.375rem;
    min-height:    calc(1.5em + 0.75rem + 2px);
    cursor:        text;
}

/* Focus ring */
.ts-wrapper.focus .ts-control,
.ts-wrapper:focus-within .ts-control {
    border-color: #86b7fe;
    box-shadow:   0 0 0 0.15rem rgba(13, 110, 253, 0.25);
    outline:      0;
}

/* Dropdown panel */
.ts-dropdown {
    font-size:     0.875rem;
    border-color:  #dee2e6;
    border-radius: 0.375rem;
    box-shadow:    0 4px 14px rgba(0, 0, 0, 0.10);
    z-index:       1060;
}

.ts-dropdown .option          { padding: 0.38rem 0.75rem; }
.ts-dropdown .option.active   { background-color: #0d6efd; color: #fff; }
.ts-dropdown .option:hover    { background-color: #e8f0fe; color: #1d4ed8; }

/* Invalid state */
select.is-invalid ~ .ts-wrapper .ts-control,
.ts-wrapper.is-invalid .ts-control {
    border-color: #dc3545;
}

select.is-invalid ~ .ts-wrapper.focus .ts-control,
select.is-invalid ~ .ts-wrapper:focus-within .ts-control {
    box-shadow: 0 0 0 0.15rem rgba(220, 53, 69, 0.25);
}

/* ============================================================
   AREA-SWITCH PILL  (Admin ↔ User mode toggle in navbar)
   Visually distinct from regular nav links — pill outline,
   contrasting accent colour, sits in the right-side toolbar.
   ============================================================ */
.amp-area-switch {
    display:         inline-flex;
    align-items:     center;
    font-size:       0.72rem;
    font-weight:     700;
    letter-spacing:  0.06em;
    text-transform:  uppercase;
    text-decoration: none;
    padding:         0.2em 0.65em;
    border-radius:   1rem;
    border:          1.5px solid currentColor;
    white-space:     nowrap;
    transition:      background-color 0.15s, color 0.15s, opacity 0.15s;
    opacity:         0.80;
}
.amp-area-switch:hover,
.amp-area-switch:focus {
    opacity:         1;
    text-decoration: none;
}

/* User navbar → Admin area: crimson accent */
body.amp-theme-user .amp-area-switch {
    color:            #fca5a5;
    border-color:     #fca5a5;
}
body.amp-theme-user .amp-area-switch:hover,
body.amp-theme-user .amp-area-switch:focus {
    background-color: rgba(220, 38, 38, 0.28);
    color:            #ffffff;
    border-color:     #ffffff;
}

/* Admin navbar → User area: blue accent */
body.amp-theme-admin .amp-area-switch {
    color:            #93c5fd;
    border-color:     #93c5fd;
}
body.amp-theme-admin .amp-area-switch:hover,
body.amp-theme-admin .amp-area-switch:focus {
    background-color: rgba(37, 99, 235, 0.28);
    color:            #ffffff;
    border-color:     #ffffff;
}

/* ============================================================
   AIRCRAFT / COMPONENT CONTEXT STRIP
   Rendered by _AircraftContext.cshtml partial at the top of
   Aircraft, Usage, Compliance, and Reports pages.
   ============================================================ */
.amp-context-strip {
    background:    rgba(0, 0, 0, 0.18);
    padding:       0.4rem 0.85rem;
    display:       flex;
    align-items:   center;
    gap:           1.25rem;
    margin-bottom: 1rem;
    border-radius: 0.375rem;
    flex-wrap:     wrap;
}

.amp-context-strip form {
    display:     flex;
    align-items: center;
    gap:         1.25rem;
    flex-wrap:   wrap;
    margin:      0;
}

.amp-ctx-item {
    display:     flex;
    align-items: center;
    gap:         0.4rem;
}

.amp-ctx-label {
    font-size:   0.72rem;
    font-weight: 600;
    color:       rgba(255, 255, 255, 0.75);
    white-space: nowrap;
    margin:      0;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.amp-context-strip .form-select {
    font-size:   0.85rem;
    min-width:   130px;
    max-width:   220px;
    padding-top:    0.25rem;
    padding-bottom: 0.25rem;
    background-color: rgba(255, 255, 255, 0.92);
    border-color: transparent;
}

.amp-context-strip .form-select:focus {
    background-color: #fff;
    border-color: #86b7fe;
    box-shadow: 0 0 0 0.15rem rgba(13, 110, 253, 0.25);
}