.jd-intro { padding: 40px 0 12px; }
.jd-intro h1 { font-size: clamp(30px, 4vw, 42px); margin-bottom: 10px; }
.jd-privacy { display: inline-block; background: var(--mint); color: var(--pine-d); border-radius: var(--radius-s); padding: 8px 14px; font-size: 15px; }
.jd-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin: 18px 0 14px; position: sticky; top: 66px; z-index: 5; background: var(--paper); padding: 8px 0; border-bottom: 1px solid var(--line); }
.jd-tabs button { font: 600 15px var(--body); border: 1px solid var(--line); background: var(--white); color: var(--ink); border-radius: 99px; padding: 8px 16px; cursor: pointer; }
.jd-tabs button.on { background: var(--pine); border-color: var(--pine); color: var(--white); }
.jd-card { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-l); padding: 20px; margin-bottom: 14px; }
.jd-card h2 { font-size: 22px; margin-bottom: 12px; }
.jd-card h3 { font-size: 18px; margin: 14px 0 10px; display: flex; gap: 10px; align-items: center; }
.jd-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px 18px; margin-bottom: 12px; }
.jd label { font-size: 15px; }
.jd-grid label { display: grid; gap: 6px; font-weight: 500; }
.jd input:not([type=checkbox]), .jd select { font: inherit; font-size: 15px; padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--radius-s); background: var(--white); color: var(--ink); min-width: 0; }
.jd-days { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; margin: 4px 0 8px; }
.chk { display: inline-flex; gap: 6px; align-items: center; cursor: pointer; }
.jd-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.jd-actions .btn { padding: 9px 16px; font-size: 15px; }
.jd-danger { border-color: #b42318 !important; color: #b42318 !important; }
.muted { color: var(--slate); font-size: 15px; }
.jd-msg { background: var(--mint); border-radius: var(--radius-s); padding: 10px 14px; margin: 8px 0 0; }
.jd-add { display: grid; grid-template-columns: 1.1fr 1.4fr 1.4fr 90px auto; gap: 8px; }
.jd-copy { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 12px; font-size: 15px; }
.jd-table { width: 100%; border-collapse: collapse; }
.jd-table th { text-align: right; font-size: 14px; color: var(--slate); font-weight: 600; padding: 6px; border-bottom: 1px solid var(--line); }
.jd-table td { padding: 4px 6px; border-bottom: 1px solid #eef2ef; }
.jd-table input { width: 100%; }
.jd-table td:nth-child(3) { width: 90px; } .jd-table td:last-child { width: 40px; }
.jd-x { border: 0; background: none; color: #b42318; cursor: pointer; font-size: 16px; }
.jd-badge { font: 600 13px var(--body); background: var(--mint); color: var(--pine-d); border-radius: 99px; padding: 3px 10px; }
.jd-badge.bad { background: #fde7e7; color: #b42318; } .jd-badge.ok { background: var(--pine); color: #fff; }
.jd-dot { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-inline-end: 8px; vertical-align: -1px; border: 1px solid rgba(0,0,0,.08); }
.jd-t summary { cursor: pointer; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; font: 500 16px var(--body); list-style: none; }
.jd-t summary::-webkit-details-marker { display: none; }
.jd-t[open] summary { margin-bottom: 12px; }
.jd-off { border-collapse: separate; border-spacing: 3px; }
.jd-off th { font-size: 13px; color: var(--slate); font-weight: 500; padding: 0 6px; }
.jd-off td { width: 34px; height: 26px; background: var(--mint); border-radius: 5px; cursor: pointer; }
.jd-off td.off { background: #e5484d; }
.jd-diag { margin: 6px 0; padding-inline-start: 20px; font-size: 15px; }
.jd-diag li.bad, .bad { color: #b42318; }
.jd-stat { margin: 6px 0 0; }
.jd-viewbar { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; margin-bottom: 14px; }
.jd-seg { display: inline-flex; border: 1px solid var(--line); border-radius: 99px; overflow: hidden; }
.jd-seg button { border: 0; background: var(--white); padding: 7px 14px; font: 500 14px var(--body); cursor: pointer; }
.jd-seg button.on { background: var(--pine); color: #fff; }
.jd-page { background: #fff; }
.jd-ph { display: flex; align-items: baseline; gap: 14px; justify-content: space-between; border-bottom: 2px solid var(--pine); padding-bottom: 8px; margin-bottom: 12px; }
.jd-ph h2 { font-size: 22px; color: var(--pine-d); margin: 0; }
.jd-ph span, .jd-ph small { color: var(--slate); font-size: 14px; }
.jd-pf { display: flex; justify-content: space-between; margin-top: 14px; font-size: 13px; color: var(--slate); }
.jd-tt { width: 100%; border-collapse: separate; border-spacing: 4px; table-layout: fixed; }
.jd-tt thead th { background: var(--pine); color: #fff; border-radius: 8px; padding: 8px 4px; font-size: 14px; }
.jd-tt th.jd-dh { width: 86px; background: var(--mint); color: var(--pine-d); border-radius: 8px; }
.jd-tt thead th.jd-dh { background: var(--pine); color: #fff; }
.jd-tt td { border-radius: 8px; padding: 8px 4px; text-align: center; vertical-align: middle; height: 64px; background: #f4f7f5; cursor: pointer; border: 2px solid transparent; }
.jd-tt td b { display: block; font: 600 14px var(--display); line-height: 1.35; }
.jd-tt td small { display: block; font-size: 12px; color: var(--slate); margin-top: 3px; }
.jd-tt td hr { border: 0; border-top: 1px dashed #c33; margin: 4px 0; }
.jd-tt td.empty { background: #fff; border: 1px dashed var(--line); }
.jd-tt td.bad { border-color: #e5484d; box-shadow: inset 0 0 0 1px #e5484d; }
.jd-tt td.sel { border-color: #1f6feb; box-shadow: 0 0 0 3px rgba(31,111,235,.25); }
.jd-tt .jd-brk { width: 18px; background: none; border: 0; padding: 0; cursor: default; }
.jd-tt td.jd-brk span { writing-mode: vertical-rl; font-size: 11px; color: var(--slate); }
.jd-scroll { overflow-x: auto; }
.jd-master { border-collapse: collapse; font-size: 11.5px; min-width: 100%; }
.jd-master th, .jd-master td { border: 1px solid var(--line); padding: 3px 2px; text-align: center; white-space: nowrap; }
.jd-master thead th { background: var(--pine); color: #fff; font-weight: 500; }
.jd-master .jd-mn { text-align: right; padding: 3px 8px; background: var(--mint); color: var(--ink); min-width: 140px; }
.jd-master thead .jd-mn { background: var(--pine); color: #fff; }
.jd-master td.bad { background: #fde7e7; color: #b42318; font-weight: 700; }
.jd-help { padding: 30px 0 50px; }
.jd-help h2 { margin-bottom: 12px; }
.jd-help li { margin-bottom: 8px; }
#printAll { display: none; }
@media (max-width: 760px) {
  .jd-add { grid-template-columns: 1fr 1fr; }
  .jd-tt td { height: 54px; padding: 4px 2px; } .jd-tt td b { font-size: 12px; } .jd-tt td small { font-size: 10.5px; }
  .jd-tt th.jd-dh { width: 54px; font-size: 12px; }
  .jd-tabs { top: 66px; }
}
@media print {
  @page { size: A4 landscape; margin: 10mm; }
  body { background: #fff; }
  .no-print, .jd-tabs, .jd-intro, .jd-help, .top, .foot { display: none !important; }
  .jd-card { border: 0; padding: 0; margin: 0; }
  .jd-card.no-print { display: none; }
  .jd-tt td { cursor: default; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .jd-tt thead th, .jd-master thead th, .jd-master .jd-mn { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .jd-tt td.sel { border-color: transparent; box-shadow: none; }
  .jd-page { break-after: page; }
  .jd-page:last-child { break-after: auto; }
  .jd-master { font-size: 8.5px; }
  .jd-master .jd-mn { min-width: 0; }
  body.printing-all main, body.printing-all .top, body.printing-all .foot { display: none !important; }
  body.printing-all #printAll { display: block; }
}
.jd-seg button { white-space: nowrap; }
@media (max-width: 560px) { .jd-viewbar { flex-direction: column; align-items: stretch; } .jd-seg button { flex: 1; padding: 7px 8px; } }

/* ===== الخطة الدراسية الجاهزة ===== */
.jd-stageseg { margin: 4px 0 14px; flex-wrap: wrap; }
.jd-trk { display: inline-flex; align-items: center; gap: 8px; margin-inline-start: 10px; font: 500 14px var(--body); }
.jd-trk select { font: inherit; padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; }
.jd-note { background: #fff8e6; border: 1px solid #f0e2b8; color: #7a5a00; border-radius: 10px; padding: 10px 12px; font-size: 13.5px; margin: 10px 0; }
table.jd-plan { border-collapse: collapse; min-width: 520px; width: 100%; }
table.jd-plan th, table.jd-plan td { border: 1px solid var(--line); padding: 4px 6px; text-align: center; }
table.jd-plan thead th { background: var(--pine-d); color: #fff; font: 600 13px var(--body); }
table.jd-plan th.jd-psubj { text-align: right; background: var(--mint); color: var(--pine-d); white-space: nowrap; }
table.jd-plan thead th.jd-psubj { background: var(--pine-d); color: #fff; }
table.jd-plan input { width: 48px; text-align: center; font: inherit; border: 1px solid var(--line); border-radius: 6px; padding: 4px 2px; }
table.jd-plan tr.jd-pcount th { background: #eef5f1; } table.jd-plan tr.jd-pcount input { font-weight: 700; background: #f6fbf8; }

/* ===== إسناد المعلمين ===== */
.jd-asg-top { display: flex; flex-wrap: wrap; gap: 14px 20px; align-items: center; margin-bottom: 12px; }
.jd-staffadd { display: flex; gap: 8px; }
.jd-staffadd input { font: inherit; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; min-width: 180px; }
.jd-asg-pick { display: inline-flex; align-items: center; gap: 8px; font: 500 14px var(--body); }
.jd-asg-pick select { font: inherit; padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px; }
.jd-asg-head { margin: 6px 0 4px; display: flex; align-items: center; gap: 10px; font-size: 16px; }
.jd-asg-subj { border-top: 1px solid var(--line); padding: 10px 0; }
.jd-asg-sname { font-weight: 600; margin-bottom: 7px; }
.jd-asg-cls { display: flex; flex-wrap: wrap; gap: 7px; }
.jd-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); border-radius: 99px; padding: 5px 12px; font-size: 13.5px; cursor: pointer; background: var(--white); }
.jd-chip.on { background: var(--mint); border-color: var(--pine); color: var(--pine-d); font-weight: 600; }
.jd-chip.taken { border-style: dashed; color: var(--muted, #5a6b62); }
.jd-chip small { color: #b42318; }
