/* MAU POS & ERP - Modern Admin Theme
 * Visual layer only: preserves existing UltimatePOS functionality and routes.
 */
:root {
  --mau-navy: #071f63;
  --mau-blue: #0d63f3;
  --mau-cyan: #13a8f5;
  --mau-orange: #ff9d00;
  --mau-orange-2: #ff5b00;
  --mau-bg: #f5f7fb;
  --mau-card: #ffffff;
  --mau-text: #14213d;
  --mau-muted: #718096;
  --mau-border: #e6eaf0;
  --mau-sidebar: #071a4e;
  --mau-sidebar-2: #0b286e;
  --mau-radius: 14px;
  --mau-shadow: 0 8px 28px rgba(17, 38, 86, .07);
}

body.modern-admin {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  background: var(--mau-bg) !important;
  color: var(--mau-text);
  font-size: 14px;
}

body.modern-admin .main-header {
  height: 72px;
  background: rgba(255,255,255,.96) !important;
  border-bottom: 1px solid var(--mau-border) !important;
  box-shadow: 0 3px 18px rgba(20, 33, 61, .05);
  z-index: 1030;
}

body.modern-admin .main-header .logo {
  width: 260px;
  height: 72px;
  line-height: 72px;
  background: #fff !important;
  border-right: 1px solid var(--mau-border);
  color: var(--mau-navy) !important;
  padding: 0 20px;
  text-align: left;
}

body.modern-admin .main-header .logo .mau-header-logo {
  max-width: 205px;
  max-height: 56px;
  width: auto;
  height: auto;
  vertical-align: middle;
  object-fit: contain;
}

body.modern-admin .main-header .navbar {
  min-height: 72px;
  margin-left: 260px;
  background: transparent !important;
}

