:root{
  --modern-bg:#f6f7fb;
  --modern-surface:#ffffff;
  --modern-surface-soft:#f8fafc;
  --modern-text:#000000;
  --modern-muted:#000000;
  --modern-line:#dfe5ee;
  --modern-line-strong:#cbd5e1;
  --modern-brand:#f6c400;
  --modern-brand-strong:#e5ad00;
  --modern-green:#18b981;
  --modern-blue:#2563eb;
  --modern-danger:#dc2626;
  --modern-shadow:0 20px 55px rgba(15,23,42,.10);
  --modern-shadow-soft:0 12px 30px rgba(15,23,42,.07);
  --modern-font:"Inter","Segoe UI",Roboto,Arial,sans-serif;
}

html,
body{
  background:var(--modern-bg) !important;
  background-image:none !important;
  color:var(--modern-text) !important;
  font-family:var(--modern-font) !important;
}

body::before,
body::after{
  background-image:none !important;
}

a{color:inherit}

.wrap,
.container{
  color:var(--modern-text) !important;
}

.topbar,
.card,
.box,
.cal,
.cal-wrap,
.res,
.kpi,
.coupon-box,
.info,
.pricebox,
.qr-box,
.promo-card,
.promo-feature,
.promo-testimonial,
.booking-panel{
  background:var(--modern-surface) !important;
  border-color:var(--modern-line) !important;
  color:var(--modern-text) !important;
  box-shadow:var(--modern-shadow-soft) !important;
  backdrop-filter:none !important;
}

.topbar{
  border-radius:18px !important;
}

.card,
.box,
.cal,
.cal-wrap,
.res,
.kpi,
.coupon-box,
.info,
.pricebox,
.qr-box,
.promo-feature,
.promo-testimonial{
  border:1px solid var(--modern-line) !important;
}

h1,h2,h3,h4,
.h1,
.brand,
.brand b,
.title,
.price,
.statusRight,
th,
td,
label,
.lbl,
.kv b,
.res .meta b{
  color:var(--modern-text) !important;
}

.muted,
.mini,
.sub,
.small,
.tagline,
.lbl,
.res .meta,
.resume .row span,
.kpi .t,
.qr-tip,
#qrStatus{
  color:var(--modern-muted) !important;
  opacity:1 !important;
}

.hr,
hr,
.section-title,
th,
td{
  border-color:var(--modern-line) !important;
}

.hr,
hr{
  background:var(--modern-line) !important;
}

table{
  color:var(--modern-text) !important;
}

th{
  background:var(--modern-surface-soft) !important;
}

tr:hover td{
  background:#fbfcff !important;
}

input,
textarea,
select,
.input,
.select{
  background:var(--modern-surface) !important;
  border:1px solid var(--modern-line-strong) !important;
  color:var(--modern-text) !important;
  box-shadow:none !important;
}

input::placeholder,
textarea::placeholder{
  color:#94a3b8 !important;
}

input:focus,
textarea:focus,
select:focus,
.input:focus,
.select:focus{
  border-color:rgba(246,196,0,.72) !important;
  box-shadow:0 0 0 4px rgba(246,196,0,.16) !important;
}

.chip,
.pill,
.badge{
  background:var(--modern-surface) !important;
  border:1px solid var(--modern-line) !important;
  color:var(--modern-text) !important;
  box-shadow:none !important;
}

.chip.on{
  background:#fff7d6 !important;
  border-color:#f4c430 !important;
  color:#1f2937 !important;
}

.btn,
button,
.btn-ghost,
.btn-primary,
.btn-ok,
.tab{
  border-radius:14px !important;
  font-family:var(--modern-font) !important;
}

.btn-primary,
button[type="submit"]{
  background:linear-gradient(180deg,var(--modern-brand),var(--modern-brand-strong)) !important;
  color:#111827 !important;
  box-shadow:0 16px 36px rgba(246,196,0,.24) !important;
}

.btn-ghost,
.tab.off,
.nav,
.qty-btn{
  background:var(--modern-surface) !important;
  border:1px solid var(--modern-line-strong) !important;
  color:var(--modern-text) !important;
}

