@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined');
:root, [data-bs-theme=light] {
    --bs-primary: #0f4277;
    --bs-primary-rgb: 15, 66, 119; /* RGB value of #473BF0 */
    --bs-primary-text-emphasis: #d9e0ea; /* Darker, contrasting color for emphasis */
    --bs-primary-bg-subtle: #d9e0ea; /* Light background, slightly off-white */
    --bs-primary-border-subtle: #d9e0ea; /* Slightly darker border to match */
}

[data-bs-theme=dark] {
    --bs-primary: #0f4277;
    --bs-primary-rgb: 15, 66, 119;
    --bs-primary-text-emphasis: #d9e0ea; /* Lighter emphasis text for dark theme */
    --bs-primary-bg-subtle: #d9e0ea; /* Darker, rich background to match primary */
    --bs-primary-border-subtle: #d9e0ea; /* Darker border to match */
}

.vestas-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;
}
.vestas-icon-s {
    font-size: 18px !important;
}
.vestas-icon-xs {
    font-size: 16px !important;
}
.vestas-icon-xxs {
    font-size: 12px !important;
}
.vestas-icon-lg {
    font-size: 28px !important;
}
.vestas-icon-md {
    font-size: 26px !important;
}
.vestas-icon-xl {
    font-size: 32px !important;
}
.vestas-icon-xxl {
    font-size: 48px !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;
}