body.modern-admin .main-header .sidebar-toggle {
  height: 72px;
  width: 64px;
  line-height: 72px;
  color: var(--mau-text) !important;
  font-size: 20px;
  text-align: center;
  transition: .2s ease;
}
body.modern-admin .main-header .sidebar-toggle:hover { background: #f5f7fb !important; }

body.modern-admin .main-header .navbar-custom-menu > * { vertical-align: middle; }
body.modern-admin .main-header .navbar-custom-menu .btn,
body.modern-admin .main-header .navbar-custom-menu .btn-success,
body.modern-admin .main-header .navbar-custom-menu .btn-danger {
  border: 1px solid var(--mau-border) !important;
  border-radius: 10px !important;
  background: #fff !important;
  color: var(--mau-text) !important;
  box-shadow: none !important;
  transition: .2s ease;
}
body.modern-admin .main-header .navbar-custom-menu .btn:hover {
  border-color: #cbd5e1 !important;
  transform: translateY(-1px);
}
body.modern-admin .main-header .navbar-custom-menu .btn-success {
  color: var(--mau-blue) !important;
}
body.modern-admin .main-header .navbar-custom-menu .btn-danger { color: #e53e3e !important; }
body.modern-admin .main-header .navbar-custom-menu .nav > li > a {
  color: var(--mau-text) !important;
  height: 72px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
}
body.modern-admin .main-header .navbar-custom-menu .nav > li > a:hover { background: #f7f9fc !important; }
body.modern-admin .main-header .user-image {
  width: 36px;
  height: 36px;
  border: 2px solid #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,.12);
}
body.modern-admin .main-header .dropdown-menu {
  border: 1px solid var(--mau-border);
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(15, 23, 42, .12);
  padding: 7px;
  margin-top: 5px;
}
body.modern-admin .main-header .dropdown-menu > li > a {
  border-radius: 8px;
  padding: 9px 12px;
  color: var(--mau-text);
}
body.modern-admin .main-header .dropdown-menu > li > a:hover { background: #f4f7fb; }
body.modern-admin .main-header .user-header { border-radius: 10px; background: linear-gradient(135deg, var(--mau-navy), var(--mau-blue)) !important; }
body.modern-admin .main-header .user-footer { background: #fff; border-radius: 10px; }

body.modern-admin .main-sidebar {
  width: 260px;
  background: linear-gradient(180deg, var(--mau-sidebar), #06153f) !important;
  box-shadow: 8px 0 28px rgba(7, 31, 99, .12);
  padding-top: 72px;
}
body.modern-admin .main-sidebar .sidebar {
  height: calc(100vh - 72px);
  padding: 0 12px 18px;
}
body.modern-admin .main-sidebar .logo {
  display: none;
}
body.modern-admin .mau-sidebar-brand {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 18px 10px 16px;
  margin-bottom: 5px;
  color: #fff;
  text-decoration: none;
}
body.modern-admin .mau-sidebar-brand img {
  width: 38px;
  height: 38px;
  object-fit: contain;
  flex: 0 0 38px;
}
body.modern-admin .mau-sidebar-brand .mau-brand-name {
  min-width: 0;
  font-weight: 800;
  font-size: 14px;
  letter-spacing: .2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.modern-admin .mau-sidebar-brand small {
  display: block;
  color: rgba(255,255,255,.58);
  font-weight: 500;
  font-size: 10px;
  margin-top: 2px;
}
body.modern-admin .sidebar-menu,
body.modern-admin .sidebar-menu .treeview-menu { background: transparent !important; }
body.modern-admin .sidebar-menu > li > a,
body.modern-admin .sidebar-menu .treeview-menu > li > a {
  margin: 3px 0;
  border-radius: 10px;
  color: rgba(255,255,255,.76) !important;
  transition: .18s ease;
}
body.modern-admin .sidebar-menu > li > a { padding: 11px 12px; }
body.modern-admin .sidebar-menu > li > a > .fa,
body.modern-admin .sidebar-menu > li > a > .fas,
body.modern-admin .sidebar-menu > li > a > .far,
body.modern-admin .sidebar-menu > li > a > .fab {
  width: 25px;
  text-align: center;
  font-size: 15px;
}
body.modern-admin .sidebar-menu > li:hover > a,
body.modern-admin .sidebar-menu > li.active > a,
body.modern-admin .sidebar-menu > li.menu-open > a {
  background: linear-gradient(90deg, rgba(13,99,243,.28), rgba(19,168,245,.12)) !important;
  color: #fff !important;
}
body.modern-admin .sidebar-menu > li.active > a { box-shadow: inset 3px 0 0 var(--mau-cyan); }
body.modern-admin .sidebar-menu .treeview-menu { padding-left: 12px; }
body.modern-admin .sidebar-menu .treeview-menu > li > a { padding: 9px 10px 9px 34px; font-size: 13px; }
body.modern-admin .sidebar-menu .treeview-menu > li.active > a,
body.modern-admin .sidebar-menu .treeview-menu > li > a:hover { background: rgba(255,255,255,.08) !important; color: #fff !important; }
body.modern-admin .sidebar-menu .header {
  color: rgba(255,255,255,.4) !important;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.2px;
  padding: 17px 10px 7px;
}
body.modern-admin .sidebar-menu .pull-right-container { color: rgba(255,255,255,.4); }

body.modern-admin .content-wrapper {
  min-height: calc(100vh - 72px) !important;
  margin-left: 260px;
  background: var(--mau-bg) !important;
}
body.modern-admin .content { padding: 22px 24px 36px; }
body.modern-admin .content-header { padding: 0 0 17px; }
body.modern-admin .content-header h1 {
  font-size: 24px;
  font-weight: 800;
  color: var(--mau-text);
}
body.modern-admin .breadcrumb { background: transparent; padding: 7px 0; color: var(--mau-muted); }
body.modern-admin .breadcrumb a { color: var(--mau-blue); }

body.modern-admin .box,
body.modern-admin .info-box,
body.modern-admin .small-box,
body.modern-admin .panel,
body.modern-admin .well {
  border: 1px solid var(--mau-border) !important;
  border-radius: var(--mau-radius) !important;
  box-shadow: var(--mau-shadow) !important;
  background: var(--mau-card) !important;
}
body.modern-admin .box { overflow: hidden; }
body.modern-admin .box-header,
body.modern-admin .panel-heading {
  background: #fff !important;
  border-bottom: 1px solid var(--mau-border) !important;
  padding: 15px 18px;
}
body.modern-admin .box-title,
body.modern-admin .panel-title { font-weight: 750; color: var(--mau-text); }
body.modern-admin .box-body,
body.modern-admin .panel-body { padding: 18px; }
body.modern-admin .box-footer,
body.modern-admin .panel-footer { background: #fbfcfe !important; border-top: 1px solid var(--mau-border) !important; }
body.modern-admin .small-box { min-height: 120px; color: var(--mau-text) !important; }
body.modern-admin .small-box .inner { padding: 19px; }
body.modern-admin .small-box h3 { font-size: 28px; font-weight: 800; }
body.modern-admin .small-box .icon { color: rgba(13,99,243,.13) !important; }
body.modern-admin .info-box { min-height: 104px; }
body.modern-admin .info-box-icon { border-radius: 12px; margin: 10px; width: 70px; height: 84px; line-height: 84px; }
body.modern-admin .info-box-content { padding: 14px 12px; }
body.modern-admin .info-box-text { color: var(--mau-muted); font-weight: 650; }
body.modern-admin .info-box-number { color: var(--mau-text); font-size: 22px; font-weight: 800; }

body.modern-admin .table { background: #fff; }
body.modern-admin .table > thead > tr > th {
  border-bottom: 1px solid var(--mau-border);
  background: #f8fafc;
  color: #556176;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .35px;
}
body.modern-admin .table > tbody > tr > td { border-top: 1px solid #edf0f5; vertical-align: middle; }
body.modern-admin .table-hover > tbody > tr:hover { background: #f8fbff; }
body.modern-admin .dataTables_wrapper .dataTables_filter input,
body.modern-admin .dataTables_wrapper .dataTables_length select,
body.modern-admin .form-control {
  border: 1px solid #dce2eb !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  min-height: 38px;
  color: var(--mau-text);
  background: #fff;
}
body.modern-admin .form-control:focus { border-color: #8bb7ff !important; box-shadow: 0 0 0 3px rgba(13,99,243,.10) !important; }
body.modern-admin label { color: #4a5568; font-weight: 650; }
body.modern-admin .input-group-addon { background: #f7f9fc; border-color: #dce2eb; border-radius: 9px 0 0 9px; }
body.modern-admin .btn {
  border-radius: 9px;
  font-weight: 650;
  box-shadow: none !important;
  transition: .18s ease;
}
body.modern-admin .btn-primary,
body.modern-admin .btn-success {
  border: none !important;
  color: #fff !important;
  background: linear-gradient(135deg, var(--mau-blue), #0754d7) !important;
}
body.modern-admin .btn-primary:hover,
body.modern-admin .btn-success:hover { transform: translateY(-1px); filter: brightness(1.03); }
body.modern-admin .btn-default { border-color: #dce2eb !important; background: #fff !important; color: #374151 !important; }
body.modern-admin .label { border-radius: 999px; padding: .35em .65em; }

body.modern-admin .main-footer {
  margin-left: 260px;
  background: #fff;
  border-top: 1px solid var(--mau-border);
  color: var(--mau-muted);
  padding: 14px 24px;
}
body.modern-admin .main-footer .btn { border-radius: 7px; }

body.modern-admin .modal-content {
  border: 0;
  border-radius: 16px;
  box-shadow: 0 24px 70px rgba(15,23,42,.2);
  overflow: hidden;
}
body.modern-admin .modal-header { border-bottom: 1px solid var(--mau-border); }
body.modern-admin .modal-footer { border-top: 1px solid var(--mau-border); background: #fafbfc; }

body.modern-admin .select2-container--default .select2-selection--single,
body.modern-admin .select2-container--default .select2-selection--multiple {
  border: 1px solid #dce2eb;
  border-radius: 9px;
  min-height: 38px;
}
body.modern-admin .select2-dropdown { border: 1px solid var(--mau-border); box-shadow: 0 14px 35px rgba(15,23,42,.1); }

/* Keep POS full-screen behavior intact */
body.modern-admin.lockscreen .main-header,
body.modern-admin.lockscreen .main-footer { margin-left: 0; }

@media (min-width: 768px) {
  body.modern-admin.sidebar-mini.sidebar-collapse .main-sidebar { width: 78px; }
  body.modern-admin.sidebar-mini.sidebar-collapse .content-wrapper,
  body.modern-admin.sidebar-mini.sidebar-collapse .main-footer { margin-left: 78px; }
  body.modern-admin.sidebar-mini.sidebar-collapse .main-header .logo { width: 78px; padding: 0 16px; }
  body.modern-admin.sidebar-mini.sidebar-collapse .main-header .logo .mau-header-logo { display: none; }
  body.modern-admin.sidebar-mini.sidebar-collapse .main-header .navbar { margin-left: 78px; }
  body.modern-admin.sidebar-mini.sidebar-collapse .mau-sidebar-brand { justify-content: center; padding-left: 0; padding-right: 0; }
  body.modern-admin.sidebar-mini.sidebar-collapse .mau-sidebar-brand > div { display: none; }
  body.modern-admin.sidebar-mini.sidebar-collapse .sidebar-menu > li > a { text-align: center; }
  body.modern-admin.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > span:not(.pull-right-container) { display: none; }
  body.modern-admin.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .fa,
  body.modern-admin.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .fas,
  body.modern-admin.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .far,
  body.modern-admin.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .fab { width: auto; font-size: 16px; }
}

@media (max-width: 767px) {
  body.modern-admin .main-header { height: 58px; }
  body.modern-admin .main-header .logo { width: 190px; height: 58px; line-height: 58px; padding: 0 12px; }
  body.modern-admin .main-header .logo .mau-header-logo { max-width: 150px; max-height: 45px; }
  body.modern-admin .main-header .navbar { margin-left: 0; min-height: 58px; }
  body.modern-admin .main-header .sidebar-toggle { height: 58px; line-height: 58px; width: 48px; }
  body.modern-admin .main-sidebar { padding-top: 58px; }
  body.modern-admin .content-wrapper { margin-left: 0; min-height: calc(100vh - 58px) !important; }
  body.modern-admin .main-footer { margin-left: 0; }
  body.modern-admin .content { padding: 16px 12px 28px; }
  body.modern-admin .main-header .navbar-custom-menu .btn { margin: 7px 3px !important; }
}


/* ================================================================
   MAU DASHBOARD FINAL FIX V3
   Restores location/date controls and prevents legacy AdminLTE
   content-header overlap from hiding the dashboard controls.
   ================================================================ */
body.modern-admin .content-wrapper {
  background: var(--mau-bg, #f5f7fb) !important;
  min-height: calc(100vh - 72px) !important;
  height: auto !important;
}
body.modern-admin .content-wrapper .content-header-custom {
  display: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
body.modern-admin .content-wrapper .content-custom {
  margin-top: 0 !important;
  padding: 0 24px 32px !important;
  position: relative !important;
}
body.modern-admin .content-wrapper .content-custom > br:first-child { display:none !important; }

.mau-dashboard-welcome {
  width: 100% !important;
  margin: 0 !important;
  padding: 18px 24px !important;
  box-sizing: border-box !important;
  background: var(--mau-sidebar, #071a4e) !important;
  color: #fff !important;
  border-radius: 0 0 14px 14px !important;
}
.mau-dashboard-welcome-inner {
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:20px !important;
  min-height:64px !important;
}
.mau-welcome-copy h1 {
  margin:0 !important; color:#fff !important; font-size:22px !important;
  line-height:1.25 !important; font-weight:700 !important;
}
.mau-welcome-copy p {
  margin:5px 0 0 !important; color:rgba(255,255,255,.75) !important;
  font-size:13px !important;
}
.mau-dashboard-filters { display:flex !important; align-items:center !important; gap:10px !important; }
.mau-filter-location { width:220px !important; }
.mau-filter-location .select2-container { width:100% !important; }
.mau-filter-location .select2-selection--single,
.mau-filter-location .form-control {
  height:40px !important; min-height:40px !important; background:#fff !important;
  color:#111827 !important; border:1px solid #d8dee9 !important;
  border-radius:8px !important; box-shadow:none !important;
}
.mau-filter-location .select2-selection__rendered { color:#111827 !important; line-height:38px !important; }
.mau-date-filter {
  height:40px !important; padding:0 14px !important; display:inline-flex !important;
  align-items:center !important; gap:8px !important; background:#fff !important;
  color:#111827 !important; border:1px solid #d8dee9 !important;
  border-radius:8px !important; font-weight:600 !important; box-shadow:none !important;
}
.mau-date-filter:hover,.mau-date-filter:focus { background:#f8fafc !important; color:#111827 !important; }

/* Five KPI cards — one row on desktop. */
body.modern-admin .content-custom .row.row-custom {
  display:flex !important; flex-wrap:nowrap !important; gap:14px !important;
  margin:22px 0 20px !important; padding:0 !important;
}
body.modern-admin .content-custom .row.row-custom > .col-custom {
  float:none !important; flex:1 1 0 !important; width:20% !important;
  max-width:none !important; padding:0 !important; margin:0 !important;
}
body.modern-admin .info-box-new-style {
  width:100% !important; min-height:120px !important; margin:0 !important;
  background:#fff !important; border-radius:14px !important;
  box-shadow:0 8px 24px rgba(17,38,86,.07) !important;
  border:1px solid var(--mau-border,#e6eaf0) !important;
}
body.modern-admin .info-box-new-style .info-box-icon {
  width:64px !important; height:64px !important; line-height:64px !important;
  margin:16px !important; border-radius:12px !important;
}
body.modern-admin .info-box-new-style .info-box-content { margin-left:96px !important; padding:20px 10px 10px 0 !important; }
body.modern-admin .info-box-new-style .info-box-text { color:#64748b !important; font-weight:700 !important; font-size:12px !important; }
body.modern-admin .info-box-new-style .info-box-number { color:#0f172a !important; font-size:20px !important; font-weight:800 !important; }

@media (max-width:1100px) {
  .mau-dashboard-welcome-inner { align-items:flex-start !important; flex-direction:column !important; }
  .mau-dashboard-filters { width:100% !important; }
  body.modern-admin .content-custom .row.row-custom { flex-wrap:wrap !important; }
  body.modern-admin .content-custom .row.row-custom > .col-custom { width:calc(50% - 7px) !important; flex-basis:calc(50% - 7px) !important; }
}
@media (max-width:767px) {
  body.modern-admin .content-wrapper .content-custom { padding:0 12px 24px !important; }
  .mau-dashboard-welcome { padding:16px !important; }
  .mau-dashboard-filters { flex-direction:column !important; align-items:stretch !important; }
  .mau-filter-location,.mau-date-filter { width:100% !important; }
  body.modern-admin .content-custom .row.row-custom > .col-custom { width:100% !important; flex-basis:100% !important; }
}

/* ================================================================
   MAU POS & ERP - FINAL LAYOUT ALIGNMENT V4
   Fixes header/welcome clipping and module title clipping caused by
   legacy AdminLTE body/layout rules.
   ================================================================ */

/* Module pages: keep the title header in normal document flow. */
body.modern-admin .content-wrapper > .content-header,
body.modern-admin .content-wrapper .content-header {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 0 18px !important;
  padding: 16px 24px !important;
  min-height: 0 !important;
  background: var(--mau-sidebar, #071a4e) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 0 0 14px 14px !important;
}

body.modern-admin .content-wrapper > .content-header h1,
body.modern-admin .content-wrapper .content-header h1 {
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  font-size: 21px !important;
  line-height: 1.35 !important;
  font-weight: 800 !important;
}

body.modern-admin .content-wrapper .content-header h1 small {
  color: rgba(255,255,255,.78) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  margin-left: 8px !important;
}

/* All normal module content starts below the module header. */
body.modern-admin .content-wrapper > .content-header + .content,
body.modern-admin .content-wrapper .content-header + .content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Dashboard welcome must sit below the fixed AdminLTE header. */
body.modern-admin .content-wrapper > .mau-dashboard-welcome {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}

body.modern-admin .content-wrapper > .mau-dashboard-welcome + .content {
  margin-top: 0 !important;
}

/* Dashboard controls remain inside the welcome bar and never get clipped. */
body.modern-admin .mau-dashboard-welcome-inner {
  width: 100% !important;
  box-sizing: border-box !important;
}

body.modern-admin .mau-welcome-copy {
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

body.modern-admin .mau-welcome-copy h1,
body.modern-admin .mau-welcome-copy p {
  overflow: visible !important;
  white-space: normal !important;
}

@media (min-width: 768px) {
  body.modern-admin .content-wrapper {
    margin-left: 260px !important;
    width: auto !important;
  }

  body.modern-admin .main-header .logo {
    width: 260px !important;
  }

  body.modern-admin .main-header .navbar {
    margin-left: 260px !important;
  }
}

@media (max-width: 767px) {
  body.modern-admin .content-wrapper > .content-header,
  body.modern-admin .content-wrapper .content-header {
    padding: 14px 16px !important;
    border-radius: 0 0 12px 12px !important;
  }

  body.modern-admin .content-wrapper .content-header h1 {
    font-size: 18px !important;
  }

  body.modern-admin .content-wrapper .content-header h1 small {
    display: block !important;
    margin: 3px 0 0 !important;
  }
}