@import url("variables.63488d98ee1a.css");

/* ==========================================================================
   Base Styles
   ========================================================================== */
html {
    font-size: 18px; /* Set explicit base size */
}

/*========================================================================
    Body Fade Overlay
========================================================================== */

.body-fade-overlay {
  position: sticky;
  top: 0px;
  height: 34px;
  background: linear-gradient(to bottom, #F5F7FD, transparent);
  pointer-events: none;
  z-index: 100;
}

.body-fade-overlay.fade-sm {
  top: 0px !important;
  height: 16px !important;
}


/*========================================================================
   Typography
========================================================================== */

.fs-1 {
    font-size: 2.5rem !important;
}
.fs-2 {
    font-size: 2rem !important;
}
.fs-3 {
    font-size: 1.75rem !important;
}
.fs-4 {
    font-size: 1.5rem !important;
}
.fs-5 {
    font-size: 1.25rem !important;
}
.fs-6 {
    font-size: 1.0rem !important;
}
.fs-7 {
    font-size: 0.875rem !important;
}
.fs-8 {
    font-size: 0.75rem !important;
}
.fs-9 {
    font-size: 0.625rem !important;
}
.fs-10 {
    font-size: 0.5rem !important;
}
.pmb-0 p {
    margin-bottom: 0rem !important;
}

.fw-bold {
    font-weight: bold;
}

.fst-italic {
    font-style: italic;
}


/* ==========================================================================
   Color Utilities
   ========================================================================== */

/* Background Colors */
.bg-body-light {  
     background-color: #F5F7FD;
}

.bg-panel-light {  
     background-color: #e9ecef !important;
}

/* Text Colors */
.text-gold {
    color: var(--gold-600) !important;
}
.text-primary {
    color: var(--bs-primary-text) !important;
}
.text-secondary {
    color: var(--bs-secondary-color) !important;
}

/* Background Colors */
.bg-gold-50 {
    background-color: var(--gold-50) !important;
}
.bg-gold-100 {
    background-color: var(--gold-100)!important;
}
.bg-gold-400 {
    background-color: var(--gold-400)!important;
}
.bg-primary-50 {
    background-color: var(--primary-50) !important;
}
.bg-primary-100 {
    background-color: var(--primary-100) !important;
}
.bg-primary-200 {
    background-color: var(--primary-200) !important;
}
.bg-primary-400 {
    background-color: var(--primary-400) !important;
}
.bg-purple-100 {
    background-color: var(--purple-100);
}
.bg-secondary-50 {
    background-color: var(--secondary-50) !important;
}
.bg-secondary-100 {
    background-color: var(--secondary-400) !important;
}

/* Specific Color Classes */
.color-gold-400 {
    color: var(--gold-400);
}
.color-gold-500 {
    color: var(--gold-400);
}

.color-primary-100 {
    color: var(--primary-100);
}
.color-primary-200 {
    color: var(--primary-200);
}
.color-primary-250 {
    color: var(--primary-250);
}
.color-primary-300 {
    color: var(--primary-300);
}
.color-primary-400 {
    color: var(--primary-400);
}
.color-primary-500 {
    color: var(--primary-500);
}

.color-purple-500 {
    color: var(--purple-500);
}

.color-secondary-300 {
    color: var(--secondary-300);
}
.color-secondary-400 {
    color: var(--secondary-400);
}
.color-secondary-500 {
    color: var(--secondary-500);
}

/* .text-primary-dark{
    color: var(--primary-700) !important;
}  */


/* ==========================================================================
   State Utilities
   ========================================================================== */

.invisible {
    visibility: hidden;
    opacity: 0;
    transition: opacity 0ms;
}
.visible {
    visibility: visible;
    opacity: 1;
    transition: opacity 500ms ease-in-out;
}
.protected {
    pointer-events: none;
    opacity: 0.75;
}