/**
* global custom css
*/

:root,
[data-bs-theme='light'] {

  /* dark/light */
  --bs-light: #f9f9f9;
  --bs-dark: #181c32;
  --bs-color-black: #000000;
  --bs-color-white: #ffffff;
  
  /* statuses */
  --bs-primary: #388d63;
  --bs-primary-light: #c9e2d7;
  --bs-primary-lighter: #d9e9e2;
  --bs-secondary: #dddddd;
  --bs-secondary-light: #eeeeee;
  --bs-success: #48bf84;
  --bs-success-light: #e8fff3;
  --bs-success-lighter: #19e281;
  --bs-success-solid: #cfe6ca;
  --bs-success-shine: #14c36f;
  
  /* context colors */
  --bs-info: #208a9f;
  --bs-info-light: #6fc8da;
  --bs-info-lighter: #d9eaf4;
  --bs-info-inverse:#ffffff;
  --bs-info-dark: #476e7c;
  --bs-warning: #ffc700;
  --bs-warning-dark: #c47d05;
  --bs-warning-light: #fff8dd;
  --bs-danger: #f1416c;
  --bs-danger-dark: #c73838;
  --bs-danger-light: #f7e4e6;
  --bs-danger-lighter: #f9f2f3; 
  --bs-danger-shine: #f1416c;   
  --bs-nav: #4b8085;
  --bs-nav-muted: #79999c;
  --bs-nav-light: #deebe6;
  --bs-nav-lighter: #eef2f2;
  --bs-nav-dark: #0e4347;
  --bs-secondary-inverse: #92929F;

  /* /src/lib/css.js colors */
  --bs-green-1: #4ad66d;
  --bs-green-2: #25a244;
  --bs-green-3: #1a7431;
  --bs-green-4: #155d27;
  --bs-green-5: #163b37; /* apb brand deep green */

  --bs-red-1: #e66063;
  --bs-red-2: #dd2c2f;
  --bs-red-3: #bd1f21;
  --bs-red-4: #ac1c1e;
  --bs-red-5: #51021d;

  /* (blue set used in plotted charts indicators) */  
  --bs-blue-1: #90E0EF;
  --bs-blue-2: #00B4D8;
  --bs-blue-3: #0077B6;
  --bs-blue-4: #03045E;

  /* gray scale */
  --bs-gray-100: #F9F9F9;
  --bs-gray-200: #F4F4F4;
  --bs-gray-300: #E1E3EA;
  --bs-gray-400: #B5B5C3;
  --bs-gray-500: #A1A5B7;
  --bs-gray-600: #7E8299;
  --bs-gray-700: #5E6278;
  --bs-gray-800: #3F4254;
  --bs-gray-900: #181C32;  

  /* elements */
  --bs-body-bg: #ffffff;  
  --bs-body: var(--bs-body-bg);    
  --bs-body-color: #0c2a2b;
  --bs-content-bg-color: #f9f9f9;    
  --bs-content: var(--bs-content-bg-color);    
  --bs-sidebar-bg: #0b2a2c; /* sidebar color */
  --bs-sidebar-section-bg: #0b2a2c;
  --bs-sidebar-selected-bg: #0e4347;
  --bs-bg-alt-1-light: #28621d12; /* light green */
  --bs-bg-alt-2-light: #abc59912; /* very light gray-green */
  --bs-text-primary: var(--bs-primary);
  --bs-text-success: var(--bs-success);
  --bs-text-info: var(--bs-info);
  --bs-text-danger: var(--bs-danger);
  --bs-text-nav: var(--bs-nav);
  --bs-text-warning: var(--bs-warning);
  --bs-card-bg: var(--bs-color-white);
  --bs-card-feature-bg: var(--bs-color-white);  
  --bs-link-color: var(--bs-nav);
  --bs-nav-link-color: var(--bs-nav);
  --bs-border-color: #eeeeee;
  --bs-btn-border-color: #eeeeee;
  --bs-btn-active-color: var(--bs-success);
  --bs-nav-active: var(--bs-nav);
  --bs-nav-active-hover: var(--bs-nav-lighter);
  --bs-heading-color: #181C32;
  --bs-heading-invert-color: #FFFFFF; 
  /* date-picker-svelte */
  --date-input-width: 159px;  
}

