/* Shared by Laravel and the static preview; status colors retain their meaning. */
:root {
  --primary: #a94712;
  --primary-dark: #80330d;
  --primary-soft: #ffe8d6;
  --canvas: #fff8f2;
  --line: #ecdccf;
  --ink: #352b25;
  --muted: #756457;
  --bs-primary: #a94712;
  --bs-primary-rgb: 169,71,18;
  --bs-link-color: #a94712;
  --bs-link-hover-color: #80330d;
}
body, .app-shell { background-color: var(--canvas); }
.app-topbar, .demo-topbar, .app-sidebar { border-color: var(--line); }
.app-nav a.active, .app-nav a.active:hover { background: #ffe8d6; color: #80330d; border-color: #f6b382; box-shadow: inset 3px 0 #a94712; }
.app-nav a:hover, .user-menu-toggle:hover, .user-menu-toggle[aria-expanded="true"] { background: #fff0e5; border-color: #f6b382; color: #80330d; }
.app-nav a.active i, .app-nav a.active svg { color: #a94712; }
.btn-primary, .login-submit, .login-system-icon, .login-card-icon {
  --bs-btn-bg: #a94712; --bs-btn-border-color: #a94712;
  --bs-btn-hover-bg: #80330d; --bs-btn-hover-border-color: #80330d;
  --bs-btn-active-bg: #74300e; --bs-btn-active-border-color: #74300e;
  --bs-btn-disabled-bg: #a94712; --bs-btn-disabled-border-color: #a94712;
  background-color: #a94712; color: white;
}
.btn-outline-primary, .csv-template-list .btn, .user-manual-button {
  --bs-btn-color: #a94712; --bs-btn-border-color: #d99a72;
  --bs-btn-hover-bg: #ffe8d6; --bs-btn-hover-color: #80330d; --bs-btn-hover-border-color: #a94712;
  --bs-btn-active-bg: #ffe8d6; --bs-btn-active-color: #80330d;
  color: #a94712; border-color: #d99a72;
}
.form-control:focus, .form-select:focus { border-color: #c77543; box-shadow: 0 0 0 3px #f6b38255; }
.avatar, .metric-icon, .stat-icon, .page-icon.icon-green, .section-icon.icon-green, .notification-icon {
  background: #ffe8d6; color: #a94712; border-color: #f6b382;
}
.notification-item.unread, .notification-item:hover, .notification-item:focus-visible { background: #fff0e5; }
.notification-item.unread::after { background: #a94712; }
.data-table thead th { background: #fff0e5; color: #653c24; border-color: #ecdccf; }
.data-table tbody tr:hover > td { background-color: #fff8f2; }
.score-mode-tab.active { background: #ffe8d6; color: #80330d; border-color: #d99a72; }
.individual-trend i, .trend-chart i { background: #e9a06e; }
.individual-trend > div:nth-child(1) i { background: #a94712; }
.individual-trend > div:nth-child(2) i { background: #cd7850; }
.individual-trend > div:nth-child(3) i { background: #f6b382; }
.individual-detail-panel .subject-result:nth-child(n) { --subject-color: #a94712; --subject-bg: #fff0e5; }
.item-entry-table thead .sticky-col { background: #ffe8d6 !important; }
.stat-grid .stat-card:nth-child(n), .metric-grid .metric:nth-child(n) { border-top-color: #f6b382; }
.stat-grid .stat-card:nth-child(n) .stat-icon { background: #ffe8d6; color: #a94712; }
.page-heading .page-icon, .section-header .section-icon, .curriculum-analysis .section-icon { background: #ffe8d6; color: #a94712; border-color: #f6b382; }
.curriculum-analysis .table-responsive { scrollbar-width: thin; }
.curriculum-analysis .table-responsive > table:not(.curriculum-table) { min-width: 760px; }
.login-page { background: #fff8f2; }
.login-visual { background-color: #ffe8d6; }
.import-help { border-left: 4px solid #f6b382; margin-bottom: 20px; }
.import-help p:last-child { margin-bottom: 0; }
.curriculum-analysis { margin-top: 24px; }
.analysis-guide { color: #74300e; background: #fff0e5; border-radius: 8px; padding: 12px 16px; }
.analysis-cohort { border-top: 1px solid #ecdccf; margin-top: 24px; padding-top: 24px; }
.analysis-cohort h3 { font-size: 17px; line-height: 1.6; margin: 16px 0 12px; }
.analysis-notice { color: #754b12; background: #fff4dc; padding: 12px; border-left: 3px solid #d59a36; }
.curriculum-highlights { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 20px 0; }
.analysis-highlight { padding: 16px; border: 1px solid #ecdccf; border-radius: 10px; background: #fffaf6; }
.analysis-highlight p { margin: 12px 0; }
.analysis-highlight.level-strong { border-top: 3px solid #388563; }
.analysis-highlight.level-needs { border-top: 3px solid #bc5345; }
.analysis-level { display: inline-block; border-radius: 6px; padding: 4px 8px; font-size: 12px; white-space: nowrap; }
.analysis-level.level-strong { background: #e6f4ec; color: #235d41; }
.analysis-level.level-developing { background: #fff1cd; color: #73500b; }
.analysis-level.level-needs { background: #fce7e1; color: #9a3024; }
.analysis-level.level-unknown { background: #eef0f2; color: #53606c; }
.curriculum-table { min-width: 960px; }
.curriculum-table td, .curriculum-table th { white-space: normal; vertical-align: top; }
.curriculum-table td:first-child { min-width: 170px; }
.curriculum-table td:last-child { min-width: 200px; }
.curriculum-table small { color: #756457; }
.item-entry-table th details { max-width: 230px; white-space: normal; font-weight: normal; }
.item-entry-table th details p { font-size: 12px; }
@media (max-width: 700px) {
  .curriculum-highlights { grid-template-columns: 1fr; }
  .curriculum-analysis { padding: 16px; }
}
@media print {
  @page { size: A4 landscape; margin: 12mm; }
  body { background: white !important; color: #222; }
  .app-topbar, .app-sidebar, .sidebar-backdrop, .no-print, .report-filter, .breadcrumb-line { display: none !important; }
  .app-main, .app-content, .main-content { margin: 0 !important; padding: 0 !important; width: 100% !important; }
  .table-responsive { overflow: visible !important; }
  .curriculum-table { min-width: 0; width: 100%; table-layout: fixed; }
  .curriculum-analysis .table-responsive > table { min-width: 0 !important; }
  .curriculum-table td, .curriculum-table th { min-width: 0 !important; font-size: 9px; padding: 5px; overflow-wrap: anywhere; }
  .curriculum-analysis, .analysis-cohort { break-inside: auto; box-shadow: none; border: 0; padding: 0; }
  .analysis-cohort h3 { break-after: avoid; }
  thead { display: table-header-group; }
  tr, .analysis-highlight { break-inside: avoid; }
  .analysis-level { white-space: normal; }
}
.individual-profile { display: grid; grid-template-columns: 48px 1fr auto; gap: 10px 16px; align-items: center; max-width: none; }
.individual-profile .person-avatar { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; color: #a94712; background: #ffe8d6; font-size: 22px; }
.individual-profile h2 { margin: 0; }
.individual-profile dl { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 0; }
.individual-profile dd { margin-bottom: 0; }
.subject-results { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
.chart-print-image { display: none; }
@media (max-width: 575px) {
  .individual-profile { grid-template-columns: 40px 1fr; }
  .individual-profile .status { grid-column: 2; justify-self: start; }
  .individual-profile dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media print {
  .app-shell { padding-top: 0 !important; background: white !important; }
  .print-report-brand { margin: 0 0 4mm !important; padding: 0 0 2mm !important; }
  .print-report-brand img { height: 12mm !important; }
  .page-heading h1 { font-size: 20px; }
  .page-heading p, .curriculum-analysis > p, .analysis-cohort > p { font-size: 11px; }
  .report-stats { grid-template-columns: repeat(4, 1fr); }
  .stat-card { min-height: 0; padding: 10px; }
  .stat-card .stat-value { font-size: 22px; }
  .individual-detail-panel { padding: 12px; break-inside: auto; }
  .individual-profile { margin-bottom: 12px; }
  .individual-profile dl { grid-template-columns: repeat(4, 1fr); }
  .individual-detail-panel .subject-result { min-height: 60px; padding: 6px; }
  .individual-trend { height: 140px; padding-top: 8px; break-inside: avoid; }
  .chart-grid { grid-template-columns: 1fr 1fr; break-inside: avoid; }
  .chart-grid .panel { padding: 12px; }
  .chart-grid h2 { font-size: 14px; }
  .chart-grid p { font-size: 10px; }
  .chart-box { height: 180px !important; }
  .chart-box canvas { display: none !important; }
  .chart-print-image { display: block; width: 100%; height: 180px; object-fit: contain; }
  .curriculum-highlights { margin: 10px 0; }
  .analysis-highlight { padding: 10px; font-size: 11px; }
  .analysis-highlight h3 { margin: 0; font-size: 13px; }
}