#about-hero {
    background-image: linear-gradient(328.26deg, rgba(17, 17, 17, 0) 41.97%, #111111 104.09%), url('../images/contact/banner-hero.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 520px;
    background-position: center;
    width: 100%;
    border-bottom-right-radius: 140px;
    border-bottom-left-radius: 140px;
    clear: both;
    /* Put hero back into normal flow but lift it under the nav */
    position: relative;
    margin-top: -102px;
    /* same offset pattern as #home-top-banner */
    z-index: 1;
    /* allow later content to stack above if needed */
}

#about-title {
    margin-bottom: 60px;
}

#contact-calendar {
    background-image: linear-gradient(275.62deg, #a277bad9 8.89%, #785e93e3 85.38%), url('../images/contact/bg1.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: left;
    width: 100%;
    height: 100%;
    border-bottom-left-radius: 140px;
    position: relative;
    z-index: 500;
}

.cc-wrapper {
    position: relative;
    z-index: 1000;
    padding-top: 105px;
    display: grid;
    grid-template-columns: 60% 40%;
    margin-left: 10%;
    gap: 24px;
    justify-content: end;
}

.cc-img {
    margin-top: -40%;
}

.cc-content h2 {
    color: white;
    font-family: 'IBMPlexSansThai-SemiBold';
    font-size: 40px;
    line-height: 48px;
}

.cc-content p {
    color: white;
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 30px;
    margin-top: 20px;
}

#contact-address,
#contact-openinfo {
    padding: 60px 0px 80px;
}

.ca-wrapper>div,
.co-wrapper>div {
    padding: 0;
}

.ca-wrapper .ca-content,
.co-wrapper .co-content {
    padding-left: 40px;
}

.ca-content h3,
.co-content h3 {
    color: #766092;
    font-family: 'IBMPlexSansThai-SemiBold';
    font-size: 24px;
    line-height: 32px;
    margin-bottom: 0px;
    letter-spacing: 0;
    text-wrap: auto;
}

.ca-detail,
.co-detail {
    margin-top: 24px;
}

.ca-detail-item,
.co-detail-item {
    border-bottom: 1px solid #1111110a;
    padding-bottom: 30px;
    margin-bottom: 32px;
    margin-left: 0px;
    margin-right: 0px;
}

.ca-detail-item:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
    border: none;
}

.ca-di-title {
    font-family: 'IBMPlexSansThai-SemiBold';
    font-size: 20px;
    line-height: 28px;
    color: #766092;
    margin-bottom: 5px;
}

.ca-di-desc .social-media {
    display: inline-block;
    padding-right: 5px;
}

section#contact-form {
    background-color: #FAF5F1;
    border-top-right-radius: 140px;
    padding: 60px 0px;
}

.cf-wrapper {
    background-color: #F9F3EE;
    border-radius: 24px;
    padding: 32px;
}

.cf-wrapper h2 {
    font-size: 40px;
    line-height: 48px;
    text-align: center;
    font-family: 'IBMPlexSansThai-SemiBold';
    color: #766092;
}

.cf-form {
    margin-top: 30px;
}

.cf-form>.row {
    margin-bottom: 16px;
}

.form-label {
    font-family: 'IBMPlexSansThai-Bold';
    margin-bottom: 5px;
}

.form-label.required:after {
    content: '*';
    color: #766092;
    padding-left: 2px;
}

.form-check {
    display: flex;
    align-items: center;
    gap: 10px;
}

.form-check-input[type=checkbox] {
    height: 20px;
    width: 20px;
    margin-top: 0px;
}

.form-check-input:checked {
    border-color: #A378B5;
    background-color: #A378B5;
}

.form-check label {
    font-size: 14px;
}

.co-detail {
    margin-top: 32px;
    border-top: 1px solid #1111110a;
    padding-top: 32px;
}

.co-detail-item {
    border-bottom: unset;
    padding-bottom: 0;
    margin-bottom: 40px;
}

/* Inputs and selects rounding */
#contact-form .form-control,
#contact-form .form-select {
    background-color: #FFFFFF;
    border: 1px solid #EADFE0;
    border-radius: 18px;
    padding: 12px 16px;
    font-size: 14px;
}

