/**
 * ============================================================================
 * BGS THEME STYLESHEET
 * ============================================================================
 *
 * @description  Comprehensive theme system for BGS Student Portal
 *               Built on Power Pages with Bootstrap 5 foundation
 * @version      23.1
 * @author       Scholarion Development Team
 * @license      Proprietary
 * @modified     2026-02-12
 *
   ============================================================================ */

:root {
  /* ------------------------------------
     Brand Colors
     Core brand identity colors
     ------------------------------------ */
  --scholarion-primary: #0e406a;
  --scholarion-primary-dark: #0a2a44; /* Darker Teal - Darker accent for hover states */
  --scholarion-secondary: #e2effb;
  --scholarion-secondary-light: #a9a6d4; /* Light Teal - Lighter secondary for subtle elements */  
  --scholarion-secondary-rgb: 15, 107, 90;  /* Used for rgba() with opacity */
  --scholarion-tertiary: #6c757d;  
  --scholarion-tertiary-light: #f8f9fa;  
  --scholarion-tertiary-dark: #374151;      
  --scholarion-accent: #0e406a; /* #0d6efd;*/

  /* ------------------------------------
     Neutrals & Surface Colors
     Background, foreground, and border colors
     ------------------------------------ */
  --scholarion-bg: #ffffff;
  --scholarion-fg: var(--scholarion-secondary);
  --scholarion-surface: #ffffff;
  --scholarion-border: #e9ecef;
  --scholarion-text: #000;
  --scholarion-text-secondary: #0e406a;
  --scholarion-text-muted: #495057;

  /* ------------------------------------
     Semantic Feedback Colors
     Success, warning, danger, info states
     ------------------------------------ */
  --scholarion-success: #08bb82;
  --scholarion-warning: #f3a826;
  --scholarion-danger: #ff0000;
  --scholarion-danger-ring: color-mix(in oklab, var(--scholarion-danger), white 75%);

  /* ------------------------------------
     Alert System
     Alert background and spacing
     ------------------------------------ */
  --scholarion-alert: color-mix(in srgb, var(--scholarion-warning) 40%, white 60%);
  --scholarion-alert-padding-x: 1rem;
  --scholarion-alert-padding-y: 1rem;
  --scholarion-validation-colour: #78350f;

  /* ------------------------------------
     Visual Effects
     Gradients, shadows, elevation
     ------------------------------------ */
  --scholarion-grad-1: linear-gradient(135deg,
      var(--scholarion-primary) 0%,
      color-mix(in oklab, var(--scholarion-primary) 80%, black) 100%);
  --scholarion-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.01);
  --scholarion-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.12);
  --scholarion-shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.2);
  --scholarion-shadow-colour: rgba(0, 0, 0, 0.01);
  --scholarion-shadow-colour-hover: rgba(0, 0, 0, 0.2);

  /* ------------------------------------
     Focus & Selection States
     User interaction feedback
     ------------------------------------ */
  --scholarion-selection-bg: var(--scholarion-secondary);
  --scholarion-selection-fg: #fff;
  --scholarion-caret: var(--scholarion-accent) !important;

  /* ------------------------------------
     Header Component Tokens
     ------------------------------------ */
  --scholarion-header-fg: #ffffff;
  --scholarion-header-bg: var(--scholarion-primary);
  --scholarion-header-fg-muted: #ffffff;
  --scholarion-header-hover: #0b1515;
  --scholarion-header-border: #e9ecef;  /* rgba(0, 0, 0, 0.12) */
  --scholarion-header-font: Poppins, sans-serif;
  --scholarion-header-title-font: var(--scholarion-header-font);
  --scholarion-header-title-weight: 400;

  /* ------------------------------------
     Footer Component Tokens
     ------------------------------------ */
  --scholarion-footer-font: var(--scholarion-header-font);
  --scholarion-footer-bg: var(--scholarion-primary);
  --scholarion-footer-fg: #ffffff;
  --scholarion-footer-fg-muted: #ffffff;
  --scholarion-footer-link: #ffffff;
  --scholarion-footer-link-hover: #d97706;

  /* ------------------------------------
     Link Tokens
     ------------------------------------ */
  --scholarion-link: var(--scholarion-accent);
  --scholarion-link-hover: var(--scholarion-accent);

  /* ------------------------------------
     Navigation Tokens
     ------------------------------------ */
  --scholarion-nav-active-colour: var(--scholarion-accent);
  --scholarion-nav-hover-colour: var(--scholarion-accent);
  --scholarion-nav-active-bg: color-mix(in srgb, var(--scholarion-secondary) 90%, white);
  --scholarion-nav-parent-bg: color-mix(in srgb, var(--scholarion-secondary) 92%, white);
  --scholarion-nav-child-bg: color-mix(in srgb, var(--scholarion-secondary) 95%, white);

  /* ------------------------------------
     Typography System
     Font families, sizes, line heights
     ------------------------------------ */
  --scholarion-font-sans: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --scholarion-font-serif: "Georgia", "Times New Roman", serif;
  --scholarion-font-mono: "Consolas", "Courier New", monospace;

  /* Font Size Scale (fluid, responsive) */
  --scholarion-fs-100: 0.875rem;  /* 14px - small text */
  --scholarion-fs-200: 1rem;  /* 16px - body text */
  --scholarion-fs-300: 1.125rem;  /* 18px */
  --scholarion-fs-400: 1.25rem;  /* 20px */
  --scholarion-fs-500: 1.5rem;  /* 24px - h3 */
  --scholarion-fs-600: 1.75rem;  /* 28px - h2 */
  --scholarion-fs-700: 1.8rem;  /* 32px - h1 */

  /* Line Height Scale */
  --scholarion-lh-tight: 1.2;
  --scholarion-lh-default: 1.5;
  --scholarion-lh-loose: 1.75;

  /* ------------------------------------
     Layout Dimensions
     ------------------------------------ */
  --scholarion-header-h: 90px;
  --scholarion-header-h-mobile: 72px;
  --scholarion-footer-h: 72px;
  --scholarion-nav-w: 280px;
  --scholarion-nav-w-collapsed: 60px;
  --scholarion-footer-pad-x: 16px;
  --scholarion-gap: 24px;

  /* ------------------------------------
     Readonly Field Tokens
     Distinctive styling for non-editable form fields
     ------------------------------------ */
  --scholarion-readonly-border: #ccc;
  --scholarion-readonly-bg: #f2f2f2;

  /* ------------------------------------
     Toast Notification Tokens
     Semantic colors for success and danger toasts
     ------------------------------------ */
  --scholarion-toast-success-bg: #f3fbf3;
  --scholarion-toast-success-border: #c8e9c5;
  --scholarion-toast-success-fg: #146c2e;
  --scholarion-toast-save-bg: #1e7e34;
  --scholarion-toast-danger-bg: #fef3f2;
  --scholarion-toast-danger-border: #f5c2c0;
  --scholarion-toast-danger-fg: #b42318;

  /* ------------------------------------
     Filter Pill Tokens
     Tab-style filter button colors
     ------------------------------------ */
  --scholarion-pill-border: #d1d5db;
  --scholarion-pill-bg: #ffffff;
  --scholarion-pill-fg: #374151;
  --scholarion-pill-hover-bg: #f3f4f6;
  --scholarion-pill-hover-border: #9ca3af;
  --scholarion-pill-card-border: #e5e7eb;
  --scholarion-pill-title-fg: #1f2937;

  /* ------------------------------------
     Subgrid Theme Tokens
     ------------------------------------ */
  --scholarion-grid-bg: #fff;
  --scholarion-grid-border: rgba(0, 0, 0, 0.08);
  --scholarion-grid-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
  --scholarion-grid-header-bg: #f7f9fb;
  --scholarion-grid-header-fg: #1b1f2a;
  --scholarion-grid-row-hover: #f4f7fb;
  --scholarion-grid-row-alt: #fbfcfe;
  --scholarion-grid-text: #27313f;
  --scholarion-grid-muted: #637083;
    
  /* ------------------------------------
     Transitions
     ------------------------------------ */
  --scholarion-transition-fast: 0.2s ease;
  --scholarion-transition-normal: 0.3s ease;
  --scholarion-transition-slow: 0.5s ease;

}

:root {

  /* ------------------------------------
     Site Branding
     ------------------------------------ */
  --scholarion-logo-url: url("/images-sis-sp-brisbanegrammar-logo.svg"); /* Main site logo */
  --scholarion-logo-white-url: url("/images-sis-sp-brisbanegrammar-logo.svg"); /* White version for dark backgrounds */
  --scholarion-logo-height: 70px; /* Default logo height */
  --scholarion-logo-width: auto; /* Default logo width */
  --scholarion-logo-aria-label: "Brisbane Grammar School"; /* Accessible label for logo */
  --scholarion-logo-alt-text: "Brisbane Grammar School"; /* Alt text for img tags */
}

/* BGS-specific Logo container with proper sizing */
.navbar-brand .logo-bg {
  min-width: 400px !important;
  max-width: 300px !important;  
}