/* Khaosokflow Tour Details — shared frontend + Summernote WYSIWYG */
.tour-detail-content {
  --td-green:#3C7557; --td-deep:#0F2B0C; --td-gold:#C4B594; --td-cream:#F7F5EF;
  --td-soft:#EEF3EF; --td-line:rgba(60,117,87,.20); --td-text:#26382d;
  box-sizing:border-box; width:100%; color:var(--td-text); font-family:'Kanit',sans-serif;
  font-size:16px; font-weight:300; line-height:1.8;
}
.tour-detail-content *, .tour-detail-content *::before, .tour-detail-content *::after { box-sizing:border-box; }
.tour-detail-content > :first-child { margin-top:0!important; }
.tour-detail-content > :last-child { margin-bottom:0!important; }
.tour-detail-content h1,.tour-detail-content h2,.tour-detail-content h3,.tour-detail-content h4 { font-family:'Kanit',sans-serif; line-height:1.3; }
.tour-detail-content h2 { margin:0 0 22px; color:var(--td-deep); font-size:32px; font-weight:400; }
.tour-detail-content h3 { margin:0 0 15px; color:var(--td-green); font-size:23px; font-weight:500; }
.tour-detail-content h4 { margin:0 0 10px; color:var(--td-deep); font-size:18px; font-weight:500; }
.tour-detail-content p { margin:0 0 16px; }
.tour-detail-content ul,.tour-detail-content ol { margin:10px 0 0; padding-left:24px; }
.tour-detail-content li { margin:6px 0; }
.tour-detail-content .tour-section { margin:0 0 46px; }
.tour-detail-content .tour-lead { max-width:980px; color:#344a3c; font-size:18px; line-height:1.85; }
.tour-detail-content .tour-kicker { display:inline-block; margin:0 0 9px; color:var(--td-gold); font-size:12px; font-weight:500; letter-spacing:.13em; text-transform:uppercase; }
.tour-detail-content .tour-highlight { margin:18px 0 0; padding:20px 24px; border:1px solid rgba(196,181,148,.48); border-left:4px solid var(--td-gold); border-radius:0 14px 14px 0; background:#FBF9F4; color:var(--td-deep); }
.tour-detail-content .tour-facts { display:flex; flex-wrap:wrap; gap:9px; margin:18px 0 0; }
.tour-detail-content .tour-fact { display:inline-flex; align-items:center; min-height:34px; padding:6px 13px; border:1px solid var(--td-line); border-radius:999px; background:#fff; color:var(--td-green); font-size:13px; font-weight:400; }
.tour-detail-content .tour-grid { display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:18px!important; }
.tour-detail-content .tour-card { display:block!important; min-height:0!important; padding:24px!important; overflow:visible!important; border:1px solid var(--td-line)!important; border-radius:16px!important; background:#fff!important; color:var(--td-text)!important; box-shadow:0 10px 28px rgba(15,43,12,.055)!important; }
.tour-detail-content .tour-card h3 { color:var(--td-green)!important; }
.tour-detail-content .tour-card strong { color:var(--td-deep)!important; }
.tour-detail-content .tour-list { list-style:none!important; margin:0!important; padding:0!important; }
.tour-detail-content .tour-list li { position:relative; margin:0!important; padding:7px 0 7px 27px!important; }
.tour-detail-content .tour-list li::before { content:'✓'; position:absolute; left:0; top:7px; color:var(--td-green); font-weight:700; }
.tour-detail-content .tour-timeline { list-style:none!important; margin:0!important; padding:4px 0 0 8px!important; }
.tour-detail-content .tour-timeline li { display:grid!important; grid-template-columns:115px minmax(0,1fr)!important; gap:22px!important; position:relative; margin:0!important; padding:0 0 22px 28px!important; border-left:1px solid var(--td-line)!important; }
.tour-detail-content .tour-timeline li:last-child { padding-bottom:0!important; }
.tour-detail-content .tour-timeline li::before { content:''; position:absolute; left:-6px; top:7px; width:11px; height:11px; border-radius:50%; background:var(--td-green); box-shadow:0 0 0 5px #fff; }
.tour-detail-content .tour-time { display:block; color:var(--td-green)!important; font-weight:500!important; white-space:nowrap; }
.tour-detail-content .tour-note { margin-top:18px; padding:20px 22px; border:1px solid rgba(196,181,148,.65); border-radius:14px; background:rgba(196,181,148,.12); color:var(--td-text); }
.tour-detail-content .tour-price-box { padding:24px!important; border:1px solid rgba(60,117,87,.24)!important; border-radius:16px!important; background:linear-gradient(135deg,#F5F7F3,#EEF3EF)!important; color:var(--td-text)!important; box-shadow:none!important; }
.tour-detail-content .tour-price-box h3 { color:var(--td-green)!important; }
.tour-detail-content .tour-price-box strong { color:var(--td-deep)!important; }
.tour-detail-content .tour-days { display:grid; gap:10px; }
.tour-detail-content .tour-day { display:grid!important; grid-template-columns:70px 1.05fr 1.45fr 1fr!important; gap:14px!important; align-items:start; padding:16px 18px!important; border:1px solid var(--td-line)!important; border-radius:13px!important; background:#fff!important; }
.tour-detail-content .tour-day-num { color:var(--td-green); font-weight:600; }
.tour-detail-content .tour-pledge { counter-reset:pledge; list-style:none!important; display:grid; gap:10px; margin:0!important; padding:0!important; }
.tour-detail-content .tour-pledge li { counter-increment:pledge; position:relative; margin:0!important; padding:13px 16px 13px 52px!important; border-radius:13px; background:var(--td-cream); }
.tour-detail-content .tour-pledge li::before { content:counter(pledge); position:absolute; left:14px; top:12px; display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:var(--td-green); color:#fff; font-size:13px; font-weight:500; }
.tour-detail-content table { width:100%!important; margin:16px 0 0!important; border-collapse:separate!important; border-spacing:0!important; overflow:hidden; border:1px solid var(--td-line)!important; border-radius:13px; background:#fff; }
.tour-detail-content th,.tour-detail-content td { padding:12px 14px!important; border:0!important; border-bottom:1px solid var(--td-line)!important; text-align:left; vertical-align:top; }
.tour-detail-content th { background:var(--td-soft); color:var(--td-deep); font-weight:500; }
.tour-detail-content tr:last-child td { border-bottom:0!important; }
/* Summernote preview: make the editing canvas feel like the public page. */
.note-editor .note-editable.tour-detail-content { padding:30px 34px!important; background:#F7F5EF!important; color:var(--td-text)!important; min-height:420px!important; }
.note-editor .note-editable.tour-detail-content .tour-card { background:#fff!important; }
@media (max-width:767px) {
  .tour-detail-content { font-size:15px; line-height:1.72; }
  .tour-detail-content h2 { font-size:27px; }
  .tour-detail-content .tour-section { margin-bottom:34px; }
  .tour-detail-content .tour-grid { grid-template-columns:1fr!important; }
  .tour-detail-content .tour-timeline li { grid-template-columns:1fr!important; gap:2px!important; padding-left:22px!important; }
  .tour-detail-content .tour-day { grid-template-columns:1fr!important; gap:4px!important; }
  .note-editor .note-editable.tour-detail-content { padding:22px!important; }
}