[data-bs-theme=dark] {
  
  /* statuses */
  --bs-light: #f9f9f9;
  --bs-dark: #181c32;
  --bs-primary: #388d63;
  --bs-primary-light: #20b26c;
  --bs-primary-lighter: #2b7a53;
  /* --bs-secondary: #547065; */
  --bs-secondary: #5d8467;
  --bs-secondary-light: #6b8b7f;
  --bs-success: #20b26c;
  --bs-success-light: #94f8c7;  
  --bs-success-lighter: #c4f8df;
  --bs-success-solid: #b0e0a7;
  --bs-success-shine: #06e676;  

  --bs-info: #208a9f;
  --bs-info-light: #6fc8da;
  --bs-info-inverse:#ffffff;
  --bs-info-dark: #476e7c;
  --bs-warning: #FFC700;
  --bs-warning-dark: #c47d05;
  --bs-warning-light: #fff8dd;  
  --bs-danger: #F1416C;
  --bs-danger-dark: #ef1a4fc0;  
  --bs-danger-light: #ffa7b0;
  --bs-danger-lighter: #f9f2f3;  
  --bs-danger-shine: #ea8686;  
  --bs-marker:#e5fa79;

  /* context */
  --bs-body-color: #FFFFFF;
  --bs-body-color-rgb: 255, 255, 255;
  --bs-body-bg: #1e1e2d;  
  --bs-content-bg-color: #151521;  

  --bs-body: var(--bs-body-bg);    
  --bs-content: var(--bs-content-bg-color);      
  
  /* dark bg 1-10 */
  --bs-bg-1:var(--bs-body);  
  --bs-bg-2:var(--bs-content);  
  --bs-bg-3:var(--bs-gray-200);  
  --bs-bg-4:var(--bs-gray-300);  
  
  
  /* light bg 10-20 */
  --bs-bg-10:var(--bs-green-6);  /* apb deep green */
  --bs-bg-11:#cfe3db;  
  --bs-bg-12:#f1f5f5;  


  --bs-sidebar-bg: var(--bs-body-bg);
  --bs-sidebar-section-bg: var(--bs-body-bg);
  --bs-sidebar-selected-bg: var(--bs-content-bg-color);
  --bs-body-bg-rgb: 30, 30, 45;
  --bs-emphasis-color: #F9F9F9;
  --bs-emphasis-color-rgb: 249, 249, 249;
  --bs-secondary-color: rgba(255, 255, 255, 0.75);
  --bs-secondary-color-rgb: 255, 255, 255;
  --bs-secondary-bg: #3F4254;
  --bs-secondary-bg-rgb: 63, 66, 84;
  --bs-tertiary-color: rgba(255, 255, 255, 0.5);
  --bs-tertiary-color-rgb: 255, 255, 255;
  --bs-tertiary-bg: #2c2f43;
  --bs-tertiary-bg-rgb: 44, 47, 67;
  --bs-emphasis-color: #ffffff;
  --bs-primary-text: #6ea8fe;
  --bs-secondary-text: #e1eae6;
  --bs-success-text: #75b798;
  --bs-secondary-inverse: #3f4254;

  /* --bs-text-info: #6edff6; */
  --bs-text-info: #4edff1;
  --bs-text-warning: #ffda6a;
  --bs-text-danger: #ea868f;
  --bs-text-danger-light: #f1aebf;
  --bs-text-light: #f9f9f9;
  --bs-text-dark: #181c32;
  --bs-primary-bg-subtle: #031633;
  --bs-secondary-bg-subtle: #181C32;
  --bs-success-bg-subtle: #051b11;
  --bs-info-bg-subtle: #032830;
  --bs-warning-bg-subtle: #332701;
  --bs-danger-bg-subtle: #2c0b0e;
  --bs-light-bg-subtle: #3F4254;
  --bs-dark-bg-subtle: #20212a;
  --bs-primary-border-subtle: #084298;
  --bs-secondary-border-subtle: #5E6278;
  --bs-success-border-subtle: #0f5132;
  --bs-info-border-subtle: #055160;
  --bs-warning-border-subtle: #664d03;
  --bs-danger-border-subtle: #842029;
  --bs-light-border-subtle: #5E6278;
  --bs-dark-border-subtle: #3F4254;
  --bs-heading-color: #FFFFFF;
  --bs-heading-invert-color: #181C32;
  
  --bs-card-bg: var(--bs-body-bg);
  --bs-card-feature-bg: #cddbcd;
  

  /* --bs-nav: var(--bs-success-text); */
  /* --bs-nav: #e1eae6; */
  /* --bs-nav: #5da3aa; */
  /* --bs-nav: #56b6ae; */

  --bs-nav: #48bf84; /* apb logo green color */
  --bs-nav-muted: #4b8085;
  --bs-link-color: #41b9c4;
  --bs-link-hover-color: #9ef3fe;
  --bs-link-color-rgb: 0, 163, 255;
  --bs-link-hover-color-rgb: 158, 197, 254;
  --bs-nav-link-color: var(--bs-nav);
  --bs-code-color: #b93993;
  --bs-border-color: #2B2B40;
  --bs-border-color-translucent: rgba(255, 255, 255, 0.15);
  /* --bs-text-muted: #E1E3EA; */
  --bs-text-muted: #d6d6d6;
  --bs-text-muted2: #bdbdbd;

  --bs-green-1: #92e6a7;
  --bs-green-2: #48c084; /* apb log green */
  --bs-green-3: #25a244;
  --bs-green-4: #208b3a;
  --bs-green-5: #163b37; /* apb brand deep green */
  --bs-green-6: #0b2a2a; /* apb brand deep green2 */
  

  --bs-red-1: #ec8385;
  --bs-red-2: #e35053;
  --bs-red-3: #dd2c2f;
  --bs-red-4: #d02224;  

  /* (blue set used in plotted charts indicators) */
  --bs-blue-1: #90E0EF;
  --bs-blue-2: #00B4D8;
  --bs-blue-3: #0077B6;
  --bs-blue-4: #03045E;

  /* gray scale */  
  --bs-gray-100: #181C32;
  --bs-gray-200: #3F4254;
  --bs-gray-300: #5E6278;
  --bs-gray-400: #7E8299;
  --bs-gray-500: #A1A5B7;
  --bs-gray-600: #B5B5C3;
  --bs-gray-700: #E1E3EA;
  --bs-gray-800: #F4F4F4;
  --bs-gray-900: #F9F9F9;  

  /* date-picker-svelte dark mode */
  --date-picker-background: var(--bs-body);
  --date-picker-foreground: var(--bs-body-color);
}




