/* ===== Sidebar + Dashboard after the Lunoz admin theme (owner, 2026-10-14: "inspire yourself from https://myrathemes.in/lunoz/ to redesign
   the sidebar and dashboard"; chose the full menu with folding sections and Lunoz's "Baloo Paaji 2" font). Values read from the theme:
   sidebar #1F1F31, links #9097A7 → white, uppercase section titles, light cards #F5F7FA with a #E9EDF3 hairline, soft badges, KPI cards
   with an uppercase label, the figure and an outline icon at the right. The white-label business colour (--brand) stays the accent. ===== */
:root {
  --lz-side: #1F1F31; --lz-side-2: #191928; --lz-side-text: #9097A7; --lz-side-rule: rgba(255, 255, 255, .06);
  --lz-card: #F5F7FA; --lz-rule: #E9EDF3; --lz-head: #343A40; --lz-text: #6B7177; --lz-muted: #8A9099;
  --lz-green: #1BB394; --lz-red: #EF5350; --lz-amber: #F5B225; --lz-blue: #346EE0;
  --lz-font: 'Baloo Paaji 2', 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

/* ---------- sidebar: the owner kept the previous sidebar (2026-10-14: "I like the new font but I prefered the old sidebar"); only the font ---------- */
.sidebar, .sidebar-brand .app-name, .sb-panel-title, .sidebar-search input { font-family: var(--lz-font); }
.sidebar-nav .nav-link { font-size: 1.05rem; line-height: 1.25; }

/* ---------- Dashboard ---------- */
.content.dash-lunoz { background: #fff; font-family: var(--lz-font); color: var(--lz-text); }
.dash-lunoz .card { background: var(--lz-card); border: 1px solid var(--lz-rule); border-radius: 4px; box-shadow: none; }
.dash-lunoz .alert-light { background: var(--lz-card) !important; border: 1px solid var(--lz-rule) !important; border-radius: 4px; color: var(--lz-text); }
/* the four counters = the theme's KPI cards: uppercase label, the figure, an outline icon at the right, a soft note under */
.dash-lunoz .dash-att { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 1.5rem; margin-bottom: 1.5rem !important; }
.dash-lunoz .dash-att-item { display: grid; grid-template-columns: 1fr auto; grid-template-areas: 'label ico' 'n ico' 'x x'; align-items: start; gap: .1rem .75rem;
  padding: 1.1rem 1.25rem 1.15rem; background: var(--lz-card); border: 1px solid var(--lz-rule); border-radius: 4px; box-shadow: none; text-align: left; color: var(--lz-text); font-family: var(--lz-font); }
.dash-lunoz .dash-att-item:hover:not(:disabled) { border-color: #D3D9E3; background: #F0F3F7; }
.dash-lunoz .dash-att-item:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.dash-lunoz .dash-att-label { grid-area: label; font-size: .92rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--lz-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-lunoz .dash-att-ico { grid-area: ico; align-self: center; font-size: 2rem; line-height: 1; color: var(--lz-head); background: none; width: auto; height: auto; }
.dash-lunoz .dash-att-n { grid-area: n; font-size: 1.85rem; font-weight: 600; line-height: 1.2; color: var(--lz-head); padding: 0; background: none; min-width: 0; text-align: left; }
.dash-lunoz .dash-att-x { grid-area: x; justify-self: start; margin-top: .45rem; padding: .1rem .45rem; border-radius: 4px; font-size: .8rem; font-weight: 700; line-height: 1.5; background: rgba(52, 110, 224, .12); color: var(--lz-blue); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.dash-lunoz .dash-att-x-none { background: none; color: var(--lz-muted); font-weight: 400; padding-left: 0; }
.dash-lunoz .att-input .dash-att-x { background: rgba(239, 83, 80, .14); color: #C62828; }
.dash-lunoz .att-slots .dash-att-x { background: rgba(245, 178, 37, .18); color: #8A5D00; }
.dash-lunoz .att-quote .dash-att-x { background: rgba(27, 179, 148, .14); color: #0E7A63; }
.dash-lunoz .att-input:not(.zero) .dash-att-ico { color: var(--lz-red); }
.dash-lunoz .dash-att-item.on { background: #fff; border-color: var(--brand); box-shadow: inset 0 0 0 1px var(--brand); }
.dash-lunoz .dash-att-item.on .dash-att-label { color: var(--brand); }
.dash-lunoz .dash-att-item.zero { opacity: 1; }
.dash-lunoz .dash-att-item.zero .dash-att-n, .dash-lunoz .dash-att-item.zero .dash-att-ico { color: #B4BAC2; }
.dash-lunoz .dash-att > .btn-link { align-self: center; justify-self: start; font-family: var(--lz-font); }
/* the projects card: a title like "Recent Buyers", a light toolbar, then the table */
.dash-lunoz .dash-toolbar { padding: 1.1rem 1.25rem .5rem; }
.dash-lunoz .dash-card-title { font-family: var(--lz-font); font-size: 1.4rem; font-weight: 600; color: var(--lz-head); white-space: nowrap; }
.dash-lunoz .dash-card-count { margin-left: .3rem; padding: .05rem .45rem; border-radius: 4px; background: rgba(52, 110, 224, .12); color: var(--lz-blue); font-size: .85rem; font-weight: 700; vertical-align: .2em; }
.dash-lunoz .dash-search { width: 23rem; max-width: 100%; }
.dash-lunoz .form-control, .dash-lunoz .form-select, .dash-lunoz .input-group-text { border-color: var(--lz-rule); border-radius: 4px; background-color: #fff; font-family: var(--lz-font); color: var(--lz-head); }
.dash-lunoz .input-group-text { color: var(--lz-muted); }
.dash-lunoz .form-control::placeholder { color: var(--lz-muted); }
.dash-lunoz .form-check-label, .dash-lunoz .small { font-family: var(--lz-font); }
.dash-lunoz .dash-legend-line { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; padding: 0 1.25rem .8rem; }
.dash-lunoz #dash-table { --bs-table-bg: transparent; --bs-table-color: var(--lz-text); color: var(--lz-text); font-family: var(--lz-font); margin: 0; }
.dash-lunoz #dash-table > thead > tr > th { background: transparent !important; color: var(--lz-head); font-weight: 600; font-size: 1rem; text-transform: none; letter-spacing: 0; padding: .75rem .75rem; border-top: 1px solid var(--lz-rule); border-bottom: 1px solid var(--lz-rule); white-space: nowrap; }
.dash-lunoz #dash-table > thead > tr > th:first-child, .dash-lunoz #dash-table > tbody > tr > td:first-child { padding-left: 1.25rem; }
.dash-lunoz #dash-table > thead > tr > th:last-child, .dash-lunoz #dash-table > tbody > tr > td:last-child { padding-right: 1.25rem; }
.dash-lunoz #dash-table > tbody > tr > td { border-color: var(--lz-rule); line-height: 1.3; }
.dash-lunoz #dash-table > tbody + tbody > tr.wo-main > td { border-top: 1px solid var(--lz-rule); }
.dash-lunoz #dash-table > tbody.wo-group:nth-of-type(even) > tr > td { --bs-table-bg-type: color-mix(in srgb, var(--brand) 5%, var(--lz-card)); } /* the alternate project shading (owner, 2026-10-09) */
.dash-lunoz #dash-table > tbody.dash-project:hover > tr > td { --bs-table-bg-state: color-mix(in srgb, var(--brand) 9%, white); }
.dash-lunoz #dash-table a.font-monospace { font-family: var(--lz-font) !important; font-weight: 700; font-size: 1.05rem; color: var(--brand); letter-spacing: .01em; }
.dash-lunoz #dash-table .fw-semibold { color: var(--lz-head); font-weight: 600 !important; }
.dash-lunoz #dash-table .text-secondary { color: var(--lz-muted) !important; }
.dash-lunoz #dash-table > thead > tr > th.dash-sortable { cursor: pointer; user-select: none; }
.dash-lunoz #dash-table > thead > tr > th.dash-sortable:hover, .dash-lunoz th.dash-sortable.sorted, .dash-lunoz th.dash-sortable.sorted .dash-sort-ico { color: var(--brand); }
.dash-lunoz .dash-sort-ico { margin-left: .35rem; font-size: .8em; color: #C3C9D1; }
/* soft badges, as the theme's "Mobile / Tablet" pills */
.dash-lunoz .mx-pill, .dash-lunoz .pr-slots, .dash-lunoz #dash-table a.badge.text-bg-light { display: inline-block; border: 0 !important; border-radius: 4px; font-size: .78rem; font-weight: 700; line-height: 1.45; padding: .05rem .45rem; vertical-align: .1em; }
.dash-lunoz .mx-pill { background: rgba(138, 144, 153, .14); color: #5E656C; }
.dash-lunoz .mx-pill.mx-st-lancer { background: rgba(52, 110, 224, .12); color: var(--lz-blue); }
.dash-lunoz .mx-pill.mx-st-fini, .dash-lunoz .mx-pill.mx-quote { background: rgba(27, 179, 148, .14); color: #0E7A63; }
.dash-lunoz .mx-pill.mx-st-annule { background: rgba(239, 83, 80, .14); color: #C62828; }
.dash-lunoz .mx-pill:is(.mx-st-stand_by, .mx-st-reporte, .mx-st-non_fini, .mx-st-non_faite) { background: rgba(245, 178, 37, .18); color: #8A5D00; }
.dash-lunoz #dash-table a.badge.text-bg-light { background: rgba(138, 144, 153, .14) !important; color: var(--lz-head) !important; }
.dash-lunoz .pr-slots.full { background: rgba(27, 179, 148, .14); color: #0E7A63; }
.dash-lunoz .pr-slots.part { background: rgba(245, 178, 37, .18); color: #8A5D00; }
.dash-lunoz .pr-slots.none { background: rgba(239, 83, 80, .14); color: #C62828; }
.dash-lunoz #dash-table .btn-sm { border-radius: 4px; font-family: var(--lz-font); font-size: .82rem; }
.dash-lunoz #dash-table .btn-outline-secondary { --bs-btn-color: var(--lz-text); --bs-btn-border-color: var(--lz-rule); --bs-btn-bg: #fff; --bs-btn-hover-bg: var(--lz-card); --bs-btn-hover-color: var(--lz-head); --bs-btn-hover-border-color: #D3D9E3; }
.dash-lunoz #dash-table .text-success { color: #0E7A63 !important; }
.dash-lunoz #dash-table .text-danger { color: #C62828 !important; }
/* the completion steps keep their arrows, in the theme's colours */
.dash-lunoz .dash-step.st-done { --step-fg: #0E7A63; --step-bg: rgba(27, 179, 148, .16); --step-bd: transparent; }
.dash-lunoz .dash-step.st-ongoing { --step-fg: #8A5D00; --step-bg: rgba(245, 178, 37, .2); --step-bd: transparent; }
.dash-lunoz .dash-step.st-input { --step-fg: #C62828; --step-bg: rgba(239, 83, 80, .16); --step-bd: transparent; }
.dash-lunoz .dash-step.st-todo { --step-fg: #6B7177; --step-bg: #E9EDF3; --step-bd: transparent; }
.dash-lunoz #dash-table .dash-steps-row .dash-step { font-family: var(--lz-font); font-weight: 600; }
.dash-lunoz #dash-table .dash-steps-row .dash-step.st-done { background: #A9E3D6; color: #0B5E4C; }
.dash-lunoz #dash-table .dash-steps-row .dash-step.st-input { background: #F8B9B8; color: #8E1C1C; }
.dash-lunoz #dash-table .dash-steps-row .dash-step.st-ongoing { background: #FBDDA0; color: #6E4A00; }
.dash-lunoz #dash-table .dash-steps-row .dash-step.st-todo { background: #DDE2EA; color: #4D545B; }
.dash-lunoz .step-group-name { font-family: var(--lz-font); color: var(--lz-muted); border-color: #CDD3DC; }
.dash-lunoz a:not(.btn):not(.badge) { color: var(--brand); }
@media (max-width: 767.98px) { .dash-lunoz .dash-att { gap: .75rem; grid-template-columns: repeat(2, minmax(0, 1fr)); } .dash-lunoz .dash-att-item { padding: .8rem .9rem; } .dash-lunoz .dash-att-ico { font-size: 1.5rem; } }
/* page title in the same face as the sidebar; long KPI labels wrap instead of being cut; rows kept compact (PRODUCT.md) */
.topbar #page-title { font-family: var(--lz-font) !important; font-weight: 600; color: var(--lz-head); }
.dash-lunoz .dash-att-label { white-space: normal; line-height: 1.25; }
.dash-lunoz #dash-table > tbody > tr.wo-main > td { padding-top: .45rem; padding-bottom: .15rem; line-height: 1.2; }
.dash-lunoz #dash-table tr.dash-steps-row td { padding-top: 0; padding-bottom: .4rem; }
.dash-lunoz .step-group-name { line-height: 1; padding-bottom: 0; }
.dash-lunoz #dash-table .dash-steps-row .dash-step { line-height: 1.15; }
.dash-lunoz #dash-table .dash-steps-row .btn-sm { --bs-btn-padding-y: 0; line-height: 1.5; }
@media (max-width: 767.98px) { .topbar #page-title { min-width: 0; } .dash-lunoz .dash-att-label { font-size: .8rem; } }
.dash-lunoz .dash-att { align-items: stretch; } .dash-lunoz .dash-att-item { align-content: start; height: 100%; }