/* RAMP brand: navy primary, green brand surfaces. Loaded after ui-polish.css / auth.css when APP_BRAND=ramp. */

:root {
    --app-primary: #1a4f74;
    --app-primary-rgb: 26, 79, 116;
    --app-primary-dark: #133a56;
    --app-surface: #429238;
    --app-surface-dark: #357a2d;
    --app-surface-rgb: 66, 146, 56;
    --app-success: #429238;
    --app-preloader: #429238;

    --auth-primary: #1a4f74;
    --auth-primary-rgb: 26, 79, 116;
    --auth-primary-dark: #133a56;
}

/* Theme classes that are hard-coded to the ARC blue */
.bg-primary { background-color: var(--app-primary) !important; }
.text-primary { color: var(--app-primary) !important; }
.border-primary { border-color: var(--app-primary) !important; }
.badge-primary { background-color: var(--app-primary) !important; }
[dir] .btn-primary,
[dir] .btn-primary:disabled { background-color: var(--app-primary) !important; border-color: var(--app-primary) !important; }
[dir] .btn-primary:hover,
[dir] .btn-primary:focus,
[dir] .btn-primary:active { background-color: var(--app-primary-dark) !important; border-color: var(--app-primary-dark) !important; }
.btn-outline-primary { color: var(--app-primary) !important; border-color: var(--app-primary) !important; }
.btn-outline-primary:hover { background-color: var(--app-primary) !important; color: #fff !important; }
.page-item.active .page-link { background-color: var(--app-primary) !important; border-color: var(--app-primary) !important; }
.custom-control-input:checked ~ .custom-control-label::before { background-color: var(--app-primary) !important; border-color: var(--app-primary) !important; }

.bg-success, .badge-success, [dir] .btn-success { background-color: var(--app-success) !important; border-color: var(--app-success) !important; }
.text-success { color: var(--app-success) !important; }

/* Login page */
.auth {
    background: linear-gradient(rgba(0, 150, 0, 0.5), rgba(0, 0, 150, 0.5)), url("../../brands/ramp/background.webp") center / cover no-repeat;
    background-color: #1f3d2c;
}

.auth__shape--one { background: rgba(0, 128, 0, 0.5); }
.auth__shape--two { background: rgba(0, 0, 128, 0.5); }

/* Wide wordmark logo: give it more of the tile */
.app-sidebar__logo { padding: 4px; }