/* ============================================================
   SWP LAUNDRY IN — DESKTOP CANONICAL R14
   Desktop only (>= 992px). This file intentionally does not style mobile.
   Goals:
   1) one real logo-blue desktop sidebar source of truth;
   2) restore clean full-width desktop report/filter geometry;
   3) keep the stable framework shell and all application functions untouched.
   ============================================================ */
@media (min-width: 992px) {
  /* ---------- DESKTOP SHELL: keep framework geometry stable ---------- */
  .layout-wrapper .layout-main-container {
    min-height: 100vh !important;
    padding: 6rem 2rem 0 !important;
  }
  .layout-wrapper.layout-static .layout-main-container {
    margin-left: 22rem !important;
  }
  .layout-wrapper.layout-static.layout-static-inactive .layout-main-container {
    margin-left: 0 !important;
    padding-left: 2rem !important;
  }
  .layout-wrapper .layout-main {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    padding-bottom: 2rem !important;
  }

  /* ---------- SIDEBAR: stronger than the legacy pale canonical rule ---------- */
  .layout-wrapper .layout-sidebar,
  .layout-wrapper.layout-static .layout-sidebar {
    position: fixed !important;
    top: 6rem !important;
    left: 2rem !important;
    width: 20rem !important;
    height: calc(100vh - 8rem) !important;
    padding: .65rem 1.25rem 1rem !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    opacity: 1 !important;
    background: linear-gradient(180deg, #155b98 0%, #176bb2 54%, #15588f 100%) !important;
    background-color: #155b98 !important;
    border: 1px solid rgba(10, 62, 105, .38) !important;
    border-radius: 14px !important;
    box-shadow: 0 14px 32px rgba(22, 74, 120, .14) !important;
  }

  /* Kill every pale/white inner surface that used to cover the blue panel. */
  .layout-wrapper .layout-sidebar > div,
  .layout-wrapper .layout-sidebar > nav,
  .layout-wrapper .layout-sidebar .layout-menu,
  .layout-wrapper .layout-sidebar .layout-menu > ul,
  .layout-wrapper .layout-sidebar .layout-menu ul,
  .layout-wrapper .layout-sidebar .layout-root-menuitem,
  .layout-wrapper .layout-sidebar .layout-menuitem,
  .layout-wrapper .layout-sidebar .layout-menuitem-content {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    filter: none !important;
  }

  .layout-wrapper .layout-sidebar .layout-menu .layout-root-menuitem > .layout-menuitem-root-text,
  .layout-wrapper .layout-sidebar .layout-menuitem-root-text {
    color: rgba(232, 245, 255, .68) !important;
    font-size: .72rem !important;
    font-weight: 800 !important;
    letter-spacing: .07em !important;
  }

  .layout-wrapper .layout-sidebar .layout-menu ul a,
  .layout-wrapper .layout-sidebar .layout-menu ul a .layout-menuitem-text,
  .layout-wrapper .layout-sidebar .layout-menu ul a .layout-menuitem-icon,
  .layout-wrapper .layout-sidebar .layout-menu ul a .layout-submenu-toggler,
  .layout-wrapper .layout-sidebar .layout-menu ul a i,
  .layout-wrapper .layout-sidebar .layout-menu ul a svg {
    color: rgba(245, 251, 255, .94) !important;
    fill: currentColor !important;
  }

  .layout-wrapper .layout-sidebar .layout-menu ul a {
    min-height: 42px !important;
    margin: 2px 0 !important;
    padding: .68rem .9rem !important;
    border-radius: 10px !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .layout-wrapper .layout-sidebar .layout-menu ul a:hover {
    color: #fff !important;
    background: rgba(255, 255, 255, .11) !important;
  }
  .layout-wrapper .layout-sidebar .layout-menu ul a:hover * {
    color: #fff !important;
  }

  /* Leaf/current menu only. Avoid making the Dashboard root look active on child routes. */
  .layout-wrapper .layout-sidebar .layout-menu ul a.active-route,
  .layout-wrapper .layout-sidebar .layout-menu ul a.router-link-exact-active,
  .layout-wrapper .layout-sidebar .layout-menu ul a[aria-current="page"] {
    color: #1766a6 !important;
    background: #fff !important;
    box-shadow: inset 3px 0 0 #5bb9e8 !important;
    font-weight: 700 !important;
  }
  .layout-wrapper .layout-sidebar .layout-menu ul a.active-route *,
  .layout-wrapper .layout-sidebar .layout-menu ul a.router-link-exact-active *,
  .layout-wrapper .layout-sidebar .layout-menu ul a[aria-current="page"] * {
    color: #1766a6 !important;
  }

  /* Parent menu with an active child: subtle, not a second white active item. */
  .layout-wrapper .layout-sidebar .layout-menu li.active-menuitem > a:not(.active-route):not(.router-link-exact-active) {
    color: #fff !important;
    background: rgba(255, 255, 255, .08) !important;
    box-shadow: none !important;
  }
  .layout-wrapper .layout-sidebar .layout-menu li.active-menuitem > a:not(.active-route):not(.router-link-exact-active) * {
    color: #fff !important;
  }

  .layout-wrapper .layout-sidebar::-webkit-scrollbar { width: 6px !important; }
  .layout-wrapper .layout-sidebar::-webkit-scrollbar-track { background: transparent !important; }
  .layout-wrapper .layout-sidebar::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .22) !important;
    border-radius: 999px !important;
  }

  /* ---------- DESKTOP PAGE RHYTHM ---------- */
  .layout-main .laundry-page-heading {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin-bottom: 14px !important;
  }
  .layout-main .laundry-owner-scope {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin-bottom: 16px !important;
  }

  /* ---------- REPORT / TRANSACTION FILTERS ----------
     Legacy compiled CSS forced max-width:720px and two columns on desktop.
     Let each row use the available desktop canvas and let 2/3/4 fields divide
     it evenly according to the number of actual children. */
  .layout-main .transaction-report-filters,
  .layout-main .transaction-report-filters > .daily-report-filter-source,
  .layout-main .daily-report-filter-source,
  .layout-main .daily-report-controls-source {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }

  .layout-main .transaction-report-filters {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
    margin: 0 0 10px !important;
  }

  .layout-main .transaction-report-filters > .daily-report-filter-source,
  .layout-main .transaction-report-filters > .daily-report-controls-source {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
    gap: 14px !important;
    align-items: end !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* Shared desktop report rows (Daily/Owner/etc.) stay full width and balanced. */
  .layout-main .daily-report-controls-source {
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important;
    gap: 14px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .layout-main .report-control-cell {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
  }
  .layout-main .report-control-cell > label {
    margin-bottom: 6px !important;
    line-height: 1.25 !important;
  }

  .layout-main .report-control-cell .p-datepicker,
  .layout-main .report-control-cell .p-calendar,
  .layout-main .report-control-cell .p-select,
  .layout-main .report-control-cell .p-dropdown,
  .layout-main .report-control-cell .p-inputtext,
  .layout-main .daily-report-date-control-source,
  .layout-main .daily-report-time-select-source {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  .layout-main .transaction-total-count {
    margin: 12px 2px 12px !important;
  }

  /* The table viewport may scroll internally, never stretch the page shell. */
  .layout-main .p-datatable-wrapper {
    max-width: 100% !important;
    overflow-x: auto !important;
  }

  /* ---------- GENERIC DESKTOP SURFACES ---------- */
  .layout-main .card,
  .layout-main .surface-card,
  .layout-main .p-card,
  .layout-main .p-panel {
    max-width: 100% !important;
    min-width: 0 !important;
  }
}