html {
  position: relative;
  min-height: 100%;
}
body {
  /* background: white; */
  /* background: #f3f6fa; */
  background: #f9fbfd;
  /* background: #fcfdfe; */
  /* background: #fefeff; */
  
  /*font-family: "Roboto", sans-serif;*/
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 1em; /* 16/16=1em */
  color: #535c68;  

  margin-bottom: 100px; /*Margin bottom by footer height plus 5*/
}
footer {
  position: absolute;
  bottom: 0;
  width: 100%;
   /*Set fixed height of footer*/
  height: 95px;  
  /*Vertically center text*/
  /* line-height: 40px;   */
  background: #f9fbfd;
}

h1, h2, h3, h4, h5, h6 {font-family: "Plus Jakarta Sans", sans-serif !important; /* Changes the font type */}
.h1, .h2, .h3, .h4, .h5, .h6 {font-family: "Plus Jakarta Sans'", sans-serif !important;}
.display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {font-family: "Plus Jakarta Sans'", sans-serif !important;}

.navbar-brand_x {
    margin-right: 0 !important; 
}

/*a:link {
  color:#2980b9 !important;
}
a:hover {
  color:#014B88 !important;
}*/

/*Scale on height to avoid dead width space*/
.logo-lg { height: 100px; width: auto; }
.logo-md { height: 75px; width: auto; }
.logo-sm { height: 50px; width: auto; }
.logo-xs { height: 30px; width: auto; }

.w-auto { width:auto; }
.w-10 {width: 10%;}
.w-20 {width: 20%;}
.w-30 {width: 30%;}
.w-40 {width: 40%;}
.w-50 {width: 50%;}
.w-60 {width: 60%;}
.w-70 {width: 70%;}
.w-80 {width: 80%;}

.carousel-indicators [data-bs-target] {
  width: 10px;      /* Set a fixed width */
  height: 10px;     /* Set the same height to maintain aspect ratio */
  border-radius: 50%; /* Apply 50% border-radius to make it a circle */
}

.carousel-control-prev-icon, .carousel-control-next-icon {
  background-color: #ecf0f1;  /* clouds */  
  background-size: 60% 60%;     /* Scales down the SVG arrow inside */
  border-radius: 50%;           /* Makes the background rounded */
  width: 42px;                  /* Custom box width */
  height: 42px;                 /* Custom box height */
}

/* Change default opacity */
.carousel-control-prev,
.carousel-control-next {
    opacity: 0.75; /* Set your desired opacity (0 to 1) */
    align-items: flex-end;   /* Moves icons to the bottom */
    padding-bottom: 29px;    /* Adds spacing from the bottom edge */
}

/* Change opacity on hover and focus */
.carousel-control-prev:hover,
.carousel-control-prev:focus,
.carousel-control-next:hover,
.carousel-control-next:focus {
    opacity: 1; /* Fully visible on hover */
    outline: 0;
}
           

.feature-icon-small {
    width: 3rem;
    height: 3rem;
}

.chart-container {
  position: relative;
  margin: auto;
  height: 80vh;
  width: 80vw;
}

/* Mobile First: Square */
.my-rounded-pill {
  border-radius: 5px; /* Small border-radius for a more square-like appearance */
}

/* Desktop: Rounded Pill */
@media (min-width: 768px) {
  .my-rounded-pill {
    border-radius: 50rem; /* Creates a pill shape */
  }
}

.nav-item {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 1.25em; /* 20px/16=1.125em */
  font-weight: 300;
  color: #014B88; 
} 

.nav-pills .nav-link {
            color: #014B88;
        }

.nav-pills .nav-link.active {
            background-color: #9BB7D0;
            color: #fff;
        }

.nav-pills .nav-link.disabled {
            color: #9BB7D0;
        }        

.dropdown-item {
  font-family: "glacial_indifference_regular", sans-serif;
  font-size: 0.875em; /* 14px/16=0.875em */ 
} 

.card-header {
  font-size: 1.125em; /* 18px/16=1.1875em */
  font-family: "Plus Jakarta Sans", serif;
  font-weight: 600;
} 

/* .form-floating>.form-control,
.form-floating>.form-control-plaintext {
  padding: 0rem 0.75rem !important;
}

.form-floating>.form-control,
.form-floating>.form-control-plaintext,
.form-floating>.form-select {
  height: calc(2.5rem + 2px) !important;
  line-height: 1;
}

.form-floating>label {
  padding: 0.5rem 0.75rem !important;
} */

 .form-floating > .form-control {
        height: 3rem !important; /* Example: set a specific height */
    }

    .form-floating > label {
        padding-top: 0.75rem; /* Adjust label padding if needed */
        padding-bottom: 0.75rem;
    }