.btn-ok{
  background:linear-gradient(180deg,#34d399,var(--modern-green)) !important;
  color:#062318 !important;
}

.erro,
.err,
.b-bad,
.pending{
  background:#fef2f2 !important;
  border-color:#fecaca !important;
  color:var(--modern-danger) !important;
}

.b-ok,
.paid{
  background:#ecfdf5 !important;
  border-color:#bbf7d0 !important;
  color:#047857 !important;
}

.b-warn,
.used{
  background:#fffbeb !important;
  border-color:#fde68a !important;
  color:#92400e !important;
}

.logo,
.brand::before{
  box-shadow:0 12px 28px rgba(246,196,0,.22) !important;
}

.foot{
  color:var(--modern-muted) !important;
}

.qr-overlay{
  background:rgba(15,23,42,.58) !important;
}

#qrReader{
  background:var(--modern-surface-soft) !important;
  border-color:var(--modern-line) !important;
}

.gallery img{
  border-color:var(--modern-line) !important;
  box-shadow:var(--modern-shadow-soft) !important;
}

@media (max-width:720px){
  .wrap,
  .container{
    padding-left:14px !important;
    padding-right:14px !important;
  }
}

/* Tema moderno claro com textos 100% pretos.
   Mantem cores de preenchimento dos botoes e estados, mas evita cinza/branco nos textos. */
html,
body,
body *,
button,
input,
textarea,
select,
option,
label,
small,
span,
p,
div,
strong,
b,
em,
li,
td,
th,
h1,
h2,
h3,
h4,
h5,
h6,
a{
  color:#000000 !important;
  text-shadow:none !important;
}

body,
.wrap,
.container,
.topbar,
.card,
.box,
.cal,
.cal-wrap,
.info-section,
.info,
.coupon-box,
.pricebox,
.qr-box,
.booking-panel,
.promo-card,
.promo-feature,
.promo-testimonial{
  background-color:#ffffff !important;
}

body{
  background:#f5f7fb !important;
}

.muted,
.mini,
.sub,
.small,
.tagline,
.lbl,
.helper,
.cal-dow,
.resume .row span,
.section-title,
.foot,
.slot small,
.qtylabel small{
  color:#000000 !important;
  opacity:1 !important;
}

.btn-primary,
button[type="submit"],
.btn-ok,
.tab:not(.off),
.chip.on,
.b-ok,
.paid,
.b-warn,
.used,
.erro,
.err,
.b-bad,
.pending{
  color:#000000 !important;
}

.cal-day,
.cal-day.on,
.cal-day.sel,
.cal-day.off,
.cal-day.disabled,
.cal-day.past,
.slot,
.slots button,
.nav,
.qty-btn,
.qtybtn,
.btn,
.btn-ghost,
.pill,
.chip,
.badge{
  color:#000000 !important;
}

input::placeholder,
textarea::placeholder{
  color:#000000 !important;
  opacity:.72 !important;
}

html:not(.sun) body,
html:not(.sun) body *,
html.sun body,
html.sun body *{
  color:#000000 !important;
  text-shadow:none !important;
}

html:not(.sun) .brand,
html:not(.sun) h1,
html:not(.sun) h2,
html:not(.sun) h3,
html:not(.sun) h4,
html:not(.sun) .title,
html:not(.sun) .cal-title,
html:not(.sun) .price,
html:not(.sun) .statusRight,
html:not(.sun) .resume .row b,
html:not(.sun) .tagline,
html:not(.sun) .muted,
html:not(.sun) .sub,
html:not(.sun) .lbl,
html:not(.sun) .mini,
html:not(.sun) .helper,
html:not(.sun) .resume .row span,
html:not(.sun) .cal-dow,
html:not(.sun) .foot,
html:not(.sun) .cal-day,
html:not(.sun) .cal-day.off,
html:not(.sun) .cal-day.past,
html:not(.sun) .cal-day.on,
html:not(.sun) .cal-day.sel,
html:not(.sun) .slot,
html:not(.sun) .slots .slot,
html:not(.sun) .slots button,
html:not(.sun) .qty-btn,
html:not(.sun) .qtybtn,
html:not(.sun) .btn-primary,
html:not(.sun) .btn-ghost,
html:not(.sun) .btn,
html:not(.sun) .nav,
html:not(.sun) .pill,
html:not(.sun) .chip,
html:not(.sun) input,
html:not(.sun) select,
html:not(.sun) textarea,
html:not(.sun) .select,
html:not(.sun) .input,
html:not(.sun) .qty-input,
html:not(.sun) .qtynum{
  color:#000000 !important;
  opacity:1 !important;
}

