/* =====================================================================
   CTR SUITE / WARA — FINAL ALIGNMENT V205
   Last-loaded geometry guard.
   Dashboard = shell/page baseline. POS keeps its dedicated workflow density.
   This layer only normalizes layout geometry and responsive presentation.
   ===================================================================== */

:root{
  --ctr-final-page-x:28px;
  --ctr-final-page-y:24px;
  --ctr-final-page-bottom:56px;
  --ctr-final-card-radius:16px;
  --ctr-final-control-h:40px;
  --ctr-final-gap:14px;
}

html,body,.app,.main{max-width:100%;}
.main{min-width:0!important;width:auto!important;}
.main > .content,.main > .module-page{min-width:0!important;width:100%!important;box-sizing:border-box!important;}

/* Dashboard-equivalent canvas for every standard workspace page. */
body:not(.ctr-pos-page) .main > .content,
body:not(.ctr-pos-page) .main > .module-page,
body:not(.ctr-pos-page) .main > .opening-shift-page,
body:not(.ctr-pos-page) .main > .customer-page,
body:not(.ctr-pos-page) .main > .profile-page,
body:not(.ctr-pos-page) .main > .billing-content,
body:not(.ctr-pos-page) .main > .notifications-page{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:var(--ctr-final-page-y) var(--ctr-final-page-x) var(--ctr-final-page-bottom)!important;
  box-sizing:border-box!important;
}

/* Remove legacy double-padding / centered narrow canvases. */
body:not(.ctr-pos-page) .main > .content > .page,
body:not(.ctr-pos-page) .main > .content > .module-page,
body:not(.ctr-pos-page) .main > .content > .customer-page,
body:not(.ctr-pos-page) .main > .content > .profile-page,
body:not(.ctr-pos-page) .main > .content > .opening-shift-page,
body:not(.ctr-pos-page) .main > .content > .rh-page,
body:not(.ctr-pos-page) .main > .content > .cs-page,
body:not(.ctr-pos-page) .main > .content > .cr-root,
body:not(.ctr-pos-page) .main > .content > .bon-modern-page,
body:not(.ctr-pos-page) .main > .content > .reports-detail-page,
body:not(.ctr-pos-page) .main > .content > .sales-modern-page{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
}

/* Canonical header rhythm. */
.main .page-head,.main .module-head,.main .pb-page-head,.main .customer-head,
.main .profile-head,.main .opening-head,.main .rh-head,.main .cs-page-head,
.main .cr-page-head,.main .billing-head,.main .notifications-head{
  margin-top:0!important;
  margin-bottom:18px!important;
  gap:12px!important;
  min-width:0!important;
}
.main .page-head h1,.main .module-head h1,.main .pb-page-head h1,
.main .customer-head h1,.main .profile-head h1,.main .opening-head h1,
.main .rh-head h1,.main .cs-page-head h1,.main .cr-page-head h1,
.main .billing-head h1,.main .notifications-head h1{
  font-size:24px!important;
  line-height:1.2!important;
  letter-spacing:-.03em!important;
  margin-top:0!important;
}
.main .page-head p,.main .module-head p,.main .pb-page-head p,
.main .customer-head p,.main .profile-head p,.main .opening-head p,
.main .rh-head p,.main .cs-page-head p,.main .cr-page-head p,
.main .billing-head p,.main .notifications-head p{
  font-size:12px!important;
  line-height:1.5!important;
}

/* Shared component geometry. Colors intentionally remain page/theme-owned. */
.main .m-card,.main .pb-card,.main .list-card,.main .filter-bar,
.main .customer-table-wrap,.main .customer-toolbar,.main .profile-card,
.main .tbl-card,.main .rh-card,.main .cs-card,.main .cr-card,
.main .billing-card,.main .settings-card,.main .owner-panel,
.main .sales-modern-page .filter-card,.main .sales-modern-page .table-card,
.main .reports-detail-page .panel{
  border-radius:var(--ctr-final-card-radius)!important;
  box-sizing:border-box!important;
}
.main .stats,.main .summary-grid,.main .m-grid,.main .pb-summary-grid,
.main .finance-kpi-grid,.main .owner-kpi-grid,.main .cr-kpi-grid,
.main .cs-kpi-grid,.main .tbl-stats{gap:10px!important;}

/* Prevent legacy controls from looking oversized relative to dashboard/POS. */
.main .btn,.main .m-btn,.main .pb-btn,.main .customer-btn,.main .profile-btn,
.main .cs-btn,.main .cr-btn,.main .btn-primary,.main .btn-secondary,
.main .btn-outline,.main .btn-ghost{
  min-height:var(--ctr-final-control-h)!important;
  border-radius:10px!important;
  font-size:11.5px!important;
  line-height:1.15!important;
  box-sizing:border-box!important;
}
.main input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.main select{min-height:var(--ctr-final-control-h);box-sizing:border-box;}