@media print {
    @page {
      size: letter;
      margin: .125in;
    }

    body {
      margin-bottom: 30px; /* Margin bottom by footer height plus some */
      font-size: 12px;
     }

     /* .table {
    font-size: 10px;
    }  */

    .h6 {
      font-size: 16px;
    }
    .fixed-table-toolbar {
      display: none;
    }
    footer {
      height: 25px;
      line-height: 25px;
      font-size: 12px;
      background-color: #9BB7D0;
    }
}

    /* Styles for screens up to 767px wide (common for tablets and larger phones) */
    @media only screen and (max-width: 767px) {
        body {
            font-size: 1.125em !important; /* 16px/16=1em Adjust base font size for mobile */
        }
        h1-x {
            font-size: 2em; /* Increase heading size relative to base font */
        }
        p-x {
            font-size: 1.1em; /* Slightly larger paragraph text */
        }
        /* Target specific elements by their class or ID if needed */
        .my-specific-element {
            font-size: 1.5em;
        }
    }

    /* Styles for screens up to 575px wide (common for smaller phones) */
    @media only screen and (max-width: 575px) {
        body {
            font-size: 1.125em !important; /* 16px Further adjustment for smaller screens */
        }
        h1-x {
            font-size: 1.8em;
        }
    }

/* Colors */
.text-light-green     {color:#ACD200;} 
.bg-light-green       {color:#fff;background-color:#ACD200;}

.text-green           {color:#84B12C;} 
.bg-green             {color:#fff;background-color:#84B12C;}

.text-dark-green      {color:#16502A;} 
.bg-dark-green        {color:#fff;background-color:#16502A;}

.text-prcc-gold       {color:#F2DC42;} 
.bg-gold              {color:#fff;background-color:#F2DC42;}




.bg-default
{background-color: #f6f8fc;}
.bg-light-blue-2
{color:#fff; background-color:#9BB7D0;}
.bg-light-blue
{color:#fff; background-color:#9BB7D0;}
.bg-light-blue:hover, .bg-light-blue:active
{color:#fff !important; background-color:#869fb5 !important;}
.bg-light-blue:focus
{color:#fff !important; background-color:#014B88 !important;}
.bg-dark-blue
{color:#fff;background-color:#014B88;}
.bg-prcc-gold
{color:#34495e;background-color:#ffc000;} 
.bg-prcc-orange
{color:#34495e;background-color:#ff9400;}
.text-light-blue
{color:#9BB7D0;}
.text-dark-blue
{color:#014B88;}
.text-wet-asphalt
{color:#34495e;}


.table-orange       {background-color:#ff9400;}

.prcc-lime-alert    {color:#4e950b;background-color:#f2fbea;}
.prcc-lime-0-text   {color:#f2fbea;}
.prcc-lime-1        {color:#fff;background-color:#c8eda4;}
.prcc-lime-1-text   {color:#c8eda4;}

.prcc-green-alert   {color:#087340;background-color:#edf7f2;}
.prcc-green-1       {color:#fff;background-color:#8ccbad;}
.prcc-green-2       {color:#fff;background-color:#51b384;}
.prcc-green-3       {color:#fff;background-color:#30a36c;}
.prcc-green-4       {color:#fff;background-color:#139556;}
.prcc-green-4-text  {color:#139556;}
.prcc-green-5       {color:#fff;background-color:#087340;}
.prcc-green-5-text  {color:#087340;}

.prcc-orange-alert   {color:#a6330c;background-color:#fcede8;}
.prcc-orange-1       {color:#fff;background-color:#ffc4b0;}
.prcc-orange-2       {color:#fff;background-color:#ff9773;}
.prcc-orange-2-text  {color:#ff9773;}
.prcc-orange-3       {color:#fff;background-color:#ea6f45;}
.prcc-orange-3-text  {color:#ea6f45;}
.prcc-orange-4       {color:#fff;background-color:#d64b1b;}
.prcc-orange-5       {color:#fff;background-color:#a6330c;}

.prcc-yellow-alert  {color:#8aa10c;background-color:#fafee7;}
.prcc-yellow-0-text {color:#fafee7;}
.prcc-yellow-1      {color:#fff;background-color:#eefaad;}
.prcc-yellow-1-text {color:#eefaad;}
.prcc-yellow-2      {color:#fff;background-color:#e3f86f;}
.prcc-yellow-2-text {color:#e3f86f;}
.prcc-yellow-3      {color:#fff;background-color:#cbe343;}
.prcc-yellow-3-text {color:#cbe343;}
.prcc-yellow-4      {color:#fff;background-color:#b4cf1a;}
.prcc-yellow-5      {color:#fff;background-color:#8aa10c;}

.prcc-pink-alert    {color:#920a38;background-color:#faeaf0;}
.prcc-pink-1        {color:#fff;background-color:#eba2bb;}
.prcc-pink-1-text   {color:#eba2bb;}
.prcc-pink-2        {color:#fff;background-color:#e2668f;}
.prcc-pink-3        {color:#fff;background-color:#ce3d6e;}
.prcc-pink-3-text   {color:#ce3d6e;}
.prcc-pink-4        {color:#fff;background-color:#bc184f;}
.prcc-pink-5        {color:#fff;background-color:#920a38;}

.border-emerald     {border-bottom: solid #2ecc71;}
.border-nephritis   {border-bottom: solid #27ae60;}

.border-peter-river {border-bottom: solid #3498db;}
.border-belize-hole {border-bottom: solid #2980b9;}

.border-sun-flower  {border-bottom: solid #f1c40f;}
.border-orange      {border-bottom: solid #f39c12 ;}
.border-carrot      {border-bottom: solid #e67e22;}
.border-pumpkin     {border-bottom: solid #d35400;}
.border-alizarin    {border-bottom: solid #e74c3c;}
.border-pomegranate {border-bottom: solid #c0392b;}

.border-asbestos    {border-bottom: solid #7f8c8d;}
.border-amethyst    {border-bottom: solid #9b59b6;}
.border-wisteria    {border-bottom: solid #8e44ad;}

.border-table-sun-flower  {border-bottom-color: solid #f1c40f !important; border-bottom-width: thick;}

.text-wisteria    {color:#8e44ad;}
.text-amethyst    {color:#9b59b6;}
.text-emerald     {color:#2ecc71;}
.text-nephritis   {color:#27ae60;}
.text-prcc-green  {color:#A0CE4E;}
.text-prcc-gold   {color:#ffc000;}
.text-sun-flower  {color:#f1c40f;}
.text-pumpkin     {color:#d35400;}
.text-clouds      {color:#ecf0f1;}
.text-alizarin    {color:#e74c3c;} 
.text-pomegranate {color:#c0392b;}
.text-peter-river {color:#3498db;} 
.text-belize-hole {color:#2980b9;} 

.text-prcc-blue   {color:#014B88;} 
.text-cal-recycle {color:#62822f;} 


/*overwrite bootstrap classes*/
.text-danger      {color:#eb4d4b !important;} /*carmine-pink*/
.text-success     {color:#6ab04c !important;} /*pure-apple*/
.text-primary     {color:#4834d4 !important;} /*blurple*/


.flat-turquoise
{color:#fff;background-color:#1abc9c}
.flat-emerald
{color:#fff;background-color:#2ecc71}
.flat-peter-river
{color:#fff;background-color:#3498db}
.flat-amethyst
{color:#fff;background-color:#9b59b6}
.flat-wet-asphalt
{color:#fff;background-color:#34495e}

.flat-green-sea
{color:#fff;background-color:#16a085}
.flat-nephritis
{color:#fff;background-color:#27ae60}
.flat-belize-hole
{color:#fff;background-color:#2980b9}
.flat-wisteria
{color:#fff;background-color:#8e44ad}
.flat-midnight-blue
{color:#fff;background-color:#2c3e50}

.flat-sun-flower
{color:#fff;background-color:#f1c40f}
.flat-carrot
{color:#fff;background-color:#e67e22}
.flat-alizarin
{color:#fff;background-color:#e74c3c}


.flat-orange
{color:#fff;background-color:#f39c12}
.flat-pumpkin
{color:#fff;background-color:#d35400}
.flat-pomegranate
{color:#fff;background-color:#c0392b}

.flat-clouds    {color:#000;background-color:#ecf0f1}
.flat-silver    {color:#000;background-color:#bdc3c7}
.flat-concrete  {color:#fff;background-color:#95a5a6}
.flat-asbestos  {color:#fff;background-color:#7f8c8d}

.grad-carrot
{color:#fff;background-image: linear-gradient(#e67e22,#d35400);}
.grad-peter
{color:#fff;background-image: linear-gradient(#3498db,#2980b9);}
.grad-emerald
{color:#fff;background-image: linear-gradient(#2ecc71,#27ae60);}
.grad-asphalt
{color:#fff;background-image: linear-gradient(#34495e,#2c3e50);}
.grad-amethyst
{color:#fff;background-image: linear-gradient(#9b59b6,#8e44ad);}
.grad-clouds
{background-image: linear-gradient(#ecf0f1,#bdc3c7);}


/*Flat UI Section/Card Headers*/
.bg-education         {color:#fff;background-color:#30336b} /*june-bug*/
.bg-management        {color:#fff;background-color:#30336b} /*quince-jelly*/
.text-management      {color:#535c68} /*wizard-grey*/
.bg-media             {color:#fff;background-color:#30336b} /*turbo*/
.bg-operations        {color:#fff;background-color:#30336b} /*exodus-fruit*/
.bg-planning          {color:#fff;background-color:#30336b}  /*carmine-pink*/
.bg-research          {color:#fff;background-color:#30336b} /*steel-pink*/

/*Flat UI Palette Aussie*/
.bg-beekeeper         {color:#fff;background-color:#f6e58d}
.bg-spiced-nectarine  {color:#fff;background-color:#ffbe76}
.bg-pink-glamour      {color:#fff;background-color:#ff7979}
.bg-june-bug          {color:#fff;background-color:#badc58} 
.bg-coastal-breeze    {color:#fff;background-color:#dff9fb}

.bg-turbo             {color:#fff;background-color:#f9ca24}
.bg-quince-jelly      {color:#fff;background-color:#f0932b}
.bg-carmine-pink      {color:#fff;background-color:#eb4d4b}
.bg-pure-apple        {color:#fff;background-color:#6ab04c}
.bg-hint-of-ice-pack  {color:#fff;background-color:#c7ecee}

.bg-middle-blue       {color:#fff;background-color:#7ed6df}
.bg-heliotrope        {color:#fff;background-color:#e056fd}
.bg-exodus-fruit      {color:#fff;background-color:#686de0}
.bg-deep-koamaru      {color:#fff;background-color:#30336b}
.text-deep-koamaru    {color:#30336b}
.bg-soaring-eagle     {color:#fff;background-color:#95afc0}

.bg-greenland-green   {color:#fff;background-color:#22a6b3}
.bg-steel-pink        {color:#fff;background-color:#be2edd}
.bg-blurple           {color:#fff;background-color:#4834d4}
.bg-deep-cove         {color:#fff;background-color:#130f40}
.bg-wizard-grey       {color:#fff;background-color:#535c68}

/* .form-signin {
  max-width: 330px;
  padding: 15px;
  margin: 0 auto;
}
.form-signin .form-signin-heading,
.form-signin .checkbox {
  margin-bottom: 10px;
}
.form-signin .checkbox {
  font-weight: normal;
}
.form-signin .form-control {
  position: relative;
  height: auto;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  padding: 10px;
  font-size: 16px;
}
.form-signin .form-control:focus {
  z-index: 2;
}
.form-signin input[type="email"] {
  margin-bottom: -1px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.form-signin input[type="password"] {
  margin-bottom: 10px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
} */

.roboto-condensed-regular {
  font-family: "Roboto Condensed", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.roboto-condensed-light {
  font-family: "Roboto Condensed", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
}

.roboto-thin {
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.roboto-light {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.roboto-regular {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.roboto-medium {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.roboto-bold {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.roboto-black {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.roboto-thin-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  font-style: italic;
}

.roboto-light-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.roboto-regular-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.roboto-medium-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-style: italic;
}

.roboto-bold-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-style: italic;
}

.roboto-black-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  font-style: italic;
}

.roboto-slab-regular {
  font-family: "Roboto Slab", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.roboto-slab-light {
  font-family: "Roboto Slab", serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
}

.roboto-slab-bold {
  font-family: "Roboto Slab", serif;
  font-optical-sizing: auto;
  font-weight: 600; 
  font-style: normal;
}


.plus-jakarta-sans-bold {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}

.plus-jakarta-sans-regular {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.inter-regular {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}



.apexcharts-legend {
  flex-direction: row-reverse
}


/*Stacked Table CSS*/

@media (max-width: 440px) { /* Adjust breakpoint as needed */
  .responsive-table thead {
    display: none;
  }

  .responsive-table,
  .responsive-table tbody,
  .responsive-table tr,
  .responsive-table td {
    display: block;
    width: 100%;
  }

  .responsive-table tr {
    margin-bottom: 15px;
    border: 1px solid #dee2e6; /* Example border */
  }

  .responsive-table td {
    padding-left: 50%; /* Adjust based on label width */
    position: relative;
  }

  .responsive-table td::before {
    content: attr(data-label);
    position: absolute;
    left: 0;
    width: 45%; /* Adjust based on label width */
    padding-right: 10px;
    white-space: nowrap;
    font-weight: bold;
  }
}
