.loading-page { min-height: 100vh; display: grid; place-items: center; color: #65758a; background: #f2f5f8; }
.loading-card { background: white; border: 1px solid #dce4eb; padding: 24px 30px; border-radius: 14px; box-shadow: 0 12px 30px rgba(31,55,78,.08); }
.database-banner { background: #eaf7ed; color: #2f6843; border-bottom: 1px solid #cbe6d2; text-align: center; padding: 7px 14px; font-size: 12px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.hercules-dashboard { display: grid; gap: 20px; color: #061525; }
.today-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.today-card { min-height: 146px; display: flex; align-items: center; gap: 15px; padding: 25px 22px; border: 1px solid #9db5c6; border-radius: 13px; background: #e5ebef; box-shadow: 0 2px 3px rgba(22,49,69,.10); }
.dashboard-icon { width: 37px; height: 37px; flex: 0 0 37px; display: grid; place-items: center; border-radius: 7px; background: #cbd6de; color: #07365a; font-size: 18px; font-weight: 800; }
.today-card > div { display: grid; gap: 2px; }
.today-card small, .year-card > small { color: #365b79; font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: .25px; }
.today-card strong { font-size: 31px; line-height: 1.05; }
.today-card div > span { color: #4b6981; font-size: 10px; }
.year-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.year-card { min-height: 174px; position: relative; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 22px; border: 1px solid #c4d3dd; border-radius: 13px; background: #fff; box-shadow: 0 2px 3px rgba(22,49,69,.10); }
.year-card > .dashboard-icon { position: absolute; top: 39px; right: 22px; background: #e8eef2; }
.year-card > strong { margin: 6px 0 2px; font-size: 27px; line-height: 1; }
.year-card > p { margin: 10px 0 0; color: #46637b; font-size: 10px; }
.dashboard-delta { font-size: 10px; font-weight: 750; }
.dashboard-delta.down { color: #e30613; }
.dashboard-delta.up { color: #19864b; }
.dashboard-delta.even { color: #667b8e; }
.dashboard-panel { min-width: 0; border: 1px solid #c4d3dd; border-radius: 13px; background: #fff; box-shadow: 0 2px 3px rgba(22,49,69,.09); overflow: hidden; }
.dashboard-panel h2 { display: flex; align-items: center; gap: 8px; margin: 0; padding: 24px 22px 18px; font-size: 14px; }
.dashboard-panel h2 > span { color: #07365a; }
.orders-chart-panel { min-height: 305px; padding-bottom: 17px; }
.orders-chart { height: 205px; display: grid; grid-template-columns: repeat(12, minmax(30px, 1fr)); gap: 10px; align-items: stretch; padding: 10px 28px 0; background-image: repeating-linear-gradient(to bottom, transparent 0, transparent 49px, #dce5eb 50px); }
.month-bars { min-width: 0; display: grid; grid-template-rows: minmax(0, 1fr) 20px; gap: 5px; text-align: center; color: #46627a; font-size: 10px; }
.bar-area { min-height: 0; display: flex; align-items: flex-end; justify-content: center; gap: 3px; }
.bar-area i { display: block; width: min(19px, 45%); min-height: 0; border-radius: 3px 3px 0 0; transition: height .25s ease; }
.bar-area .previous-bar { background: #aebbc5; }
.bar-area .current-bar { background: #06345a; }
.chart-legend { display: flex; justify-content: center; gap: 14px; margin-top: 7px; color: #4a657c; font-size: 10px; }
.chart-legend span { display: flex; align-items: center; gap: 5px; }
.chart-legend i { width: 10px; height: 10px; display: inline-block; }
.previous-swatch { background: #6f8798; }
.current-swatch { background: #06345a; }
.dashboard-bottom-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.dashboard-table-scroll, .dealer-ranking-scroll { max-height: 415px; overflow: auto; }
.monthly-breakdown table { table-layout: fixed; }
.monthly-breakdown th { padding: 9px 12px; background: #fff; color: #34536b; font-size: 9px; letter-spacing: .4px; }
.monthly-breakdown th:first-child { width: 42%; }
.monthly-breakdown th small { display: block; font-size: 8px; }
.monthly-breakdown td { padding: 11px 12px; color: #385a74; text-align: right; }
.monthly-breakdown th:first-child, .monthly-breakdown td:first-child { text-align: left; }
.monthly-breakdown td strong { color: #061525; }
.monthly-breakdown td.negative { color: #e30613; font-weight: 800; }
.monthly-breakdown td.positive { color: #19864b; font-weight: 800; }
.dealer-ranking-head, .dealer-rank-row { display: grid; grid-template-columns: 22px minmax(0, 1fr) 62px 43px; gap: 8px; align-items: center; }
.dealer-ranking-head { padding: 9px 14px; border-bottom: 1px solid #d8e1e8; color: #34536b; font-size: 9px; text-transform: uppercase; letter-spacing: .6px; }
.dealer-ranking-head span:nth-child(3), .dealer-ranking-head span:nth-child(4) { text-align: right; }
.dealer-rank-row { min-height: 46px; padding: 7px 14px; border-bottom: 1px solid #d8e1e8; color: #49667d; font-size: 10px; }
.dealer-rank-row:last-child { border-bottom: 0; }
.dealer-rank-row > div { min-width: 0; }
.dealer-rank-row > div > strong { display: block; overflow: hidden; color: #061525; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.dealer-rank-row > div > i { height: 6px; display: block; margin-top: 5px; overflow: hidden; border-radius: 999px; background: #dce5eb; }
.dealer-rank-row > div > i > b { height: 100%; display: block; border-radius: 999px; background: #06345a; }
.dealer-rank-row > strong, .dealer-rank-row > span:last-child { color: #061525; text-align: right; }
.dealer-rank-row > span:last-child { color: #4c687e; }
.hercules-reports-page { display: grid; gap: 14px; color: #061525; }
.report-order-section { display: grid; gap: 10px; }
.report-order-card { padding: 24px 18px 25px; border: 1px solid #c4d3dd; border-radius: 13px; background: #fff; box-shadow: 0 2px 3px rgba(22,49,69,.09); }
.report-order-card h2 { display: flex; align-items: center; gap: 8px; margin: 0 0 32px; font-size: 14px; }
.report-order-card h2 span { color: #07365a; }
.report-order-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 9px 8px; }
.report-order-grid label { gap: 4px; color: #23445e; font-size: 10px; font-weight: 600; }
.report-order-grid input { height: 31px; padding: 6px 11px; border-color: #c5d5df; border-radius: 6px; background: #f2f5f7; color: #06345a; font-size: 12px; box-shadow: none; }
.report-order-empty { padding: 32px; color: #607992; text-align: center; font-size: 12px; }
.report-order-pagination { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 34px; }
.report-order-pagination button { border: 0; border-radius: 7px; padding: 7px 11px; background: #e5edf2; color: #0b3553; font-size: 10px; }
.report-order-pagination button:hover:not(:disabled) { background: #d4e3ec; }
.report-order-pagination button:disabled { color: #8da0ae; opacity: .52; cursor: default; }
.report-order-pagination strong { min-width: 84px; color: #061525; font-size: 10px; text-align: center; }
.report-form-card { border: 1px solid #c4d3dd; border-radius: 13px; background: #fff; box-shadow: 0 2px 3px rgba(22,49,69,.09); padding: 23px 18px 18px; }
.report-form-card h2 { display: flex; align-items: center; gap: 8px; margin: 0 0 34px; font-size: 14px; }
.report-form-card h2 span { color: #07365a; }
.report-form-card > p { margin: -16px 0 16px; color: #607992; font-size: 10px; }
.report-criteria { display: grid; grid-template-columns: minmax(160px,.8fr) minmax(190px,1.1fr) minmax(190px,1.1fr) minmax(205px,1.1fr); gap: 9px; align-items: end; }
.report-criteria label { color: #071523; font-size: 11px; font-weight: 650; gap: 6px; }
.report-criteria input, .report-criteria select { height: 40px; padding: 8px 11px; border-color: #c8d7e1; border-radius: 7px; font-size: 13px; }
.report-run-button { height: 40px; border: 0; border-radius: 7px; background: #06345a; color: #fff; font-weight: 750; }
.report-run-button:hover { background: #082b49; }
.report-run-button:disabled { opacity: .65; cursor: default; }
.report-result-strip { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 15px; padding-top: 13px; border-top: 1px solid #e1e8ed; color: #405e75; font-size: 12px; }
.report-result-strip strong { color: #06345a; font-size: 15px; }
.report-results { border-color: #c4d3dd; }
.report-results .table-wrap { max-height: 410px; overflow: auto; }
.report-summary { padding: 20px; border-top: 1px solid #e1e8ed; }
.report-summary h3 { margin: 0 0 12px; color: #20364d; font-size: 13px; }
.report-summary table { max-width: 620px; border: 1px solid #e1e8ed; }
.report-summary td:last-child, .report-summary th:last-child { text-align: right; }
.cookie-groups { display: grid; gap: 15px; padding: 17px; }
.cookie-group { overflow: hidden; border: 1px solid #d5e0e7; border-radius: 9px; }
.cookie-dealer-head { display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 18px; align-items: center; padding: 10px 12px; background: #f0f4f7; color: #47647a; font-size: 11px; }
.cookie-dealer-head strong { overflow: hidden; color: #061525; text-overflow: ellipsis; white-space: nowrap; }
.cookie-dealer-head b { color: #06345a; }
.cookie-group .table-wrap { max-height: none; }
.notice { border: 1px solid #cfe2ed; background: #f0f8fb; color: #315b70; border-radius: 10px; padding: 11px 13px; font-size: 12px; margin-bottom: 16px; }
.notice.warning { border-color: #eadca8; background: #fff9e3; color: #6d5b1f; }
.notice.error { border-color: #efc0c6; background: #fff1f3; color: #a12637; }
.page-controls { padding: 14px 16px; border-top: 1px solid #edf1f4; display: flex; align-items: center; justify-content: space-between; gap: 14px; color: #708093; font-size: 12px; }
.page-controls > div { display: flex; align-items: center; gap: 8px; }
.page-controls .button { padding: 7px 10px; font-size: 11px; }
.search-summary { padding: 10px 16px; font-size: 11px; color: #6e7c8e; background: #fbfcfd; border-bottom: 1px solid #edf1f4; }
.security-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; margin-bottom: 20px; }
.security-item { background: white; border: 1px solid #dce4eb; border-radius: 13px; padding: 18px; box-shadow: 0 8px 20px rgba(31,55,78,.05); }
.security-item strong { display: block; font-size: 26px; margin: 5px 0 2px; }
.security-item span, .security-item small { color: #708093; font-size: 11px; }
.security-item.good { border-top: 4px solid #4b9a65; }
.security-item.warn { border-top: 4px solid #d5a129; }
.security-copy { padding: 20px; line-height: 1.6; color: #4e6073; font-size: 13px; }
.security-copy h2 { margin-top: 0; color: #20354b; }
.security-copy li { margin-bottom: 8px; }
.month-picker { display: flex; align-items: end; gap: 10px; }
.month-picker label { min-width: 170px; }
.empty-panel { padding: 50px 20px; text-align: center; color: #778697; }
.data-source { display: inline-flex; align-items: center; gap: 6px; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .7px; color: #39744d; background: #e9f6ed; padding: 5px 9px; border-radius: 999px; }
.add-user-panel { margin-bottom: 20px; }
.add-user-form { padding: 20px; display: grid; gap: 17px; }
.form-section { border: 1px solid #dfe7ed; border-radius: 11px; padding: 17px; margin: 0; min-width: 0; }
.form-section legend { padding: 0 8px; color: #20364d; font-size: 13px; font-weight: 850; }
.profile-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.profile-grid .wide { grid-column: span 2; }
.required { color: #b83040; }
.profile-details { border: 1px solid #dfe7ed; border-radius: 11px; background: #fbfcfd; }
.profile-details summary { cursor: pointer; padding: 15px 17px; font-size: 13px; font-weight: 800; color: #31475d; }
.profile-details[open] summary { border-bottom: 1px solid #e5ebf0; }
.profile-details .form-section { border: 0; }
.add-user-form .form-actions > div { display: flex; gap: 9px; }
.add-user-form input[readonly] { background: #f1f4f6; color: #667789; }
.button.danger { background: #a92335; color: white; box-shadow: 0 7px 16px rgba(169,35,53,.18); }
.button.danger:hover { background: #8f1c2c; }
.button.small { padding: 6px 10px; font-size: 10px; }
.heading-actions { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; justify-content: flex-end; }
.import-panel, .delete-panel { margin-bottom: 20px; }
.import-body, .delete-body { padding: 20px; display: grid; gap: 16px; }
.file-picker { border: 2px dashed #b9cfdb; border-radius: 12px; background: #f7fbfd; padding: 25px; text-align: center; color: #087ba8; cursor: pointer; }
.file-picker input { margin-top: 12px; background: white; }
.import-summary { display: grid; gap: 3px; padding: 13px 15px; border: 1px solid #dce6ec; border-radius: 9px; }
.import-summary span { color: #6f7e90; font-size: 12px; }
.import-summary small { color: #a12637; font-weight: 750; }
.progress-track { height: 9px; background: #e8eef2; border-radius: 999px; overflow: hidden; }
.progress-track i { display: block; height: 100%; background: linear-gradient(90deg,#087fae,#42b6dc); transition: width .2s ease; }
.delete-body { max-width: 720px; }
.delete-body .form-actions > div, .import-body .form-actions > div { display: flex; gap: 9px; }

/* Build 4 manager orders: closely follows the Hercules search-and-card view. */
.manager-orders-page { color: #061627; }
.manager-orders-page .page-heading { margin-bottom: 26px; }
.manager-orders-page .page-heading h1 { color: #06111e; font-size: 30px; }
.manager-search-card { background: #fff; border: 1px solid #cad8e1; border-radius: 16px; box-shadow: 0 2px 4px rgba(18,48,69,.11); padding: 32px 32px 0; margin-bottom: 26px; }
.manager-search-title { display: flex; align-items: center; gap: 12px; margin-bottom: 62px; font-size: 16px; }
.manager-search-title > span { display: grid; place-items: center; width: 20px; height: 20px; font-size: 25px; transform: rotate(-18deg); }
.manager-search-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 22px; row-gap: 22px; }
.manager-search-grid label { color: #071523; font-size: 16px; font-weight: 500; gap: 9px; }
.manager-search-grid input { height: 49px; border-color: #c8d7e1; border-radius: 8px; padding: 12px 16px; color: #092037; font-size: 15px; box-shadow: 0 1px 2px rgba(20,45,65,.06); }
.manager-search-grid input::placeholder { color: #607896; opacity: 1; }
.date-search-label { padding: 10px; margin: -10px; border: 1px solid #d9e6ed; border-radius: 11px; background: #f7fbfd; }
.date-search-label > span { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.date-search-label em { border-radius: 999px; background: #dceef5; color: #075f81; padding: 4px 7px; font-size: 9px; font-style: normal; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; }
.date-search-label small { color: #62778b; font-size: 10px; font-weight: 600; }
.manager-search-buttons { display: flex; align-items: end; justify-content: flex-end; gap: 10px; }
.manager-search-buttons .button { height: 49px; min-width: 118px; }
.manager-search-submit { background: #0b5f88; color: #fff; }
.manager-search-submit:hover { background: #084d70; }
.orders-toolbar { min-height: 96px; display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 26px; border-top: 1px solid #edf1f4; }
.orders-toolbar > strong { font-size: 15px; white-space: nowrap; }
.orders-toolbar-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
.toolbar-button { min-height: 38px; border: 0; border-radius: 9px; background: #e2ebf1; color: #092c48; padding: 9px 13px; font-size: 13px; font-weight: 700; white-space: nowrap; }
.toolbar-button:hover { background: #d5e2e9; }
.toolbar-button.import { background: #dceef5; color: #075f81; }
.toolbar-button:disabled { opacity: .55; cursor: default; }
.select-all { display: flex; grid-template-columns: auto 1fr; align-items: center; gap: 8px; color: #061627; font-size: 13px; font-weight: 600; white-space: nowrap; }
.select-all input, .order-check { appearance: none; width: 22px; height: 22px; margin: 0; padding: 0; border: 1px solid #c7d6e0; border-radius: 5px; background: #fff; box-shadow: none; cursor: pointer; }
.select-all input:checked, .order-check:checked { background: #0b6d97; border-color: #0b6d97; box-shadow: inset 0 0 0 5px #fff; }
.delete-all-button { min-height: 38px; background: #e30613 !important; border-radius: 9px; box-shadow: none !important; padding: 9px 15px; font-size: 13px; white-space: nowrap; }
.manager-order-list { display: grid; gap: 9px; }
.manager-order-card { min-height: 150px; display: grid; grid-template-columns: 22px minmax(0, 1fr); align-items: center; gap: 16px; background: #fff; border: 1px solid #cad8e1; border-radius: 16px; box-shadow: 0 2px 4px rgba(18,48,69,.10); padding: 24px 22px; transition: border-color .15s, background .15s; }
.manager-order-card.selected { border-color: #65a8c3; background: #f9fdff; }
.manager-order-copy { min-width: 0; }
.manager-order-copy h2 { margin: 0 0 11px; color: #03111f; font-size: 15px; font-weight: 850; text-transform: uppercase; }
.manager-order-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.manager-order-heading h2 { min-width: 0; }
.order-detail-button { flex: 0 0 auto; margin-top: -7px; }
.order-meta { display: flex; align-items: center; gap: 0; flex-wrap: wrap; color: #42607d; font-size: 13px; }
.order-meta span { display: inline-flex; align-items: center; }
.order-meta span:not(:last-child)::after { content: ""; width: 1px; height: 15px; margin: 0 14px; background: #d7e0e7; }
.manager-pagination { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 18px 4px 4px; color: #506579; font-size: 13px; }
.manager-pagination > div { display: flex; gap: 8px; }
.manager-orders-page .import-panel, .manager-orders-page .delete-panel { border-color: #cad8e1; border-radius: 16px; }
.order-detail-overlay { position: fixed; z-index: 1000; inset: 0; display: grid; place-items: center; padding: 22px; background: rgba(3,17,31,.62); }
.order-detail-card { width: min(1040px, 100%); max-height: calc(100vh - 44px); overflow: auto; border-radius: 16px; background: #fff; padding: 24px; box-shadow: 0 24px 70px rgba(0,0,0,.35); }
.order-detail-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.order-detail-title span { color: #64798d; font-size: 11px; font-weight: 800; letter-spacing: .7px; text-transform: uppercase; }
.order-detail-title h2 { margin: 4px 0 0; color: #061525; font-size: 24px; }
.order-detail-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 13px; }
.order-detail-grid label { color: #28475f; font-size: 11px; }
.order-detail-grid input[readonly] { border-color: #e0e7ec; background: #f4f7f9; color: #486177; }
.order-detail-actions { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: 22px; padding-top: 18px; border-top: 1px solid #e2e8ed; }
.order-detail-actions > div { display: flex; gap: 9px; }

@media (max-width: 1240px) {
  .orders-toolbar { align-items: flex-start; flex-direction: column; padding: 20px 0; }
  .orders-toolbar-actions { justify-content: flex-start; }
}
@media (max-width: 900px) {
  .year-card-grid { grid-template-columns: 1fr; }
  .dashboard-bottom-grid { grid-template-columns: 1fr; }
  .orders-chart { overflow-x: auto; grid-template-columns: repeat(12, minmax(45px, 1fr)); }
  .report-criteria { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .report-order-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .manager-search-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .manager-search-title { margin-bottom: 34px; }
  .order-detail-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 620px) {
  .today-card-grid { grid-template-columns: 1fr; }
  .today-card { min-height: 115px; }
  .dashboard-panel h2 { padding: 19px 16px 14px; }
  .monthly-breakdown th:first-child { width: 25%; }
  .report-criteria { grid-template-columns: 1fr; }
  .report-order-grid { grid-template-columns: 1fr; }
  .report-order-card h2 { margin-bottom: 22px; }
  .report-order-pagination { flex-wrap: wrap; }
  .report-form-card h2 { margin-bottom: 22px; }
  .report-result-strip { align-items: stretch; flex-direction: column; }
  .cookie-dealer-head { grid-template-columns: 1fr; gap: 4px; }
  .manager-search-card { padding: 22px 18px 0; }
  .manager-search-grid { grid-template-columns: 1fr; }
  .manager-search-buttons { justify-content: stretch; }
  .manager-search-buttons .button { flex: 1; }
  .orders-toolbar-actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .orders-toolbar-actions > * { width: 100%; justify-content: center; }
  .delete-all-button { grid-column: 1 / -1; }
  .order-meta { display: grid; gap: 6px; }
  .manager-order-heading, .order-detail-actions { align-items: stretch; flex-direction: column; }
  .order-detail-grid { grid-template-columns: 1fr; }
  .order-detail-actions > div { display: grid; }
  .order-meta span:not(:last-child)::after { display: none; }
  .manager-order-card { min-height: 0; align-items: start; }
}
@media (max-width: 900px) { .security-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) { .profile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .security-grid { grid-template-columns: 1fr 1fr; } .month-picker { width: 100%; } .page-controls { align-items: stretch; flex-direction: column; } .profile-grid { grid-template-columns: 1fr; } .profile-grid .wide { grid-column: span 1; } }