/*
Theme Name: San Bay Lien Khuong
Theme URI: https://sanbaylienkhuong.com
Author: sanbaylienkhuong.com
Author URI: https://sanbaylienkhuong.com
Description: Theme cho website dịch vụ xe đưa đón Sân bay Liên Khương (Đà Lạt). Dùng kèm plugin "San Bay Lien Khuong Toolkit" để quản lý hotline, bảng giá tuyến và gallery ảnh.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: lksb-theme
*/

:root{
  --forest:#1F5C4A;
  --forest-dark:#164436;
  --sunset:#E8833A;
  --sunset-dark:#C96A28;
  --cream:#FAF8F3;
  --sky:#EAF3F8;
  --ink:#1E2622;
  --ink-soft:#5B655F;
  --line:#E4E1D6;
  --danger:#B3261E;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'Be Vietnam Pro',sans-serif;background:var(--cream);color:var(--ink);line-height:1.6;}
a{text-decoration:none;color:inherit;}
img{max-width:100%;display:block;}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px;}
ul{list-style:none;}

/* Top bar */
.topbar{background:var(--forest-dark);color:#fff;font-size:13px;}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;padding:6px 24px;flex-wrap:wrap;gap:6px;}
.topbar a{opacity:.9;}

/* Header */
header.site-header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;}
header.site-header .wrap{display:flex;align-items:center;justify-content:space-between;padding:14px 24px;flex-wrap:wrap;gap:12px;}
.logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:19px;color:var(--forest);}
.logo .mark{width:36px;height:36px;border-radius:8px;background:var(--forest);color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;}
nav ul{display:flex;gap:26px;font-size:14.5px;font-weight:500;color:var(--ink);flex-wrap:wrap;}
nav a:hover{color:var(--forest);}
nav .current-menu-item > a,nav a.active{color:var(--forest);font-weight:700;}
.header-actions{display:flex;align-items:center;gap:14px;}
.hotline{font-size:14px;font-weight:600;color:var(--forest-dark);}
.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:38px;height:38px;background:none;border:1px solid var(--line);border-radius:8px;cursor:pointer;padding:0;flex-shrink:0;}
.nav-toggle span{display:block;width:18px;height:2px;margin:0 auto;background:var(--forest-dark);border-radius:2px;transition:transform .2s ease,opacity .2s ease;}
.nav-toggle.is-active span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.is-active span:nth-child(2){opacity:0;}
.nav-toggle.is-active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.btn{display:inline-block;padding:10px 20px;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;border:none;font-family:inherit;}
.btn-primary{background:var(--sunset);color:#fff;}
.btn-primary:hover{background:var(--sunset-dark);}
.btn-outline{border:1.5px solid var(--forest);color:var(--forest);background:transparent;}
.btn-outline:hover{background:var(--sky);}
.btn-block{width:100%;text-align:center;}

/* Status banner */
.status-banner{background:#FFF4E8;border-bottom:1px solid #F1D9B8;}
.status-banner .wrap{display:flex;align-items:center;gap:10px;padding:10px 24px;font-size:13.5px;color:#7A4A16;}
.status-dot{width:8px;height:8px;border-radius:50%;background:var(--sunset);flex-shrink:0;}

/* Hero */
.hero{background:linear-gradient(160deg,var(--forest) 0%,var(--forest-dark) 100%);color:#fff;padding:64px 0 80px;}
.hero h1{font-size:38px;font-weight:700;max-width:640px;line-height:1.25;margin-bottom:16px;color:#fff;}
.hero p{font-size:16.5px;color:#DCEAE3;max-width:560px;margin-bottom:32px;}

/* Page header (trang con) */
.page-header{background:linear-gradient(160deg,var(--forest) 0%,var(--forest-dark) 100%);color:#fff;padding:40px 0;}
.breadcrumb{font-size:13px;color:#BFE0CE;margin-bottom:10px;}
.breadcrumb a{opacity:.9;}
.page-header h1{font-size:28px;font-weight:700;color:#fff;}
.page-header p{color:#DCEAE3;margin-top:8px;max-width:600px;font-size:15px;}

section{padding:56px 0;}
.section-head{margin-bottom:32px;}
.eyebrow{font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--sunset-dark);margin-bottom:8px;}
h2{font-size:26px;font-weight:700;color:var(--forest-dark);}
h3{font-size:18px;font-weight:600;color:var(--forest-dark);}
.sub{color:var(--ink-soft);font-size:15px;margin-top:8px;max-width:620px;}

.api-note{background:var(--sky);border:1px solid #CFE0EA;border-radius:10px;padding:14px 16px;font-size:13.5px;color:#2A4A5C;margin-top:20px;}
.api-note code{background:#fff;padding:1px 6px;border-radius:4px;border:1px solid #CFE0EA;font-size:12.5px;}

/* Transfer / pricing */
.transfer{background:var(--sky);}
.vehicle-strip{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:16px;margin-top:28px;align-items:stretch;}
.vehicle-chip{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px;}
.vehicle-chip h4{font-size:16px;font-weight:600;color:var(--forest-dark);margin-bottom:6px;}
.vehicle-chip p{font-size:13.5px;color:var(--ink-soft);}
.vehicle-cta{background:var(--forest);color:#fff;border-radius:14px;padding:20px;display:flex;flex-direction:column;justify-content:center;gap:12px;}
.vehicle-cta p{font-size:13.5px;color:#DCEAE3;}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px;}
.price-card{background:#fff;border-radius:14px;border:1px solid var(--line);padding:24px;text-align:left;position:relative;}
.price-card.featured{border:2px solid var(--sunset);}
.price-card .tag{position:absolute;top:-12px;left:20px;background:var(--sunset);color:#fff;font-size:11.5px;font-weight:700;padding:4px 10px;border-radius:999px;}
.price-card h4{font-size:16px;font-weight:600;margin-bottom:4px;}
.price-card .price{font-size:24px;font-weight:700;color:var(--forest-dark);margin:10px 0;}
.price-card .price span{font-size:13px;font-weight:500;color:var(--ink-soft);}
.price-card ul{font-size:13.5px;color:var(--ink-soft);margin-bottom:18px;}
.price-card li{padding:4px 0;}
.price-card li::before{content:"✓ ";color:var(--forest);font-weight:700;}

/* Cards general */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:28px;}
.info-card{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;}
.info-thumb{height:130px;background:linear-gradient(135deg,#CFE3D9,#9FCBB0);display:flex;align-items:center;justify-content:center;color:var(--forest-dark);font-size:13px;font-weight:600;text-align:center;padding:0 12px;}
.info-body{padding:16px 18px;}
.info-date{font-size:12px;color:var(--ink-soft);margin-bottom:6px;}
.info-title{font-size:14.5px;font-weight:600;line-height:1.4;margin-bottom:6px;}
.info-desc{font-size:13.5px;color:var(--ink-soft);}

/* Two column layout */
.two-col{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:start;}
.map-box{background:#fff;border:1px solid var(--line);border-radius:14px;height:280px;display:flex;align-items:center;justify-content:center;color:var(--ink-soft);font-size:13.5px;text-align:center;padding:20px;}

/* Compare table */
.table-scroll{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:14px;}
.compare-table{width:100%;min-width:600px;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;font-size:14px;}
.compare-table th{background:var(--sky);text-align:left;padding:12px 16px;font-size:13px;color:var(--forest-dark);white-space:nowrap;}
.compare-table td{padding:12px 16px;border-top:1px solid var(--line);color:var(--ink-soft);white-space:nowrap;}
.compare-table td.td-hotline a{color:var(--forest);font-weight:600;}

/* Form (Contact Form 7 dùng chung style input) */
.form-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px;}
label{font-size:13px;font-weight:600;color:var(--ink);display:block;margin-bottom:6px;}
input,select,textarea{width:100%;padding:11px 14px;border:1px solid var(--line);border-radius:8px;font-family:inherit;font-size:14px;background:#fff;}
textarea{resize:vertical;min-height:90px;}
.form-note{font-size:12.5px;color:var(--ink-soft);margin-top:14px;}

/* Hero info */
.hero-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center;}
.hero-tag{display:inline-block;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);color:#DCEAE3;font-size:12px;font-weight:600;letter-spacing:.04em;padding:5px 12px;border-radius:999px;margin-bottom:14px;}
.hero p.lead{font-size:15.5px;color:#DCEAE3;max-width:560px;margin-bottom:20px;}
.fact-row{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px;}
.fact-chip{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:12.5px;font-weight:500;padding:6px 12px;border-radius:8px;}
.dist-label{color:#BFE0CE;font-size:12.5px;font-weight:600;margin-bottom:8px;}
.dist-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px;}
.dist-chip{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:8px;padding:7px 12px;font-size:12.5px;color:#fff;}
.dist-chip b{color:#FFD9AE;font-weight:700;}
.hero-cta-row{display:flex;flex-wrap:wrap;gap:12px;}
.btn-ghost-light{background:transparent;border:1.5px solid rgba(255,255,255,.5);color:#fff;}
.btn-ghost-light:hover{background:rgba(255,255,255,.1);}
.hero-photo .photo-box{height:340px;}
.link-btn{background:none;border:none;padding:0;color:#fff;text-decoration:underline;font-family:inherit;font-size:inherit;cursor:pointer;}

/* Modal album ảnh (plugin) */
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(15,25,20,.72);z-index:100;align-items:center;justify-content:center;padding:24px;}
.modal-overlay.open{display:flex;}
.modal-content{background:var(--cream);border-radius:16px;max-width:900px;width:100%;max-height:88vh;overflow-y:auto;padding:24px;}
.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
.modal-head h3{font-size:19px;font-weight:700;color:var(--forest-dark);}
.modal-close{background:var(--sky);border:none;width:32px;height:32px;border-radius:50%;font-size:15px;cursor:pointer;color:var(--forest-dark);}

/* Photo gallery */
.photo-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:14px;margin-top:28px;height:380px;}
.photo-box{position:relative;border-radius:14px;overflow:hidden;background:linear-gradient(135deg,#CFE3D9,#9FCBB0);display:flex;align-items:flex-end;color:var(--forest-dark);}
.photo-box.tall{grid-row:span 2;}
.photo-box img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2;}
.photo-caption{position:relative;z-index:3;padding:12px 14px;font-size:12.5px;font-weight:600;color:#fff;background:linear-gradient(0deg,rgba(22,68,54,.75),rgba(22,68,54,0) 70%);width:100%;}
.photo-fallback-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:16px;font-size:13px;font-weight:600;z-index:1;}
.photo-credit{font-size:12px;color:var(--ink-soft);margin-top:10px;}

/* Distance strip */
.distance-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-top:28px;}
.distance-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 10px;text-align:center;}
.distance-card .km{font-size:20px;font-weight:700;color:var(--forest-dark);}
.distance-card .place{font-size:12.5px;color:var(--ink-soft);margin-top:4px;}

/* Trust */
.trust{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;text-align:center;}
.trust .num{font-size:28px;font-weight:700;color:var(--forest-dark);}
.trust .lbl{font-size:13px;color:var(--ink-soft);margin-top:4px;}

/* Tài xế nổi bật theo khu vực */
.taixe-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px;}
.taixe-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px;text-align:center;}
.taixe-card.taixe-featured{border:2px solid var(--sunset);}
.taixe-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--sunset);color:#fff;font-size:11px;font-weight:700;padding:4px 12px;border-radius:999px;white-space:nowrap;}
.taixe-photo{width:88px;height:88px;border-radius:50%;background:linear-gradient(135deg,#CFE3D9,#9FCBB0);display:flex;align-items:center;justify-content:center;margin:0 auto 14px;overflow:hidden;font-size:34px;}
.taixe-photo img{width:100%;height:100%;object-fit:cover;}
.taixe-name{font-size:15.5px;font-weight:700;color:var(--forest-dark);}
.taixe-meta{font-size:12.5px;color:var(--ink-soft);margin-top:6px;line-height:1.5;}

/* FAQ */
.faq-item{border-bottom:1px solid var(--line);padding:16px 0;}
.faq-item h4{font-size:15px;font-weight:600;margin-bottom:6px;}
.faq-item p{font-size:13.5px;color:var(--ink-soft);}

/* Blog tabs */
.tab-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:28px;}
.tab-btn{background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 16px;font-size:13.5px;font-weight:600;color:var(--ink-soft);cursor:pointer;font-family:inherit;}
.tab-btn.active{background:var(--forest);border-color:var(--forest);color:#fff;}
.post-tag{display:inline-block;font-size:11.5px;font-weight:700;padding:3px 10px;border-radius:999px;margin-bottom:8px;}
.tag-tin-tuc{background:#FFF1DE;color:#B5670F;}
.tag-cam-nang-du-lich{background:#E4F3EA;color:#1F7A48;}
.tag-huong-dan-di-chuyen{background:#EAF3F8;color:#1D5C82;}

footer.site-footer{background:var(--forest-dark);color:#DCEAE3;padding:48px 0 24px;font-size:13.5px;}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:32px;margin-bottom:32px;}
footer h5{color:#fff;font-size:14px;font-weight:600;margin-bottom:14px;}
footer li{padding:5px 0;opacity:.85;}
.foot-bottom{border-top:1px solid rgba(255,255,255,.15);padding-top:18px;opacity:.7;font-size:12.5px;}

.mobile-cta{display:none;}

@media(max-width:860px){
  .price-grid,.card-grid,.foot-grid,.two-col,.hero-grid,.vehicle-strip,.taixe-grid{grid-template-columns:1fr;}
  .trust{grid-template-columns:repeat(2,1fr);}
  .distance-grid{grid-template-columns:repeat(3,1fr);}
  .photo-grid{grid-template-columns:1fr 1fr;grid-template-rows:180px 180px 180px;height:auto;}
  .photo-box.tall{grid-row:span 1;}
  .hero-photo .photo-box{height:220px;}
  .hero h1{font-size:28px;}

  /* Menu di động: ẩn menu mặc định, hiện qua nút hamburger */
  header.site-header .wrap{flex-wrap:wrap;}
  .nav-toggle{display:flex;order:2;}
  .logo{order:1;}
  .header-actions{display:none;}
  nav{display:none;order:3;flex-basis:100%;width:100%;}
  nav.nav-open{display:block;}
  nav ul{flex-direction:column;gap:0;padding:10px 0 16px;}
  nav ul li{width:100%;}
  nav ul li a{display:block;padding:11px 4px;border-bottom:1px solid var(--line);}

  .mobile-cta{display:flex;position:sticky;bottom:0;background:#fff;border-top:1px solid var(--line);padding:12px 16px;gap:10px;z-index:30;}
  .mobile-cta .btn{flex:1;text-align:center;}

  /* Bảng giá/hotline → card xếp dọc, hotline hiện ngay thành nút bấm, không cần cuộn ngang để thấy */
  .table-scroll{overflow-x:visible;}
  .compare-table{min-width:0;width:100%;border:none;background:transparent;border-radius:0;}
  .compare-table,.compare-table tr,.compare-table td{display:block;width:100%;}
  .compare-table tr:first-child{display:none;} /* hàng tiêu đề (th) */
  .compare-table tr{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:10px;}
  .compare-table td{padding:5px 0;border-top:none;white-space:normal;display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13.5px;}
  .compare-table td::before{content:attr(data-label);font-weight:600;color:var(--ink-soft);font-size:11.5px;flex-shrink:0;}
  .compare-table td.td-hotline{margin-top:8px;padding-top:10px;border-top:1px dashed var(--line);}
  .compare-table td.td-hotline::before{display:none;}
  .compare-table td.td-hotline a{display:block;width:100%;text-align:center;background:var(--forest);color:#fff !important;padding:11px;border-radius:8px;font-weight:700;}
}

@media(max-width:480px){
  .distance-grid{grid-template-columns:repeat(2,1fr);}
  .fact-row,.dist-row,.hero-cta-row{gap:8px;}
  .hero h1{font-size:24px;}
  section{padding:40px 0;}
  .wrap{padding:0 16px;}
}