/* =====================================================================
   Sakkara Traffic Ops - Brand CSS
   Orange #E67E22 / Dark #1A2332
   ===================================================================== */

:root {
    --sakkara-primary: #E67E22;
    --sakkara-primary-dark: #CF6A13;
    --sakkara-primary-light: #F39C4D;
    --sakkara-dark: #1A2332;
    --sakkara-dark-2: #2C3E50;
    --sakkara-accent: #F4D03F;
    --sakkara-muted: #ECF0F1;
}

/* ---- Buttons ---- */
.btn-sakkara {
    background-color: var(--sakkara-primary) !important;
    border-color: var(--sakkara-primary) !important;
    color: #fff !important;
    font-weight: 600;
}
.btn-sakkara:hover,
.btn-sakkara:focus {
    background-color: var(--sakkara-primary-dark) !important;
    border-color: var(--sakkara-primary-dark) !important;
    color: #fff !important;
}

/* ---- Navbar / Sidebar ---- */
.sakkara-navbar {
    background-color: var(--sakkara-dark) !important;
    border-bottom: 3px solid var(--sakkara-primary) !important;
}
.sakkara-brand-text { color: #fff; }
.sakkara-sidebar {
    background-color: var(--sakkara-dark) !important;
}
.sakkara-sidebar .brand-link {
    background-color: var(--sakkara-dark-2) !important;
    border-bottom: 2px solid var(--sakkara-primary) !important;
    color: #fff !important;
}
.sakkara-sidebar .nav-sidebar .nav-link.active {
    background-color: var(--sakkara-primary) !important;
    color: #fff !important;
}
.sakkara-sidebar .nav-header {
    color: var(--sakkara-accent) !important;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 1px;
}

/* ---- Cards ---- */
.sakkara-card-header {
    background-color: var(--sakkara-dark) !important;
    color: #fff !important;
    border-bottom: 3px solid var(--sakkara-primary) !important;
}
.sakkara-card-header .card-title { color: #fff; }
.card-outline.card-sakkara {
    border-top: 4px solid var(--sakkara-primary) !important;
}

.sakkara-thead {
    background-color: var(--sakkara-dark);
    color: #fff;
}
.sakkara-thead th { color: #fff !important; border-color: var(--sakkara-dark-2) !important; }

.sakkara-bg-primary {
    background-color: var(--sakkara-primary) !important;
    color: #fff !important;
}

.sakkara-alert-welcome {
    background: linear-gradient(135deg, var(--sakkara-primary) 0%, var(--sakkara-primary-dark) 100%);
    color: #fff;
    border: none;
    border-radius: 0.5rem;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
}

/* ---- Login page ---- */
.sakkara-login-bg {
    background: linear-gradient(135deg, var(--sakkara-dark) 0%, var(--sakkara-dark-2) 100%);
    min-height: 100vh;
}
body.login-page {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    width: 100%;
    margin: 0;
    padding: 1rem;
}
body.login-page > .login-box {
    width: 100%;
    max-width: 360px;
    margin: 0 auto;
}
.login-box .card-outline.card-sakkara {
    border-top: 4px solid var(--sakkara-primary);
}

/* ---- Small boxes (dashboard) ---- */
.small-box > .inner h3 { font-weight: 700; }

/* ---- Print ---- */
@media print {
    .main-sidebar, .main-header, .main-footer, .btn, form { display: none !important; }
    .content-wrapper { margin: 0 !important; }
    body { background: #fff !important; }
}

/* ---- Tablet responsive tweaks ---- */
@media (max-width: 991.98px) {
    .small-box .icon { font-size: 50px; }
    .sakkara-brand-text .badge { display: none; }
}

/* ---- Color-blind friendly: icons alongside color ---- */
.badge i { margin-inline-end: 0.25rem; }

/* ---- Phase 8: Dashboard ---- */
.sakkara-upcoming .upcoming-row { padding: .75rem 1rem; }
.sakkara-upcoming .upcoming-time { min-width: 70px; }
.sakkara-upcoming .urgent-row { background: #fff3cd; }
.sakkara-upcoming .upcoming-row + .upcoming-row { border-top: 1px solid #eee; }
.bg-sakkara { background-color: #E67E22 !important; }