/* ===========================
   POS Modal Readability Fix
   =========================== */
.modal-content,
.modal-body,
.modal-body * {
  color: #0f172a !important;
}

.modal-content {
  background: #ffffff !important;
  border-radius: 14px !important;
}

.modal-header {
  background: #f1f5f9 !important;
  color: #0f172a !important;
  border-bottom: 1px solid #e5e7eb !important;
}

.modal-header .close,
.modal-header button.close {
  color: #0f172a !important;
  opacity: .7 !important;
  text-shadow: none !important;
}

.modal-body .table,
.modal-body table {
  background: #ffffff !important;
}

.modal-body .table th,
.modal-body .table td {
  color: #0f172a !important;
  border-color: #e5e7eb !important;
}


/* Modern UI overrides (CSS-only, non-breaking) */
:root{
  --ui-bg:#f6f7fb;
  --ui-surface:#ffffff;
  --ui-border:rgba(17,24,39,.10);
  --ui-text:#111827;
  --ui-muted:rgba(17,24,39,.65);
  --ui-shadow:0 10px 25px rgba(17,24,39,.08);
  --ui-radius:14px;
  --ui-radius-sm:10px;
}

html,body{height:100%;}
body{
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  background:var(--ui-bg);
  color:var(--ui-text);
}

.content-wrapper,.right-side{background:var(--ui-bg);}

/* cards/boxes */
.box,
.navbar,
.main-header .navbar,
.main-sidebar,
.content-header{
  border-color:var(--ui-border);
}
.box{
  border-top:0;
  border-radius:var(--ui-radius);
  box-shadow:var(--ui-shadow);
}
.box-header{
  padding:14px 16px;
}
.box-body{
  padding:16px;
}
.box-footer{padding:14px 16px;}

/* buttons */
.btn{
  border-radius:var(--ui-radius-sm);
}
.btn:focus{outline:0;}

/* tables */
.table{
  background:var(--ui-surface);
}
.table>thead>tr>th{
  border-bottom:1px solid var(--ui-border);
  color:var(--ui-muted);
  font-weight:600;
}
.table>tbody>tr>td{border-top:1px solid var(--ui-border);}

/* inputs */
.form-control,
.select2-container--default .select2-selection--single{
  border-radius:var(--ui-radius-sm);
  border-color:var(--ui-border);
}

/* sidebar polish */
.main-sidebar{box-shadow:var(--ui-shadow);}
.sidebar-menu>li>a{padding:12px 15px;}
.sidebar-menu>li.active>a{border-left-width:4px;}

/* alerts */
.alert{border-radius:var(--ui-radius-sm);}

/* optional dark mode */
@media (prefers-color-scheme: dark){
  :root{
    --ui-bg:#0b1020;
    --ui-surface:#0f172a;
    --ui-border:rgba(148,163,184,.18);
    --ui-text:#e5e7eb;
    --ui-muted:rgba(229,231,235,.65);
    --ui-shadow:0 10px 25px rgba(0,0,0,.35);
  }
  body{background:var(--ui-bg);color:var(--ui-text);}
  .box,.table,.modal-content,.form-control{background:var(--ui-surface);color:var(--ui-text);}
  .table>thead>tr>th{color:var(--ui-muted);}
}

/* cards/boxes */
.box{
  border-top:0;
  border-radius:var(--ui-radius);
  box-shadow:var(--ui-shadow);
  overflow:hidden;
}
.box-header{
  padding:14px 18px;
  border-bottom:1px solid var(--ui-border);
}
.box-body{padding:18px;}
.box-footer{
  padding:14px 18px;
  border-top:1px solid var(--ui-border);
}

/* typography */
.content-header>h1{font-weight:700;letter-spacing:-.01em;}
.small-box .inner h3{font-weight:800;}

/* buttons */
.btn{border-radius:var(--ui-radius-sm);}
.btn:focus{outline:0;}

/* tables */
.table{
  background:var(--ui-surface);
  border-radius:var(--ui-radius);
}
.table>thead>tr>th{
  border-bottom:1px solid var(--ui-border);
  color:var(--ui-muted);
  font-weight:700;
  text-transform:uppercase;
  font-size:12px;
  letter-spacing:.06em;
}
.table>tbody>tr>td{border-top:1px solid var(--ui-border);}

/* forms */
.form-control{
  border-radius:var(--ui-radius-sm);
  border-color:var(--ui-border);
  box-shadow:none;
}
.form-control:focus{
  border-color:rgba(59,130,246,.45);
  box-shadow:0 0 0 3px rgba(59,130,246,.12);
}

/* tables */
.table{
  background:var(--ui-surface);
}
.table>thead>tr>th{
  border-bottom:1px solid var(--ui-border);
  color:var(--ui-muted);
  font-weight:600;
}
.table>tbody>tr>td{
  border-top:1px solid var(--ui-border);
}

/* forms */
.form-control,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple{
  border-radius:var(--ui-radius-sm);
  border-color:var(--ui-border);
  box-shadow:none;
}
.form-control:focus{
  border-color:rgba(59,130,246,.45);
  box-shadow:0 0 0 4px rgba(59,130,246,.12);
}

/* sidebar */
.main-sidebar{box-shadow:var(--ui-shadow);}
.sidebar-menu>li>a{padding:12px 15px;}
.sidebar-menu>li>a>.fa,
.sidebar-menu>li>a>.fas{
  width:22px;
}

