@font-face {
    font-family: 'Sofia Pro Regular';
    font-style: normal;
    font-weight: normal;
    src: local('Sofia Pro Regular'), url('./assets/Sofia Pro Regular Az.woff') format('woff');
}

@font-face {
    font-family: 'Sofia Pro Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Sofia Pro Italic'), url('./assets/Sofia Pro Regular Italic Az.woff') format('woff');
}

@font-face {
    font-family: 'Sofia Pro Bold';
    font-style: normal;
    font-weight: normal;
    src: local('Sofia Pro Bold'), url('./assets/Sofia Pro Bold Az.woff') format('woff');
}

@font-face {
    font-family: 'Sofia Pro Bold Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Sofia Pro Bold Italic'), url('./assets/Sofia Pro Bold Italic Az.woff') format('woff');
}

@font-face {
    font-family: 'Sofia Pro SemiBold';
    font-style: normal;
    font-weight: normal;
    src: local('Sofia Pro SemiBold'), url('./assets/Sofia Pro Semi Bold Az.woff') format('woff');
}

:root {
    --color-primary: #094156;
    --color-secondary: #f1f16e;
    --color-secondary-light1: #f1f16e1a;
    --color-secondary-light2: #f1f16e33;
    --color-secondary-border: #f1f16e4d;
    --color-primary-light1: #0941560d;
    --color-primary-nav: #09415699;
    --color-primary-hover: #094156e0;
    --color-tertiary-light1: #b5edf033;
    --color-secondary-hover: #f1f16ee6;
    --color-tertiary: #b5edf0;
    --color-grey: grey;
    --grey-text: #8cadaf;
    --background-bottom: #f9fafb;
}

.circle-icon {
    width: 70px;
    height: 70px;
    background-color: var(--color-secondary);
    color: var(--color-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
}
.card-success .circle-icon-small {
    width: 35px;
    height: 35px;
    background-color: var(--color-primary);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
}
.card-success .circle-icon {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    background-color:#dcfce7;
}

a.primary-color {
    color: var(--color-primary)!important;
}

body {
    font-family: "Sofia Pro Regular", sans-serif!important;
    background: linear-gradient(to bottom, var(--color-primary) 50%, var(--background-bottom) 50%);!important;
  /*background-color: var(--color-primary)!important;*/
  color: white;
    height: 100%;

}
body .body-container {
    background-color: var(--background-bottom)!important;
}
body .bottom-half {
    background-color: var(--background-bottom)!important;
}
body .top-half {
    background-color: var(--color-primary);
}

span strong {
    font-family: "Sofia Pro Bold", sans-serif!important;
}

span strong.semi-bold {
    font-family: "Sofia Pro SemiBold", sans-serif!important;
}

span i.italic {
    font-family: "Sofia Pro Italic", sans-serif!important;
}

.nav-tabs .nav-link {
    color: var(--color-primary);
}

button.btn-primary {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: white;
}
button.btn-primary:hover {
    background-color: var(--color-primary-hover);
    border-color: var(--color-primary-hover);
    color: white;
}
button.icon-btn {
    margin-left: 5px;
    border-radius: 20px;
    background-color: transparent;
    border-color: transparent;
    color: var(--color-primary);
}
button.icon-btn:hover {
    background-color: var(--color-tertiary);
    color: var(--color-primary);
}
button.primary-icon-btn {
    margin-left: 5px;
    border-radius: 20px;
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-tertiary);
}
button.primary-icon-btn:hover {
    background-color: var(--color-tertiary);
    color: var(--color-primary);
}
h1 {
    font-family: "Bricolage Grotesque", sans-serif;
    color: white!important;
}
.subtitle {
    font-size: 20px;
    font-weight: 500;
    color: var(--color-tertiary);
}
.row.intro-row {
    margin-left: 1rem;
    margin-right: 1rem;
}
.card.intro-card {
    border-color: #fff3;
    background-color: #ffffff1a;
    backdrop-filter: blur(4px);
    flex: 1 1 auto;
    display: flex;
}
.card.intro-card.secondary {
    border-color: var(--color-secondary-border);
    background-color: var(--color-secondary-light1);
    backdrop-filter: blur(4px);
    flex: 1 1 auto;
    display: flex;
}
.card.intro-card .card-body {
    flex-grow: 1;
}
.card.intro-card .icon-card, button .icon-card , .accordion-item .privacy-item.icon-card {
    width: 40px;
    height: 40px;
    margin-right: 20px;
    border-radius: 6px;
}
.card.intro-card .icon-box {
    margin-right: 20px;
}
.card.intro-card .icon-card .card-icon, button .icon-card .card-icon, .accordion-item .privacy-item.icon-card .card-icon {
    width: auto;
    height: 25px;
    margin-right: 0;
}
.card.intro-card h5 {
    font-family: "Sofia Pro Regular", sans-serif!important;
    color: white!important;
}
.card.note {
    border: solid;
    border-left-width: 4px;
    border-right-width: 0;
    border-bottom-width:0;
    border-top-width:0;
    background-color: var(--color-secondary-light2);
    color: white;
}
.card.note.tip {
    border-color: var(--color-secondary);
}
a.card.container-secondary:hover {
    background-color: var(--color-secondary-hover)!important;
}
.colored-line {
    background-image: linear-gradient(to right, var(--color-secondary),var(--color-tertiary));
    border-radius: 9999px;
    width: 6rem;
    height: 0.25rem;
}


