:root {
    --tig-deep-royal-blue: #03338B;
    --tig-secondary-orange: #E17A2C;
    --tig-cta-red: #EE0907;
    --tig-light-background: #F4F5F6;
    --tig-light-sky-blue: #B0D8E6;
    --tig-primary-text: #030303;
    --tig-muted-text: #3f4b57;
    --logistics-blue: var(--tig-deep-royal-blue);
    --logistics-navy: var(--tig-deep-royal-blue);
    --logistics-teal: var(--tig-light-sky-blue);
    --logistics-orange: var(--tig-secondary-orange);
    --logistics-red: var(--tig-cta-red);
    --logistics-ink: var(--tig-primary-text);
    --bs-primary: var(--tig-deep-royal-blue);
    --bs-primary-rgb: 3, 51, 139;
    --bs-info: var(--tig-light-sky-blue);
    --bs-info-rgb: 176, 216, 230;
    --bs-success: var(--tig-deep-royal-blue);
    --bs-success-rgb: 3, 51, 139;
    --bs-warning: var(--tig-secondary-orange);
    --bs-warning-rgb: 225, 122, 44;
    --bs-danger: var(--tig-cta-red);
    --bs-danger-rgb: 238, 9, 7;
    --bs-dark: var(--tig-primary-text);
    --bs-dark-rgb: 3, 3, 3;
    --bs-light: var(--tig-light-background);
    --bs-light-rgb: 244, 245, 246;
    --bs-link-color: var(--tig-deep-royal-blue);
    --bs-link-hover-color: var(--tig-cta-red);
}

html, body { min-height: 100%; }
body { color: var(--logistics-ink); background-color: var(--tig-light-background); }

.logistics-nav {
    background: linear-gradient(110deg, var(--tig-deep-royal-blue), #02245f);
}

.brand-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    margin-right: .35rem;
    border-radius: .55rem;
    background: var(--tig-secondary-orange);
    color: var(--tig-deep-royal-blue);
    font-size: .75rem;
    font-weight: 900;
}

.auth-shell {
    min-height: calc(100vh - 160px);
    display: flex;
    align-items: center;
}

.auth-card {
    overflow: hidden;
    border: 0;
    border-radius: 1.25rem;
    box-shadow: 0 1.25rem 3rem rgb(13 43 69 / 14%);
}

.auth-panel {
    background: linear-gradient(155deg, var(--tig-light-sky-blue), var(--tig-light-background));
}

.auth-icon {
    width: 3.5rem;
    height: 3.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 1rem;
    background: rgb(225 122 44 / 20%);
    color: var(--tig-deep-royal-blue);
    font-weight: 900;
}

.form-control:focus, .form-select:focus {
    border-color: var(--tig-deep-royal-blue);
    box-shadow: 0 0 0 .25rem rgb(3 51 139 / 18%);
}

.foundation-card {
    padding: clamp(1.5rem, 4vw, 3rem);
    background: white;
    border: 1px solid #dbe5ef;
    border-radius: 1rem;
    box-shadow: 0 1rem 2rem rgb(13 43 69 / 8%);
}

