/*
   Indeliver V33 system-wide company branding runtime bridge.
   Loaded LAST. PrimaryColor/SecondaryColor are company-owned identity tokens.
   Operational status colors (success/warning/danger/return/info) intentionally remain fixed.
*/

/* V33 first-paint/realtime switch guard. Theme variable changes are atomic. */
html[data-brand-updating="true"] *,
html[data-brand-updating="true"] *::before,
html[data-brand-updating="true"] *::after {
    transition: none !important;
    animation-duration: 0s !important;
    animation-delay: 0s !important;
}

:root {
    --brand-primary: #2563EB;
    --brand-primary-rgb: 37, 99, 235;
    --brand-primary-hover: #1D4ED8;
    --brand-primary-deep: #1E40AF;
    --brand-primary-soft: #EFF6FF;
    --brand-primary-border: #BFDBFE;
    --brand-primary-contrast: #FFFFFF;

    --brand-secondary: #0F2747;
    --brand-secondary-rgb: 15, 39, 71;
    --brand-secondary-hover: #0D223E;
    --brand-secondary-deep: #0B1D35;
    --brand-secondary-soft: #F1F5F9;
    --brand-secondary-border: #CBD5E1;
    --brand-secondary-contrast: #FFFFFF;

    /* Legacy portal/public aliases. Runtime JS updates both canonical + aliases. */
    --ind-blue: var(--brand-primary);
    --ind-blue-600: var(--brand-primary-hover);
    --ind-blue-700: var(--brand-primary-deep);
    --ind-blue-soft: var(--brand-primary-soft);
    --ind-blue-line: var(--brand-primary-border);
    --ind-orange: var(--brand-secondary);
    --ind-orange-600: var(--brand-secondary-hover);
    --ind-orange-bright: var(--brand-secondary);
    --ind-orange-soft: var(--brand-secondary-soft);
    --ind-brand: var(--brand-primary);
    --ind-brand-600: var(--brand-primary-hover);
    --ind-brand-700: var(--brand-primary-deep);
    --ind-brand-soft: var(--brand-primary-soft);
    --ind-brand-ring: rgba(var(--brand-primary-rgb), .14);
    --ind-accent: var(--brand-secondary);
    --ind-accent-600: var(--brand-secondary-hover);
    --ind-accent-soft: var(--brand-secondary-soft);
    --expo-blue: var(--brand-secondary);
    --expo-blue-dark: var(--brand-secondary-deep);
    --expo-blue-soft: var(--brand-secondary-soft);
    --expo-orange: var(--brand-primary);
    --expo-orange-dark: var(--brand-primary-hover);
    --expo-orange-soft: var(--brand-primary-soft);
    --expo-orange-line: var(--brand-primary-border);
    --orange: var(--brand-primary);
    --orange-dark: var(--brand-primary-hover);
    --dark: var(--brand-secondary-deep);
    --accent: var(--brand-secondary);
    --accent-600: var(--brand-secondary-hover);
    --accent-soft: var(--brand-secondary-soft);
    --ui-brand: var(--brand-primary);
    --ui-brand-dark: var(--brand-primary-hover);
    --ui-brand-light: var(--brand-primary);
    --tracking-brand: var(--brand-primary);
    --tracking-brand-dark: var(--brand-primary-deep);
    --tracking-brand-soft: var(--brand-primary-soft);
}

/* Primary company identity: navigation, links, focus, selected state, main action. */
.ind-vendor-body .btn-primary,
.ind-btn-primary,
.ind-top-create,
.auth-submit,
.register-submit,
.account-submit,
.tracking-search button,
.tracking-search .btn,
button[type="submit"].btn-primary {
    background: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
    color: var(--brand-primary-contrast) !important;
    box-shadow: 0 5px 14px rgba(var(--brand-primary-rgb), .16) !important;
}

.ind-vendor-body .btn-primary:hover,
.ind-btn-primary:hover,
.ind-top-create:hover,
.auth-submit:hover,
.register-submit:hover,
.account-submit:hover,
.tracking-search button:hover,
.tracking-search .btn:hover,
button[type="submit"].btn-primary:hover {
    background: var(--brand-primary-hover) !important;
    border-color: var(--brand-primary-hover) !important;
}

.ind-vendor-body .btn-outline-primary,
.btn-outline-primary {
    color: var(--brand-primary) !important;
    border-color: var(--brand-primary-border) !important;
    background: #fff !important;
}
.ind-vendor-body .btn-outline-primary:hover,
.btn-outline-primary:hover {
    color: var(--brand-primary-deep) !important;
    border-color: var(--brand-primary) !important;
    background: var(--brand-primary-soft) !important;
}