h2, h3, h4, h5, h6 {
    font-family: "Bricolage Grotesque", sans-serif;
    color: var(--color-primary)!important;
}
.accordion-header h6 {
    margin-bottom: 0;
}
.row .form-check-input.radio-style {
    border-radius: 50%;
    --bs-form-check-bg-image: #{escape-svg($form-check-radio-checked-bg-image)};
    /*--bs-form-check-bg-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e);*/
}
.row .form-check-input.radio-style:checked:before {
    content: '';
    position: absolute;
    left: 3.5px;
    top: 3.5px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #fff;
    z-index: 2;
}
.row .form-check-input.radio-style:checked {
    position:relative;
    --bs-form-check-bg-image: none;
}
.grey-text {
    color: var(--color-grey)!important;
}
.primary-text {
    color: var(--color-primary);
}
.secondary-text {
    color: var(--color-secondary);
}
.tertiary-text {
    color: var(--color-tertiary);
}
.white-text {
    color: white;
}
.container-primary {
    background-color: var(--color-primary)!important;
}
button:disabled .container-primary {
    background-color: darkGray!important;
}
.container-tertiary {
    background-color: var(--color-tertiary)!important;
}
.container-secondary {
    background-color: var(--color-secondary)!important;
}

.container .accordion {
    /*--bs-accordion-active-bg: var(--color-tertiary);*/
    --bs-accordion-active-bg: white;
    --bs-accordion-active-color: var(--color-primary);
    --bs-accordion-color: var(--color-primary);
}

.container .accordion-item:has(.accordion-header button:disabled) {
    border-color: light-dark(rgba(118, 118, 118, 0.3), rgba(195, 195, 195, 0.3));
    --bs-accordion-bg: light-dark(rgba(239, 239, 239, 0.3), rgba(19, 1, 1, 0.3));
    color: light-dark(rgba(16, 16, 16, 0.3), rgba(255, 255, 255, 0.3));
}
.container .accordion :disabled{
    --bs-accordion-btn-bg: light-dark(rgba(239, 239, 239, 0.3), rgba(19, 1, 1, 0.3));
    --bs-accordion-btn-color: light-dark(rgba(16, 16, 16, 0.3), rgba(255, 255, 255, 0.3));
}
.accordion-item {
    border-radius: var(--bs-accordion-border-radius);
}
.accordion-item .accordion-header .accordion-button {
    border-radius: var(--bs-accordion-inner-border-radius);
}

.datepicker table tr td.active.active {
    background-color: var(--color-primary)!important;
    background-image: linear-gradient(to bottom, var(--color-primary), var(--color-tertiary));
}
.datepicker table tr td.active.today {
    background-color: var(--color-primary)!important;
    background-image: linear-gradient(to bottom, #fdd49a, var(--color-secondary));
}

.datepicker table tr td.active.active:hover {
    background-color: var(--color-tertiary)!important;
    background-image: linear-gradient(to bottom, var(--color-tertiary), var(--color-primary));
}


.label_required {
    font-weight: bold;
}
.label_required::after {
    content: "*";
}
/*.card-icon {*/
/*    margin-right:15px;*/
/*    align-self:center;*/
/*}*/

.price .input-group-prepend .input-group-text{
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.price .input-group-append .input-group-text{
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.price input {
    max-width: 140px;
}
.first-column {
    flex: 0 1 auto;
    margin-right: 10px!important;
    min-width: 113px;
}

.second-column {
    flex: 1; /* Item takes up the rest of the available space */
}

.divider {
    border-bottom: 1px solid #f3f4f6; /* Adjust color and thickness as needed */
    padding-bottom: 8px;           /* Adjust padding for spacing */
    margin-bottom: 8px;
    font-size: 16px;
}
.price-overview {
    font-weight: 600;
}
.card.overview-card {
    background-color: var(--color-primary-light1);
    border-color: var(--color-primary-light1);
}

.card.card-info {
    border: none;
    border-left: 4px solid;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.card.card-info-primary {
    background-color: var(--color-primary-light1);
    border-color: var(--color-primary);
}
.card.card-info-secondary {
    background-color: var(--color-secondary-light2);
    border-color: var(--color-secondary);
}
.card.card-info-tertiary {
    background-color: var(--color-tertiary-light1);
    border-color: var(--color-tertiary);
}
.card.card-info .icon-card {
    margin-right: 15px;
    margin-top: 2px;
}

button.btn#submit_form:disabled {
    background-color: #efefef4d;
    color: #1010104d;
    border-color: #1010104d;
}

@media screen and (max-width: 767px) {
    .intro-row .col-md-6 {
        padding-left:0;
        padding-right: 0;
    }
}