/* @override 
	https://www.pines-retreat.com/css/booking.css?*
	http://whisper.ddev.site/css/booking.css?* */

/**
 * Booking form styles.
 *
 * All rules are scoped under .booking so they can't leak into Webflow styles.
 * Override / extend in your own stylesheet as needed.
 */
 .booking__confirmed {
        max-width: 640px;
        margin: 0 auto;
        padding: 2rem 1rem;
    }
    .booking__confirmed h1 {
        font-size: 2.25rem;
        margin: 0 0 1rem;
    }
    .booking__confirmed-lead {
        font-size: 1.1rem;
        color: #555;
        margin-bottom: 2rem;
    }
    .booking__confirmed-summary {
        background: #f7f5f0;
        border: 1px solid #e3ddd0;
        border-radius: 8px;
        padding: 1.5rem;
        margin-bottom: 2rem;
    }
    .booking__confirmed-summary h2,
    .booking__confirmed-next h2 {
        font-size: 1.1rem;
        margin: 0 0 1rem;
    }
    .booking__confirmed-summary dl {
        display: grid;
        grid-template-columns: max-content 1fr;
        gap: .5rem 1.5rem;
        margin: 0;
    }
    .booking__confirmed-summary dt {
        font-weight: 500;
        color: #6b6655;
    }
    .booking__confirmed-summary dd {
        margin: 0;
    }
    .booking__confirmed-next ul {
        padding-left: 1.25rem;
        line-height: 1.6;
    }
    .booking__confirmed-next li {
        margin-bottom: .5rem;
    }
    
 .page-content {
 		width: 100%;
 	 
 }   
 
 .freeform-fieldtype-html a {
 	color: #333;
 	text-decoration: none;
 }

.booking__form-wrap {
	width: 100%;
}
.booking__header {
    margin-bottom: 2rem;
}
.booking__header h1 {
    margin: 0 0 .5rem;
}
.booking__intro {
    color: #555;
    margin-bottom: 2em;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 1px;
}

#bookingCalendarHint {
	margin: 20px 0 30px 10px;
	text-align: left;
	font-size: 16px;
	color: #000;
}
/* ---- Layout: form left, quote right (desktop), stacked (mobile) ---- */

.booking__shell {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.booking__form-wrap {
    width: 100%;
    min-width: 0;
}

.booking__quote {
    width: 100%;
}

/* Default desktop layout: form + sticky quote sidebar */
@media (min-width: 800px) {
    .booking__shell {
        flex-direction: row;
        align-items: flex-start;
        gap: 2.5rem;
    }

    .booking__form-wrap {
        flex: 1;
        min-width: 0;
    }

    .booking__quote {
        width: 360px;
        flex-shrink: 0;
        position: sticky;
        top: 1.5rem;
        visibility: hidden;
    }

    .booking__quote.is-visible {
        visibility: visible;
    }

    /* Page 2 (Payment): hide quote sidebar, give form full width */
    .booking__shell--page-2 .booking__form-wrap {
        flex: 1;
    }

    .booking__shell--page-2 .booking__quote {
        display: none !important;
    }
}
/* ---- Quote box ---- */

.booking__quote {
    background: #f7f5f0;
    border: 1px solid #e3ddd0;
    border-radius: 8px;
    padding: 1.25rem 1.5rem;
}
.booking__quote-heading {
    margin: 0 0 .75rem;
    font-size: 1.1rem;
}
.booking__quote-list {
    margin: 0;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: .35rem .75rem;
}
.booking__quote-list dt,
.booking__quote-list dd {
    margin: 0;
    font-size: .95rem;
}
.booking__quote-list dd {
    text-align: right;
    font-variant-numeric: tabular-nums;
}
.booking__quote-total {
    border-top: 1px solid #d6cfbe;
    margin-top: .5rem !important;
    padding-top: .5rem;
    font-weight: 600;
    font-size: 1.1rem !important;
}
.booking__quote-message {
    margin: .75rem 0 0;
    font-size: .9rem;
    color: #6b6655;
}
.booking__quote-message--error {
    color: #a53a3a;
}

/* ---- Form ---- */

.booking__step {
    border: none;
    padding: 0;
    margin: 0 0 1.5rem;
}
.booking__step-legend {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 1rem;
    padding: 0;
}

.booking__row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}
 

 

@media (min-width: 600px) {
    .booking__row {
        grid-template-columns: 1fr 1fr;
    }
	
}



.booking__field {
    display: flex;
    flex-direction: column;
    gap: .35rem;
}
.booking__field > span {
    font-size: .9rem;
    font-weight: 500;
    color: #333;
}
.booking__field input {
    padding: .65rem .75rem;
    border: 1px solid #ccc;
    border-radius: 6px;
    font: inherit;
    background: #fff;
}
.booking__field input:focus {
    outline: 2px solid #6b6655;
    outline-offset: 1px;
    border-color: #6b6655;
}

/* ---- Add-ons ---- */

.booking__addons {
    border: 1px solid #e3ddd0;
    border-radius: 6px;
    padding: 1rem;
    margin: 1rem 0;
}
.booking__addons legend {
    padding: 0 .5rem;
    font-size: .9rem;
    font-weight: 500;
    color: #555;
}

.booking__check {
    display: flex;
    align-items: flex-start;
    gap: .65rem;
    padding: .5rem 0;
    cursor: pointer;
    line-height: 1.4;
}
.booking__check input {
    margin-top: .25rem;
    flex-shrink: 0;
}
.booking__check--agreement {
    margin: 1rem 0;
    padding: .75rem;
    background: #f7f5f0;
    border-radius: 6px;
}

/* ---- Buttons ---- */

.booking__continue,
.booking__submit {
    display: block;
    width: 100%;
    padding: .9rem 1.5rem;
    background: #6b6655;
    color: #fff;
    border: none;
    border-radius: 6px;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
    margin-top: 1rem;
    transition: background .15s;
}
.booking__continue:hover:not(:disabled),
.booking__submit:hover:not(:disabled) {
    background: #524e42;
}
.booking__continue:disabled,
.booking__submit:disabled {
    background: #b8b3a3;
    cursor: not-allowed;
}

.booking__back {
    background: none;
    border: none;
    color: #6b6655;
    font: inherit;
    cursor: pointer;
    padding: 0;
    margin-bottom: 1rem;
    text-decoration: underline;
}

.booking__cancel-policy {
    font-size: .85rem;
    color: #6b6655;
    margin: .75rem 0 1.5rem;
}

.booking__payment {
    margin: 1.5rem 0;
}

.booking__below {
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 1px solid #e3ddd0;
}