/* Responsivo mobile: prioriza leitura, toque e calendario sem estouro horizontal. */
@media (max-width:900px){
  .wrap,
  .container,
  .checkout-wrap{
    width:100% !important;
    max-width:100% !important;
    margin:0 auto 28px !important;
    padding:12px !important;
  }

  .cards,
  .checkout-grid,
  .pixFlex{
    grid-template-columns:1fr !important;
    display:grid !important;
    gap:14px !important;
  }

  .topbar{
    align-items:flex-start !important;
    border-radius:16px !important;
    flex-direction:column !important;
    gap:12px !important;
    padding:14px !important;
  }

  .pill,
  .chip,
  .badge{
    width:100% !important;
    justify-content:center !important;
    white-space:normal !important;
    text-align:center !important;
  }

  .card,
  .box,
  .info-section,
  .cal,
  .cal-wrap{
    width:100% !important;
    max-width:100% !important;
    border-radius:16px !important;
    padding:16px !important;
    overflow:hidden !important;
  }

  h1,
  h2{
    font-size:clamp(20px, 6vw, 26px) !important;
    line-height:1.15 !important;
  }

  h3{
    font-size:clamp(18px, 5vw, 22px) !important;
    line-height:1.2 !important;
  }

  .brand{
    font-size:clamp(16px, 4.8vw, 20px) !important;
    line-height:1.2 !important;
    align-items:flex-start !important;
  }

  .tagline,
  .sub,
  .mini,
  .lbl,
  .helper{
    font-size:14px !important;
    line-height:1.35 !important;
  }

  .select,
  .input,
  input,
  select,
  textarea,
  .qty-input,
  .qtynum{
    min-height:48px !important;
    width:100% !important;
    max-width:100% !important;
    font-size:16px !important;
    border-radius:12px !important;
  }

  .row,
  .qtysummary,
  .resumo-valor,
  .resumo-total{
    align-items:flex-start !important;
    flex-wrap:wrap !important;
  }

  .qty{
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  .qtyrow,
  .qty-step{
    width:100% !important;
    justify-content:space-between !important;
  }

  .qty-btn,
  .qtybtn,
  .nav,
  .btn,
  .btn-primary,
  .btn-ghost,
  button[type="submit"],
  .tab,
  .slot,
  .slots button{
    min-height:46px !important;
    touch-action:manipulation !important;
  }

  .btn-primary,
  button[type="submit"],
  .btn,
  .btn-ghost{
    width:100% !important;
    white-space:normal !important;
    line-height:1.2 !important;
  }

  .tabs,
  .pixActions,
  .coupon-row{
    grid-template-columns:1fr !important;
    flex-direction:column !important;
  }

  .cal{
    padding:10px !important;
  }

  .cal-head{
    gap:8px !important;
  }

  .title,
  .cal-title{
    flex:1 !important;
    min-width:0 !important;
    text-align:center !important;
    font-size:15px !important;
  }

  .dow,
  .cal-grid,
  #grid{
    display:grid !important;
    grid-template-columns:repeat(7, minmax(0, 1fr)) !important;
    gap:4px !important;
  }

  .dow span,
  .cal-dow span{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-width:0 !important;
    text-align:center !important;
    font-size:11px !important;
  }

  .cal-day{
    min-width:0 !important;
    width:100% !important;
    height:auto !important;
    min-height:44px !important;
    aspect-ratio:1 / .74 !important;
    border-radius:10px !important;
    font-size:15px !important;
    padding:0 !important;
  }

  .cal-day.on::after,
  .cal-day.sel::after{
    bottom:5px !important;
    width:18px !important;
    height:3px !important;
  }

  .slots{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
  }

  .slot,
  .slots button{
    width:100% !important;
    min-width:0 !important;
    align-items:center !important;
  }

  .price{
    font-size:clamp(26px, 8vw, 34px) !important;
    line-height:1.05 !important;
  }

  .gallery{
    grid-template-columns:1fr !important;
  }

  .gallery img,
  .pixQr{
    width:100% !important;
    height:auto !important;
  }
}

@media (max-width:420px){
  .wrap,
  .container,
  .checkout-wrap{
    padding:10px !important;
  }

  .card,
  .box,
  .info-section{
    padding:14px !important;
  }

  .cal{
    padding:8px !important;
  }

  .nav{
    width:42px !important;
    min-width:42px !important;
    padding:0 !important;
  }

  .cal-day{
    min-height:40px !important;
    font-size:14px !important;
    border-radius:9px !important;
  }

  .cal-dow{
    font-size:11px !important;
    padding:7px 0 !important;
  }
}
