/* Additions for PHP-only features. Uses the same tokens as style.css. */
/* Accessibility: readable eyebrow on the light process band, links distinguishable without colour. */
.process-light .eyebrow{color:#7a4f12}
.footer-bottom a{text-decoration:underline;text-underline-offset:2px}
.product-img{display:block}
.product-card h3 a:hover{color:var(--gold)}
.brand-logo{height:44px;width:auto}
.preview-bar{position:sticky;top:0;z-index:90;background:#5a3f1f;color:#fff0db;text-align:center;font-size:.82rem;padding:7px 12px}
.promo-strip{background:#29251e;border-bottom:1px solid var(--line)}
.promo-strip p{margin:0;padding:12px 0;text-align:center;font-size:.9rem;color:#fff0db}

/* Pricing tabs with daily tiers: scroll horizontally instead of squeezing */
.tabrow-wide{max-width:none;overflow-x:auto;scrollbar-width:thin}
.tabrow-wide button{flex:1 0 auto;white-space:nowrap}
.price-table tr.is-today td{background:rgba(244,199,139,.08)}
.today-tag{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:20px;background:var(--gold);color:#17120c;font-size:.68rem;font-weight:800;vertical-align:middle}

/* Product detail */
.pd-gallery{margin-bottom:26px}
.pd-main{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:13px;background:#161b19}
.pd-thumbs{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.pd-thumb{padding:0;border:2px solid transparent;border-radius:9px;background:none;overflow:hidden;width:86px;height:64px}
.pd-thumb img{width:100%;height:100%;object-fit:cover}
.pd-thumb.active,.pd-thumb:hover{border-color:var(--gold)}
.pd-actions{display:grid;gap:10px;margin:16px 0 12px}
.product-detail .asidebox .price{font-size:1.5rem;color:var(--gold);font-weight:800}
.product-detail .asidebox .price small{font-size:.78rem;color:var(--muted);font-weight:500}
.spec-table{min-width:0}
.spec-table th{width:38%;background:#1d221f;white-space:normal}
.article-copy .price-table-wrap{margin:0 0 18px}
.article-copy ol{padding-left:24px}

/* Article extras */
.toc{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px 22px;margin:0 0 26px}
.toc strong{display:block;color:var(--gold);font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px}
.toc ol{margin:0;padding-left:20px}
.toc li{margin:6px 0;font-size:.92rem}
.toc .toc-l3{margin-left:16px;list-style:circle}
.toc a:hover{color:var(--gold)}
.article-copy figure{margin:24px 0}
.article-copy figure img,.article-copy img{border-radius:11px;height:auto}
.article-copy figcaption{font-size:.84rem;color:var(--muted);margin-top:8px}
.article-copy blockquote{margin:22px 0;padding:14px 20px;border-left:3px solid var(--gold);background:#1a1f1c;border-radius:6px;color:#e7e2d8}
.table-wrap{overflow-x:auto;margin:0 0 18px;border:1px solid var(--line);border-radius:10px}
.table-wrap table{border-collapse:collapse;width:100%;min-width:480px}
.table-wrap th,.table-wrap td{padding:10px 14px;border-top:1px solid #343833;text-align:left;font-size:.92rem}
.table-wrap th{background:#242925;border-top:0}

/* Booking form */
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.form-alert{border-radius:9px;padding:13px 15px;margin-bottom:16px;font-size:.9rem;line-height:1.55}
.form-alert.success{background:#1f2b20;border:1px solid #4f7a4f;color:#dff3d8}
.form-alert.error{background:#2e1d1b;border:1px solid #8a4a40;color:#ffd9d2}
.field-error{color:#ffb4a6;font-size:.8rem;margin:6px 0 0}
.field [aria-invalid="true"]{border-color:#c0644f}
.map-embed{width:100%;min-height:260px;border:1px solid var(--line);border-radius:12px;margin-top:23px}

.pagination{display:flex;gap:8px;justify-content:center;margin-top:20px}
.pagination a,.pagination span{min-width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:8px;font-size:.88rem}
.pagination span{background:var(--gold);color:#17120c;border-color:var(--gold);font-weight:700}
.pagination a:hover{border-color:var(--gold);color:var(--gold)}

/* Page banners (Admin → Banner các trang). The photo sits behind the HTML hero copy. */
.page-hero.has-banner,.home-hero.has-banner{position:relative;isolation:isolate;overflow:hidden;background:#0c100f}
.banner-bg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;max-width:none;object-fit:cover;object-position:var(--banner-pos,50% 50%)}
.banner-shade{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:var(--banner-overlay,.7);background:linear-gradient(90deg,rgba(10,15,14,.97) 0%,rgba(10,15,14,.86) 42%,rgba(10,15,14,.35) 100%)}
.page-hero.has-banner .container{position:relative}
@media(max-width:850px){.home-hero.has-banner .hero-copy{padding-bottom:64px}}

/* Home "scenic_cta" background: section media_id (Admin → Trang & section / MCP update_homepage_section). */
.scenic-cta.has-bg{position:relative;isolation:isolate;overflow:hidden;background:#0c100f}
.scenic-shade{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(10,17,16,.94) 0%,rgba(10,17,16,.73) 58%,rgba(10,17,16,.42) 100%)}
@media(max-width:600px){.scenic-shade{background:linear-gradient(90deg,rgba(10,17,16,.9) 0%,rgba(10,17,16,.64) 100%)}}
@media(max-width:600px){.banner-bg{object-position:var(--banner-pos-m,50% 50%)}.banner-shade{background:linear-gradient(0deg,rgba(10,15,14,.97) 0%,rgba(10,15,14,.82) 55%,rgba(10,15,14,.45) 100%)}}