/* ============================= */
/* GLOBAL BRAND VARIABLES */
/* ============================= */

:root {
    /* BRAND COLORS */
     /*  Navy Colors   */
 /*--navy: #0E2A47;*/
   --navy: #0b1f3a;
  --navy-dark: #0B1F36;
  --navy-light-transparent: rgba(11, 31, 54, 0.3); /* Light transparent navy hover */
  --navy-rgb: 14, 42, 71; /* For rgba() use */


 


  /*  Gold Colors   */
  --gold: #d4af37;
  --gold-dark: #A67C00;
  --gold-light-transparent: rgba(212, 175, 55, 0.3); /* Light transparent gold for hover/active */
  --light-gold: #f5e6a8;
  --gold-rgb: 212, 175, 55; /* For rgba() use */
  
   /*  local Colors   */
  --bg-body: #f4f6f9;
  --bg-card: #ffffff;
  --text-primary: #1a1a1a;
  --text-muted: #6c757d;
  --radius: 12px;
  --transition: 0.3s ease;
  --white: #FFFFFF;
  --gray: #CFCFCF;
  --green: #28a745;
  --red: #dc3545;
  --orange: #ff9800;
  --gray-light: #ccc;
  
/* LIGHT MODE */
  --bg-body: #f4f6f9;
  --bg-card: #ffffff;



  --sidebar-bg: linear-gradient(180deg, var(--navy), var(--navy-dark));
  --sidebar-text: #cfd8e3;

  --radius: 12px;
  --transition: 0.3s ease;

  --sidebar-width: 260px;
  --radius: 10px;
  --transition: 0.3s ease;
  
/* DARK MODE */
  --bg-body: #0f172a;
  --bg-card: #1e293b;
  --text-muted: #cbd5e1;    

  
  

  /* Primary Colors */
  --color-navy-primary: #0E2A47;
  --color-navy-glow: #1C3F6E;
  --color-navy-dark: #0B1F36;

  --color-gold-primary: #A67C00;
  --color-gold-light: #F2D16B;
  --color-gold-dark: #A67C00;

  /* Neutral Colors */
  --color-white: #FFFFFF;
  --color-black: #000000;

  /* Backgrounds */
  --bg-primary: var(--color-navy-primary);
  --bg-secondary: var(--color-navy-dark);

 

  /* Borders */
  --border-gold: 1px solid var(--color-gold-primary);


  /* Backgrounds */
  --bg-primary: var(--color-navy-primary);
  --bg-secondary: #0B1F36;

  /* Text */
  --text-primary: #FFFFFF;
  --text-secondary: #CFCFCF;
  --text-dark: #0E2A47;

  /* Borders */
  --border-gold: 1px solid var(--color-gold-primary);

}





/* Dark mode variables */
body.dark-mode {
  --navy: #121212;
  --navy-dark: #0A0A0A;
  --gold: #FFD700;
  --gold-dark: #B8860B;
  --white: #EEE;
  --gray: #1C1C1C;
  --bg-body: #0f172a;
  --bg-card: #1e293b;
  --text-primary: #ffffff;
  --text-muted: #cbd5e1;

  --sidebar-bg: linear-gradient(180deg, #0B1F36, #071521);
  --sidebar-text: #e2e8f0;
}