.ind-vendor-body a:not(.btn),
.indeliver-public a:not(.btn),
.ind-tracking-link,
.ind-back-link,
.ind-card-header-row > a,
.ind-work-tabs a:hover,
.ind-work-tabs a.active,
.ind-vendor-body .btn-link,
.auth-link,
.login-link,
.account-secondary a,
.account-secondary button {
    color: var(--brand-primary) !important;
}

.ind-nav-item > a:hover,
.ind-nav-group-toggle:hover,
.ind-nav-submenu a:hover,
.ind-account-dropdown a:hover,
.ind-account-dropdown button:hover,
.ind-nav-item.active > a,
.ind-nav-group.active > .ind-nav-group-toggle,
.ind-nav-submenu li.active > a {
    color: var(--brand-primary) !important;
}
.ind-nav-item.active > a,
.ind-nav-group.active > .ind-nav-group-toggle,
.ind-nav-submenu li.active > a {
    background: var(--brand-primary-soft) !important;
}
.ind-nav-item.active > a { box-shadow: inset 3px 0 0 var(--brand-primary) !important; }
.ind-nav-item.active .ind-nav-glyph,
.ind-nav-group.active > .ind-nav-group-toggle .ind-nav-glyph { color: var(--brand-primary) !important; }

.ind-work-tabs a.active::after { background: var(--brand-primary) !important; }
.ind-work-tabs a.active::after,
.ind-rider-workspace-tabs a.active { border-color: var(--brand-primary) !important; }
.ind-status-tabs a.active,
.ind-subtabs a.active,
.ind-rider-kpis button.active {
    border-color: var(--brand-primary-border) !important;
    background: var(--brand-primary-soft) !important;
    color: var(--brand-primary) !important;
}
.ind-status-tabs a.active strong,
.ind-rider-kpis button.active strong { color: var(--brand-primary) !important; }

.ind-vendor-body .form-control:focus,
.ind-vendor-body .form-select:focus,
.shipment-input:focus,
.auth-control:focus,
.account-control:focus,
.register-page .form-control:focus,
.select2-container--default.select2-container--focus .select2-selection,
.select2-container--default.select2-container--open .select2-selection,
.form-control:focus,
.form-select:focus,
input:focus,
select:focus,
textarea:focus {
    border-color: var(--brand-primary) !important;
    box-shadow: 0 0 0 3px rgba(var(--brand-primary-rgb), .12) !important;
}
.ind-vendor-body .form-check-input:checked,
.ind-inline-check input,
.ind-api-scope input,
.ind-check-line input,
.permission-check input,
.auth-check input,
.password-toggle input { accent-color: var(--brand-primary) !important; }
.select2-results__option--highlighted[aria-selected] {
    background: var(--brand-primary) !important;
    color: var(--brand-primary-contrast) !important;
}

/* Secondary company identity: supporting actions, avatars and decorative accents. */
.ind-vendor-body .btn-secondary,
.btn-secondary {
    background: var(--brand-secondary) !important;
    border-color: var(--brand-secondary) !important;
    color: var(--brand-secondary-contrast) !important;
}
.ind-vendor-body .btn-secondary:hover,
.btn-secondary:hover {
    background: var(--brand-secondary-hover) !important;
    border-color: var(--brand-secondary-hover) !important;
}
.ind-avatar {
    background: linear-gradient(145deg, var(--brand-secondary), var(--brand-secondary-deep)) !important;
    color: var(--brand-secondary-contrast) !important;
    box-shadow: 0 3px 10px rgba(var(--brand-secondary-rgb), .18) !important;
}
.ind-brand-text small,
.ind-footer-brand small,
.auth-password-toggle,
.account-toggle,
.expo-footer-support-link i,
.expo-footer-social a:hover,
#back-top:hover {
    color: var(--brand-secondary) !important;
}
.ind-report-progress span,
.ind-report-horizontal-bar-track span,
.ind-rider-month-track i.delivered { background: var(--brand-secondary) !important; }
.ind-report-dist-track i { background: linear-gradient(90deg, var(--brand-primary), var(--brand-secondary)) !important; }

/* White-label account/public panels use primary as structure + secondary as accent. */
.auth-story,
.account-brand,
.register-side {
    background:
        radial-gradient(circle at 88% 14%, rgba(var(--brand-secondary-rgb), .14), transparent 28%),
        linear-gradient(145deg, var(--brand-primary-deep) 0%, var(--brand-primary) 62%, var(--brand-primary-deep) 100%) !important;
}
.auth-story::before,
.account-brand::before,
.register-side::before {
    background: linear-gradient(180deg, var(--brand-secondary), var(--brand-secondary-hover)) !important;
}
.auth-eyebrow,
.account-brand-copy .account-kicker,
.expo-kicker,
.expo-eyebrow,
.expo-pill { color: var(--brand-secondary) !important; }
.register-title,
.account-panel h2,
.auth-panel h2,
.ind-brand-text strong,
.ind-footer-brand strong { color: var(--brand-primary-deep) !important; }