.eyebrow {
    margin: 0 0 .5rem;
    color: var(--tig-deep-royal-blue);
    font-size: .8rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.health-status { font-size: 1.1rem; }
.status-ok { color: var(--tig-deep-royal-blue); }
.status-failed { color: var(--tig-cta-red); }

.health-table {
    width: 100%;
    border-collapse: collapse;
    margin-block: 1.5rem;
}

.health-table th, .health-table td {
    padding: .75rem;
    border-bottom: 1px solid #cbd5e1;
    text-align: left;
    vertical-align: top;
}

.notice { color: #64748b; font-size: .9rem; }

/* Administrator workspace */
.admin-body { background: #f4f7fb; }
.admin-shell { min-height: 100vh; display: flex; }
.admin-sidebar {
    width: 280px;
    flex: 0 0 280px;
    min-height: 100vh;
    background: linear-gradient(180deg, var(--tig-deep-royal-blue) 0%, #02245f 100%);
    color: var(--tig-light-background);
    border-right: 1px solid rgb(255 255 255 / 8%);
    z-index: 1045;
}
.admin-sidebar-inner { padding: 1.5rem 1rem 2rem; }
.admin-brand { padding: .25rem .5rem 1rem; border-bottom: 1px solid rgb(255 255 255 / 12%); }
.admin-nav-heading { margin: 1.25rem .7rem .4rem;     color: var(--tig-light-sky-blue); font-size: .68rem; font-weight: 800; letter-spacing: .13em; }
.admin-nav-link {
    display: flex;
    align-items: center;
    gap: .7rem;
    width: 100%;
    min-height: 2.35rem;
    padding: .55rem .7rem;
    margin-block: .15rem;
    border-radius: .65rem;
    color: #d9e9f5;
    font-size: .9rem;
    text-decoration: none;
    transition: background .15s ease, color .15s ease;
}
.admin-nav-link i { width: 1.1rem; text-align: center; }
.admin-nav-link:hover, .admin-nav-link.active { background: rgb(255 255 255 / 13%); color: #fff; }
.admin-nav-link.active {     box-shadow: inset 3px 0 0 var(--tig-secondary-orange); }
.admin-nav-link.disabled { color: #7894aa; cursor: not-allowed; opacity: .74; }
.admin-nav-link.disabled small { margin-left: auto; font-size: .64rem; text-transform: uppercase; letter-spacing: .05em; }
.admin-main { min-width: 0; flex: 1; display: flex; flex-direction: column; }
.admin-topbar { position: sticky; top: 0; z-index: 1020; min-height: 4.5rem; display: flex; align-items: center; background: rgb(255 255 255 / 94%); border-bottom: 1px solid #dbe5ef; backdrop-filter: blur(10px); }
.admin-content { flex: 1; padding: clamp(1rem, 2.5vw, 2rem); }
.admin-footer { padding: 1rem clamp(1rem, 2.5vw, 2rem); border-top: 1px solid #dbe5ef; background: #fff; }
.avatar-chip { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border-radius: 50%; background: #dbeafe; color: #1d4ed8; font-size: .8rem; font-weight: 800; }
.stat-card { padding: 1.15rem; border: 1px solid rgb(219 229 239 / 80%); border-left: 4px solid var(--card-accent, var(--logistics-blue)); border-radius: .9rem; background: #fff; box-shadow: 0 .6rem 1.5rem rgb(13 43 69 / 6%); }
.stat-card-blue { --card-accent: #2563eb; }
.stat-card-indigo { --card-accent: var(--tig-deep-royal-blue); }
.stat-card-teal { --card-accent: var(--tig-light-sky-blue); }
.stat-card-green { --card-accent: var(--tig-deep-royal-blue); }
.stat-card-orange { --card-accent: #ea580c; }
.stat-card-purple { --card-accent: var(--tig-secondary-orange); }
.stat-card-red { --card-accent: var(--tig-cta-red); }
.stat-card-yellow { --card-accent: var(--tig-secondary-orange); }
.stat-label { color: #64748b; font-size: .78rem; font-weight: 700; }
.stat-value { color: #102f4b; font-size: clamp(1.45rem, 2.2vw, 2rem); font-weight: 800; line-height: 1; }
.stat-icon { display: inline-flex; align-items: center; justify-content: center; width: 2.55rem; height: 2.55rem; border-radius: .8rem; background: color-mix(in srgb, var(--card-accent) 13%, white); color: var(--card-accent); font-size: 1.15rem; }
.admin-panel { padding: 1.2rem; border: 1px solid #dbe5ef; border-radius: .9rem; background: #fff; box-shadow: 0 .6rem 1.5rem rgb(13 43 69 / 4%); }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid #edf2f7; }
.admin-table { --bs-table-bg: transparent; font-size: .86rem; }
.admin-table thead th { color: #64748b; font-size: .7rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }
.admin-table tbody tr:last-child td { border-bottom: 0; }
.admin-table td, .admin-table th { padding: .75rem .65rem; }
.empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 9rem; gap: .6rem; color: #64748b; text-align: center; }
.empty-state i { color: #94a3b8; font-size: 2rem; }
.activity-list { display: grid; gap: .15rem; }
.activity-item { display: grid; grid-template-columns: .7rem 1fr; gap: .7rem; padding: .65rem 0; border-bottom: 1px solid #edf2f7; }
.activity-item:last-child { border-bottom: 0; }
.activity-dot { width: .55rem; height: .55rem; margin-top: .3rem; border-radius: 50%;     background: var(--tig-secondary-orange); box-shadow: 0 0 0 .25rem #fff3d6; }
.detail-field { min-height: 4rem; padding: .75rem; border: 1px solid #e5edf5; border-radius: .65rem; background: #fbfdff; }
.mini-stat-list { display: grid; gap: .25rem; }
.mini-stat-list > div { display: flex; align-items: center; justify-content: space-between; padding: .85rem .2rem; border-bottom: 1px solid #edf2f7; }
.mini-stat-list > div:last-child { border-bottom: 0; }
.mini-stat-list span { color: #64748b; }
.mini-stat-list strong { font-size: 1.2rem; }

@media (min-width: 992px) {
    .admin-sidebar.offcanvas-lg { position: sticky; top: 0; visibility: visible !important; transform: none !important; }
}

@media (max-width: 991.98px) {
    .admin-sidebar { width: 280px; }
    .admin-sidebar .btn-close { filter: invert(1); }
}

@media (max-width: 575.98px) {
    .admin-content { padding: 1rem .75rem; }
    .admin-panel { padding: .9rem; }
    .stat-card { padding: .9rem; }
    .stat-label { font-size: .7rem; }
    .stat-value { font-size: 1.35rem; }
    .panel-heading { align-items: flex-start; flex-direction: column; }
}

.tracking-timeline { position: relative; display: grid; gap: 0; }
.tracking-timeline::before { content: ''; position: absolute; top: .65rem; bottom: .65rem; left: .7rem; width: 2px; background: #dbe5ef; }
.tracking-event { position: relative; display: grid; grid-template-columns: 1.5rem 1fr; gap: .8rem; padding: .3rem 0 1rem; }
.tracking-event:last-child { padding-bottom: .2rem; }
.tracking-event-marker { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; width: 1.45rem; height: 1.45rem; border: 3px solid #fff; border-radius: 50%;     background: var(--tig-deep-royal-blue); color: #fff; box-shadow: 0 0 0 1px #b6d5d2; font-size: .68rem; }
.tracking-event-body { min-width: 0; padding: .05rem 0 .8rem; border-bottom: 1px solid #edf2f7; }
.tracking-event:last-child .tracking-event-body { border-bottom: 0; }
.public-tracking-hero {     background: linear-gradient(135deg, var(--tig-light-sky-blue) 0%, var(--tig-light-background) 58%, #fff7ef 100%); border: 1px solid #dbe5ef; border-radius: 1.25rem; box-shadow: 0 1rem 2.4rem rgb(13 43 69 / 8%); }
.public-status-card { border: 0; border-radius: 1rem;     background: linear-gradient(135deg, var(--tig-deep-royal-blue), #02245f); color: #fff; box-shadow: 0 1rem 2.2rem rgb(13 43 69 / 16%); }
.public-status-card .eyebrow { color: var(--tig-light-sky-blue); }
.public-status-card .text-secondary { color: #d6e5f2 !important; }
.tracking-location { color: var(--tig-deep-royal-blue); }
@media (max-width: 575.98px) {
    .tracking-event { grid-template-columns: 1.35rem 1fr; gap: .55rem; }
    .tracking-event-marker { width: 1.3rem; height: 1.3rem; }
}

/* Milestone 7 receipt presentation */
.receipt-document {
    background: #fff;
    border: 1px solid rgba(20, 37, 63, .10);
    border-radius: 1rem;
    box-shadow: 0 .5rem 1.5rem rgba(20, 37, 63, .06);
    padding: clamp(1.25rem, 3vw, 2.5rem);
}
.receipt-company-header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 3px solid var(--tig-deep-royal-blue);
    padding-bottom: 1.25rem;
}
.receipt-breakdown dt,
.receipt-breakdown dd { padding-bottom: .5rem; }
.receipt-print-body { background: var(--tig-light-background); }
@media print {
    @page { size: A4; margin: 12mm; }
    body.receipt-print-body,
    body { background: #fff !important; }
    .receipt-actions,
    .navbar,
    .admin-sidebar,
    .admin-topbar,
    .admin-footer,
    footer,
    header,
    nav { display: none !important; }
    .receipt-document {
        border: 0;
        border-radius: 0;
        box-shadow: none;
        padding: 0;
    }
    .container,
    .container-fluid,
    main,
    section { max-width: none !important; width: 100% !important; margin: 0 !important; padding: 0 !important; }
}
@media (max-width: 576px) {
    .receipt-company-header { display: block; }
}

/* Milestone 8 shipment media */
.media-gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 1rem;
}
.media-card {
    overflow: hidden;
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: .85rem;
    background: #fff;
    box-shadow: 0 .2rem .8rem rgba(24, 36, 58, .06);
}
.media-card-archived { opacity: .72; }
.media-preview {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 180px;
    overflow: hidden;
    background: #f2f5f9;
    text-decoration: none;
}
.media-preview img,
.media-preview video { display: block; width: 100%; height: 190px; object-fit: cover; }
.media-video-placeholder { display: flex; flex-direction: column; align-items: center; gap: .5rem; color: #5d6b82; font-size: .9rem; }
.media-video-placeholder i { font-size: 2.5rem; }
.media-card-body { padding: 1rem; }
@media (max-width: 575.98px) {
    .media-gallery-grid { grid-template-columns: 1fr; }
}

/* Centralized site branding assets */
.site-logo {
    display: block;
    width: auto;
    max-width: 100%;
    object-fit: contain;
}
.site-logo--public { width: 2.25rem; height: 2.25rem; border-radius: .55rem; background: #fff; padding: .12rem; }
.site-logo--footer { width: 2.25rem; height: 2.25rem; border-radius: .55rem; background: #fff; padding: .12rem; }
.site-logo--admin { width: 2.35rem; height: 2.35rem; border-radius: .55rem; background: #fff; padding: .12rem; flex: 0 0 auto; }
.site-logo--customer { width: 2rem; height: 2rem; border-radius: .45rem; background: #fff; padding: .1rem; }
.site-logo--legacy { width: 2rem; height: 2rem; border-radius: .45rem; background: #fff; padding: .1rem; }
.site-logo-preview { max-width: 260px; max-height: 120px; object-fit: contain; border: 1px solid rgb(3 51 139 / 15%); border-radius: .65rem; padding: .5rem; background: #fff; }
