/* Relistate additions on top of the unmodified shared-theme. Everything reads the theme's --brand-* tokens, so dark mode works. */
body { font-family: 'Inter', 'Noto Sans Ethiopic', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; }
.nowrap { white-space: nowrap; }
.mono { font-variant-numeric: tabular-nums; font-feature-settings: 'tnum'; }
.text-end .mono, td.text-end { font-variant-numeric: tabular-nums; }
body.bare .app-sidebar, body.bare .app-topbar { display: none; }

/* cards */
.card { background: var(--brand-card-bg); border: 1px solid var(--brand-border); border-radius: var(--brand-radius); box-shadow: var(--brand-shadow-sm); }
.card-header { background: transparent; border-bottom: 1px solid var(--brand-border-soft); padding: .85rem 1.1rem; }
.card-title-sm { font-size: .95rem; font-weight: 600; margin: 0; }
.card-body { padding: 1.1rem; }

/* stat cards */
.stat-card { height: 100%; }
.stat-link { color: inherit; text-decoration: none; transition: transform .12s ease, box-shadow .12s ease; }
.stat-link:hover { transform: translateY(-2px); box-shadow: var(--brand-shadow); color: inherit; }
.stat-icon { flex: 0 0 44px; width: 44px; height: 44px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; font-size: 1.2rem; }
.tone-primary { background: var(--brand-soft-primary-bg); color: var(--brand-soft-primary-fg); }
.tone-success { background: var(--brand-soft-success-bg); color: var(--brand-soft-success-fg); }
.tone-warning { background: var(--brand-soft-warning-bg); color: var(--brand-soft-warning-fg); }
.tone-danger  { background: var(--brand-soft-danger-bg);  color: var(--brand-soft-danger-fg); }
.tone-info    { background: var(--brand-soft-info-bg);    color: var(--brand-soft-info-fg); }
[data-no-access] { cursor: default; }
.site-card[data-no-access]:hover, .stat-card[data-no-access]:hover { transform: none; box-shadow: none; }
.stat-label { font-size: .76rem; text-transform: uppercase; letter-spacing: .04em; color: var(--brand-text-muted); font-weight: 600; }
.stat-body { min-width: 0; }
.stat-value { font-size: clamp(1.1rem, 1.05rem + .5vw, 1.45rem); font-weight: 700; color: var(--brand-heading); line-height: 1.2; overflow-wrap: anywhere; }
.stat-sub { font-size: .78rem; color: var(--brand-text-muted); }

