@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined');

@font-face {
  font-family: 'Oakes';
  src: url('../fonts/OakesGroteskRegular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Oakes';
  src: url('../fonts/OakesGroteskMedium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'Oakes';
  src: url('../fonts/OakesGroteskSemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'Oakes';
  src: url('../fonts/OakesGroteskBold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}

:root,
[data-bs-theme="light"] {
    --bs-font-sans-serif: "Plus Jakarta Sans", "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;

    /* Primary brand color */
    --bs-primary: #0173E5;
    --bs-primary-rgb: 1, 115, 229;
    --bs-primary-hover: #0162C3;
    --bs-primary-bg-subtle: #EDF5FF;
    --bs-primary-text-emphasis: #01458A;
    --bs-primary-border-subtle: #C2DEFC;

    /* Secondary colors */
    --bs-secondary: #E8EDF3;
    --bs-secondary-rgb: 232, 237, 243;
    --bs-secondary-hover: #DAE3EE;
    --bs-secondary-color: #687587;
    --bs-secondary-bg: #F0F3F7;
    --bs-secondary-bg-rgb: 240, 243, 247;

    /* Surfaces */
    --bs-paper-bg: #FFFFFF;
    --bs-body-bg: #F7F9FC;
    --bs-card-bg: #FFFFFF;
    --bs-light-bg-subtle: #F0F5FC;
    --bs-menu-hover-bg: #EDF5FF;
    --bs-avatar-bg: #EDF5FF;

    /* Body text */
    --bs-body-color: #273142;
    --bs-text-body: #273142;
    --bs-body-color-rgb: 39, 49, 66;
    --bs-base-color: #273142;
    --bs-base-color-rgb: 39, 49, 66;
    --bs-text-emphasis: #172233;
    --bs-heading-color: #172233;

    /* Neutral controls */
    --bs-jmp-dark: #F0F3F7;
    --bs-jmp-dark-border: #DAE2EC;
    --bs-jmp-dark-text: #48566A;
    --bs-jmp-dark-hover: #E7EDF5;
    --bs-jmp-dark-border-hover: #BBC9DA;
    --bs-jmp-dark-text-hover: #172233;
    --bs-jmp-dark-disabled: #F7F9FC;

    /* Borders */
    --bs-border-color: #DFE6EF;
    --bs-border-color-rgb: 223, 230, 239;
    --bs-jmp-border-hover: #9AAEC7;

    /* Forms */
    --bs-form-label: 0.875rem;

    /* Additional backgrounds */
    --bs-tertiary-bg: #F0F3F7;
    --bs-tertiary-bg-rgb: 240, 243, 247;
    --bs-dark-rgb: 232, 237, 243;

    /* Links */
    --bs-link-color: #0173E5;
    --bs-link-color-rgb: 1, 115, 229;
    --bs-link-hover-color: #015BB5;
    --bs-link-hover-color-rgb: 1, 91, 181;

    /* Fade overlays */
    --bs-jmp-fade-bg: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.7) 70%,
        rgba(255, 255, 255, 1) 100%
    );

    --bs-jmp-fade-bg-up: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.7) 70%,
        rgba(255, 255, 255, 1) 100%
    );

    /* Swiper */
    --swiper-theme-color: var(--bs-primary);

    /* Status colors */
    --bs-warning: #D99A06;
    --bs-warning-rgb: 217, 154, 6;
    --bs-success: #15803D;
    --bs-success-rgb: 21, 128, 61;
    --bs-danger: #E1013C;
    --bs-danger-rgb: 225, 1, 60;
    --bs-danger-bg-subtle: #FFF0F4;
    --bs-btn-border-color: #C10033;

    /* Additional status accents */
    --aw-info: #509FEF;
    --aw-danger: #EE85B5;
    --aw-warning: #EE6352;

    /* Cool gray palette */
    --bs-gray-100: #F0F3F7;
    --bs-gray-200: #E3E9F1;
    --bs-gray-400: #B5C1D0;
    --bs-gray-600: #59677B;
}

.dominant-icon {
    font-family: "Material Symbols Outlined";
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    font-size: 24px !important;
    font-weight: 400;
    width: 1em;
    height: 1em;
    line-height: 1em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    text-transform: none;
    overflow: hidden;
}
.dominant-icon-xs {
    font-size: 16px !important;
}

.dominant-icon-sm {
    font-size: 18px !important;
}

.dominant-icon-md {
    font-size: 28px !important;
}

.dominant-icon-lg {
    font-size: 32px !important;
}

/** Fixes grouped floating inputs **/
.form-floating > .form-select {
    padding-top: 1.625rem !important;
    padding-bottom: 0.625rem !important;
}
.form-floating > .form-control {
    padding-top: 1.625rem !important;
    padding-bottom: 0.625rem !important;
}
.form-floating > .form-control:focus {
    padding-top: 1.625rem !important;
    padding-bottom: 0.625rem !important;
}
.form-floating > .form-control:focus-within {
    padding-top: 1.625rem !important;
    padding-bottom: 0.625rem !important;
}
.input-group:has(button) .form-control {
    padding-top: 1.625rem !important;
    padding-bottom: 0.625rem !important;
}
/* (Optional) If you want to keep the focus-within behavior for input-groups */
html:not([dir='rtl']) .input-group .form-select {
    padding: calc(0.543rem - 2px) calc(0.9375rem - 2px);
}
[dir='rtl'] .input-group .form-select {
    padding: calc(0.543rem - 2px) calc(0.9375rem - 2px);
}
.flatpickr-calendar.open {
    z-index: 1090 !important;
}
.bbd-btn-icon {
    block-size: calc(2.2505001rem + calc(var(--bs-border-width)* 2));
    inline-size: calc(2.2505001rem + calc(var(--bs-border-width)* 2));
    padding:0;
}

.aside-logo {
    max-height: 50px;
    max-width: 33px;
    object-fit: contain;
    margin-left: 15px;
}

@media (min-width: 576px) {
    .aside-logo {
        max-height: 50px;
        max-width: 32px;
        object-fit: contain;
        margin-left: 15px;
    }
}

.jmp-logo-text {
    font-family: "Oakes", sans-serif;
    font-weight: 700;
}

.jmp-logo-text,
span.app-brand-text.demo.menu-text.ms-2.jmp-logo-text {
    font-size: 2em !important;
    line-height: 1.60em;
    margin-top: 6px;
}

.btn-secondary {
    background-color: #ffffff !important;
    border-color: #d8d8d8 !important;
    color: #383838 !important;
}