/* Tables may scroll horizontally, but must never push the whole page. */
.main .table-wrap,.main .m-table-wrap,.main .pb-table-wrap,.main .sales-table-wrap,
.main .customer-table-wrap,.main .att-table-wrap,.main .pay-table-wrap,
.main .pmx-table-wrap,.main [class*="table-scroll"]{
  max-width:100%!important;
  overflow-x:auto!important;
  -webkit-overflow-scrolling:touch;
}
.main table{max-width:100%;}

/* POS: preserve its dedicated layout, only harden width containment. */
body.ctr-pos-page .main,body.ctr-pos-page .main > .content,
body.ctr-pos-page .pos-grid,body.ctr-pos-page .catalog-card,
body.ctr-pos-page .cart-card{min-width:0!important;max-width:100%!important;box-sizing:border-box!important;}

@media (min-width:760px) and (max-width:1180px){
  :root{--ctr-final-page-x:22px;--ctr-final-page-y:20px;--ctr-final-page-bottom:48px;}
  .main .page-head h1,.main .module-head h1,.main .pb-page-head h1,
  .main .customer-head h1,.main .profile-head h1,.main .opening-head h1,
  .main .rh-head h1,.main .cs-page-head h1,.main .cr-page-head h1{font-size:22px!important;}
}

@media (max-width:759px){
  :root{
    --ctr-final-page-x:10px;
    --ctr-final-page-y:12px;
    --ctr-final-page-bottom:34px;
    --ctr-final-card-radius:13px;
    --ctr-final-control-h:36px;
  }

  /* Override older admin CSS that used 8/10/14/16px inconsistently. */
  body:not(.ctr-pos-page) .main > .content,
  body:not(.ctr-pos-page) .main > .module-page,
  body:not(.ctr-pos-page) .main > .opening-shift-page,
  body:not(.ctr-pos-page) .main > .customer-page,
  body:not(.ctr-pos-page) .main > .profile-page,
  body:not(.ctr-pos-page) .main > .billing-content,
  body:not(.ctr-pos-page) .main > .notifications-page{
    padding:var(--ctr-final-page-y) var(--ctr-final-page-x) var(--ctr-final-page-bottom)!important;
  }

  .main .page-head,.main .module-head,.main .pb-page-head,.main .customer-head,
  .main .profile-head,.main .opening-head,.main .rh-head,.main .cs-page-head,
  .main .cr-page-head,.main .billing-head,.main .notifications-head{
    min-height:0!important;
    margin-bottom:11px!important;
    gap:8px!important;
    flex-wrap:wrap!important;
  }
  .main .page-head h1,.main .module-head h1,.main .pb-page-head h1,
  .main .customer-head h1,.main .profile-head h1,.main .opening-head h1,
  .main .rh-head h1,.main .cs-page-head h1,.main .cr-page-head h1,
  .main .billing-head h1,.main .notifications-head h1{
    font-size:18px!important;
  }
  .main .page-head p,.main .module-head p,.main .pb-page-head p,
  .main .customer-head p,.main .profile-head p,.main .opening-head p,
  .main .rh-head p,.main .cs-page-head p,.main .cr-page-head p{
    font-size:10.5px!important;
  }

  .main .head-actions,.main .module-actions,.main .page-head-actions,
  .main .pb-head-actions,.main .customer-actions,.main .profile-actions,
  .main .rh-actions,.main .cr-head-actions,.main .opening-actions,
  .main .att-head-actions{gap:6px!important;max-width:100%;}

  .main .btn,.main .m-btn,.main .pb-btn,.main .customer-btn,.main .profile-btn,
  .main .cs-btn,.main .cr-btn,.main .btn-primary,.main .btn-secondary,
  .main .btn-outline,.main .btn-ghost{
    min-height:36px!important;
    border-radius:9px!important;
    font-size:10.5px!important;
  }

  /* Keep grids compact instead of one huge card per row when space allows. */
  .main .stats,.main .summary-grid,.main .m-grid,.main .pb-summary-grid,
  .main .finance-kpi-grid,.main .owner-kpi-grid,.main .cr-kpi-grid,
  .main .cs-kpi-grid,.main .tbl-stats{gap:7px!important;}

  .main .stat-card,.main .m-kpi,.main .pb-stat,.main .summary-card,
  .main .customer-stat,.main .tbl-stat-card,.main .cr-kpi-card,
  .main .cs-kpi-card{border-radius:11px!important;padding:11px!important;min-width:0;}
}

@media (max-width:420px){
  :root{--ctr-final-page-x:8px;}
  .main .page-head h1,.main .module-head h1,.main .pb-page-head h1,
  .main .customer-head h1,.main .profile-head h1,.main .opening-head h1,
  .main .rh-head h1,.main .cs-page-head h1,.main .cr-page-head h1{font-size:17px!important;}
}