/* soft badges */
.badge { font-weight: 600; letter-spacing: .01em; padding: .38em .62em; border-radius: 6px; }
.badge-soft-primary { background: var(--brand-soft-primary-bg); color: var(--brand-soft-primary-fg); }
.badge-soft-success { background: var(--brand-soft-success-bg); color: var(--brand-soft-success-fg); }
.badge-soft-warning { background: var(--brand-soft-warning-bg); color: #B45309; }
html.theme-dark .badge-soft-warning { color: var(--brand-soft-warning-fg); }
.badge-soft-danger  { background: var(--brand-soft-danger-bg);  color: var(--brand-soft-danger-fg); }
.badge-soft-info    { background: var(--brand-soft-info-bg);    color: #0369A1; }
html.theme-dark .badge-soft-info { color: var(--brand-soft-info-fg); }
.badge-soft-secondary { background: var(--brand-border-soft); color: var(--brand-text-muted); }
.badge-soft-dark { background: var(--brand-heading); color: var(--brand-card-bg); }

/* tables */
.app-table { margin: 0; --bs-table-bg: transparent; --bs-table-hover-bg: var(--brand-border-soft); color: var(--brand-text); }
.app-table th { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--brand-text-muted); font-weight: 600; border-bottom: 1px solid var(--brand-border); white-space: nowrap; background: transparent; }
.app-table td { border-color: var(--brand-border-soft); vertical-align: middle; }
.app-table tr.clickable { cursor: pointer; }
.app-table tr.row-danger td { background: var(--brand-danger-50); }
html.theme-dark .app-table tr.row-danger td { background: rgba(239,68,68,.12); }
.app-table tfoot td { font-weight: 600; border-top: 2px solid var(--brand-border); }
.empty-state { text-align: center; color: var(--brand-text-muted); padding: 2.5rem 1rem; }
.empty-state .bi { font-size: 2rem; display: block; margin-bottom: .5rem; opacity: .6; }

/* key/value lists */
.kv { display: grid; grid-template-columns: minmax(110px, 38%) 1fr; gap: .45rem 1rem; margin: 0; }
.kv dt { color: var(--brand-text-muted); font-weight: 500; font-size: .82rem; }
.kv dd { margin: 0; font-weight: 500; word-break: break-word; }

/* tabs */
.app-tabs { border-bottom: 1px solid var(--brand-border); }
.app-tabs .nav-link { color: var(--brand-text-muted); border: 0; border-bottom: 2px solid transparent; font-weight: 500; padding: .6rem 1rem; }
.app-tabs .nav-link:hover { color: var(--brand-text); }
.app-tabs .nav-link.active { color: var(--brand-primary); background: transparent; border-bottom-color: var(--brand-accent); }
html.theme-dark .app-tabs .nav-link.active { color: #fff; }

/* filters bar */
.filters { display: flex; flex-wrap: wrap; gap: .6rem; align-items: end; margin-bottom: 1rem; }
.filters .form-control, .filters .form-select { min-width: 150px; }
.filters .grow { flex: 1 1 220px; }
.filters label { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--brand-text-muted); margin-bottom: .2rem; display: block; }
.view-toggle .btn { padding: .35rem .7rem; }

/* kanban board */
.board { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(260px, 1fr); gap: .9rem; overflow-x: auto; padding-bottom: .8rem; align-items: start; }
.board-col { background: var(--brand-border-soft); border-radius: var(--brand-radius); padding: .6rem; min-height: 160px; }
.board-col.drop { outline: 2px dashed var(--brand-accent); outline-offset: -2px; }
.board-col h3 { font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; color: var(--brand-text-muted); margin: .2rem .3rem .6rem; display: flex; justify-content: space-between; }
.lead-card { background: var(--brand-card-bg); border: 1px solid var(--brand-border); border-radius: 8px; padding: .65rem .75rem; margin-bottom: .5rem; cursor: grab; box-shadow: var(--brand-shadow-sm); }
.lead-card:hover { box-shadow: var(--brand-shadow); }
.lead-card .name { font-weight: 600; color: var(--brand-heading); }
.lead-card .meta { font-size: .76rem; color: var(--brand-text-muted); }
.lead-card.overdue { border-left: 3px solid var(--brand-danger); }

/* status stepper */
.stepper { display: flex; gap: 0; flex-wrap: wrap; }
.stepper .step { flex: 1 1 110px; text-align: center; padding: .5rem .3rem; font-size: .75rem; font-weight: 600; color: var(--brand-text-muted); border-bottom: 3px solid var(--brand-border); }
.stepper .step.done { color: var(--brand-success); border-bottom-color: var(--brand-success); }
.stepper .step.now { color: var(--brand-primary); border-bottom-color: var(--brand-accent); }
html.theme-dark .stepper .step.now { color: #fff; }

/* timeline */
.timeline { list-style: none; margin: 0; padding: 0 0 0 1.2rem; border-left: 2px solid var(--brand-border); }
.timeline li { position: relative; padding: 0 0 1.1rem 1rem; }
.timeline li::before { content: ''; position: absolute; left: -1.62rem; top: .3rem; width: 11px; height: 11px; border-radius: 50%; background: var(--brand-card-bg); border: 2px solid var(--brand-primary); }
.timeline .when { font-size: .75rem; color: var(--brand-text-muted); }

/* permission matrix */
.matrix-wrap { overflow: auto; max-height: 70vh; border: 1px solid var(--brand-border); border-radius: var(--brand-radius); }
.matrix { border-collapse: separate; border-spacing: 0; width: 100%; font-size: .82rem; }
.matrix th, .matrix td { padding: .35rem .6rem; border-bottom: 1px solid var(--brand-border-soft); white-space: nowrap; background: var(--brand-card-bg); }
.matrix thead th { position: sticky; top: 0; z-index: 2; background: var(--brand-card-bg); border-bottom: 2px solid var(--brand-border); }
.matrix td:first-child, .matrix th:first-child { position: sticky; left: 0; z-index: 1; border-right: 1px solid var(--brand-border); }
.matrix thead th:first-child { z-index: 3; }
.matrix .module td { background: var(--brand-border-soft); font-weight: 700; text-transform: uppercase; font-size: .7rem; letter-spacing: .06em; color: var(--brand-text-muted); }
.matrix select { min-width: 84px; padding: .15rem .4rem; font-size: .78rem; }
.matrix select.has-scope { border-color: var(--brand-primary); font-weight: 600; }
.matrix .changed { box-shadow: 0 0 0 2px var(--brand-accent); }
.matrix thead th .role-meta { white-space: normal; max-width: 150px; margin: 0 auto; }
.matrix .role-chips { display: flex; flex-wrap: wrap; gap: .2rem; justify-content: center; margin-top: .2rem; }
.matrix .role-chips .badge { font-size: .62rem; font-weight: 600; }
.matrix thead th.role-new { box-shadow: inset 0 -3px 0 var(--brand-accent); }
.scope-pill { display: inline-block; font-size: .7rem; font-weight: 700; padding: .12rem .45rem; border-radius: 99px; background: var(--brand-soft-primary-bg); color: var(--brand-soft-primary-fg); }

/* misc */
.card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; }
.site-card { transition: transform .12s ease, box-shadow .12s ease; color: inherit; display: block; height: 100%; }
.site-card:hover { transform: translateY(-2px); box-shadow: var(--brand-shadow); color: inherit; }
.unit-chip { display: inline-block; min-width: 70px; padding: .35rem .55rem; border-radius: 8px; border: 1px solid var(--brand-border); text-align: center; font-size: .75rem; font-weight: 600; margin: 0 .35rem .35rem 0; }
.unit-chip.NOT_RELEASED { background: transparent; color: var(--brand-text-muted); border-style: dashed; }
.unit-chip.semi { box-shadow: inset 0 -3px 0 var(--brand-accent); }   /* semi-finished: a bar under the chip */
.unit-chip.AVAILABLE { background: var(--brand-soft-success-bg); color: var(--brand-soft-success-fg); }
.unit-chip.RESERVED { background: var(--brand-soft-warning-bg); color: #B45309; }
.unit-chip.SOLD, .unit-chip.HANDED_OVER { background: var(--brand-soft-primary-bg); color: var(--brand-soft-primary-fg); }
.unit-chip.BLOCKED { background: var(--brand-border-soft); color: var(--brand-text-muted); }
.chart-box { position: relative; height: 260px; }
.chart-box.tall { height: 320px; }
.pay-row { display: grid; grid-template-columns: 26px 1fr 150px; gap: .6rem; align-items: center; padding: .45rem 0; border-bottom: 1px solid var(--brand-border-soft); }
.total-bar { display: flex; justify-content: space-between; font-weight: 700; font-size: 1.05rem; padding: .75rem 1rem; border-radius: 8px; background: var(--brand-soft-primary-bg); color: var(--brand-soft-primary-fg); }
pre.json { background: var(--brand-border-soft); border-radius: 8px; padding: .6rem .8rem; font-size: .75rem; max-height: 260px; overflow: auto; margin: 0; white-space: pre-wrap; word-break: break-all; }
.sidebar-footer .name, .topbar-user .name { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-main-inner { max-width: 1500px; }
.dropdown-menu { border-color: var(--brand-border); background: var(--brand-card-bg); }
.dropdown-item { color: var(--brand-text); }
html.theme-dark .modal-content { background: var(--brand-card-bg); color: var(--brand-text); border-color: var(--brand-border); }
html.theme-dark .table { --bs-table-color: var(--brand-text); }
html.theme-dark .form-text, html.theme-dark .breadcrumb-item.active { color: var(--brand-text-muted); }
html.theme-dark .page-link { background: var(--brand-card-bg); border-color: var(--brand-border); color: var(--brand-text); }
html.theme-dark .page-item.active .page-link { background: var(--brand-accent); border-color: var(--brand-accent); color: var(--brand-on-accent); }
html.theme-dark .list-group-item { background: var(--brand-card-bg); color: var(--brand-text); border-color: var(--brand-border); }
:focus-visible { outline: 2px solid var(--brand-accent); outline-offset: 2px; }
@media (max-width: 767px) {
  .page-header { flex-direction: column; gap: .75rem; }
  .kv { grid-template-columns: 1fr; gap: .1rem; }
  .kv dd { margin-bottom: .5rem; }
  .pay-row { grid-template-columns: 26px 1fr; } .pay-row input { grid-column: 2; }
}
@media print {
  .app-sidebar, .app-topbar, .app-footer, .page-header .btn, .filters, .no-print, .toast-container { display: none !important; }
  body { background: #fff !important; }
  .app-main { margin: 0 !important; padding: 0 !important; }
  .card { box-shadow: none; border: 1px solid #ccc; }
  @page { size: A4; margin: 14mm; }
  .paper { border: 0 !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important; max-width: none !important; }
  .paper-contract { break-inside: auto; }
  .paper tr, .paper-sign { break-inside: avoid; }
  .paper thead { display: table-header-group; }
  .paper-h2, .paper-h3 { break-after: avoid; }
}

/* ------------- printable papers: receipt and customer statement (always black on white, like paper) ------------- */
.paper { position: relative; background: #fff; color: #111; border: 1px solid var(--brand-border); border-radius: var(--brand-radius); box-shadow: var(--brand-shadow-sm); padding: 2rem 2.25rem; max-width: 820px; margin: 0 auto 2rem; font-size: .92rem; }
.paper .table { --bs-table-color: #111; --bs-table-bg: transparent; --bs-table-border-color: #d5d9e0; --bs-table-striped-bg: transparent; color: #111; margin-bottom: .75rem; }
.paper .table th { color: #3d4654; font-weight: 600; background: transparent; text-transform: none; letter-spacing: 0; font-size: .82rem; }
.paper .text-muted { color: #5b6472 !important; }
.paper-head { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; border-bottom: 2px solid #111; padding-bottom: .9rem; margin-bottom: 1.1rem; }
.paper-company-name { font-size: 1.15rem; font-weight: 700; }
.paper-company-am { font-size: .95rem; }
.paper-title { text-align: right; }
.paper-title-text { font-size: 1.05rem; font-weight: 700; letter-spacing: .06em; }
.paper-meta { margin-bottom: 1rem; }
.paper-label { font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; color: #5b6472; font-weight: 600; }
.paper-value { font-weight: 600; font-size: 1rem; }
.paper-amount { border: 2px solid #111; border-radius: 8px; padding: .8rem 1rem; margin: .5rem 0 1rem; text-align: center; }
.paper-amount-value { font-size: 1.8rem; font-weight: 700; line-height: 1.2; }
.paper-words { font-style: italic; }
.paper-table th[scope=row] { width: 34%; font-weight: 600; }
.pa-table th[scope=row] { width: auto; }
.pa-table .paper-sec th { background: #eef1f5 !important; font-size: .78rem; letter-spacing: .05em; text-transform: uppercase; padding-top: .5rem; }
.pa-table .pa-no { width: 2.6rem; white-space: nowrap; }
.pa-table .pa-total td, .pa-table .pa-total th { border-top: 2px solid #111; font-size: 1.05rem; }
.paper-summary th[scope=row] { width: auto; }
.paper-h2 { font-size: 1.05rem; font-weight: 700; margin: 1.4rem 0 .15rem; border-top: 1px solid #aeb5c2; padding-top: .8rem; }
.paper-h3 { font-size: .85rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; margin: .9rem 0 .35rem; color: #3d4654; }
.paper-sign { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin-top: 2.5rem; text-align: center; }
.paper-line { border-top: 1px solid #111; margin-top: 2.2rem; }
.paper-foot { margin-top: 1.5rem; border-top: 1px solid #d5d9e0; padding-top: .6rem; }
.paper.is-void .paper-head, .paper.is-void .paper-amount { opacity: .55; }
.paper-void { position: absolute; top: 38%; left: 50%; transform: translate(-50%, -50%) rotate(-18deg); font-size: 6rem; font-weight: 800; letter-spacing: .2em; color: rgba(220, 38, 38, .22); border: .5rem solid rgba(220, 38, 38, .22); padding: 0 1.5rem; pointer-events: none; }
@media (max-width: 575px) { .paper { padding: 1.1rem; } .paper-head { flex-direction: column; } .paper-title { text-align: left; } .paper-sign { grid-template-columns: 1fr; } }

/* ------------- login page ------------- */
.login-body { background: var(--brand-body-bg); min-height: 100vh; }
.login-wrap { display: grid; grid-template-columns: 1.05fr 1fr; min-height: 100vh; }
.login-hero { background: linear-gradient(155deg, #0B1437 0%, #1E3A8A 100%); color: #E0E7FF; padding: 4rem; align-items: center; }
.login-hero h1 { color: #fff; font-size: 2.6rem; margin: 1.2rem 0 .6rem; }
.login-hero .lead { color: #C7D2FE; max-width: 30rem; }
.hero-points { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: .8rem; }
.hero-points .bi { color: var(--brand-accent); margin-right: .5rem; }
.brand-mark { width: 56px; height: 56px; border-radius: 14px; background: var(--brand-accent); color: var(--brand-on-accent); display: inline-flex; align-items: center; justify-content: center; font-size: 1.7rem; }
.small-mark { width: 44px; height: 44px; font-size: 1.3rem; margin-bottom: 1rem; }
.login-card-wrap { display: flex; align-items: center; justify-content: center; padding: 2rem 1.25rem; }
.login-card { width: 100%; max-width: 400px; }
.login-card h2 { font-size: 1.6rem; }
.login-card .btn-link { text-decoration: none; }
.login-card .btn-link:disabled { color: var(--bs-secondary-color, #6c757d); }
.code-input { font-size: 1.6rem; letter-spacing: .5rem; font-variant-numeric: tabular-nums; }
@media (max-width: 991px) { .login-wrap { grid-template-columns: 1fr; } }

/* highlighted table rows (overdue / frozen) */
.app-table tr.table-danger-soft > td { background: var(--brand-soft-danger-bg); }
.app-table tr.table-warning-soft > td { background: var(--brand-soft-warning-bg); }
.app-table tr.table-danger-soft:hover > td, .app-table tr.table-warning-soft:hover > td { filter: brightness(.97); }

/* the HTML hidden attribute must win over Bootstrap's d-flex etc. */
[hidden] { display: none !important; }

/* ---- language switch on the sign-in page ---- */
.login-card-wrap { position: relative; }
.lang-switch { position: absolute; top: 1rem; right: 1.25rem; display: flex; gap: .25rem; z-index: 2; }
.lang-switch .btn { text-decoration: none; color: var(--bs-secondary-color, #64748b); font-weight: 500; }
.lang-switch .btn[aria-pressed="true"] { color: var(--bs-primary, #1e3a8a); font-weight: 700; text-decoration: underline; }

/* ---- date entry in the Ethiopian calendar / in Amharic (public/js/datepicker.js) ---- */
.date-picker { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; }
.date-picker .form-select { padding-left: .5rem; padding-right: 1.5rem; background-position: right .4rem center; min-width: 0; }
.date-picker .dp-d { flex: 0 0 4.2rem; }
.date-picker .dp-m { flex: 1 1 6.5rem; }
.date-picker .dp-y { flex: 0 0 5.4rem; }
.date-picker .dp-timerow { flex: 1 0 100%; display: flex; gap: .35rem; align-items: center; }
.date-picker .dp-timerow .dp-time { flex: 0 0 4.4rem; }
.date-picker.is-invalid .form-select { border-color: var(--bs-form-invalid-border-color, #dc3545); }
.date-picker.is-invalid ~ .invalid-feedback { display: block; }
html[lang="am"] body { font-family: 'Noto Sans Ethiopic', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; }