/*! © 2026 Cyber Affinity LLC. All rights reserved. Use is subject to https://www.cyber-affinity.com/terms — copying or redistributing this code is not permitted. */
/* On-call Rotation Planner — tool-specific styles (shared classes live in /styles.css) */
.oc-stats { margin-top: 12px; }
.oc-stats:empty { display: none; }
.oc-stat-small { font-size: 12px; color: var(--muted); }
.oc-h3 { font-size: 15px; margin: 0; color: var(--accent-2); }
.oc-red-text { color: #fca5a5; }
.oc-yellow-text { color: #fde047; }
.oc-ok { color: #6ee7b7; }
.oc-in { color: var(--accent); }
.oc-danger { color: #fca5a5; }
.oc-danger:hover { border-color: #fca5a5; }
.oc-offscreen { position: fixed; left: -9999px; top: 0; opacity: 0; }

/* Schedule controls and notices */
.oc-controls { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: flex-end; }
.oc-seed-field { flex: 0 1 150px; min-width: 0; }
.oc-seed-field input { padding: 7px 10px; font-size: 14px; }
.oc-msg { margin: 0; font-size: 14px; color: var(--text); background: rgba(45, 212, 191, 0.08); border: 1px solid rgba(45, 212, 191, 0.3); border-radius: 10px; padding: 8px 12px; overflow-wrap: anywhere; }
.oc-notice { margin: 0; border: 1px solid var(--line); background: var(--surface); border-radius: 10px; padding: 10px 14px; font-size: 14px; color: var(--muted); }
.oc-notice strong { color: var(--text); }
.oc-notice.warn { border-color: rgba(253, 224, 71, 0.45); background: rgba(253, 224, 71, 0.08); }
.oc-notice.warn strong { color: #fde047; }

/* Calendar */
.oc-cal { border-collapse: collapse; width: 100%; min-width: 820px; table-layout: fixed; font-size: 13px; }
.oc-cal col.oc-col-wk { width: 76px; }
.oc-cal th, .oc-cal td { border: 1px solid var(--line); padding: 4px; vertical-align: top; text-align: left; }
.oc-cal thead th { text-align: center; font-size: 12px; }
.oc-cal th.oc-wk { font-size: 12px; white-space: nowrap; color: var(--muted); }
.oc-wk-of { display: block; font-size: 10px; font-weight: 400; }
.oc-day { height: 92px; background: var(--bg); }
.oc-day.oc-we { background: rgba(159, 179, 200, 0.06); }
.oc-day.oc-out { background: transparent; opacity: 0.45; }
.oc-day.oc-yellow { background: rgba(253, 224, 71, 0.10); }
.oc-day.oc-red { background: rgba(248, 113, 113, 0.16); }
.oc-date { display: block; font-size: 11px; color: var(--muted); }
.oc-hol { display: inline-block; font-size: 10.5px; font-weight: 700; color: var(--accent-2); border: 1px solid rgba(125, 211, 252, 0.4); border-radius: 6px; padding: 0 4px; margin: 1px 0 2px; overflow-wrap: anywhere; }
.oc-slot { display: grid; gap: 1px; width: 100%; text-align: left; font: inherit; color: var(--text); background: none; border: 1px solid transparent; border-radius: 8px; padding: 3px 4px; margin-top: 2px; cursor: pointer; }
div.oc-slot { cursor: default; }
button.oc-slot:hover, button.oc-slot:focus-visible { border-color: var(--accent); background: rgba(45, 212, 191, 0.06); }
.oc-slot.oc-start { border-left: 3px solid var(--accent); }
.oc-slot.oc-cont .oc-p, .oc-slot.oc-cont .oc-s { color: var(--muted); font-weight: 400; }
.oc-p { font-weight: 700; font-size: 13px; line-height: 1.25; overflow-wrap: anywhere; }
.oc-s { font-size: 12px; color: var(--muted); line-height: 1.25; overflow-wrap: anywhere; }
.oc-slot .oc-unfilled, .oc-slot.oc-cont .oc-unfilled { color: #fca5a5; font-weight: 700; }
.oc-meta { font-size: 11px; color: var(--muted); }
.oc-chg { font-size: 11px; color: var(--accent); }
.oc-off { display: block; font-size: 10.5px; color: var(--muted); font-style: italic; margin-top: 2px; overflow-wrap: anywhere; }

.oc-legend { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13px; }
.oc-legend li { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); margin: 0; }
.oc-key { width: 14px; height: 14px; border-radius: 4px; border: 1px solid var(--line); display: inline-block; }
.oc-key.oc-key-start { border-left: 3px solid var(--accent); }
.oc-key.oc-key-red { background: rgba(248, 113, 113, 0.45); }
.oc-key.oc-key-yellow { background: rgba(253, 224, 71, 0.4); }
.oc-key.oc-key-we { background: rgba(159, 179, 200, 0.2); }

.oc-issues { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.oc-issues > li { margin: 0; }
.oc-issue-when { flex: 1 1 240px; min-width: 0; color: var(--text); font-weight: 600; }
.oc-issue-list { margin: 0; padding-left: 20px; font-size: 14px; }
.oc-issue-list li { margin: 2px 0; }
.page .oc-issue-list li.oc-red-text { color: #fca5a5; }
.page .oc-issue-list li.oc-yellow-text { color: #fde047; }

.oc-outputs { align-items: center; margin-top: 0; }
.oc-ics { display: inline-flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.oc-ics select { width: auto; max-width: 220px; padding: 7px 10px; font-size: 14px; }
.oc-copy { align-self: center; }

/* Shift editor dialog */
.oc-dlg { background: var(--surface); color: var(--text); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; width: min(580px, calc(100vw - 24px)); max-height: calc(100vh - 32px); overflow-y: auto; }
.oc-dlg::backdrop { background: rgba(3, 10, 20, 0.7); }
.oc-dlg h2 { margin: 0; font-size: 20px; }
.oc-dlg p { margin: 0; }
.oc-dlg > * + * { margin-top: 12px; }
.oc-dlg-when { font-weight: 600; color: var(--accent-2); }
.oc-dlg-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.oc-dlg input, .oc-dlg select { padding: 8px 10px; font-size: 14px; min-width: 0; }
.oc-dlg-warn { display: grid; gap: 4px; }
.oc-dlg-log, .oc-dlg-swap { border-top: 1px solid var(--line); padding-top: 10px; }
.oc-dlg-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.oc-dlg-swaprow { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.oc-dlg-swaprow select { flex: 1 1 180px; width: auto; }
.oc-dlg-swaprow select:first-child:not(:only-of-type) { flex: 0 1 130px; }
@media (max-width: 480px) { .oc-dlg-grid { grid-template-columns: minmax(0, 1fr); } }

/* Team */
.oc-person-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.2fr) auto 150px auto; gap: 10px 12px; align-items: end; }
.oc-person-grid input, .oc-notes input, .oc-to-row input, .oc-hol-row input { padding: 8px 10px; font-size: 14px; min-width: 0; }
.oc-elig { display: grid; gap: 4px; font-size: 14px; }
.oc-elig-label { font-weight: 600; }
.oc-elig .opt-row { font-size: 14px; gap: 6px; }
.oc-timeoff { border-top: 1px solid var(--line); padding-top: 10px; display: grid; gap: 8px; justify-items: start; }
.oc-timeoff h3 { font-size: 14px; margin: 0; color: var(--muted); text-transform: uppercase; letter-spacing: 0.05em; }
.oc-to-list, .oc-hol-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; width: 100%; }
.oc-to-row { display: grid; grid-template-columns: 170px 170px minmax(0, 1fr) auto; gap: 8px; align-items: end; margin: 0; }
.oc-hol-row { display: grid; grid-template-columns: 170px minmax(0, 1fr) 150px auto; gap: 8px; align-items: end; margin: 0; }
.oc-hol-row > span { padding-bottom: 10px; }
@media (max-width: 1000px) {
  .oc-person-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .oc-person-grid > .cw-right { justify-content: flex-start; }
}
@media (max-width: 700px) {
  .oc-to-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; }
  .oc-to-row > label:nth-child(3) { grid-column: 1 / 3; grid-row: 2; }
  .oc-to-row > .rr-x { grid-column: 3; grid-row: 1; }
  .oc-hol-row { grid-template-columns: minmax(0, 1fr) auto; }
  .oc-hol-row > label:nth-child(2) { grid-column: 1 / 2; }
  .oc-hol-row > span { grid-column: 1 / 2; padding-bottom: 0; }
  .oc-hol-row > .rr-x { grid-column: 2; grid-row: 1; }
}
@media (max-width: 420px) { .oc-person-grid { grid-template-columns: minmax(0, 1fr); } }

/* Holidays quick add */
.oc-qa-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 10px; }
.oc-qa-head h3 { margin: 0; font-size: 16px; }
.oc-qa-year { flex: 0 1 120px; }
.oc-qa-year select { padding: 7px 10px; font-size: 14px; }
.oc-qa-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 4px 16px; }
.oc-qa-list li { margin: 0; }
.oc-qa-list .opt-row { align-items: flex-start; flex-wrap: wrap; gap: 4px 8px; font-size: 14px; }
.oc-qa-list .opt-row input { margin-top: 4px; }
.oc-qa-name { color: var(--text); }

/* Settings */
.oc-set-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); gap: 10px 14px; align-items: end; }
.oc-wide { grid-column: span 2; }
@media (max-width: 480px) { .oc-wide { grid-column: auto; } }
.oc-set-grid input, .oc-set-grid select { padding: 8px 10px; font-size: 14px; min-width: 0; }
.oc-rules { margin: 0; }
.oc-rules li { margin: 4px 0; font-size: 14px; }

/* Tables */
.oc-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.oc-table th, .oc-table td { padding: 7px 10px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.oc-table td { font-variant-numeric: tabular-nums; }
.oc-load { min-width: 760px; }
.oc-load td { text-align: right; }
.oc-load thead th:not(:first-child) { text-align: right; white-space: normal; }
.oc-load tbody th { white-space: normal; min-width: 150px; color: var(--text); background: transparent; }
.oc-name { display: block; font-weight: 600; overflow-wrap: anywhere; }
.oc-sub { display: block; font-size: 12px; color: var(--muted); font-weight: 400; }
.oc-dev { color: var(--muted); }
.oc-flag { display: block; width: fit-content; margin: 3px 0 0 auto; }
.oc-table .oc-row-yellow td, .oc-table tbody .oc-row-yellow th { background: rgba(253, 224, 71, 0.07); }
.oc-table .oc-row-red td, .oc-table tbody .oc-row-red th { background: rgba(248, 113, 113, 0.10); }
.oc-avg-row th, .oc-avg-row td { border-top: 2px solid var(--line); color: var(--muted); }
.oc-reasons { margin: 0; padding-left: 20px; font-size: 14px; }
.oc-reasons li { margin: 3px 0; }
.oc-log { min-width: 560px; }
.oc-log tbody th { white-space: normal; font-weight: 400; color: var(--text); background: transparent; }
.oc-log input { width: 100px; padding: 6px 8px; font-size: 14px; }
.oc-cost-table { min-width: 560px; }
.oc-cost-table td { text-align: right; }
.oc-cost-table thead th:not(:first-child) { text-align: right; }
.oc-cost-table tbody th { color: var(--text); background: transparent; white-space: normal; }

/* Cost */
.oc-legal { margin: 0; font-size: 14px; color: var(--text); border: 1px solid rgba(253, 224, 71, 0.45); background: rgba(253, 224, 71, 0.08); border-radius: 10px; padding: 10px 14px; }
.oc-cost-out { display: grid; gap: 12px; }
.oc-cost-stats { margin-top: 0; }
.oc-compare { border: 1px solid rgba(45, 212, 191, 0.3); background: rgba(45, 212, 191, 0.06); border-radius: var(--radius); padding: 12px 16px; display: grid; gap: 6px; }
.oc-compare p { margin: 0; }
.oc-compare strong { color: var(--text); }
.oc-summary { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px 16px; display: grid; gap: 8px; }
.page .oc-summary-text { margin: 0; color: var(--text); line-height: 1.6; }
.oc-summary .out-actions { margin-top: 0; align-items: center; }

/* Printing: only the generated report is printed — never the editing UI. */
#oc-print { display: none; }
@media print {
  body.oc-printing > *:not(#oc-print) { display: none !important; }
  body.oc-printing #oc-print { display: block; width: 100%; max-width: 100%; overflow: visible; }
  #oc-print, #oc-print * { color: #111 !important; box-shadow: none !important; }
  .oc-doc { display: grid; gap: 10px; font-size: 10pt; }
  .oc-doc h2 { font-size: 18pt; margin: 0; }
  .oc-doc h3 { font-size: 12.5pt; margin: 8px 0 6px; border-bottom: 1px solid #bbb; padding-bottom: 2px; break-after: avoid; }
  .oc-doc p { margin: 2px 0; }
  .oc-doc-head p { color: #444 !important; }
  .oc-doc-note { font-weight: 700; }
  .oc-doc ul { margin: 2px 0; padding-left: 18px; }
  .oc-doc ul li { margin: 2px 0; overflow-wrap: anywhere; break-inside: avoid; }
  .oc-doc-keep { break-inside: avoid; }
  #oc-print .oc-cal { min-width: 0 !important; width: 100% !important; table-layout: fixed !important; font-size: 8pt; }
  #oc-print .oc-cal col.oc-col-wk { width: 11%; }
  #oc-print .oc-cal th, #oc-print .oc-cal td { border: 1px solid #999 !important; padding: 2px 3px !important; font-size: 8pt !important; background: #fff !important; }
  #oc-print .oc-cal thead th { background: #eee !important; }
  #oc-print .oc-cal thead { display: table-header-group; }
  #oc-print .oc-cal tr { break-inside: avoid; }
  #oc-print .oc-day { height: auto; opacity: 1; }
  #oc-print .oc-day.oc-we { background: #f4f4f4 !important; }
  #oc-print .oc-day.oc-red { background: #fde2e2 !important; }
  #oc-print .oc-day.oc-yellow { background: #fef9c3 !important; }
  #oc-print .oc-day.oc-we, #oc-print .oc-day.oc-red, #oc-print .oc-day.oc-yellow { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  #oc-print .oc-day.oc-out .oc-date { color: #999 !important; }
  #oc-print .oc-slot { border: 0; border-radius: 0; padding: 0; margin-top: 1px; }
  #oc-print .oc-slot.oc-start { border-left: 2px solid #111; padding-left: 3px; }
  #oc-print .oc-p { font-size: 8pt; }
  #oc-print .oc-s, #oc-print .oc-meta, #oc-print .oc-chg, #oc-print .oc-off, #oc-print .oc-date { font-size: 7pt !important; color: #444 !important; }
  #oc-print .oc-slot.oc-cont .oc-p, #oc-print .oc-slot.oc-cont .oc-s { color: #666 !important; }
  #oc-print .oc-unfilled { text-decoration: underline; }
  #oc-print .oc-hol { font-size: 7pt; border-color: #999; }
  .oc-doc-table { width: 100% !important; min-width: 0 !important; table-layout: auto !important; border-collapse: collapse; font-size: 8.5pt; }
  .oc-doc-table th, .oc-doc-table td { border: 1px solid #999 !important; padding: 3px 4px !important; font-size: 8.5pt !important; text-align: right; vertical-align: top; }
  .oc-doc-table th:first-child { text-align: left; }
  .oc-doc-table thead th { background: #eee !important; text-align: right; }
  .oc-doc-table thead th:first-child { text-align: left; }
  .oc-doc-table tbody th { font-weight: 600; background: transparent !important; }
  .oc-doc-table tr { break-inside: avoid; }
  .oc-doc-table .flag { border: 0 !important; padding: 0; font-weight: 700; background: transparent !important; }
  .oc-doc-table .oc-sub { font-size: 7.5pt; color: #444 !important; }
  .oc-doc-table .oc-row-red th, .oc-doc-table .oc-row-red td { background: #fde2e2 !important; }
  .oc-doc-table .oc-row-yellow th, .oc-doc-table .oc-row-yellow td { background: #fef9c3 !important; }
  .oc-doc-table .oc-row-red th, .oc-doc-table .oc-row-red td, .oc-doc-table .oc-row-yellow th, .oc-doc-table .oc-row-yellow td { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .oc-doc-legend { font-size: 8.5pt; color: #444 !important; }
}
