.khb-schedule-root{
  --khb-navy:#1B2C55;
  --khb-navy-soft:#4A5A80;
  --khb-olive:#8E7B45;
  --khb-olive-dark:#6E5D30;
  --khb-olive-grad-top:#B39A5E;
  --khb-olive-grad-bot:#8A7440;
  --khb-line:#C9C4B6;
  --khb-row-alt:#EFEEE9;
  --khb-muted:#A7A296;
  --khb-paper:#FFFFFF;
  max-width:1200px;margin:0 auto;padding:24px 12px 40px;
  font-family:'Sarabun',sans-serif;color:var(--khb-navy);box-sizing:border-box;
}
.khb-schedule-root *{box-sizing:border-box;}

.khb-brand{display:flex;align-items:center;justify-content:center;margin-bottom:18px;}
.khb-brand img{height:64px;width:auto;max-width:100%;}

.khb-month-row{display:flex;align-items:center;justify-content:center;gap:16px;margin:20px 0 26px;flex-wrap:nowrap;}
.khb-arrow-btn{
  background:none;border:1px solid var(--khb-line);border-radius:20px;color:var(--khb-olive-dark);cursor:pointer;
  font-size:13px;font-weight:500;padding:7px 16px;line-height:1;white-space:nowrap;flex-shrink:0;
}
.khb-arrow-btn:hover{background:var(--khb-row-alt);}

