/* ============================================================
   Granny Murray Schools — Brand identity
   Colors (corrected semantic names from brand chart):
     Green      #99cf15
     Blue       #00a8ec
     Red        #df0024
     Dark Blue  #1c4480
     Orange     #FF9900
   Typeface: Montserrat
   ============================================================ */

@font-face {
    font-family: 'Montserrat';
    src: url('../../fonts/Montserrat-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

:root {
    --gms-green: #99cf15;
    --gms-blue: #00a8ec;
    --gms-red: #df0024;
    --gms-dark-blue: #1c4480;
    --gms-orange: #FF9900;

    --gms-green-rgb: 153, 207, 21;
    --gms-blue-rgb: 0, 168, 236;
    --gms-red-rgb: 223, 0, 36;
    --gms-dark-blue-rgb: 28, 68, 128;
    --gms-orange-rgb: 255, 153, 0;

    --gms-primary: var(--gms-dark-blue);
    --gms-primary-hover: #163668;
    --gms-primary-soft: #e8eef6;
    --gms-accent: var(--gms-green);
    --gms-accent-hover: #86b512;
    --gms-info: var(--gms-blue);
    --gms-danger: var(--gms-red);
    --gms-warning: var(--gms-orange);

    --gms-font: 'Montserrat', 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --gms-font-display: 'Montserrat', 'Segoe UI', sans-serif;

    --gms-scheme-bg: #f4f6f9;
    --gms-scheme-surface: #ffffff;
    --gms-scheme-surface-2: #f0f4f8;
    --gms-scheme-text: #1c4480;
    --gms-scheme-text-muted: #5b6b7c;
    --gms-scheme-border: #d9e2ec;
    --gms-scheme-input-bg: #ffffff;
    --gms-scheme-input-border: #c5d0dc;
    --gms-scheme-shadow: rgba(28, 68, 128, 0.10);
    --gms-toggle-track: #d6ebf8;
    --gms-toggle-track-active: #1c4480;
    --gms-toggle-thumb: #ffffff;
    --gms-toggle-icon: #00a8ec;
    --gms-toggle-icon-active: #FF9900;
}

html[data-theme="dark"] {
    --gms-scheme-text: #e8eef6;
    --gms-scheme-text-muted: #9ca8b8;
    --gms-toggle-icon: #88dbff;
}

/* ---- Global type ---- */

html,
body,
body.nav-md,
body.nav-sm,
body.gms-login,
body.font-montserrat {
    font-family: var(--gms-font) !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.school-name,
.site_title,
.x_title h2,
.head-title,
.gms-login-card h1,
.nav_title span {
    font-family: var(--gms-font-display) !important;
    letter-spacing: 0.01em;
}

.btn,
.form-control,
label,
.nav.side-menu > li > a,
.nav.child_menu > li > a,
.dropdown-menu,
.table {
    font-family: var(--gms-font) !important;
}

/* ---- Portal chrome accents (works with any theme pack) ---- */

body.nav-md .right_col,
body.nav-sm .right_col {
    background: var(--gms-scheme-bg) !important;
}

.x_panel {
    border-color: var(--gms-scheme-border);
    box-shadow: 0 1px 3px var(--gms-scheme-shadow);
}

.x_title {
    border-bottom-color: rgba(var(--gms-dark-blue-rgb), 0.18) !important;
}

/*
 * Contrast lock:
 * Do NOT color every <a> globally — that paints sky-blue (#00a8ec) onto
 * blue theme sidebars and washes out menu labels.
 * Scope content links only; force white chrome text on the left rail.
 */

/* Header title + top nav: dark brand on white bar */
.nav_menu .school-name,
.top_nav .nav.navbar-nav > li > a,
.top_nav .nav.navbar-nav > li > a span {
    color: #1c4480 !important;
    font-weight: 600;
}

.top_nav .navbar-right .fa,
#menu_toggle i {
    color: #1c4480 !important;
}

/* Sidebar / left rail: always white text + icons (any theme pack) */
.left_col,
.left_col .nav_title,
.left_col .site_title,
.left_col .site_title span,
.left_col .nav_title span,
.left_col .profile_details,
.left_col .profile_details span,
.left_col .profile_name,
.left_col .profile_name span,
.main_menu_side,
.main_menu {
    color: #ffffff !important;
}

.left_col a,
.left_col a:hover,
.left_col a:focus,
.left_col a:visited,
.left_col .nav.side-menu > li > a,
.left_col .nav.side-menu > li > a:hover,
.left_col .nav.side-menu > li > a:focus,
.left_col .nav.side-menu > li.active > a,
.left_col .nav.child_menu > li > a,
.left_col .nav.child_menu > li > a:hover,
.left_col .nav.child_menu > li > a:focus,
.left_col .sidebar-footer a,
.main_menu_side .nav.side-menu > li > a,
.main_menu_side .nav.child_menu > li > a {
    color: #ffffff !important;
}

.left_col .fa,
.left_col i.fa,
.main_menu span.fa,
.main_menu_side .fa,
.left_col .nav.side-menu > li > a > i,
.left_col .nav.child_menu > li > a > i {
    color: #ffffff !important;
}

/* Content-area links only (not sidebar / top chrome) */
.right_col a:not(.btn):not(.user-profile):not(.close),
.x_panel a:not(.btn):not(.close),
.x_content a:not(.btn):not(.close) {
    color: var(--gms-info);
}

.right_col a:not(.btn):not(.user-profile):not(.close):hover,
.right_col a:not(.btn):not(.user-profile):not(.close):focus,
.x_panel a:not(.btn):not(.close):hover,
.x_panel a:not(.btn):not(.close):focus,
.x_content a:not(.btn):not(.close):hover,
.x_content a:not(.btn):not(.close):focus {
    color: var(--gms-primary);
}

/* Content body copy stays dark for readability on white panels */
.right_col,
.right_col .x_panel,
.right_col .x_title h2,
.right_col label,
.right_col .control-label,
.right_col .table,
.right_col .form-control,
.right_col .help-block {
    color: #1c2a3a;
}

.right_col .x_title h2,
.right_col .head-title,
.right_col .head-title small {
    color: #1c4480 !important;
}

.btn-primary,
.btn-success {
    background-color: var(--gms-primary) !important;
    border-color: var(--gms-primary) !important;
    color: #fff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-success:hover,
.btn-success:focus {
    background-color: var(--gms-primary-hover) !important;
    border-color: var(--gms-primary-hover) !important;
    color: #fff !important;
}

.btn-info {
    background-color: var(--gms-info) !important;
    border-color: var(--gms-info) !important;
}

.btn-warning {
    background-color: var(--gms-warning) !important;
    border-color: var(--gms-warning) !important;
    color: #1a1a1a !important;
}

.btn-danger {
    background-color: var(--gms-danger) !important;
    border-color: var(--gms-danger) !important;
}

.btn-accent,
.btn-gms-accent {
    background-color: var(--gms-accent) !important;
    border-color: var(--gms-accent) !important;
    color: #1a1a1a !important;
}

.form-control:focus {
    border-color: var(--gms-blue) !important;
    box-shadow: 0 0 0 3px rgba(var(--gms-blue-rgb), 0.18) !important;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover {
    border-bottom-color: var(--gms-primary) !important;
    color: var(--gms-primary) !important;
}

.badge.bg-green,
.badge.bg-success {
    background: var(--gms-accent) !important;
    color: #1a1a1a !important;
}

.alert-success {
    background-color: #eef8d4 !important;
    border-color: #99cf15 !important;
    color: #1c4480 !important;
    font-weight: 600;
}

.alert-info {
    background-color: rgba(var(--gms-blue-rgb), 0.12) !important;
    border-color: rgba(var(--gms-blue-rgb), 0.4) !important;
    color: #045f86 !important;
}

.alert-warning {
    background-color: rgba(var(--gms-orange-rgb), 0.14) !important;
    border-color: rgba(var(--gms-orange-rgb), 0.45) !important;
    color: #7a4a00 !important;
}

.alert-danger {
    background-color: rgba(var(--gms-red-rgb), 0.1) !important;
    border-color: rgba(var(--gms-red-rgb), 0.4) !important;
    color: #8a0016 !important;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover {
    background-color: var(--gms-primary) !important;
    border-color: var(--gms-primary) !important;
}

.progress-bar {
    background-color: var(--gms-primary);
}

.progress-bar-success {
    background-color: var(--gms-accent) !important;
}

.progress-bar-info {
    background-color: var(--gms-info) !important;
}

.progress-bar-warning {
    background-color: var(--gms-warning) !important;
}

.progress-bar-danger {
    background-color: var(--gms-danger) !important;
}

/* Brand utility helpers (align with landing cus-* names) */
.text-cus-green { color: var(--gms-green) !important; }
.text-cus-blue { color: var(--gms-blue) !important; }
.text-cus-red { color: var(--gms-red) !important; }
.text-cus-darkblue { color: var(--gms-dark-blue) !important; }
.text-cus-orange { color: var(--gms-orange) !important; }
.bg-cus-green { background-color: var(--gms-green) !important; }
.bg-cus-blue { background-color: var(--gms-blue) !important; }
.bg-cus-red { background-color: var(--gms-red) !important; }
.bg-cus-darkblue { background-color: var(--gms-dark-blue) !important; }
.bg-cus-orange { background-color: var(--gms-orange) !important; }

/* Theme toggle uses brand tokens already via :root vars */

.gms-theme-toggle {
    font-family: var(--gms-font) !important;
}

/* Loader brand tint */
#loader.green-color .loader-icon,
.loader.green-color {
    filter: none;
}

/* ---- Login / forgot (force brand over cached login CSS) ---- */

body.gms-login {
    color: var(--gms-dark-blue) !important;
    background: var(--gms-scheme-bg) !important;
}

body.gms-login .gms-login-card {
    background: #ffffff !important;
    border: 1px solid var(--gms-scheme-border) !important;
    box-shadow: 0 10px 28px var(--gms-scheme-shadow) !important;
}

body.gms-login .gms-login-card h1 {
    color: var(--gms-dark-blue) !important;
    font-weight: 600 !important;
}

body.gms-login .gms-btn-primary {
    background: var(--gms-primary) !important;
    color: #fff !important;
}

body.gms-login .gms-btn-primary:hover,
body.gms-login .gms-btn-primary:focus {
    background: var(--gms-primary-hover) !important;
    color: #fff !important;
}

body.gms-login .gms-btn-link {
    color: var(--gms-blue) !important;
}

body.gms-login .gms-btn-link:hover {
    color: var(--gms-dark-blue) !important;
}

body.gms-login .gms-actions {
    background: var(--gms-scheme-bg) !important;
    border-top-color: var(--gms-scheme-border) !important;
}

body.gms-login .gms-input {
    border-color: var(--gms-scheme-input-border) !important;
    background: var(--gms-scheme-surface-2) !important;
    color: var(--gms-dark-blue) !important;
}

body.gms-login .gms-input:focus {
    border-color: var(--gms-blue) !important;
    background: #fff !important;
    box-shadow: 0 0 0 3px rgba(var(--gms-blue-rgb), 0.18) !important;
}