/* Submit button style */
#contact-form .btn-submit {
    background-color: #B369A6;
    color: #FFFFFF;
    border-radius: 24px;
    padding: 10px 24px;
    min-width: 90px;
}

/* Map iframe rounding within layout */
.ca-map iframe {
    border-radius: 24px;
}

.ca-di-desc {
    margin-bottom: 0px;
}

/* reCAPTCHA badge positioning */
.grecaptcha-badge {
    bottom: 24px !important;
    right: 24px !important;
    z-index: 10;
}

#booking-visitor {
    background: #FAF5F1;
    border-top-left-radius: 140px;
    padding: 60px 0px 80px;
}

.bv-remark {
    padding-bottom: 35px;
    margin-bottom: 25px;
    border-bottom: 1px solid #1111110a;
}

.bv-remark-text p {
    margin-bottom: 0;
    font-size: 14px;
    line-height: 20px;
}

.bv-remark-status {
    display: flex;
    justify-content: end;
}

.bv-rs-item {
    margin-right: 32px;
}

.bv-rs-item span {
    font-family: 'IBMPlexSansThai-SemiBold';
    font-size: 18px;
    line-height: 28px;
}

.bv-rs-item:last-child {
    margin-right: 0;
}

.calendar-update {
    margin-top: 16px;
}

/* Responsive tweaks */
/* Booking visitor calendar styles */
.fc .fc-button-group>.fc-button,
.fc .fc-button-group>.fc-button:focus,
.fc .fc-button-group>.fc-button:active,
.fc .fc-button-group>.fc-button:focus-visible {
    padding: 0;
    margin-right: 10px;
    height: 100%;
}

#booking-visitor .fc {
    background-color: #FAF5F1;

    padding: 16px 0px;
}

#booking-visitor .fc-toolbar {
    margin-bottom: 16px;
}

#booking-visitor .fc-toolbar h2 {
    font-family: 'IBMPlexSansThai-SemiBold';
    color: #766092;
    font-size: 28px;
    line-height: 36px;
}

#booking-visitor .fc-toolbar .fc-button {
    background-color: #B369A6;
    border: none;
    border-radius: 999px;
    width: 44px;
    height: 44px;
    line-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

#booking-visitor .fc-toolbar .fc-button .fc-button-content {
    display: none;
}

#booking-visitor .fc-day-header {
    background-color: #8A6BBB;
    color: #fff;
    padding: 8px 0;
}

.fc th {
    background-color: #A378B5;
    border-color: #A378B5;
}

.fc td {
    background-color: white;
    border-color: #E8E8E8;
}

.fc .fc-daygrid-day-number {
    color: #252525;
}

.fc .fc-daygrid-day-frame {
    align-items: start;
}

.fc tbody .fc-scrollgrid-section,
.fc .fc-scrollgrid-section-liquid>td {
    border-radius: unset;
}

.fc .fc-scroller-liquid-absolute {
    inset: unset;
}

.fc .fc-daygrid-body-unbalanced .fc-daygrid-day-events {
    z-index: 9999;
    padding-top: 20%;
}

.fc .fc-daygrid-event-harness,
.fc-direction-ltr .fc-daygrid-event.fc-event-end {
    display: flex;
    justify-content: center;
    width: 100%;

}

.fc-direction-ltr .fc-daygrid-event.fc-event-end {

    display: grid;
    grid-template-columns: 1fr auto;
    /* gap: 20px; */
    color: black;
    padding: 2px 6px;
    width: 95%;
    margin: 0 auto;

}

.fc .fc-daygrid-day-top {
    padding-top: 5px;
}

.bv-free {
    background-color: #7EDA88 !important;
}

.bv-full {
    background-color: #F37979 !important;
}

.bv-holiday-day .fc-daygrid-day-frame {
    background-color: #EBEFF0;
    /* softer holiday cell background */
}

.fc td.fc-day-mon {
    background-color: #EBEFF0 !important;
}

.bv-holiday-day .fc-daygrid-day-frame a.fc-daygrid-event.fc-event-end {
    font-size: 12px;
}

.fc .fc-day-other .fc-daygrid-day-frame {
    background-color: rgb(255 249 249 / 18%);
}

.fc-h-event .fc-event-main {
    color: black;
    font-family: 'IBMPlexSansThai-Bold';
    display: flex;
    justify-self: start;
}

