/* Current Brand Colors: 
   -------------
    - #2364aa (blue), #3da5d9 (light blue), #73bfb8 (green), #fb8500 (orange), #fec601 (yellow), #c9c9c9 (grey)
    - REDESIGN #093067 (dark blue), #3664a6 (med-dark blue/h2) #1a92b6 (medium blue/btn), #dbf7ff (light blue/h3), #eff9fc very light blue/grey, #ff8300 (orange/h1 alt/accent)
*/

/***************************** STYLE VARIABLES *****************************/
:root {

    /* ----- Bootstrap styles available in :root by default ----- */

    --bs-blue: #0d6efd;
    --bs-indigo: #6610f2;
    --bs-purple: #6f42c1;
    --bs-pink: #d63384;
    --bs-red: #dc3545;
    --bs-orange: #fd7e14;
    --bs-yellow: #ffc107;
    --bs-green: #198754;
    --bs-teal: #20c997;
    --bs-cyan: #0dcaf0;
    --bs-white: #fff;
    --bs-gray: #aeaeae;
    --bs-gray-dark: #343a40;
    --bs-primary: var(--button-color);
    --bs-secondary: #6c757d;
    --bs-success: #198754;
    --bs-info: #0dcaf0;
    --bs-warning: #ffc107;
    --bs-danger: #dc3545;
    --bs-light: #f8f9fa;
    --bs-dark: #212529;
    --bs-body-color: #5F5E60;
    --bs-link-color: var(--brand-color-1);
    --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));

    --bs-dropdown-item-border-radius: 10px;

    /* ----- KDB style variables ----- */

    
    /* === LEGACY - REMOVE WHEN ABLE TO === */
    --banner-background-color1: #093067;
    --banner-text-color1: #ffffff;
    --banner-background-color2: #73bfb8;
    --banner-text-color2: #ffffff;
    --banner-background-color3: #DD5D26;
    --banner-text-color3: #ffffff;
    --banner-background-color4: #F9F9E1;
    --banner-text-color4: #3D3088;
    /* =================================== */

    --brand-color-1: #3A74B9;
    --brand-color-2: #2EB14C;
    --brand-color-3: #ca0e78;
    
    --blob-color-1: var(--brand-color-1);
    --blob-color-2: var(--brand-color-2);
    --blob-color-3: #E90D8B ;
    --blob-color-4: #E1BE38; /* The SVGs that use this have a hardcoded opacity of .15 (consider moving that to this color instead) */
    --blob-color-5: #fdd1ea; /* background blob color of "Just for Kids" feature*/
    --blob-color-6: #eef1ff; /* background blob color of "Fun Environment" feature*/
    --blob-color-7: #E4F9D7; /* background blob color of "Family-Friendly" feature*/
    --blob-color-8: #F1E405;
    --blob-color-9: rgba(255, 255, 255, 0.15);

    --background-color-1: var(--brand-color-1);
    --background-color-2: var(--brand-color-2);
    --background-color-3: var(--brand-color-3);
    --background-color-4: #F9F9E1;
    
    --button-color: var(--brand-color-2);
    --button-hover-color: linear-gradient(rgb(0 0 0/15%), rgb(0 0 0/15%));
    --button-secondary-color: #ffffff;
    
    /* Used in faq card-color3 and card-color5 classes*/
    --card-background-color3: #F9F9E1;
    
    --navbar-background-color: #ffffff;
    /*--navbar-dropdown-hover-color: #7CC244;*/
    /*--brand-color-3: #DD5D26;*/
    --rz-listbox-border: 0px !important; /* Radzen override for something? TODO: Figure out what this is used for */
    /*--social-icon-color: #3D3088;*/
    /*--social-icon-hover-color: #DD5D26;*/
    --promo-ribbon-background-color: #3D3088; /* Might want to keep this for use later if we keep the promo ribbon*/
    --search-button-background-color: #dddddd;
    --swiper-theme-color: #7CC244; /* TODO: Figure out if this is used any where or if we can replace with brand-color*/
}