@import url('my_pagination.css');
@import url('my_card.css');
@import url('my_breadcrumbs.css');
@import url('my_btn-secondary.css');
@charset "UTF-8";
@charset "UTF-8";
@charset "UTF-8";
:root, [data-bs-theme="light"] {
   /* --- CUSTOM THEME CORE COLORS --- */
  --my-primary: #000080;         /* The primary color in the theme (Navy Blue) */
  --my-primary-rgb: 0, 0, 128;
  --my-secondary: #B22234;       /* The secondary color of the theme (American flag red) */
  --my-secondary-rgb: 178, 34, 52;
  --my-tertiary: #808080;        /* The tertiary color of the theme (Standard Grey) */
  --my-tertiary-rgb: 128, 128, 128;
  --my-accent: #B22234;          /* The secondary color of the theme used for icons */
  --my-bg-light: #F4F4F4;        /* Grey for neutral light background */
  --my-second-stop: #0000FF;     /* A lighter, more vibrant version of my-primary (Pure Blue) */
  --my-link-color: var(--my-primary);

  --my-primary-shades-100: #E6E6F2;  /* 9 incremental shades of the primary (Navy Blue) */
  --my-primary-shades-200: #CDCCE6;
  --my-primary-shades-300: #9B99CC;
  --my-primary-shades-400: #6866B3;
  --my-primary-shades-500: #333399;
  --my-primary-shades-600: #000080;
  --my-primary-shades-700: #000066;
  --my-primary-shades-800: #00004D;
  --my-primary-shades-900: #000033;

  --my-secondary-shades-100: #F7E9EB;  /* 9 incremental shades of the secondary (American flag red) */
  --my-secondary-shades-200: #F0D3D6;
  --my-secondary-shades-300: #E0A7AD;
  --my-secondary-shades-400: #D17B85;
  --my-secondary-shades-500: #C14F5C;
  --my-secondary-shades-600: #B22234;
  --my-secondary-shades-700: #8E1B2A;
  --my-secondary-shades-800: #6B141F;
  --my-secondary-shades-900: #470E15;

  --my-tertiary-shades-100: #F2F2F2;  /* 9 incremental shades of the tertiary (Standard Grey Scale) */
  --my-tertiary-shades-200: #E6E6E6;
  --my-tertiary-shades-300: #CCCCCC;
  --my-tertiary-shades-400: #B3B3B3;
  --my-tertiary-shades-500: #999999;
  --my-tertiary-shades-600: #808080;
  --my-tertiary-shades-700: #666666;
  --my-tertiary-shades-800: #4D4D4D;
  --my-tertiary-shades-900: #333333;
  
 
--cassiopeia-color-primary: var(--my-primary);
--cassiopeia-color-link: var(--my-primary);
--cassiopeia-color-hover: var(--my-secondary);

  --blue: #010156;
  --black: #000;
  --indigo: #6812f3;
  --purple: #6f42c2;
  --pink: #e93f8e;
  --red: #a51f18;
  --orange: #fd7e17;
  --yellow: #ad6200;
  --green: #448344;
  --teal: #5abfdd;
  --cyan: #30638d;
  --white: #fff;
  --gray-100: #f9fafb;
  --gray-200: #eaedf0;
  --gray-300: #dfe3e7;
  --gray-400: #ced4da;
  --gray-500: #adb5bd;
  --gray-600: #6d757e;
  --gray-700: #484f56;
  --gray-800: #353b41;
  --gray-900: #22262a;

  --primary: var(--my-primary);
  --secondary: #6d757e;
  --success: #448344;
  --info: #30638d; 
  --warning: #ad6200;
  --danger: #a51f18;
  --light: #f9fafb;
  --dark: #353b41;
  --primary-rgb: 1, 1, 86;
  --secondary-rgb: 109, 117, 126;
  --success-rgb: 68, 131, 68;
  --info-rgb: 48, 99, 141;
--info-rgb: var(--my-secondary-rgb);
  --warning-rgb: 173, 98, 0;
  --danger-rgb: 165, 31, 24;
  --light-rgb: 249, 250, 251;
  --dark-rgb: 53, 59, 65;
  --primary-text-emphasis: #002;
  --secondary-text-emphasis: #2c2f32;
  --success-text-emphasis: #1b351b;
  --info-text-emphasis: #132838;
--info-text-emphasis: var(--my-primary);
  --warning-text-emphasis: #452700;
  --danger-text-emphasis: #420c09;
  --light-text-emphasis: #484f56;
--light-text-emphasis: var(--my-primary);
  --dark-text-emphasis: #484f56;
  --primary-bg-subtle: #ccd;
  --secondary-bg-subtle: #e2e3e5;
  --success-bg-subtle: #dae6da;
  --info-bg-subtle: #d6e0e8;
  --warning-bg-subtle: #efe0cc;
  --danger-bg-subtle: #edd2d1;
  --light-bg-subtle: #fcfcfd;
  --dark-bg-subtle: #ced4da;
  --primary-border-subtle: #99b;
  --secondary-border-subtle: #c5c8cb;
  --success-border-subtle: #b4ceb4;
  --info-border-subtle: #acc1d1;
  --warning-border-subtle: #dec099;
  --danger-border-subtle: #dba5a2;
  --light-border-subtle: #eaedf0;
  --dark-border-subtle: #adb5bd;
  --white-rgb: 255, 255, 255;
  --black-rgb: 0, 0, 0;
  --font-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --gradient: linear-gradient(180deg, #ffffff26, #fff0);
  --body-font-family: var(--cassiopeia-font-family-body, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
  --body-font-size: 1rem;
  --body-font-weight: 400;
  --body-line-height: 1.5;
  --body-color: #22262a;
--body-color: var(--my-primary); /* globally changes body text*/
  --body-color-rgb: 34, 38, 42;
--body-color-rgb: var(--my-primary-rgb); /* globally changes body text*/
  --body-bg: #fff;
  --body-bg-rgb: 255, 255, 255;
  --emphasis-color: #000;
--emphasis-color: var(--my-primary); /* changes text color in tables among other things */ 
  --emphasis-color-rgb: 0, 0, 0;
--emphasis-color-rgb: var(--my-secondary-rgb); /* changes background color in tables and through opacity the stripped hover */
  --secondary-color: #22262abf;
  --secondary-color-rgb: 34, 38, 42;
  --secondary-bg: #eaedf0; 
  --secondary-bg-rgb: 234, 237, 240;
  --tertiary-color: #22262a80;
  --tertiary-color-rgb: 34, 38, 42;
  --tertiary-bg: #f9fafb;
  --tertiary-bg-rgb: 249, 250, 251;
  --heading-color: var(--my-secondary); /* globally changes H tags*/
  --link-color: var(--my-primary);/* globally changes link color*/
  --link-color-rgb: var(--my-primary-rgb);/* globally changes link color*/
  --link-decoration: underline;
  --link-hover-color: var(--my-secondary);  /* globally changes link hover color*/
  --link-hover-color-rgb: var(--my-secondary-rgb); /* globally changes link hover color*/
  --code-color: #e93f8e;
  --highlight-color: #22262a;
  --highlight-bg: #fbeea8;
  --border-width: 1px;
  --border-style: solid;
  --border-color: #dfe3e7;
  --border-color-translucent: #0000002d;
  --border-radius: .25rem;
  --border-radius-sm: .2rem;
  --border-radius-lg: .3rem;
  --border-radius-xl: .3rem;
  --border-radius-xxl: 2rem;
  --border-radius-2xl: var(--border-radius-xxl);
  --border-radius-pill: 50rem;
  --box-shadow: 0 .5rem 1rem #00000026;
  --box-shadow-sm: 0 .125rem .25rem #00000013;
  --box-shadow-lg: 0 1rem 3rem #0000002d;
  --box-shadow-inset: inset 0 1px 2px #00000013;
  --focus-ring-width: .25rem;
  --focus-ring-opacity: .25;
  --focus-ring-color: #01015640;
  --form-valid-color: #448344;
  --form-valid-border-color: #448344;
  --form-invalid-color: #a51f18;
  --form-invalid-border-color: #a51f18;
}


/* --- GRADIENT HEADER --- */
.header {
  background-color: var(--my-primary) !important; 
  /* 180deg flows from top to bottom */
  background-image: linear-gradient(180deg, var(--my-primary) 0%, var(--my-second-stop) 100%) !important;    
  border-top: none !important;                    
  border-bottom: 20px solid #FF0000 !important; 
}

/* --- GRADIENT FOOTER --- */
.footer {
  background-color: var(--my-primary) !important; 
  /* 0deg flows from bottom to top (Reverse) */
  background-image: linear-gradient(0deg, var(--my-primary) 0%, var(--my-second-stop) 100%) !important;    
  border-top: 20px solid #FF0000 !important;    
  border-bottom: none !important;                 
}

@media (max-width: 991.98px) {
    .site-grid {
        display: flex !important;
        flex-direction: column !important;
        /* Adds side spacing for mobile view */
        margin-left: 1rem !important;
        margin-right: 1rem !important;
    }

    .sidebar-left, 
    .container-sidebar-left {
        order: -1 !important; 
        margin-bottom: .5rem !important; /* Vertical spacing between top sidebar and main content */
    }

    .site-grid > main { 
        order: 1 !important; 
        margin-bottom: 2rem !important; /* Adds spacing between main content and bottom sidebar */
    }

    .sidebar-right, 
    .container-sidebar-right {
        order: 2 !important;
        margin-top: 0 !important; /* Reset to prevent double spacing */
    }