/* dark mode (auto) */
@media (prefers-color-scheme: dark){
  :root{
    --ui-bg:#0b1220;
    --ui-surface:#0f172a;
    --ui-border:rgba(148,163,184,.20);
    --ui-text:#e5e7eb;
    --ui-muted:rgba(229,231,235,.70);
    --ui-shadow:0 10px 25px rgba(0,0,0,.40);
  }
  body{background:var(--ui-bg);color:var(--ui-text);}
  .content-wrapper,.right-side{background:var(--ui-bg);}
  .box,.table,.modal-content{background:var(--ui-surface);}
  .main-header .navbar,.main-header .logo{background:#111827 !important;}
  .main-sidebar{background:#0f172a;}
  .sidebar a{color:rgba(229,231,235,.88) !important;}
  .sidebar-menu>li.active>a{background:rgba(59,130,246,.18) !important;}
}



/* Tech Revives dashboard polish */
.tr-dashboard .box{margin-bottom:16px;}
.tr-actions-row .box{background:var(--ui-surface);}
.tr-actions-row .btn{margin:0 8px 8px 0;}
.tr-kpi-row{margin-top:6px;}
.tr-kpi.small-box .inner h3{
  font-size:28px;
  font-weight:800;
  letter-spacing:-.02em;
  margin:0 0 6px 0;
}
.tr-kpi.small-box .inner p{font-size:14px;margin:0;opacity:.95;}
.tr-kpi .small-box-footer{
  opacity:.9;
  padding:8px 10px;
}
.tr-box-header-flex{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}
.tr-box-header-flex .box-title small{opacity:.7;}
.tr-mini-stats .text-muted{display:block;font-size:12px;margin-bottom:3px;}
.tr-stat{font-size:22px;font-weight:800;letter-spacing:-.02em;margin-bottom:10px;}

/*
  Fix: "white text on white background" in some AdminLTE skins/customizations.
  Some builds override bg-* background colors but keep the white text color.
  We enforce both background + foreground for the KPI small-boxes.
*/
.small-box{color:inherit;}
.small-box.bg-aqua{background:#00c0ef !important;color:#fff !important;}
.small-box.bg-blue{background:#0073b7 !important;color:#fff !important;}
.small-box.bg-green{background:#00a65a !important;color:#fff !important;}
.small-box.bg-yellow{background:#f39c12 !important;color:#fff !important;}
.small-box.bg-red{background:#dd4b39 !important;color:#fff !important;}

/* Ensure box text stays readable on light surfaces */
.box,
.box .box-header,
.box .box-body,
.box .box-title,
.content-header,
.content-header>h1,
.content-header>h1>small{color:var(--ui-text);}
.tr-table>thead>tr>th{white-space:nowrap;}
.tr-table>tbody>tr>td{vertical-align:middle;}
.box-body.no-padding .table{margin-bottom:0;}


/* ===== Tech Revives Dashboard (Panze-style) ===== */
.tr-dashboard{
  background:#f5f7fb;
  padding-top: 8px;
}
.tr-page-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin: 6px 4px 18px;
}
.tr-page-title{
  margin:0;
  font-size:22px;
  font-weight:700;
  color:#0f172a;
  letter-spacing:-0.2px;
}
.tr-page-sub{
  margin-top:4px;
  font-size:13px;
  color:#64748b;
}
.tr-card{
  border-radius:18px !important;
  border:0 !important;
  box-shadow:0 10px 30px rgba(15,23,42,0.06) !important;
  overflow:hidden;
}
.tr-card .box-header{
  border-bottom:0 !important;
  padding:18px 20px 10px !important;
  background:transparent !important;
}
.tr-card .box-title{
  font-size:15px !important;
  font-weight:700 !important;
  color:#0f172a !important;
}
.tr-card .box-body{
  padding: 16px 20px 20px !important;
}
.tr-card .table>thead>tr>th{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:#64748b;
  border-bottom:1px solid rgba(148,163,184,.35) !important;
}
.tr-card .table>tbody>tr>td{
  padding:12px 8px;
  vertical-align:middle;
  border-top:1px solid rgba(148,163,184,.18);
  color:#0f172a;
}
.tr-card .table>tbody>tr:hover{
  background: rgba(15,23,42,0.03);
}

/* Metric cards */
.tr-metrics{ margin-bottom: 6px; }
.tr-metric-card{
  display:flex;
  align-items:center;
  gap:14px;
  background:#fff;
  border-radius:18px;
  padding:16px 16px;
  box-shadow:0 10px 30px rgba(15,23,42,0.06);
  min-height:88px;
}
.tr-metric-link{ text-decoration:none !important; }
.tr-metric-link:hover{ transform: translateY(-1px); }
.tr-metric-icon{
  width:44px;
  height:44px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  flex:0 0 44px;
  box-shadow:0 10px 18px rgba(15,23,42,0.12);
}
.tr-metric-icon i{ font-size:18px; }
.tr-metric-label{
  font-size:12px;
  color:#64748b;
  font-weight:600;
}
.tr-metric-value{
  font-size:22px;
  font-weight:800;
  color:#0f172a;
  line-height:1.05;
  margin-top:2px;
}
.tr-metric-sub{
  font-size:12px;
  color:#94a3b8;
  margin-top:4px;
}

.tr-bg-purple{ background: linear-gradient(135deg,#8b5cf6,#a78bfa); }
.tr-bg-indigo{ background: linear-gradient(135deg,#4f46e5,#60a5fa); }
.tr-bg-cyan{ background: linear-gradient(135deg,#06b6d4,#22c55e); }
.tr-bg-amber{ background: linear-gradient(135deg,#f59e0b,#ef4444); }

.tr-card-tools{ display:flex; gap:8px; align-items:center; }
.tr-chip{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  color:#475569;
  background: rgba(148,163,184,0.18);
}

/* Chart container */
.tr-chart-center{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:260px;
}

/* Make sure text never becomes white on light surfaces */
.tr-dashboard .box, .tr-dashboard .box *{
  color: inherit;
}
.tr-dashboard a{ color:#2563eb; }
.tr-dashboard a:hover{ color:#1d4ed8; }