/* -------------------------------------
Helpers
---------------------------------------- */
.right {
    float:right !important;
}
.left {
    float:left !important;
}

/* -------------------------------------
Bg colors
---------------------------------------- */

/**
* bg 1-10 = dark bg colors
* bg 11-20 = light bg colors
*/

/* the platform bg-body */
.bg-1, .bg-body, .bg-ocean { background-color: var(--bs-bg-1); }

/* the platform bg-content */
.bg-2, .bg-content { background-color: var(--bs-bg-2); }

/* the platform gray-200 */
.bg-3 { background-color: var(--bs-bg-3); }

.bg-4 { background-color: var(--bs-green-6); }

/* the apb deep green */
.bg-10 { background-color: var(--bs-bg-10); }
.bg-11, .bg-primary-alt { background-color: var(--bs-bg-11); }
.bg-12, .bg-primary-2-alt  { background-color: var(--bs-bg-12); }

.bg-white { background-color: #fff; }
.bg-gray-400 { background-color: var(--bs-gray-400); }

/* svg handlers */
svg.bg-white * { fill: #fff; }
svg.bg-1 * { fill: var(--bs-bg-1);}
svg.bg-2 * { fill: var(--bs-bg-2);}
svg.bg-3 * { fill: var(--bs-bg-3);}
svg.bg-4 * { fill: var(--bs-bg-4);}

svg.bg-11 * { fill: var(--bs-bg-11);}
svg.bg-12 * { fill: var(--bs-bg-12);}

/* -------------------------------------
Text colors
---------------------------------------- */


.text-light {
    color:var(--bs-text-light) !important;
}
.text-dark {
    color:var(--bs-text-dark) !important;
}
.text-muted {
    color: var(--bs-text-muted) !important;
}
.text-muted2 {
    color: var(--bs-text-muted2) !important;
}
.text-success {
    color: var(--bs-success) !important;   
}
.text-success-shine {
    color: var(--bs-success-shine) !important;   
}
.text-marker {
    background: var(--bs-marker) !important;
}



/* -------------------------------------
main
---------------------------------------- */

body {
    color: var(--bs-light);
    /* background-color: var(--bs-body);  */
}


/* -------------------------------------
typography
---------------------------------------- */

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.display-1, .display-2, .display-3, .display-4
{
    color: var(--bs-text-light);
}


/* -------------------------------------
navbar
---------------------------------------- */
/* .navbar-container .navbar {
    border-bottom: 1px solid #6f6f6f;
} */
.navbar-container .navbar .navbar-logo {
    width: 160px;
    margin-top: -11px;
}
.navbar-dark .navbar-nav .nav-link {
    /* color: rgb(255 255 255 / 67%); */
    color: var(--bs-text-muted);
}
.navbar-dark .navbar-nav .nav-link:hover {
    color: #fff;
    /* color: var(--bs-light); */
}

.navbar-nav img.nav-blog-link {
    max-width: 200px;
}

/* -------------------------------------
elements
---------------------------------------- */



a, button, input, label {
    cursor: pointer !important;
}

.process-circle.bg-primary {
    background: rgb(71 183 128 / 17%) !important;
}
.process-circle.bg-primary-2 {
    background: rgb(15 82 87 / 15%) !important;
}
.process-circle.bg-primary-3 {
    background: rgb(5 54 2 / 20%) !important;
}
.logo.centered-msg-logo {
    margin-left: -30px;
    max-width: 70%;        
}
.btn.back-to-top {
    position: fixed;
    bottom: 1.5rem;
    left: 1.5rem !important;
    z-index: 1020;
}

.icon.icon-mid svg {
    width: 40px;
    height: 40px;
}


/* -------------------------------------
custom shadow
---------------------------------------- */
.white-shadow {
    box-shadow: 0 0.625rem 1.5rem rgba(255, 255, 255, 0.08) !important;
}


/* -------------------------------------
product pages
---------------------------------------- */
.product-page p {
    color:var(--bs-text-muted2);
}