.khb-view-switch{display:flex;justify-content:center;gap:0;margin:0 0 18px;}
.khb-view-btn{
  background:var(--khb-paper);border:1px solid var(--khb-line);color:var(--khb-navy-soft);cursor:pointer;
  font-size:12px;font-weight:500;padding:6px 14px;flex-shrink:0;
}
.khb-view-btn:first-child{border-radius:20px 0 0 20px;border-right:none;}
.khb-view-btn:last-child{border-radius:0 20px 20px 0;}
.khb-view-btn.active{background:var(--khb-olive-dark);color:#fff;border-color:var(--khb-olive-dark);}
.khb-month-title{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;justify-content:center;}
.khb-month-title .en{font-family:'Prompt',sans-serif;font-weight:700;font-size:32px;letter-spacing:2px;color:var(--khb-navy);}
.khb-month-title .divider{color:var(--khb-olive);font-weight:300;font-size:26px;}
.khb-month-title .th{font-weight:600;font-size:28px;color:var(--khb-navy);}

.khb-legend{display:flex;justify-content:center;gap:18px;margin:0 0 20px;font-size:15.5px;color:var(--khb-navy-soft);flex-wrap:wrap;}
.khb-legend span{display:flex;align-items:center;gap:6px;}
.khb-legend i{width:8px;height:8px;border-radius:50%;display:inline-block;}
.khb-legend .open{background:#5B7B4F;}
.khb-legend .few{background:#B4772F;}
.khb-legend .full{background:#B4472F;}

.khb-filter-bar{display:flex;justify-content:center;align-items:center;gap:8px;margin:0 0 20px;font-size:17px;color:var(--khb-navy-soft);flex-wrap:wrap;}
.khb-filter-bar select{padding:5px 10px;border-radius:20px;border:1px solid var(--khb-line);color:var(--khb-navy);background:var(--khb-paper);font-size:17px;}
.khb-cell.khb-filter-dim{opacity:0.35;filter:grayscale(40%);transition:opacity .15s, filter .15s;}
.khb-cell.khb-filter-match{background:#DCEEF7 !important;box-shadow:inset 0 0 0 2px #2E6F8E;position:relative;z-index:1;transition:box-shadow .15s, background .15s;}

.khb-cal{border:1px solid var(--khb-line);}
.khb-cal-head{display:grid;grid-template-columns:repeat(7,1fr);}
.khb-cal-head div{
  padding:12px 6px 13px;text-align:center;color:#FBF4DE;
  background:linear-gradient(180deg,var(--khb-olive-grad-top),var(--khb-olive-grad-bot));
  border-right:1px solid rgba(255,255,255,.18);
  min-width:0;
}
.khb-cal-head div:last-child{border-right:none;}
.khb-cal-head .en{display:block;font-size:13px;letter-spacing:1px;font-weight:500;}
.khb-cal-head .th{display:block;font-size:13px;margin-top:3px;opacity:.95;}

.khb-cal-body{display:grid;grid-template-columns:repeat(7,1fr);}
.khb-week-row{display:contents;}
.khb-cell{
  border-right:1px solid var(--khb-line);
  border-bottom:1px solid var(--khb-line);
  min-height:118px;padding:12px 12px 10px;
  display:flex;flex-direction:column;background:var(--khb-paper);
  min-width:0;
}
.khb-cell:nth-child(7n){border-right:none;}
.khb-row-alt .khb-cell{background:var(--khb-row-alt);}
.khb-cell.khb-outside{background:#F5F4F0;}
.khb-cell.khb-outside .khb-daynum{color:#D7D3C6;}
.khb-cell.khb-today{background:#FCEFC7 !important;box-shadow:inset 0 0 0 2px var(--khb-olive-dark);position:relative;z-index:1;}
.khb-cell.khb-today .khb-daynum{color:var(--khb-navy);font-weight:700;}

.khb-daynum{font-size:20px;color:var(--khb-navy-soft);text-align:right;font-weight:400;margin-bottom:6px;font-variant-numeric:tabular-nums;}
.khb-dow-mobile{display:none;}
.khb-cell-body{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;}

/* ---- วันที่มี 2 คอร์ส: แสดงแบบแบ่งครึ่งทแยงมุม ---- */
.khb-cell.khb-cell-split{position:relative;overflow:hidden;}
.khb-split-line{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(135deg, transparent calc(50% - 0.5px), var(--khb-line) calc(50% - 0.5px), var(--khb-line) calc(50% + 0.5px), transparent calc(50% + 0.5px));
}
.khb-split-course{
  position:absolute;font-weight:700;font-size:14px;line-height:1.28;max-width:66%;
  text-decoration:none;cursor:pointer;overflow-wrap:break-word;word-break:break-word;
}
.khb-split-tl{top:32px;left:10px;color:var(--khb-navy);text-align:left;}
.khb-split-br{bottom:10px;right:10px;color:#2451A4;text-align:right;}
a.khb-split-course:hover{text-decoration:underline;}

.khb-course-name{font-weight:700;font-size:16px;color:var(--khb-navy);line-height:1.32;overflow-wrap:break-word;word-break:break-word;}
a.khb-course-name{display:block;text-decoration:none;cursor:pointer;}
a.khb-course-name:hover{text-decoration:underline;color:var(--khb-olive-dark);}
.khb-holiday-text{color:var(--khb-muted);font-size:15px;}
.khb-note-text{color:#B7B0A0;font-size:15px;}
.khb-sub-row{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:2px;flex-wrap:wrap;}
.khb-price-tag{color:var(--khb-olive-dark);font-weight:600;font-size:12.5px;}
.khb-seats-tag{font-size:11px;padding:1px 7px;border-radius:20px;font-weight:600;white-space:nowrap;}
.khb-seats-tag.open{color:#5B7B4F;background:#EEF2E7;}
.khb-seats-tag.few{color:#B4772F;background:#FBF0E1;}
.khb-seats-tag.full{color:#B4472F;background:#F8EAE4;}

.khb-footer{margin-top:26px;}
.khb-footer-list div{font-size:13px;color:var(--khb-navy-soft);line-height:1.7;margin-bottom:2px;}

@media (max-width:760px){
  .khb-split-line{display:none;}
  .khb-cell.khb-cell-split{overflow:visible;}
  .khb-split-course{position:static !important;max-width:100% !important;text-align:left !important;display:block;margin-bottom:4px;}
  .khb-cal-head{display:none;}
  .khb-cal-body{grid-template-columns:1fr;}
  .khb-week-row{display:block;}
  .khb-cell{border-right:none;min-height:auto;flex-direction:row;gap:12px;align-items:flex-start;padding:12px 14px;}
  .khb-cell.khb-outside{display:none;}
  .khb-daynum{flex:none;width:52px;text-align:left;display:flex;flex-direction:column;}
  .khb-dow-mobile{display:block;font-size:11px;color:var(--khb-olive-dark);font-weight:600;margin-bottom:2px;}
  .khb-cell-body{align-items:flex-start;text-align:left;}
  .khb-sub-row{justify-content:flex-start;}
  .khb-month-row{gap:8px;}
  .khb-month-title .en{font-size:20px;}
  .khb-month-title .th{font-size:20px;}
  .khb-brand img{height:42px;}
  .khb-arrow-btn{font-size:11px;padding:6px 10px;background:var(--khb-olive-dark);color:#fff;border-color:var(--khb-olive-dark);}
  .khb-arrow-btn:hover{background:var(--khb-olive);}
}

/* ===================== ปุ่มสลับดูแบบเดสก์ท็อป / มือถือ (บังคับ ไม่สนขนาดจอจริง) ===================== */
.khb-schedule-root.khb-force-mobile{max-width:430px;margin-left:auto;margin-right:auto;border:1px solid var(--khb-line);border-radius:8px;padding-top:16px;}
.khb-force-mobile .khb-cal-head{display:none !important;}
.khb-force-mobile .khb-cal-body{grid-template-columns:1fr !important;}
.khb-force-mobile .khb-week-row{display:block !important;}
.khb-force-mobile .khb-cell{border-right:none !important;min-height:auto !important;flex-direction:row !important;gap:12px !important;align-items:flex-start !important;padding:12px 14px !important;}
.khb-force-mobile .khb-split-line{display:none !important;}
.khb-force-mobile .khb-cell.khb-cell-split{overflow:visible !important;}
.khb-force-mobile .khb-split-course{position:static !important;max-width:100% !important;text-align:left !important;display:block !important;margin-bottom:4px;}
.khb-force-mobile .khb-cell.khb-outside{display:none !important;}
.khb-force-mobile .khb-daynum{flex:none !important;width:52px !important;text-align:left !important;display:flex !important;flex-direction:column !important;}
.khb-force-mobile .khb-dow-mobile{display:block !important;font-size:11px !important;color:var(--khb-olive-dark) !important;font-weight:600 !important;margin-bottom:2px !important;}
.khb-force-mobile .khb-cell-body{align-items:flex-start !important;text-align:left !important;}
.khb-force-mobile .khb-sub-row{justify-content:flex-start !important;}
.khb-force-mobile .khb-month-title .en{font-size:20px !important;}
.khb-force-mobile .khb-month-title .th{font-size:20px !important;}
.khb-force-mobile .khb-brand img{height:42px !important;}
.khb-force-mobile .khb-arrow-btn{font-size:11px !important;padding:6px 10px !important;background:var(--khb-olive-dark) !important;color:#fff !important;border-color:var(--khb-olive-dark) !important;}

.khb-force-desktop .khb-cal{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.khb-force-desktop .khb-cal-head{display:grid !important;min-width:700px;}
.khb-force-desktop .khb-cal-body{grid-template-columns:repeat(7,1fr) !important;min-width:700px;}
.khb-force-desktop .khb-week-row{display:contents !important;}
.khb-force-desktop .khb-cell{border-right:1px solid var(--khb-line) !important;flex-direction:column !important;padding:12px 12px 10px !important;align-items:stretch !important;}
.khb-force-desktop .khb-cell.khb-outside{display:flex !important;}
.khb-force-desktop .khb-daynum{width:auto !important;text-align:right !important;display:block !important;flex:initial !important;}
.khb-force-desktop .khb-dow-mobile{display:none !important;}
.khb-force-desktop .khb-cell-body{align-items:center !important;text-align:center !important;}
.khb-force-desktop .khb-sub-row{justify-content:center !important;}
.khb-force-desktop .khb-month-title .en{font-size:32px !important;}
.khb-force-desktop .khb-month-title .th{font-size:28px !important;}
.khb-force-desktop .khb-brand img{height:64px !important;}
.khb-force-desktop .khb-arrow-btn{font-size:13px !important;padding:7px 16px !important;}