.shipment-field em,
.ind-rider-profile-avatar,
.ind-rider-avatar { color: var(--brand-primary) !important; }
.ind-rider-profile-avatar,
.ind-rider-avatar { background: var(--brand-primary-soft) !important; }

/* Browser/system focus + link decoration follow company primary. */
a { text-decoration-color: rgba(var(--brand-primary-rgb), .35); }
:focus-visible { outline-color: rgba(var(--brand-primary-rgb), .46) !important; }

/* Preserve semantic operational colors regardless of tenant brand selection. */
.status-badge.is-success,.ind-status.is-success { background:#EAF8EF!important;color:#15803D!important; }
.status-badge.is-danger,.ind-status.is-danger { background:#FEF0F0!important;color:#B91C1C!important; }
.status-badge.is-warning,.ind-status.is-warning { background:#FFF7E6!important;color:#B45309!important; }
.status-badge.is-return,.ind-status.is-return { background:#F3E8FF!important;color:#6D28D9!important; }

/* Additional compatibility aliases for older page-specific reference styles. */
:root {
    --brand: var(--brand-primary);
    --brand-600: var(--brand-primary-hover);
    --brand-700: var(--brand-primary-deep);
    --brand-dark: var(--brand-primary-hover);
    --brand-light: var(--brand-primary);
    --brand-soft: var(--brand-primary-soft);
    --brand-50: var(--brand-primary-soft);
    --brand-100: var(--brand-primary-soft);
    --brand-200: var(--brand-primary-border);
    --brand-border: var(--brand-primary-border);
    --brand-rgb: var(--brand-primary-rgb);
    --brand-ring: rgba(var(--brand-primary-rgb), .14);
    --primary: var(--brand-primary);
    --primary-dark: var(--brand-primary-hover);
    --bs-primary: var(--brand-primary);
    --bs-link-color: var(--brand-primary);
    --bs-link-hover-color: var(--brand-primary-hover);
    --vendor-brand: var(--brand-primary);
    --vendor-brand-dark: var(--brand-primary-hover);
    --vendor-brand-soft: var(--brand-primary-soft);
    --vendor-accent: var(--brand-secondary);
    --vendor-accent-dark: var(--brand-secondary-hover);
    --vendor-accent-soft: var(--brand-secondary-soft);
    --vai: var(--brand-primary);
    --vai-dark: var(--brand-primary-hover);
    --vai-border: var(--brand-primary-border);
    --ui-brand: var(--brand-primary);
    --ui-brand-dark: var(--brand-primary-hover);
    --ui-brand-light: var(--brand-primary);
    --ui-brand-50: var(--brand-primary-soft);
    --ui-brand-100: var(--brand-primary-soft);
    --ui-brand-200: var(--brand-primary-border);
    --ui-brand-border: var(--brand-primary-border);
    --accent: var(--brand-secondary);
    --accent-600: var(--brand-secondary-hover);
    --accent-soft: var(--brand-secondary-soft);
    --accent-50: var(--brand-secondary-soft);
    --accent-s: var(--brand-secondary-soft);
    --orange: var(--brand-primary);
    --orange-500: var(--brand-primary);
    --orange-600: var(--brand-primary-hover);
    --orange-dark: var(--brand-primary-hover);
    --timeline-red: var(--brand-primary);
    --expo-soft-orange: var(--brand-primary-soft);
    --ind-brand-dark: var(--brand-primary-hover);
    --ind-brand-line: var(--brand-primary-border);
    --toast-accent: var(--brand-secondary);
    --sh-brand: 0 2px 8px rgba(var(--brand-primary-rgb), .25);
    --shadow-brand: 0 2px 8px rgba(var(--brand-primary-rgb), .25);
    --ui-shadow-brand: 0 2px 8px rgba(var(--brand-primary-rgb), .25);
}

/* Reference pages that still contain a literal legacy orange border. */
#reportrange {
    border-color: var(--brand-primary) !important;
}
#reportrange:hover,
#reportrange:focus {
    border-color: var(--brand-primary-hover) !important;
    box-shadow: 0 0 0 3px rgba(var(--brand-primary-rgb), .10) !important;
}

.ind-brand-badge {
    background: linear-gradient(145deg, var(--brand-primary), var(--brand-secondary)) !important;
    color: var(--brand-primary-contrast) !important;
    box-shadow: 0 4px 12px rgba(var(--brand-primary-rgb), .18) !important;
}

::selection {
    background: rgba(var(--brand-primary-rgb), .16) !important;
}

.tracking-search-box:focus-within {
    border-color: var(--brand-primary) !important;
    box-shadow: 0 0 0 3px rgba(var(--brand-primary-rgb), .10) !important;
}

.auth-story,
.account-brand,
.register-side,
.auth-story h1,
.account-brand h1,
.register-side h1,
.ind-public-brand-copy strong {
    color: var(--brand-primary-contrast) !important;
}


/* -------------------------------------------------------------------------
   V33 global component contract
   Covers Bootstrap/plugin controls and older screens that do not use the
   current Indeliver component classes. This is intentionally loaded last.
   ------------------------------------------------------------------------- */
.ind-vendor-body .bg-primary,
.indeliver-public .bg-primary,
.badge-primary,
.badge.bg-primary,
.nav-pills .nav-link.active,
.list-group-item.active,
.dropdown-item.active,
.dropdown-item:active,
.page-item.active .page-link,
.progress-bar,
.custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
    color: var(--brand-primary-contrast) !important;
}

.ind-vendor-body .text-primary,
.indeliver-public .text-primary,
.page-link,
.nav-link.active:not(.btn),
.custom-control-input:checked ~ .custom-control-label::after {
    color: var(--brand-primary) !important;
}

.ind-vendor-body .border-primary,
.indeliver-public .border-primary {
    border-color: var(--brand-primary) !important;
}

.ind-vendor-body .bg-secondary,
.indeliver-public .bg-secondary,
.badge-secondary {
    background-color: var(--brand-secondary) !important;
    border-color: var(--brand-secondary) !important;
    color: var(--brand-secondary-contrast) !important;
}

.ind-vendor-body .border-secondary,
.indeliver-public .border-secondary {
    border-color: var(--brand-secondary) !important;
}

.page-link:hover,
.page-link:focus {
    color: var(--brand-primary-hover) !important;
    border-color: var(--brand-primary-border) !important;
    background: var(--brand-primary-soft) !important;
}

.daterangepicker td.active,
.daterangepicker td.active:hover,
.daterangepicker .ranges li.active {
    background-color: var(--brand-primary) !important;
    color: var(--brand-primary-contrast) !important;
}

.select2-container--default .select2-results__option[aria-selected="true"],
.select2-container--default .select2-results__option--selected {
    background: var(--brand-primary-soft) !important;
    color: var(--brand-primary-deep) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
.dataTables_wrapper .page-item.active .page-link {
    background: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
    color: var(--brand-primary-contrast) !important;
}

/* Main actions always use Primary. Supporting actions use Secondary. */
.ind-vendor-body .btn-primary,
.ind-vendor-body .ind-btn-primary,
.ind-vendor-body .ind-top-create,
.indeliver-public .btn-primary,
.indeliver-public .auth-submit,
.indeliver-public .register-submit,
.indeliver-public .account-submit {
    background: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
    color: var(--brand-primary-contrast) !important;
}

.ind-vendor-body .btn-secondary,
.indeliver-public .btn-secondary {
    background: var(--brand-secondary) !important;
    border-color: var(--brand-secondary) !important;
    color: var(--brand-secondary-contrast) !important;
}

/* Warnings/errors/success are operational semantics, never tenant branding. */
.ind-vendor-body .btn-warning,
.indeliver-public .btn-warning {
    background: var(--status-warning, #F59E0B) !important;
    border-color: var(--status-warning, #F59E0B) !important;
    color: #172033 !important;
}
.ind-vendor-body .btn-success,
.indeliver-public .btn-success {
    background: var(--status-success, #16A34A) !important;
    border-color: var(--status-success, #16A34A) !important;
    color: #fff !important;
}
.ind-vendor-body .btn-danger,
.indeliver-public .btn-danger {
    background: var(--status-danger, #DC2626) !important;
    border-color: var(--status-danger, #DC2626) !important;
    color: #fff !important;
}

/* Known legacy page details that used literal brand-tinted borders/gradients. */
.shipment-map-btn:hover { border-color: var(--brand-primary-border) !important; }
.ind-sub-plan.current { border-color: var(--brand-primary-border) !important; }
.ind-report-bar-track span {
    background: linear-gradient(180deg, var(--brand-secondary), var(--brand-primary)) !important;
}
.ind-check-line input,
.ind-inline-check input,
.ind-api-scope input,
.permission-check input { accent-color: var(--brand-primary) !important; }