/* Carpe Diem — skin for the Cloudbeds Booking Engine Plus (hotels.cloudbeds.com/…/tiPZk7)
 *
 * Install once: Cloudbeds > Settings > Booking Engine > Customize > Custom Meta Tags, add
 *   <link rel="stylesheet" href="https://os.boutiquehotel-paraty.com/brand/cloudbeds-engine.css?v=1">
 * (saving needs two-factor). After that, changes to THIS file go live on deploy; bump ?v= to
 * beat the browser cache.
 *
 * Hooks: only Cloudbeds' stable `cb-*` / `chakra-*` classes, ids and data-testid attributes.
 * Their `d-xxxxxx` classes are regenerated on every release and must never be used here.
 * Colours match the preview site: green #445542, clay #A6634B (white text 4.66:1), ink #16140F.
 */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500&family=Karla:wght@400;500;700&display=swap');

:root {
  --cd-ink: #16140f; --cd-body: #554c41; --cd-ground: #faf7f1; --cd-sand: #f3eee3;
  --cd-line: #e6ded1; --cd-clay: #a6634b; --cd-clay-d: #8a5140; --cd-green: #445542;
  --cd-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --cd-sans: 'Karla', system-ui, -apple-system, sans-serif;
}

/* page + type */
body, #cb-bookingengine { background: var(--cd-ground) !important; }
body, button, input, select, textarea,
.chakra-text, .chakra-button, .cb-text, .chakra-accordion__button { font-family: var(--cd-sans) !important; }

/* header */
.cb-header { background: var(--cd-green) !important; }
.cb-property-name { font-family: var(--cd-display) !important; font-size: 21px !important; font-weight: 500 !important; letter-spacing: .01em; color: #fff !important; }
[data-testid="header-search-panel-promocode-button"],
[data-testid="language-selector"], [data-testid="currency-selector"] { color: #fff !important; }
[data-testid="header-search-panel-promocode-button"],
[data-testid="header-search-panel-filters"] { border-color: rgba(255,255,255,.6) !important; }
[data-testid="header-search-panel-filters"] { color: #fff !important; }

/* cards */
.cb-card, .cb-shopping-cart { border: 1px solid var(--cd-line) !important; border-radius: 3px !important; box-shadow: none !important; }
.cb-card { background: #fff !important; }
h3.cb-title-text { font-family: var(--cd-display) !important; font-weight: 500 !important; font-size: 26px !important; line-height: 1.15 !important; color: var(--cd-ink) !important; }
.cb-view-details-button { color: var(--cd-clay-d) !important; text-decoration: underline !important; text-underline-offset: 3px; font-weight: 700 !important; }
.cb-only-x-left { background: var(--cd-sand) !important; color: var(--cd-clay-d) !important; border-radius: 3px !important; font-weight: 700 !important; text-transform: none !important; }

/* rates: plan name, struck-through standard price, price, Add button */
.cb-rate-plan-title-text { font-family: var(--cd-sans) !important; font-weight: 700 !important; }
.cb-rate-plan-price { font-family: var(--cd-display) !important; font-size: 28px !important; font-weight: 400 !important; color: var(--cd-ink) !important; }
.cb-rate-plan p.cb-text:has(+ .cb-rate-plan-price) { color: var(--cd-body) !important; font-size: 15px !important; }
.cb-select-button { background: var(--cd-clay) !important; color: #fff !important; border-radius: 3px !important; font-weight: 700 !important; min-height: 44px !important; padding: 0 26px !important; }
.cb-select-button .cb-text { color: #fff !important; }
.cb-select-button:hover { background: var(--cd-clay-d) !important; }

/* "View offers" bar and "more options" toggle */
.chakra-accordion__button { background: var(--cd-sand) !important; color: var(--cd-clay-d) !important; font-weight: 700 !important; border-top: 1px solid var(--cd-line) !important; }
[data-testid="discover-more-options-button"] { background: transparent !important; color: var(--cd-ink) !important; border: 1px solid var(--cd-ink) !important; border-radius: 3px !important; }

/* Cloudbeds "Rate Check" / Best Price Guarantee pill - recoloured only. The box lists our own
 * per-OTA channel prices (Cloudbeds add-ons on the base rate), before the OTAs' own discounts.
 * To hide it: [data-testid="rate-checker-open-toggle"] { display: none !important; } */
[data-testid="rate-checker-open-toggle"] { background: var(--cd-green) !important; border-radius: 3px !important; font-weight: 700 !important; }

:focus-visible { outline: 2px solid var(--cd-clay) !important; outline-offset: 2px !important; }

@media (max-width: 600px) {
  .cb-property-name { font-size: 17px !important; line-height: 1.2 !important; }
  h3.cb-title-text { font-size: 23px !important; }
}