/*
    OnTime corporate theme.

    Single source of truth for the OnTime brand colours. Loaded after every vendor
    stylesheet (bootstrap, app.min, plugins) and after custom.css, on both the main
    and the login layout, so it replaces the Lexa template teal (#3eb7ba) with the
    OnTime navy. Change the brand here, not in bootstrap.css / app.min.css.
*/

:root {
    /* Brand tokens */
    --ot-navy: #1e3a5f;
    --ot-navy-strong: #17304e;
    --ot-navy-soft: #edf3fa;
    --ot-navy-focus: rgba(30, 58, 95, 0.25);
    --ot-on-navy: #ffffff;

    /* Bootstrap 4 exposes --primary on :root */
    --primary: var(--ot-navy);

    /* Existing custom.css tokens now follow the brand tokens */
    --ontime-primary: var(--ot-navy);
    --ontime-primary-strong: var(--ot-navy-strong);
    --ontime-primary-soft: var(--ot-navy-soft);
    --ontime-focus: 0 0 0 0.2rem var(--ot-navy-focus);
    --ontime-button-primary: var(--ot-navy);
    --ontime-button-outline-border: var(--ot-navy);
}

/* ---------- Buttons ---------- */

.btn-primary,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
    color: var(--ot-on-navy);
    background-color: var(--ot-navy);
    border-color: var(--ot-navy);
}

.btn-primary:hover,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active {
    background-color: var(--ot-navy-strong);
    border-color: var(--ot-navy-strong);
}

.btn-primary.disabled,
.btn-primary:disabled {
    color: var(--ot-on-navy);
    background-color: var(--ot-navy);
    border-color: var(--ot-navy);
    opacity: 0.65;
}

.btn:focus,
.btn.focus,
.btn-primary:focus,
.btn-primary.focus,
.btn-outline-primary:focus,
.btn-outline-primary.focus {
    box-shadow: 0 0 0 0.15rem var(--ot-navy-focus);
}

.btn-outline-primary.disabled,
.btn-outline-primary:disabled {
    color: var(--ot-navy);
    border-color: var(--ot-navy);
}

.btn-link,
.btn-link:hover {
    color: var(--ot-navy);
}

/* ---------- Text, background, border, links ---------- */

a {
    color: var(--ot-navy);
}

a:hover {
    color: var(--ot-navy-strong);
}

.text-primary {
    color: var(--ot-navy) !important;
}

.bg-primary {
    background-color: var(--ot-navy) !important;
}

.border-primary {
    border-color: var(--ot-navy) !important;
}

.bg-soft-primary {
    background-color: var(--ot-navy-soft) !important;
}

/* ---------- Badges ---------- */

.badge-primary,
a.badge-primary:hover,
a.badge-primary:focus {
    color: var(--ot-on-navy);
    background-color: var(--ot-navy);
}

.badge-soft-primary,
.badge-soft-primary[href]:hover,
.badge-soft-primary[href]:focus {
    color: var(--ot-navy);
    background-color: var(--ot-navy-soft);
}

/* ---------- Navigation, pagination, lists, progress ---------- */

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link,
.list-group-item.active,
.page-item.active .page-link,
.progress-bar {
    color: var(--ot-on-navy);
    background-color: var(--ot-navy);
    border-color: var(--ot-navy);
}

.page-link,
.page-link:hover {
    color: var(--ot-navy);
}

.page-link:focus {
    box-shadow: 0 0 0 0.15rem var(--ot-navy-focus);
}

.nav-tabs-custom .nav-item .nav-link.active {
    color: var(--ot-navy);
}

.nav-tabs-custom .nav-item .nav-link::after {
    background: var(--ot-navy);
}

.topnav .navbar-nav .nav-link:focus,
.topnav .navbar-nav .nav-link:hover,
.topnav .navbar-nav .nav-item .nav-link.active {
    color: var(--ot-navy);
}

/* ---------- Form controls ---------- */

.custom-control-input:checked ~ .custom-control-label::before,
.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
    background-color: var(--ot-navy);
    border-color: var(--ot-navy);
}

.custom-control-input:focus ~ .custom-control-label::before,
.custom-select:focus,
.form-control:focus {
    border-color: var(--ot-navy);
    box-shadow: 0 0 0 0.15rem var(--ot-navy-focus);
}

.custom-range::-webkit-slider-thumb { background-color: var(--ot-navy); }
.custom-range::-moz-range-thumb { background-color: var(--ot-navy); }
.custom-range::-ms-thumb { background-color: var(--ot-navy); }

input[switch]:checked + label,
input[switch=primary]:checked + label {
    background-color: var(--ot-navy);
}

/* ---------- Plugins ---------- */

.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option[aria-selected=true]:hover {
    color: var(--ot-on-navy);
    background-color: var(--ot-navy);
}

.datepicker table tr td.active,
.datepicker table tr td.active:hover,
.datepicker table tr td.selected,
.datepicker table tr td.selected:hover,
.datepicker table tr td.today,
.datepicker table tr td.today:hover {
    background-color: var(--ot-navy) !important;
}

.swal2-styled.swal2-confirm {
    background-color: var(--ot-navy);
}

.swal2-styled.swal2-confirm:focus {
    box-shadow: 0 0 0 3px var(--ot-navy-focus);
}

/* ------------------------------------------------------------------------------------------------
   Phase 2B tenant context (docs/system-contract/admin-tenant-context.md §64.8, §64.12).
   Header selector and stale-context banner. Only rendered in TenantContext:Mode = Enforced.
   ------------------------------------------------------------------------------------------------ */
.tenant-context-selector .tenant-context-select {
    width: 260px;
    max-width: 40vw;
}

.tenant-context-selector .select2-container--default .select2-selection--single {
    border-color: #ced4da;
    height: calc(1.5em + .5rem + 2px);
}

.tenant-context-selector .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: calc(1.5em + .5rem);
    color: var(--ot-navy);
    font-weight: 500;
}

.tenant-context-selector .tenant-context-unselected,
.tenant-context-selector .tenant-context-unselected + .select2-container .select2-selection--single {
    border-color: #f1b44c;
    background-color: #fff8ec;
}

.tenant-context-selector .select2-container--focus .select2-selection--single,
.tenant-context-selector .tenant-context-select:focus {
    border-color: var(--ot-navy);
    box-shadow: 0 0 0 .2rem var(--ot-navy-focus);
}

.tenant-context-locked {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .25rem .75rem;
    border: 1px solid #e3e8ef;
    border-radius: .25rem;
    color: var(--ot-navy);
    background-color: var(--ot-navy-soft);
    font-weight: 500;
}

.tenant-context-notices {
    position: fixed;
    top: 78px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1040;
    width: min(720px, calc(100vw - 2rem));
}

.tenant-context-banner {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-bottom: .5rem;
    padding: .6rem 1rem;
    border: 1px solid #d6e0ec;
    border-left: 4px solid var(--ot-navy);
    border-radius: .25rem;
    background-color: var(--ot-navy-soft);
    color: var(--ot-navy-strong);
    box-shadow: 0 2px 6px rgba(23, 48, 78, .08);
}

.tenant-context-banner[hidden] {
    display: none;
}

.tenant-context-banner__text {
    flex: 1 1 auto;
}

.tenant-context-banner:focus {
    outline: 2px solid var(--ot-navy);
    outline-offset: 2px;
}

body.tenant-context-stale form[method="post"] button[type="submit"],
body.tenant-context-stale form[method="post"] input[type="submit"] {
    opacity: .6;
    cursor: not-allowed;
}