/*
 * Taxi Lâm Đồng — CSS riêng cho các trang Directory (Tìm tài xế, Tuyến cố
 * định, Xe cho thuê, Xe tiện chuyến). Cũng nằm trong phạm vi ".tld-scope"
 * để không xung đột với theme, giống file tld-core.css.
 */

/* ---- hero dùng chung cho mọi archive ---- */
.tld-scope .hero{ padding:44px 0 30px; background:linear-gradient(180deg,#EAFBFC 0%, #FFFFFF 90%); text-align:center; }
.tld-scope .hero h1{ font-size:clamp(25px,3.8vw,38px); font-weight:800; margin:0 auto 12px; max-width:700px; }
.tld-scope .hero p.lead{ color:var(--muted); font-size:15px; max-width:580px; margin:0 auto 22px; }
.tld-scope .hero-actions{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* ---- benefit / trust card grid (4 cột) ----
 * --tld-cols: nơi gọi chỉ set biến này qua inline style, KHÔNG set thẳng
 * grid-template-columns nữa — để 2 @media bên dưới luôn ghi đè được đúng
 * trên mobile (inline "grid-template-columns:..." trực tiếp từng thắng mọi
 * @media do độ ưu tiên CSS, gây vỡ layout — xem class-tld-shortcodes-
 * region-drivers.php). */
.tld-scope .benefit-grid{ display:grid; grid-template-columns:repeat(var(--tld-cols,4),1fr); gap:14px; }
@media(max-width:860px){ .tld-scope .benefit-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .tld-scope .benefit-grid{ grid-template-columns:1fr; } }
.tld-scope .bcard{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:20px; text-align:center; box-shadow:var(--shadow-sm); }
.tld-scope .bcard .ico{ width:44px; height:44px; border-radius:13px; background:var(--bg-soft); display:flex; align-items:center; justify-content:center; font-size:20px; margin:0 auto 12px; }
.tld-scope .bcard h3{ font-size:14px; font-weight:700; margin-bottom:6px; }
.tld-scope .bcard p{ font-size:12.5px; color:var(--muted); }

/* ---- filter bar (Tìm tài xế) ---- */
.tld-scope .filter-bar{ background:#fff; border:1px solid var(--line); border-radius:20px; padding:22px; box-shadow:var(--shadow-sm); margin-bottom:24px; }
.tld-scope .filter-group{ margin-bottom:16px; }
.tld-scope .filter-group:last-child{ margin-bottom:0; }
.tld-scope .filter-lbl{ display:block; font-size:11.5px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; margin-bottom:9px; }
.tld-scope .filter-row{ display:flex; gap:8px; flex-wrap:wrap; }
.tld-scope .field-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.tld-scope .field label{ display:block; font-size:11px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; margin-bottom:7px; }
.tld-scope .field select{ width:100%; padding:11px 12px; border-radius:10px; border:1.5px solid var(--line); background:#fff; font-size:13.5px; color:var(--ink); }
.tld-scope .field select:focus{ outline:none; border-color:var(--cyan); }
@media(max-width:640px){ .tld-scope .field-row{ grid-template-columns:1fr; } }
.tld-scope .filter-foot{ display:flex; align-items:center; justify-content:space-between; margin-top:18px; padding-top:16px; border-top:1px solid var(--line); flex-wrap:wrap; gap:10px; }
.tld-scope .result-count{ font-size:13.5px; font-weight:600; }
.tld-scope .result-count strong{ color:var(--cyan-ink); }
.tld-scope .sort-row{ display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--muted); }
.tld-scope .sort-row select{ border:1.5px solid var(--line); border-radius:10px; padding:7px 10px; font-size:12.5px; color:var(--ink); background:#fff; }
.tld-scope .search-submit{ width:100%; padding:15px; font-size:15px; margin-top:6px; }
.tld-scope .pre-search-note{ text-align:center; padding:34px 20px; color:var(--muted); font-size:13.5px; background:var(--bg-soft); border-radius:16px; }
.tld-scope .pre-search-note strong{ color:var(--cyan-ink); }
.tld-scope .results-area{ display:none; }
.tld-scope .results-area.show{ display:block; }
.tld-scope .empty-state{ text-align:center; padding:40px 20px; color:var(--muted); font-size:13.5px; display:none; }
.tld-scope .see-more{ text-align:center; margin-top:22px; font-size:12.5px; color:var(--muted); }

/* ---- driver grid / driver card ----
 * Bố cục "thẻ hồ sơ" chuyên nghiệp kiểu poster: ảnh đại diện chiếm trọn
 * chiều rộng thẻ ở phía trên (to hơn hẳn avatar tròn nhỏ trước đây), tên +
 * khu vực đặt đè lên dải gradient tối phía dưới ảnh (dễ đọc trên mọi ảnh),
 * phần thân thẻ bên dưới giữ badge/đánh giá/nút hành động như cũ.
 */
.tld-scope .driver-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
@media(max-width:900px){ .tld-scope .driver-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .tld-scope .driver-grid{ grid-template-columns:1fr; } }
.tld-scope .driver-card{ background:#fff; border:1px solid var(--line); border-radius:20px; padding:0; overflow:hidden; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; transition:box-shadow .2s ease, transform .2s ease; }
.tld-scope .driver-card:hover{ box-shadow:0 16px 34px rgba(11,77,80,0.14); transform:translateY(-2px); }
.tld-scope .driver-card.featured{ border-color:var(--yellow); }
.tld-scope .dc-photo-link{ display:block; }
.tld-scope .dc-photo{ position:relative; height:230px; background:linear-gradient(135deg,#8CE9EC,var(--cyan)); overflow:hidden; }
.tld-scope .driver-card.featured .dc-photo{ background:linear-gradient(135deg,#FFE380,var(--yellow-deep)); }
.tld-scope .dc-photo-img{ width:100%; height:100%; object-fit:cover; display:block; }
/* Dưới 560px, .driver-grid chuyển về 1 cột (xem trên) — thẻ chiếm TRỌN
   chiều rộng màn hình, nhưng ảnh vẫn giữ nguyên chiều cao 230px như lúc còn
   xếp 2-3 cột, khiến ảnh trông nhỏ/dẹt so với bề ngang rộng hơn hẳn của thẻ.
   Tăng chiều cao ảnh trên di động để ảnh thật sự "lớn hơn", cân đối với bề
   ngang toàn màn hình thay vì bị bó hẹp như trên desktop. */
@media(max-width:560px){
	.tld-scope .dc-photo{ height:340px; }
	.tld-scope .dc-photo-fallback{ font-size:96px; }
}
/* Chữ trắng trên nền gradient xanh cyan nhạt chỉ đạt ~1.4:1 (rớt chuẩn WCAG
   AA, cần tối thiểu 4.5:1) — đổi sang màu chữ đậm (--ink), đạt ~8-12:1. */
.tld-scope .dc-photo-fallback{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:72px; font-weight:800; color:var(--ink); }
.tld-scope .dc-photo-scrim{ position:absolute; inset:auto 0 0 0; height:80%; background:linear-gradient(180deg, rgba(14,33,38,0) 0%, rgba(14,33,38,.15) 40%, rgba(14,33,38,.86) 100%); pointer-events:none; }
.tld-scope .dc-ribbon{ position:absolute; top:12px; right:12px; z-index:1; background:var(--yellow); color:var(--ink); font-size:10.5px; font-weight:800; padding:5px 11px; border-radius:20px; box-shadow:0 3px 10px rgba(0,0,0,.18); }
.tld-scope .dc-photo-info{ position:absolute; left:16px; right:16px; bottom:13px; z-index:1; }
.tld-scope .dc-name{ font-size:17px; font-weight:800; color:#fff; text-shadow:0 1px 3px rgba(0,0,0,.25); }
.tld-scope .dc-loc{ font-size:12px; color:rgba(255,255,255,.9); margin-top:2px; }
.tld-scope .dc-body{ padding:16px 18px 18px; display:flex; flex-direction:column; flex-grow:1; }
.tld-scope .badge-row{ display:flex; gap:5px; flex-wrap:wrap; margin-bottom:12px; }
.tld-scope .dc-stats{ display:flex; justify-content:space-between; font-size:12px; color:var(--muted); border-top:1px solid var(--line); padding-top:10px; margin-top:auto; margin-bottom:14px; }
.tld-scope .dc-stats .rating{ color:var(--yellow-deep); font-weight:700; }
.tld-scope .dc-actions{ display:flex; gap:8px; }
.tld-scope .dc-actions .btn{ flex:1; padding:9px; font-size:12px; }

/* ---- fallback CTA (dark band, dùng lại ở nhiều archive) ---- */
.tld-scope .fallback-cta{ background:linear-gradient(150deg,#0E2126,#173A3F); border-radius:24px; padding:32px; display:flex; align-items:center; justify-content:space-between; gap:22px; flex-wrap:wrap; color:#fff; }
.tld-scope .fallback-cta h3{ font-size:17px; font-weight:700; margin-bottom:6px; }
.tld-scope .fallback-cta p{ font-size:13px; color:#B7CBCD; }
.tld-scope .fallback-cta .actions{ display:flex; gap:10px; flex-wrap:wrap; }

/* ---- route grid (Tuyến cố định) ---- */
.tld-scope .route-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
@media(max-width:860px){ .tld-scope .route-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .tld-scope .route-grid{ grid-template-columns:1fr; } }
.tld-scope .route-card{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:18px; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; }
.tld-scope .route-card .tag-row{ display:flex; gap:5px; flex-wrap:wrap; margin-bottom:10px; }
.tld-scope .rtag{ font-size:10px; font-weight:700; padding:3px 9px; border-radius:20px; }
.tld-scope .rtag.from{ background:var(--bg-soft); color:var(--cyan-ink); }
.tld-scope .rtag.type-trong-tinh{ background:#F1F0FF; color:#5B4FE0; }
.tld-scope .rtag.type-lien-tinh{ background:#FFE9CE; color:#B4570A; }
.tld-scope .route-card .route-name{ font-size:14.5px; font-weight:700; margin-bottom:4px; }
.tld-scope .route-card .route-dist{ font-size:11.5px; color:var(--muted); margin-bottom:14px; }
.tld-scope .route-card .price-list{ margin-top:auto; border-top:1px solid var(--line); padding-top:12px; margin-bottom:12px; }
.tld-scope .price-row{ display:flex; justify-content:space-between; font-size:12.5px; margin-bottom:5px; }
.tld-scope .price-row span:last-child{ font-weight:700; color:var(--cyan-ink); }
.tld-scope .route-card .btn{ width:100%; padding:9px; font-size:12.5px; }

/* ---- vehicle grid (Xe cho thuê) ---- */
.tld-scope .vehicle-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
@media(max-width:900px){ .tld-scope .vehicle-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .tld-scope .vehicle-grid{ grid-template-columns:1fr; } }
.tld-scope .vehicle-card{ background:#fff; border:1px solid var(--line); border-radius:18px; overflow:hidden; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; }
.tld-scope .vehicle-thumb{ height:140px; background:linear-gradient(135deg,var(--bg-soft),#fff); display:flex; align-items:center; justify-content:center; font-size:40px; overflow:hidden; }
.tld-scope .vehicle-thumb img{ width:100%; height:100%; object-fit:cover; }
.tld-scope .vehicle-body{ padding:18px; display:flex; flex-direction:column; flex-grow:1; }
.tld-scope .vehicle-body h3{ font-size:14.5px; font-weight:700; margin-bottom:8px; }
.tld-scope .vehicle-specs{ font-size:11.5px; color:var(--muted); margin-bottom:12px; }
.tld-scope .vehicle-price{ margin-top:auto; border-top:1px solid var(--line); padding-top:12px; display:flex; justify-content:space-between; align-items:center; }
.tld-scope .vehicle-price .amt{ font-weight:800; color:var(--cyan-ink); font-size:16px; }

/* ---- trip grid (Xe tiện chuyến) ---- */
.tld-scope .trip-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
@media(max-width:900px){ .tld-scope .trip-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .tld-scope .trip-grid{ grid-template-columns:1fr; } }
.tld-scope .trip-card{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:18px; box-shadow:var(--shadow-sm); }
.tld-scope .trip-route{ font-size:14.5px; font-weight:700; margin-bottom:6px; }
.tld-scope .trip-time{ font-size:11.5px; color:var(--muted); margin-bottom:12px; }
.tld-scope .trip-price-row{ display:flex; align-items:baseline; gap:8px; margin-bottom:14px; }
.tld-scope .trip-price-old{ font-size:12px; color:var(--muted); text-decoration:line-through; }
.tld-scope .trip-price-new{ font-size:18px; font-weight:800; color:var(--cyan-ink); }
.tld-scope .trip-card .btn{ width:100%; padding:9px; font-size:12.5px; }

/* ---- single driver profile ----
 * Ảnh đại diện phóng to đáng kể (112px → tới 200px trên desktop) làm điểm
 * nhấn chính của thẻ hồ sơ, viền trắng dày + đổ bóng sâu hơn cho cảm giác
 * "thẻ hành nghề" chuyên nghiệp, kèm huy hiệu "✓ đã xác minh" nhỏ đè lên
 * góc dưới-phải ảnh (giống huy hiệu xác minh của các nền tảng lớn).
 */
.tld-scope .driver-profile-hero{ padding-top:36px; padding-bottom:8px; }
.tld-scope .profile-card{ background:linear-gradient(150deg,#fff,var(--bg-soft)); border:1px solid var(--line); border-radius:28px; padding:clamp(24px,3.4vw,40px); box-shadow:0 16px 44px rgba(11,77,80,0.10); }
.tld-scope .profile-card.is-featured{ border-color:var(--yellow); box-shadow:0 16px 44px rgba(214,158,0,0.16); }
.tld-scope .profile-head{ display:flex; gap:28px; align-items:center; flex-wrap:wrap; }
.tld-scope .profile-avatar-ring{ position:relative; flex-shrink:0; padding:7px; border-radius:50%; background:#fff; box-shadow:0 10px 28px rgba(11,77,80,0.16); }
.tld-scope .profile-avatar-ring.is-featured{ background:linear-gradient(135deg,var(--yellow),var(--yellow-deep)); }
.tld-scope .profile-avatar{ width:clamp(130px,15vw,200px); height:clamp(130px,15vw,200px); border-radius:50%; background:linear-gradient(135deg,#8CE9EC,var(--cyan)); color:var(--ink); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:clamp(46px,5.5vw,70px); overflow:hidden; }
.tld-scope .profile-avatar img{ width:100%; height:100%; object-fit:cover; }
.tld-scope .profile-verified-badge{ position:absolute; bottom:8px; right:8px; width:32px; height:32px; border-radius:50%; background:var(--cyan-deep); color:#fff; display:flex; align-items:center; justify-content:center; font-size:16px; font-weight:800; border:3px solid #fff; box-shadow:0 2px 8px rgba(0,0,0,.22); }
.tld-scope .profile-main{ flex:1; min-width:220px; }
.tld-scope .profile-name{ font-size:clamp(24px,3.2vw,33px); font-weight:800; margin-bottom:10px; }
.tld-scope .profile-badge-row{ margin-bottom:10px; }
.tld-scope .profile-loc{ font-size:13.5px; color:var(--muted); margin-bottom:16px; }
.tld-scope .profile-stats{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.tld-scope .pstat-sep{ width:1px; height:34px; background:var(--line); flex-shrink:0; }
.tld-scope .pstat .num{ font-size:19px; font-weight:800; color:var(--cyan-ink); display:flex; align-items:center; gap:6px; }
.tld-scope .pstat .lbl{ font-size:11px; color:var(--muted); }
.tld-scope .star-row{ color:var(--yellow-deep); font-size:14px; letter-spacing:1px; }
.tld-scope .profile-cta-inline{ flex-shrink:0; display:flex; flex-direction:column; gap:9px; }
.tld-scope .profile-cta-inline .btn-lg{ padding:14px 24px; font-size:15px; white-space:nowrap; }
.tld-scope .profile-body p{ font-size:14px; color:var(--ink); margin-bottom:14px; }
.tld-scope .profile-vehicle{ margin-top:22px; }
.tld-scope .profile-vehicle-title{ font-size:15px; font-weight:800; margin-bottom:10px; }
.tld-scope .profile-vehicle-img{ width:100%; max-width:480px; border-radius:16px; box-shadow:var(--shadow-sm); }
.tld-scope .profile-reviews-wrap{ margin-top:30px; }
@media (max-width:640px){
	.tld-scope .profile-head{ flex-direction:column; text-align:center; }
	.tld-scope .profile-main{ text-align:center; }
	.tld-scope .profile-badge-row,
	.tld-scope .profile-stats{ justify-content:center; }
	.tld-scope .profile-cta-inline{ display:none; }
}

/* ---- đánh giá thực (TLD_Reviews::render_section) ---- */
.tld-scope .tld-reviews{ background:#fff; border:1px solid var(--line); border-radius:20px; padding:26px; box-shadow:var(--shadow-sm); }
.tld-scope .tld-reviews-title{ font-size:19px; font-weight:800; margin-bottom:14px; }
.tld-scope .tld-reviews-summary{ display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.tld-scope .tld-reviews-avg{ font-size:26px; font-weight:800; color:var(--cyan-ink); }
.tld-scope .tld-reviews-count{ font-size:13px; color:var(--muted); }
.tld-scope .tld-reviews-empty{ font-size:13.5px; color:var(--muted); margin-bottom:18px; }
.tld-scope .tld-review-list{ display:flex; flex-direction:column; gap:14px; margin-bottom:20px; }
.tld-scope .tld-review-item{ border-top:1px solid var(--line); padding-top:14px; }
.tld-scope .tld-review-head{ display:flex; align-items:center; gap:10px; margin-bottom:6px; flex-wrap:wrap; }
.tld-scope .tld-review-body{ font-size:13.5px; color:var(--ink); margin-bottom:4px; }
.tld-scope .tld-review-date{ font-size:11.5px; color:var(--muted); }
.tld-scope .tld-review-form-wrap summary{ cursor:pointer; list-style:none; display:inline-flex; }
.tld-scope .tld-review-form-wrap summary::-webkit-details-marker{ display:none; }
.tld-scope .tld-review-form-wrap[open] summary{ margin-bottom:18px; }
.tld-scope .tld-star-pick{ display:flex; gap:14px; flex-wrap:wrap; }
.tld-scope .tld-star-opt{ display:flex; align-items:center; gap:5px; font-size:13px; font-weight:600; text-transform:none; letter-spacing:0; cursor:pointer; }
.tld-scope .tld-star-opt input{ accent-color:var(--cyan); }
.tld-scope .tld-review-share{ font-size:12px; color:var(--muted); margin-top:20px; padding-top:16px; border-top:1px solid var(--line); word-break:break-all; }

/* ---- form đăng ký tài xế [tld_driver_register] ---- */
.tld-scope .tld-dr-form{ background:#fff; border:1px solid var(--line); border-radius:20px; padding:26px; box-shadow:var(--shadow-sm); }
.tld-scope .tld-dr-row{ margin-bottom:16px; }
.tld-scope .tld-dr-row:last-of-type{ margin-bottom:0; }
.tld-scope .tld-dr-row label{ display:block; font-size:11.5px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; margin-bottom:8px; }
/* #E5484D chỉ đạt ~3.9:1 trên nền trắng (cần tối thiểu 4.5:1 cho chữ thường)
   — dùng lại đúng màu đỏ đậm hơn (#B3261E) đã dùng cho .tld-dr-error bên
   dưới (đã đạt ~6.5:1), để không thêm 1 sắc đỏ thứ 3 vào hệ thống. */
.tld-scope .tld-dr-row label .req{ color:#B3261E; }
.tld-scope .tld-dr-row input[type="text"],
.tld-scope .tld-dr-row input[type="tel"],
.tld-scope .tld-dr-row input[type="number"],
.tld-scope .tld-dr-row select,
.tld-scope .tld-dr-row textarea{ width:100%; padding:11px 12px; border-radius:10px; border:1.5px solid var(--line); background:#fff; font-size:13.5px; color:var(--ink); font-family:inherit; }
.tld-scope .tld-dr-row input:focus,
.tld-scope .tld-dr-row select:focus,
.tld-scope .tld-dr-row textarea:focus{ outline:none; border-color:var(--cyan); }
.tld-scope .tld-dr-row textarea{ resize:vertical; }
.tld-scope .tld-dr-row-2col{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media(max-width:520px){ .tld-scope .tld-dr-row-2col{ grid-template-columns:1fr; } }
.tld-scope .tld-dr-hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.tld-scope .tld-dr-form .btn{ width:100%; justify-content:center; padding:14px; font-size:15px; margin-top:4px; }
.tld-scope .tld-dr-note{ font-size:12px; color:var(--muted); text-align:center; margin-top:12px; }
.tld-scope .tld-dr-error{ background:#FCE8E6; color:#B3261E; border-radius:10px; padding:11px 14px; font-size:13px; margin-bottom:16px; }
.tld-scope .tld-dr-success{ background:#fff; border:1px solid var(--line); border-radius:20px; padding:28px; box-shadow:var(--shadow-sm); text-align:center; }
.tld-scope .tld-dr-success h3{ font-size:17px; font-weight:800; margin-bottom:10px; color:var(--cyan-ink); }
.tld-scope .tld-dr-success p{ font-size:13.5px; color:var(--muted); max-width:440px; margin:0 auto; }