.fc .fc-daygrid-day.fc-day-today {
    background-color: unset;
}

.fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-top .fc-daygrid-day-number {
    background: #766092;
    width: max-content;
    border-radius: 100%;
    padding: 2px 10px;
    margin: 0;
    color: white;
}

@media (max-width:1024px) {
    #about-hero {
        background-image: url('../images/contact/banner-hero.jpg');
        margin-top: 25px;
        border-bottom-right-radius: 120px;
        border-bottom-left-radius: 120px;
        min-height: 420px;
        height: 420px;
    }
}

@media (max-width:991px) {
    #about-title {
        margin-bottom: 5%;
    }

    #contact-calendar {
        border-bottom-left-radius: 100px;
    }

    .cc-wrapper {
        grid-template-columns: 50% 50%;
        margin-left: 5%;
        padding-top: 10%;
    }

    .cc-content {
        margin-top: -10%;
    }

    .ca-wrapper .ca-map iframe {
        height: 550px;
    }

    .ca-wrapper .ca-content,
    .co-wrapper .co-content {
        padding-left: 0px;
        margin-top: 40px;
    }

    .ca-detail-item .col-1,
    .co-detail-item .col-1 {
        width: auto;
    }

    #contact-address,
    #contact-openinfo {
        padding: 60px 25px;
    }

    .cf-wrapper {
        padding: 0px;
    }

    section#contact-form {
        border-top-right-radius: 120px;
        padding-top: 80px;
    }

    .ca-detail-item,
    .co-detail-item {
        margin-bottom: 28px;
    }

    #booking-visitor {
        border-top-left-radius: 120px;
    }

    .fc .fc-daygrid-body-unbalanced .fc-daygrid-day-events {
        padding-top: 30%;
    }
}

@media (max-width:767px) {
    #about-hero {
        border-bottom-left-radius: 80px;
        border-bottom-right-radius: 80px;
        min-height: 340px;
        height: 340px;
    }

    .cc-wrapper {
        grid-template-columns: auto;
        margin-left: 0%;
        padding-top: 75px;
        gap: 0px;
        justify-content: center;
    }

    .cc-content {
        margin-bottom: 20px;
    }

    .cc-content h2,
    .cc-detail {
        text-align: center;
    }

    .cc-img,
    .cc-content {
        margin-top: 0%;
    }

    .cc-img {
        margin-left: 5%;
    }

    .cc-img img {
        width: 450px !important;
        max-width: 100%;
        margin: 0 auto;
    }

    .ca-wrapper .ca-map iframe {
        height: 350px;
    }

    #contact-address,
    #contact-openinfo {
        padding-left: 0px;
        padding-right: 0px;
    }

    .ca-wrapper {
        margin: 0;
    }

    .ca-wrapper .ca-content,
    .co-wrapper .co-content {
        margin-top: 30px;
    }

    section#contact-form {
        border-top-right-radius: 80px;
        padding: 60px 0px;
    }

    #contact-form .btn-submit {
        width: 100%;
        margin-top: 25px;
    }

    .co-detail {
        padding-top: 24px;
        margin-top: 24px;
    }

    /* Full Calendar Scroll on Mobile */
    .bvc-wrapper {
        overflow-x: auto;
    }

    #bv-calendar {
        min-width: 100%;
    }

    .fc .fc-col-header-cell-cushion {
        padding: 1px 2px;
    }

    .fc-direction-ltr .fc-daygrid-event.fc-event-end {
        padding: 2px;
    }

    .fc .fc-daygrid-day-top{
        padding-top:0px;
    }
    .fc .fc-daygrid-day-number{
        font-size: 10px;
    }
    .fc .fc-col-header-cell-cushion,
    .fc-direction-ltr .fc-daygrid-event.fc-event-end,
    .bv-holiday-day .fc-daygrid-day-frame a.fc-daygrid-event.fc-event-end {
        font-size: 10px;
    }
    .fc-daygrid-block-event .fc-event-time, .fc-daygrid-block-event .fc-event-title{
        padding:0px;
    }
    .bv-remark-status{
        justify-content: center;
        margin-top:20px;
    }
    #booking-visitor .fc-toolbar .fc-button, #booking-visitor .fc-toolbar .fc-button img{width: 30px; height: 30px;}
}