/* =========================================================
   BESTAY — SITE-WIDE STYLES (Header/Nav, Base Buttons, Pages)
   Keep home/hero-specific styles in style-home.css
   ========================================================= */

/* ======= Global Header / Navigation ======= */
.bestay-header{
  position:sticky; top:0; z-index:100;
  background:#16453A; color:#fff;
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 1px 0 rgba(255,255,255,.06);
}
.bestay-header-inner{
  max-width:1200px; margin:0 auto; padding:12px 20px;
  display:flex; align-items:center; justify-content:space-between;
}
.bestay-logo{display:flex; align-items:center; gap:10px; text-decoration:none; color:#fff; font-weight:800}
.bestay-logo-mark{display:grid; place-items:center; width:28px; height:28px; border-radius:8px; background:#1F4A3C}
.bestay-logo-text{font-size:18px}

/* Desktop nav */
.bestay-nav{display:block; transition:all .2s ease}
.bestay-menu{display:flex; gap:22px; list-style:none; margin:0; padding:0}
.bestay-menu a{color:#fff; text-decoration:none; font-weight:600; opacity:.95}
.bestay-menu a:hover{opacity:1; text-decoration:underline}

/* Primary buttons always white text */
.bestay-btn-primary,
.bestay-btn-primary:link,
.bestay-btn-primary:visited,
.wp-element-button,
.wp-element-button:link,
.wp-element-button:visited {
  background:#1F4A3C !important;
  color:#FFFFFF !important;
  font-weight:700;
  border-radius:12px;
}
.bestay-btn-primary * ,
.wp-element-button * { color:inherit !important; }


/* Mobile nav */
.bestay-nav-toggle{
  display:none; background:transparent; border:0; color:#fff; font-size:22px; line-height:1;
}
.bestay-nav-toggle .sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
@media (max-width:900px){
  .bestay-nav-toggle{display:block}
  .bestay-nav{
    position:absolute; top:56px; left:0; right:0;
    background:#16453A; border-bottom:1px solid rgba(255,255,255,.1);
    display:none;
  }
  .bestay-nav.open{display:block}
  .bestay-menu{flex-direction:column; padding:12px 20px; gap:12px}
}

/* Smooth anchor offset for sticky header */
:target{scroll-margin-top:80px}

/* ======= Base Buttons (site-wide) ======= */
/* Keep primary brand button green; hero-specific white variant is scoped in style-home.css */
.bestay-btn-primary,
.bestay-btn-primary:link,
.bestay-btn-primary:visited{
  background:#1F4A3C; color:#fff;
  border-radius:12px; padding:12px 20px; text-decoration:none; font-weight:700;
  display:inline-flex; align-items:center; gap:8px;
  box-shadow:0 2px 8px rgba(31,74,60,.15);
}
.bestay-btn-primary:hover{background:#16453A}
.bestay-btn-ghost{
  border:2px solid rgba(31,74,60,.25); color:#1F4A3C;
  border-radius:12px; padding:10px 18px; text-decoration:none; font-weight:700;
}
.bestay-btn-ghost:hover{background:rgba(31,74,60,.06)}
.bestay-btn-primary *{color:inherit} /* ensure inner spans/icons inherit */

/* ======= Host Page (page template) ======= */
.bestay-host-hero{position:relative; background:#F6F8F7}
.bestay-host-hero-media{position:absolute; inset:0; z-index:0}
.bestay-host-hero-media img{width:100%; height:100%; object-fit:cover; opacity:.28}
.bestay-host-hero-gradient{
  position:absolute; inset:0;
  background:
    radial-gradient(1100px 460px at 18% 18%, rgba(22,69,58,.22), transparent 60%),
    linear-gradient(135deg, rgba(31,74,60,.18) 0%, rgba(22,69,58,.10) 45%, rgba(22,69,58,0) 100%);
  opacity:1;
}
.bestay-host-hero-inner{
  position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:96px 20px 64px; text-align:left;
}
.bestay-host-hero-inner .bestay-section-label{
  display:inline-block; background:rgba(31,74,60,.1); color:#1F4A3C;
  padding:6px 12px; border-radius:999px; font-weight:700;
}
.bestay-host-hero-inner h1{color:#1F4A3C; font-size:clamp(32px,5vw,48px); margin:10px 0}
.bestay-host-hero-inner p{color:#374151; max-width:760px; margin:0 0 8px}
.bestay-host-hero-ctas{display:flex; gap:14px; margin-top:18px; flex-wrap:wrap}

.bestay-host.bestay-host--page{padding:80px 0; background:#fff}
.bestay-host-grid{
  display:grid; grid-template-columns:1.4fr .8fr; gap:28px;
  max-width:1200px; margin:0 auto; padding:0 20px;
}
@media (max-width:960px){.bestay-host-grid{grid-template-columns:1fr}}

.bestay-host-title{color:#1F4A3C; margin:0 0 8px}
.bestay-host-subtitle{color:#1F4A3C; margin:22px 0 8px}
.bestay-host-copy p,.bestay-host-copy li{color:#374151; font-size:16px; line-height:1.6}
.bestay-host-list,.bestay-host-checks{margin:0 0 10px 18px}
.bestay-host-checks li::marker{content:"✔ "; color:#1F4A3C; font-weight:700}
.bestay-host-ctas{display:flex; gap:12px; margin-top:10px}

.bestay-host-card{position:sticky; top:88px; height:fit-content}
.bestay-host-card-inner{
  background:#F8F9F8; border:1px solid #E5E7EB; border-radius:16px; padding:20px;
  box-shadow:0 6px 18px rgba(31,74,60,.08);
}
.bestay-host-kpis{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:12px 0 8px}
.bestay-host-kpis strong{display:block; color:#1F4A3C; font-size:20px}
.bestay-pricing-card{margin-top:14px; padding:14px; border-radius:12px; background:#fff; border:1px dashed #D1D5DB}

/* Steps */
.bestay-steps{padding:70px 0; background:#F6F8F7}
.bestay-steps .bestay-container{max-width:1200px; padding:0 20px; margin:0 auto}
.bestay-steps-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; counter-reset:step; margin:0; padding:0}
.bestay-steps-grid li{list-style:none; background:#fff; border:1px solid #E5E7EB; border-radius:14px; padding:14px}
.bestay-steps-grid strong{color:#1F4A3C; display:block; margin-bottom:4px}

/* FAQ */
.bestay-faq{padding:70px 0; background:#fff}
.bestay-faq .bestay-container{max-width:1200px; padding:0 20px; margin:0 auto}
.bestay-faq-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px}
.bestay-faq-item{background:#F9FAF9; border:1px solid #E5E7EB; border-radius:14px; padding:16px}
.bestay-faq-cta{text-align:center; margin-top:16px}

/* ======= Contact Page ======= */
.bestay-contact-section{padding:60px 0; background:#fff}
.bestay-contact-section .bestay-container{max-width:1200px; padding:0 20px; margin:0 auto}
.bestay-contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:28px; align-items:start}
@media (max-width:960px){.bestay-contact-grid{grid-template-columns:1fr}}

.bestay-contact-title{color:#1F4A3C; margin:0 0 8px}
.bestay-contact-subtitle{color:#4B5563; margin:0 0 14px}
.bestay-contact-methods{display:grid; gap:10px; margin-top:8px}
.bestay-contact-item{
  display:flex; gap:10px; align-items:center; padding:10px;
  border:1px solid #E5E7EB; border-radius:12px; text-decoration:none; color:#1F2937; background:#F9FAF9;
  transition:background .2s, box-shadow .2s;
}
.bestay-contact-item:hover{background:#FFFFFF; box-shadow:0 6px 18px rgba(31,74,60,.06)}
.bestay-contact-icon{font-size:18px}

.bestay-simple-form .bestay-form-group{margin-bottom:10px}
.bestay-simple-form input,.bestay-simple-form textarea,.bestay-simple-form select{
  width:100%; padding:12px; border:1px solid #D1D5DB; border-radius:10px; background:#fff;
}
.bestay-form-submit{background:#1F4A3C; color:#fff; border:0; padding:12px 18px; border-radius:10px; font-weight:700}

.page-template-page-contact .bestay-contact-section { padding: 96px 0 72px; }
.page-template-page-contact .bestay-contact-grid {
  grid-template-columns: 1.05fr 1fr; gap: 32px; align-items: start;
}
.page-template-page-contact .bestay-contact-item {
  background:#FFF; border:1px solid #E5E7EB; box-shadow:0 6px 18px rgba(31,74,60,.06);
}
.page-template-page-contact .bestay-form-submit {
  background:#1F4A3C !important; color:#fff !important;
}
@media (max-width:960px){
  .page-template-page-contact .bestay-contact-grid { grid-template-columns:1fr; }
}


.page-template-page-list-with-us .bestay-host-hero {
  background: radial-gradient(900px 400px at 15% 10%, rgba(255,255,255,.8), transparent 60%),
              linear-gradient(135deg, #1F4A3C 0%, #0E6E57 60%, #0B5B47 100%);
}
.page-template-page-list-with-us .bestay-host-hero-media img { opacity:.15; }
.page-template-page-list-with-us .bestay-host-hero-gradient { opacity:0; }

.bestay-hero { background: linear-gradient(135deg, #16453A 0%, #0E6E57 70%); }

/* =========================
   Bestay — Booking Calendar & Form (clean)
   ========================= */

/* ---- Base tokens & fallbacks ---- */
#bestay-booking{
  --border: var(--border, #e3e7e5);
  --surface: var(--surface, #f7f8f7);
  --ink-strong: #1F4A3C;
  --ink-muted: #6b7a74;
  --field-h: 46px;
  --radius: 12px;
  --gap-col: 18px;
  --gap-row: 18px;

  background:#fff;
  border-radius:16px;
  box-shadow:0 8px 24px rgba(0,0,0,.04);
}

/* =========================
   CALENDAR
   ========================= */
.bestay-range__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.bestay-range__nav{background:var(--ink-strong);color:#fff;border:0;border-radius:8px;padding:8px 12px;cursor:pointer}
.bestay-range__months{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(260px,1fr))}
@media (max-width:720px){.bestay-range__months{grid-template-columns:1fr}}

.bestay-month{border:1px solid var(--border);border-radius:12px;padding:12px;background:var(--surface)}
.bestay-month__title{font-weight:600;margin-bottom:8px;text-align:center}
.bestay-week{display:grid;grid-template-columns:repeat(7,1fr);font-size:12px;color:var(--ink-muted)}
.bestay-days{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-top:6px}

.bestay-day{position:relative;height:36px;line-height:36px;text-align:center;border-radius:10px;cursor:pointer;user-select:none}
.bestay-day.is-empty{visibility:hidden}
.bestay-day.is-disabled{opacity:.35;cursor:not-allowed}
.bestay-day.is-selected{background:var(--ink-strong);color:#fff}
.bestay-day.is-inrange{background:rgba(31,74,60,.12)}
.bestay-day.is-start::after,.bestay-day.is-end::after{content:"";position:absolute;inset:0;border:2px solid var(--ink-strong);border-radius:10px;pointer-events:none}
.bestay-day.is-checkout-disabled{opacity:.35;cursor:not-allowed}
.bestay-price{position:absolute;bottom:-14px;left:50%;transform:translateX(-50%);font-size:10px;color:var(--ink-muted)}
.bestay-range__hint{margin-top:10px;color:var(--ink-muted)}

/* =========================
   FORM LAYOUT
   ========================= */
.bestay-form.is-hidden{display:none}
.bestay-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:var(--gap-col);
  row-gap:var(--gap-row);
}

/* Mobile stack */
@media (max-width:768px){
  .bestay-grid{grid-template-columns:1fr}
}

/* Utility wrappers (use these in markup) */
.bestay-grid .compact-pair{ margin-top:-8px; } /* pull paired rows a bit closer */
.bestay-grid .full-width{ grid-column:1/-1; }

/* Labels */
.bestay-label{
  display:block;
  margin:0 0 6px 0;
  font-weight:600;
  color:color-mix(in srgb, var(--ink-strong) 70%, #0000);
}

/* Inputs (shared) */
.bestay-input,
.bestay-grid input:not([type="checkbox"]),
.bestay-grid select,
.bestay-grid textarea{
  width:100%;
  height:var(--field-h);
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:#fff;
  box-sizing:border-box;
  outline:none;
  box-shadow:none;
  font:inherit;
}
.bestay-input[readonly]{background:#F5F7F6; color:#2f3b38; cursor:default}

/* Textarea */
.bestay-grid textarea{
  height:auto;
  min-height:110px;
  resize:vertical;
}

/* Focus ring (consistent) */
.bestay-grid input:not([type="checkbox"]):focus,
.bestay-grid select:focus,
.bestay-grid textarea:focus,
.bestay-datepill:focus-within,
.bestay-phone:focus-within{
  border-color:var(--ink-strong);
  box-shadow:0 0 0 3px rgba(31,74,60,.08);
}

/* Date pills (visible UI for check-in/out) */
.bestay-datepill{
  display:flex;align-items:center;gap:8px;
  height:var(--field-h);
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:#F5F7F6;
  font-weight:600;
}
.bestay-datepill .icon{font-size:14px;line-height:1}
.bestay-datepill small{font-weight:500;opacity:.75}

/* Nights chip */
.bestay-chip{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 10px;border-radius:999px;background:#E7F1ED;border:1px solid #D4E7DF;font-weight:700
}

/* Phone input group (no inner seams) */
.bestay-phone{
  display:flex;align-items:stretch;overflow:hidden;
  height:var(--field-h);
  border:1px solid var(--border); border-radius:var(--radius); background:#fff;
}
.bestay-phone select{
  width:120px; min-width:110px;
  border:0; border-right:1px solid var(--border);
  background:#F5F7F6; padding:0 10px; height:100%; appearance:none;
}
.bestay-phone input{
  border:0; flex:1 1 auto; padding:0 12px; height:100%;
}
.bestay-help{margin-top:6px;font-size:.9em;color:var(--ink-muted)}

/* Total row */
.bestay-total{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px;border:1px solid var(--border);border-radius:var(--radius);background:#fff
}

/* Status text */
#bestay-alert{min-height:1.25rem;color:var(--ink-muted)}
#bestay-alert.error{color:#b00020!important}
#bestay-alert.ok{color:var(--ink-strong)!important}
