.csnl-bnb-account { max-width: 900px; }
.csnl-bnb-account-card { border: 1px solid #ded8d1; border-radius: 10px; padding: 1.25rem; margin: 1.25rem 0; background: #fff; }
.csnl-bnb-account-card header { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.csnl-bnb-account-card h3 { margin: 0 0 1rem; }
.csnl-bnb-account-card dl { display: flex; flex-wrap: wrap; gap: 1rem 2rem; margin: 0 0 1rem; }
.csnl-bnb-account-card dt { font-size: .85em; color: #5f5b56; }
.csnl-bnb-account-card dd { margin: 0; font-weight: 600; }
.csnl-bnb-account-card details { border-top: 1px solid #e6e0d9; padding: .8rem 0; }
.csnl-bnb-account-card summary { cursor: pointer; font-weight: 600; }
.csnl-bnb-account-card form { display: grid; gap: .85rem; margin-top: 1rem; }
.csnl-bnb-account-card label { display: grid; gap: .3rem; }
.csnl-bnb-account-card input[type=date], .csnl-bnb-account-card textarea { max-width: 100%; width: 100%; box-sizing: border-box; }
.csnl-bnb-account-card button { justify-self: start; }
@media (max-width: 600px) { .csnl-bnb-account-card { padding: 1rem; } .csnl-bnb-account-card header { display: block; } }

.csnl-bnb-account { max-width: 960px; color: #18382f; }
.csnl-bnb-account > h2 { margin-bottom: 1.6rem; font-size: clamp(1.8rem, 3vw, 2.4rem); }
.csnl-bnb-account > h3 { margin: 2rem 0 1rem; font-size: 1.25rem; }
.csnl-bnb-account-card { margin-bottom: 1.35rem; padding: clamp(1.1rem, 3vw, 1.8rem); border-color: #dce6df; border-radius: 18px; box-shadow: 0 8px 30px rgba(24, 56, 47, .06); }
.csnl-bnb-account-card header { align-items: center; margin-bottom: 1.3rem; }
.csnl-bnb-account-card header h3 { margin: 0; font-size: clamp(1.25rem, 2.5vw, 1.6rem); }
.csnl-bnb-account-card header span { padding: .35rem .7rem; border-radius: 99px; background: #e8f3ed; color: #285c49; font-size: .78rem; font-weight: 700; white-space: nowrap; }
.csnl-bnb-account-card dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin-bottom: 1.25rem; }
.csnl-bnb-account-card dl > div { padding: .85rem 1rem; border-radius: 10px; background: #f5f8f5; }
.csnl-bnb-account-card dt { margin-bottom: .18rem; color: #62726a; }
.csnl-bnb-account-card h4 { margin: 1.5rem 0 .65rem; }
.csnl-bnb-account-card details { margin-top: .65rem; padding: 0; border: 1px solid #dce6df; border-radius: 12px; overflow: hidden; }
.csnl-bnb-account-card details[open] { border-color: #9ec9b1; }
.csnl-bnb-account-card summary { padding: 1rem 1.1rem; background: #f8faf8; }
.csnl-bnb-account-card details[open] summary { background: #edf6ef; }
.csnl-bnb-account-card form { padding: 1.15rem; gap: 1.1rem; }
.csnl-bnb-account-card input[type=date], .csnl-bnb-account-card textarea { border: 1px solid #cddbd1; border-radius: 8px; padding: .65rem .75rem; }
.csnl-bnb-account-card button[type=submit]:disabled { opacity: .55; cursor: not-allowed; }
.csnl-bnb-date-current { display: flex; justify-content: space-between; gap: .5rem 1rem; flex-wrap: wrap; padding: .9rem 1rem; border-radius: 10px; background: #eef4f0; }
.csnl-bnb-date-current span { color: #52685a; }
.csnl-bnb-date-intro, .csnl-bnb-date-note { margin: 0; line-height: 1.5; }
.csnl-bnb-date-note { padding: .8rem 1rem; border-left: 3px solid #49977a; background: #f4f8f5; font-size: .92rem; }
.csnl-bnb-date-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; }
.csnl-bnb-account-calendar { max-width: 570px; padding: clamp(.75rem, 2vw, 1.15rem); border: 1px solid #d9e7dd; border-radius: 14px; background: #fbfdfb; }
.csnl-bnb-account-calendar[hidden] { display: none; }
.csnl-bnb-account-calendar-bar { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .8rem; }
.csnl-bnb-account-calendar-bar strong { text-transform: capitalize; font-size: 1.05rem; }
.csnl-bnb-account-calendar-bar button { width: 38px; height: 38px; border: 1px solid #cddfd2; border-radius: 9px; background: #fff; color: #265d49; cursor: pointer; font-size: 1.5rem; line-height: 1; }
.csnl-bnb-account-calendar-bar button:disabled { opacity: .35; cursor: default; }
.csnl-bnb-account-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 5px; }
.csnl-bnb-account-weekday { display: grid; place-items: center; min-height: 30px; color: #677a6d; font-size: .78rem; font-weight: 700; text-transform: capitalize; }
.csnl-bnb-account-days .csnl-bnb-account-day { display: grid; place-items: center; width: 100%; min-width: 0; aspect-ratio: 1; padding: 0; border: 1px solid #d8e7dc; border-radius: 9px; background: #fff; color: #205444; font-weight: 650; cursor: pointer; }
.csnl-bnb-account-days .csnl-bnb-account-day:hover:not(:disabled), .csnl-bnb-account-days .csnl-bnb-account-day:focus-visible { border-color: #23775a; outline: 2px solid #a9d6b9; outline-offset: 1px; }
.csnl-bnb-account-days .csnl-bnb-account-day.is-current { background: #e4eaf3; border-color: #b6c7de; color: #34546d; }
.csnl-bnb-account-days .csnl-bnb-account-day.is-current-checkout small { display: block; font-size: .56em; font-weight: 700; }
.csnl-bnb-account-days .csnl-bnb-account-day.is-pending { background: #fff1d5; border-color: #efcf83; color: #715215; }
.csnl-bnb-account-days .csnl-bnb-account-day.is-booked { background: #eceeee; border-color: #d6dddd; color: #677574; }
.csnl-bnb-account-days .csnl-bnb-account-day.is-current-checkout { display: flex; flex-direction: column; gap: 0; background: linear-gradient(135deg, #e4eaf3 0 48%, #fff 49% 100%); border-color: #b6c7de; color: #34546d; line-height: 1.05; }
.csnl-bnb-account-days .csnl-bnb-account-day.is-turnover:not(.is-selected):not(.is-start):not(.is-end):not(.is-current-checkout) { background: linear-gradient(135deg, #fff 0 48%, #eceeee 49% 100%); border-color: #cad8d1; }
.csnl-bnb-account-days .csnl-bnb-account-day.is-selected { background: #d9eee2; border-color: #8cbd9d; color: #185139; }
.csnl-bnb-account-days .csnl-bnb-account-day.is-start, .csnl-bnb-account-days .csnl-bnb-account-day.is-end { background: #176a50; border-color: #176a50; color: #fff; }
.csnl-bnb-account-days .csnl-bnb-account-day:disabled { cursor: default; }
.csnl-bnb-account-days .csnl-bnb-account-day:disabled:not(.is-booked):not(.is-pending):not(.is-current) { opacity: .45; }
.csnl-bnb-account-legend { display: flex; flex-wrap: wrap; gap: .5rem 1rem; margin-top: 1rem; padding-top: .8rem; border-top: 1px solid #e0e9e2; font-size: .76rem; color: #516458; }
.csnl-bnb-account-legend span { display: inline-flex; align-items: center; gap: .35rem; }
.csnl-bnb-account-legend span::before { content: ''; display: inline-block; width: 12px; height: 12px; border-radius: 3px; border: 1px solid #d8e7dc; background: #fff; }
.csnl-bnb-account-legend .is-current::before { background: #e4eaf3; border-color: #b6c7de; }
.csnl-bnb-account-legend .is-selected::before { background: #d9eee2; border-color: #8cbd9d; }
.csnl-bnb-account-legend .is-pending::before { background: #fff1d5; border-color: #efcf83; }
.csnl-bnb-account-legend .is-booked::before { background: #eceeee; border-color: #d6dddd; }
.csnl-bnb-account-legend .is-turnover::before { background: linear-gradient(135deg, #fff 0 48%, #eceeee 49% 100%); border-color: #cad8d1; }
.csnl-bnb-account-calendar-status { min-height: 1.4em; margin: .8rem 0 0; color: #275c45; font-size: .9rem; }
.csnl-bnb-account-calendar-status.is-error { color: #9c362e; }
.csnl-bnb-account-offer { margin-top: .7rem; padding: 1rem; border: 1px solid #eed394; border-radius: 10px; background: #fff9eb; }
@media (max-width: 650px) { .csnl-bnb-account-card header { display: flex; align-items: flex-start; flex-direction: column; } .csnl-bnb-account-card dl, .csnl-bnb-date-fields { grid-template-columns: 1fr; } .csnl-bnb-account-days { gap: 3px; } .csnl-bnb-account-days .csnl-bnb-account-day { border-radius: 6px; font-size: .85rem; } }

.csnl-bnb-payment-link { display: inline-flex; align-items: center; gap: .4rem; font-weight: 700; }
.csnl-bnb-payment-history { margin: 1.75rem 0; padding: clamp(1rem, 3vw, 1.5rem); border: 1px solid #dce6df; border-radius: 14px; background: #f8fbf9; }
.csnl-bnb-payment-history h2 { margin: 0 0 .35rem; font-size: 1.35rem; }
.csnl-bnb-payment-history h3 { margin: 1.25rem 0 .6rem; font-size: 1.05rem; }
.csnl-bnb-payment-history p { margin: 0 0 .75rem; color: #52685a; }
.csnl-bnb-payment-history ol { display: grid; gap: .7rem; margin: 0; padding: 0; list-style: none; }
.csnl-bnb-payment-history li { display: grid; gap: .25rem; padding: .9rem 1rem; border: 1px solid #dce6df; border-radius: 10px; background: #fff; }
.csnl-bnb-payment-history li strong { color: #1d5944; }
.csnl-bnb-payment-history-dates { font-weight: 600; }
.csnl-bnb-payment-history a { justify-self: start; margin-top: .25rem; font-weight: 700; }

/* Booking list: the summary is the compact entry point to all existing details. */
.csnl-bnb-account-card { padding: 0; overflow: hidden; }
.csnl-bnb-account-card > summary.csnl-bnb-booking-summary { display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; align-items: center; gap: 1.2rem; min-height: 140px; padding: 0 1.3rem 0 0; background: #fff; list-style: none; }
.csnl-bnb-account-card > summary.csnl-bnb-booking-summary::-webkit-details-marker { display: none; }
.csnl-bnb-account-card > summary.csnl-bnb-booking-summary:hover, .csnl-bnb-account-card > summary.csnl-bnb-booking-summary:focus-visible { background: #f5faf6; }
.csnl-bnb-account-card[open] > summary.csnl-bnb-booking-summary { background: #f5faf6; border-bottom: 1px solid #dce6df; }
.csnl-bnb-account-photo { display: block; width: 150px; height: 140px; overflow: hidden; background: #dbe9df; }
.csnl-bnb-account-photo img.csnl-bnb-account-image { display: block; width: 100%; height: 100%; object-fit: cover; }
.csnl-bnb-account-image-placeholder { display: grid; place-items: center; width: 100%; height: 100%; color: #678a76; font-size: 3.2rem; }
.csnl-bnb-booking-summary-main { display: grid; gap: .3rem; min-width: 0; }
.csnl-bnb-booking-summary-main > strong { color: #173d2d; font-size: 1.25rem; line-height: 1.2; }
.csnl-bnb-booking-summary-dates { color: #234838; font-weight: 650; }
.csnl-bnb-booking-summary-guests { color: #65796b; font-size: .9rem; }
.csnl-bnb-booking-summary-side { display: flex; flex-direction: column; align-items: flex-end; gap: .4rem; text-align: right; }
.csnl-bnb-booking-status { padding: .28rem .65rem; border-radius: 99px; background: #e8f3ed; color: #285c49; font-size: .76rem; font-weight: 700; white-space: nowrap; }
.csnl-bnb-booking-countdown { color: #176a50; font-weight: 750; font-size: .95rem; white-space: nowrap; }
.csnl-bnb-booking-request-indicator { color: #8a621b; font-size: .8rem; font-weight: 650; }
.csnl-bnb-booking-open-label { color: #266b51; font-size: .84rem; font-weight: 700; white-space: nowrap; }
.csnl-bnb-booking-open-label::after { content: '⌄'; display: inline-block; margin-left: .4rem; font-size: 1.1rem; transition: transform .2s; }
.csnl-bnb-account-card[open] .csnl-bnb-booking-open-label::after { transform: rotate(180deg); }
.csnl-bnb-booking-details { padding: clamp(1rem, 3vw, 1.6rem); }
.csnl-bnb-booking-details > p:first-of-type { margin-top: 0; }
.csnl-bnb-request-list { display: grid; gap: .65rem; padding: 0 !important; list-style: none; }
.csnl-bnb-request-list > li { margin: 0; padding: .85rem 1rem; border: 1px solid #e0e8e2; border-radius: 10px; background: #fbfdfb; }
.csnl-bnb-request-heading { display: flex; justify-content: space-between; gap: .5rem 1rem; flex-wrap: wrap; }
.csnl-bnb-request-heading strong { color: #204c38; }
.csnl-bnb-request-heading span { color: #5f7265; font-size: .87rem; font-weight: 650; }
.csnl-bnb-request-date-flow { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: .5rem; margin-top: .65rem; padding: .65rem .75rem; border-radius: 8px; background: #eef5ef; font-size: .88rem; }
.csnl-bnb-request-date-flow > span:not(.csnl-bnb-request-arrow) { display: grid; gap: .1rem; }
.csnl-bnb-request-date-flow small { color: #63776b; font-size: .75rem; font-weight: 650; }
.csnl-bnb-request-arrow { color: #438d68; font-size: 1.25rem; }
@media (max-width: 700px) { .csnl-bnb-account-card > summary.csnl-bnb-booking-summary { grid-template-columns: 96px minmax(0, 1fr); gap: .4rem .9rem; min-height: 116px; padding-right: .85rem; } .csnl-bnb-account-photo { grid-row: 1 / span 2; width: 96px; height: 100%; min-height: 116px; } .csnl-bnb-booking-summary-main > strong { font-size: 1.08rem; } .csnl-bnb-booking-summary-dates { font-size: .88rem; } .csnl-bnb-booking-summary-side { grid-column: 2; align-items: flex-start; flex-direction: row; flex-wrap: wrap; gap: .25rem .6rem; text-align: left; padding-bottom: .6rem; } .csnl-bnb-booking-countdown { font-size: .82rem; } .csnl-bnb-booking-open-label { width: 100%; } }
@media (max-width: 460px) { .csnl-bnb-request-date-flow { grid-template-columns: 1fr; } .csnl-bnb-request-arrow { line-height: .8; transform: rotate(90deg); justify-self: start; } }

.csnl-bnb-date-quote { padding: 1rem; border: 1px solid #d7e6da; border-radius: 12px; background: #f8fbf8; }
.csnl-bnb-date-quote h4 { margin: 0 0 .35rem; font-size: 1.08rem; }
.csnl-bnb-date-quote-status { margin: .4rem 0; color: #607368; }
.csnl-bnb-date-rate-options { display: grid; gap: .55rem; }
.csnl-bnb-date-rate-choice { display: grid !important; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: .8rem !important; padding: .85rem; border: 1px solid #d5e3d9; border-radius: 10px; background: #fff; cursor: pointer; }
.csnl-bnb-date-rate-choice:has(input:checked) { border-color: #23775a; background: #edf7ef; box-shadow: inset 0 0 0 1px #23775a; }
.csnl-bnb-date-rate-choice input { margin: 0; accent-color: #176a50; }
.csnl-bnb-date-rate-choice > span { display: grid; gap: .1rem; }
.csnl-bnb-date-rate-choice small { color: #267455; font-weight: 700; }
.csnl-bnb-date-rate-conditions { color: #66776a; font-size: .82rem; }
.csnl-bnb-date-rate-choice > strong { white-space: nowrap; }
.csnl-bnb-date-quote-summary { display: flex; justify-content: space-between; gap: .5rem 1rem; flex-wrap: wrap; margin-top: .85rem; padding: .8rem; border-radius: 8px; background: #eaf3ec; }
.csnl-bnb-date-quote-summary[hidden] { display: none; }
.csnl-bnb-date-quote-summary .is-more { color: #865018; }
.csnl-bnb-date-quote-summary .is-less { color: #176a50; }
.csnl-bnb-date-quote-note { margin: .8rem 0 0; color: #5e7063; font-size: .86rem; line-height: 1.45; }
@media (max-width: 540px) { .csnl-bnb-date-rate-choice { grid-template-columns: auto minmax(0,1fr); } .csnl-bnb-date-rate-choice > strong { grid-column: 2; } }