﻿/*
  Safeway Transport brand theme for the driver portal.
  Brand colors (from the Safeway Transport logo):
    Safeway Teal #006666, Safeway Blue #119ABC, Deep Navy #0B3044, Light Teal #38B2B5
*/
html:root {
    --safeway-teal: #006666;
    --safeway-teal-dark: #004D4D;
    --safeway-blue: #119ABC;
    --safeway-navy: #0B3044;
    --primary: #006666;
}

/* ===== Navigation: teal bar with a blue strip ===== */
.bg-primary {
    background-color: #006666 !important;
}

.navbar.bg-primary {
    border-bottom: 4px solid #119ABC;
}

.navbar-brand {
    font-weight: 800;
    letter-spacing: 0.02em;
}

.navbar-dark .navbar-nav .nav-link {
    border-bottom: 3px solid transparent;
}

    .navbar-dark .navbar-nav .nav-link:hover,
    .navbar-dark .navbar-nav .nav-link.active,
    .navbar-dark .navbar-nav .nav-item.active .nav-link {
        color: #ffffff;
        border-bottom-color: #119ABC;
    }

/* ===== Links ===== */
.icon, a {
    color: #006666;
}

    a:hover {
        color: #004D4D;
    }

/* ===== Buttons ===== */
.btn-primary {
    background-color: #006666;
    border: 1px solid #006666;
    color: #ffffff;
}

    .btn-primary:hover,
    .btn-primary:focus,
    .btn-primary:not(:disabled):not(.disabled):active {
        background-color: #004D4D;
        border-color: #004D4D;
        color: #ffffff;
    }

    .btn-primary:focus {
        box-shadow: 0 0 0 0.2rem rgba(17, 154, 188, 0.35);
    }

.btn-primary.disabled, .btn-primary:disabled {
    background-color: #ababab;
    border: 1px solid #999;
}

.btn-outline-primary {
    color: #006666;
    border-color: #006666;
}

    .btn-outline-primary:hover {
        background-color: #006666;
        border-color: #006666;
        color: #ffffff;
    }

.btn-info {
    background-color: #119ABC;
    border-color: #119ABC;
}

.border-info,
.border-primary {
    border-color: #006666 !important;
}

.text-primary {
    color: #006666 !important;
}

.badge-primary {
    background-color: #119ABC;
    color: #ffffff;
}

.form-control:focus {
    border-color: #119ABC;
    box-shadow: 0 0 0 0.2rem rgba(17, 154, 188, 0.25);
}

.card-header {
    border-bottom: 3px solid #119ABC;
}

/* ===== Login / logout ===== */
.login-logo {
    width: 260px;
    max-width: 90%;
    height: auto;
}
