:root,
[data-bs-theme=light] {
    --bs-primary: #006837;
    --bs-primary-rgb: 82, 230, 9;
    --bs-primary-text-emphasis: #215C04;
    --bs-primary-bg-subtle: #DCFACE;
    --bs-primary-border-subtle: #BAF59D
}

.btn-primary {
    --bs-btn-color: #000000;
    --bs-btn-bg: #006837;
    --bs-btn-border-color: #006837;
    --bs-btn-hover-color: #000000;
    --bs-btn-hover-bg: #006837;
    --bs-btn-hover-border-color: #006837;
    --bs-btn-focus-shadow-rgb: 12, 35, 1;
    --bs-btn-active-color: #000000;
    --bs-btn-active-bg: #006837;
    --bs-btn-active-border-color: #006837;
    --bs-btn-disabled-color: #000000;
    --bs-btn-disabled-bg: #006837;
    --bs-btn-disabled-border-color: #006837
}

.btn-outline-primary {
    --bs-btn-color: #006837;
    --bs-btn-border-color: #006837;
    --bs-btn-focus-shadow-rgb: 82, 230, 9;
    --bs-btn-hover-color: #000000;
    --bs-btn-hover-bg: #006837;
    --bs-btn-hover-border-color: #006837;
    --bs-btn-active-color: #000000;
    --bs-btn-active-bg: #006837;
    --bs-btn-active-border-color: #006837;
    --bs-btn-disabled-color: #006837;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #006837
}

.fit-cover {
    object-fit: cover
}

.bs-icon {
    --bs-icon-size: .50rem;
    display: flex;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    font-size: var(--bs-icon-size);
    width: calc(var(--bs-icon-size) * 2);
    height: calc(var(--bs-icon-size) * 2);
    color: var(--bs-primary)
}

.bs-icon-xs {
    --bs-icon-size: 1rem;
    width: calc(var(--bs-icon-size) * 1.5);
    height: calc(var(--bs-icon-size) * 1.5)
}

.bs-icon-sm {
    --bs-icon-size: 1rem
}

.bs-icon-md {
    --bs-icon-size: 1.5rem
}

.bs-icon-lg {
    --bs-icon-size: 2rem
}

.bs-icon-xl {
    --bs-icon-size: 2.5rem
}

.bs-icon.bs-icon-primary {
    color: var(--bs-white);
    background: var(--bs-primary)
}

.bs-icon.bs-icon-primary-light {
    color: var(--bs-primary);
    background: rgba(var(--bs-primary-rgb), .2)
}

.bs-icon.bs-icon-semi-white {
    color: var(--bs-primary);
    background: rgba(255, 255, 255, .5)
}

.bs-icon.bs-icon-rounded {
    border-radius: .5rem
}

.bs-icon.bs-icon-circle {
    border-radius: 20%
}

.bg-white-300 {
    background: rgba(255, 255, 255, .3) !important
}

.rounded-bottom-left {
    border-radius: 0;
    border-bottom-left-radius: .25rem !important
}

.rounded-bottom-right {
    border-radius: 0;
    border-bottom-right-radius: .25rem !important
}

/* Media queries for iOS devices */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px)
  and (-webkit-min-device-pixel-ratio: 3) { 
    .logo {
        /* Styles for the logo on iPhone X, XS */
        max-width: 100px; /* Adjust maximum width as needed */
        height: auto;
    }
}

@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 2) {
    .logo {
        /* Styles for the logo on iPad */
        max-width: 200px; /* Adjust maximum width as needed */
        height: auto;
    }
}

/* Media queries for macOS laptops and desktops */
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 2560px) {
    .logo {
        /* Styles for the logo on Mac laptops and desktops */
        max-width: 300px; /* Adjust maximum width as needed */
        height: auto;
    }
}

/* General styles for large screens, including macOS desktops */
@media only screen 
  and (min-width: 1200px) {
    .logo {
        /* Styles for the logo on large screens */
        max-width: 100px; /* Adjust maximum width as needed */
        height: auto;
    }
}

/* Safari-specific styles */
@media not all and (min-resolution:.001dpcm) { @media {
    .logo {
        /* Styles specific for Safari */
        max-width: 300px; /* Adjust maximum width as needed */
        height: auto;
    }
}}
