/* ===== OpenCart Admin Modern UI ===== */
:root{
  --acc:#0ea5e9;         /* accent */
  --acc-2:#e0f2fe;       /* accent light */
  --txt:#111827;         /* text */
  --muted:#6b7280;       /* secondary text */
  --bg:#ffffff;          /* card bg */
  --bg-soft:#f8fafc;     /* soft bg */
  --bd:#e5e7eb;          /* borders */
  --ok:#16a34a; --warn:#f59e0b; --err:#ef4444; --info:#0284c7;
}

/* Layout wrapper */
#container, .container-fluid{
  background: linear-gradient(180deg,#fafafa,#f3f4f6);
  color: var(--txt);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

/* Top navbar */
.navbar{
  background:#0b1220;
  border: none;
  box-shadow: 0 2px 10px rgba(0,0,0,.15);
}
.navbar .navbar-brand,
.navbar .navbar-nav > li > a{color: #000000 !important;}
.navbar .navbar-nav > li > a:hover{ color:#565656 !important; }

/* Sidebar */
#column-left{
  background:#0f172a;
  border-right: 0;
  box-shadow: 2px 0 12px rgba(0,0,0,.1);
}
#column-left .list-group a{
  color:#cbd5e1;
  background: transparent;
  border:0;
  padding:10px 14px;
  transition: background .15s ease, color .15s ease, transform .1s ease;
}
#column-left .list-group a:hover{ background:#111827; color:#fff; transform: translateX(2px); }
#column-left .list-group .active{ background:#0b1220; color:#fff; }
#column-left .list-group .collapsed:after{ opacity:.6; }

#column-left .profile{
  background:#0b1220;
  border-bottom:1px solid rgba(255,255,255,.06);
}
#column-left .profile a{ color:#e5e7eb; }

/* Breadcrumbs */
.breadcrumb{
  background: transparent;
  border:0;
  padding:10px 0 0;
  color: var(--muted);
}
.breadcrumb > li + li:before{ color:#9ca3af; }

/* Content card */
#content > .page-header{
  border:0;
  margin: 20px 0 10px;
}
#content .container-fluid{
  background: var(--bg);
  border:1px solid var(--bd);
  border-radius:14px;
  padding:22px;
  box-shadow: 0 6px 20px rgba(0,0,0,.06);
}

/* Headings */
#content h1, #content h2, #content h3{
  color: var(--txt);
  line-height:1.2;
}
#content h1{ font-size:26px; margin:6px 0 14px; }
#content h2{ font-size:20px; margin:18px 0 10px; }
#content h2::after{
  content:""; display:block; width:64px; height:3px; margin-top:8px;
  background: var(--acc); border-radius:2px;
}

/* Panels to cards */
.panel{
  border:1px solid var(--bd);
  border-radius:14px;
  overflow:hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.panel-heading{
  background: var(--bg-soft) !important;
  border-bottom:1px solid var(--bd) !important;
  font-weight:600; color: var(--txt);
}
.panel-body{ background:#fff; }

/* Tables */
.table{
  border-collapse: separate;
  border-spacing:0;
  border:1px solid var(--bd);
  border-radius:12px;
  overflow:hidden;
  background:#fff;
}
.table > thead > tr > th{
  background: var(--bg-soft);
  border-bottom:1px solid var(--bd);
  color: var(--muted);
  font-weight:600;
}
.table > tbody > tr:hover{ background:#fcfcff; }
.table > tbody > tr > td{ vertical-align: middle; }

/* Row actions spacing */
.btn-group .btn + .btn{ margin-left:4px; }

/* Forms */
.form-control{
  height:44px;
  border:1px solid var(--bd);
  border-radius:10px;
  background:#fff;
  box-shadow: inset 0 1px 0 rgba(0,0,0,.02);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.form-control:focus{
  border-color: var(--acc);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--acc) 22%, transparent);
  outline: none;
}
label{ color: var(--muted); font-weight:500; }

/* Select2 / chosen compatibility */
.select2-container .select2-selection--single,
.chosen-container-single .chosen-single{
  height:44px !important; border-radius:10px !important; border:1px solid var(--bd) !important;
}

/* Switch accent */
input[type="checkbox"], input[type="radio"]{ accent-color: var(--acc); }

/* Buttons */
.btn{
  border-radius:10px;
  padding:9px 14px;
  border:1px solid transparent;
  transition: transform .08s ease, box-shadow .15s ease, filter .15s ease;
}
.btn:active{ transform: translateY(1px); }
.btn-primary{ background: var(--acc); border-color: var(--acc); }
.btn-primary:hover{
  filter: brightness(1.05);
  box-shadow: 0 6px 18px color-mix(in srgb, var(--acc) 30%, transparent);
}
.btn-default{
  background:#fff; border:1px solid var(--bd); color: var(--txt);
}
.btn-default:hover{ border-color: var(--acc); background: var(--acc-2); }
.btn-danger{ background: var(--err); border-color: var(--err); }
.btn-warning{ background: var(--warn); border-color: var(--warn); }
.btn-success{ background: var(--ok); border-color: var(--ok); }

/* Filters row spacing */
.well{
  background: var(--bg-soft);
  border:1px dashed var(--bd);
  border-radius:12px;
}

/* Nav tabs (order, return, setting pages) */
.nav-tabs > li > a{ border-radius:10px 10px 0 0; }
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover{
  border-color: var(--acc) var(--acc) #fff;
  color: var(--txt);
}

/* Pagination */
.pagination > li > a, .pagination > li > span{
  border-radius:8px !important;
  margin: 0 4px;
  border-color: var(--bd);
}
.pagination > .active > a,
.pagination > .active > span{
  background: var(--acc); border-color: var(--acc);
}

/* Alerts */
.alert{
  border-radius:10px; border:1px solid var(--bd);
}
.alert-success{ background: color-mix(in srgb, var(--ok) 12%, #fff); border-color: color-mix(in srgb, var(--ok) 35%, #fff); }
.alert-warning{ background: color-mix(in srgb, var(--warn) 12%, #fff); border-color: color-mix(in srgb, var(--warn) 35%, #fff); }
.alert-danger{  background: color-mix(in srgb, var(--err) 12%, #fff); border-color: color-mix(in srgb, var(--err) 35%, #fff); }
.alert-info{    background: color-mix(in srgb, var(--info) 12%, #fff); border-color: color-mix(in srgb, var(--info) 35%, #fff); }

/* Modals */
.modal-content{
  border-radius:14px; border:1px solid var(--bd); box-shadow: 0 12px 30px rgba(0,0,0,.2);
}
.modal-header{ background: var(--bg-soft); border-bottom:1px solid var(--bd); }
.modal-footer{ border-top:1px solid var(--bd); }

/* Login page */
body.login{
  background: linear-gradient(135deg,#0ea5e9 0%, #6366f1 100%) !important;
}
#container .login-panel{
  border-radius:14px; border:1px solid rgba(255,255,255,.2);
  box-shadow: 0 10px 30px rgba(0,0,0,.2);
}

/* Dashboard tiles */
.dashboard-stats .well, .tile{
  border-radius:14px !important; border:1px solid var(--bd) !important;
  background:#fff !important;
}
.tile .tile-heading{ color: var(--muted) !important; }
.tile .tile-body{ color: var(--txt) !important; }
.tile .tile-footer{ background: var(--bg-soft) !important; border-top:1px solid var(--bd) !important; }

/* Code and pre */
code, pre{ border-radius:8px; }

/* Compact mode for dense tables */
.admin-compact .table > tbody > tr > td{ padding:8px 10px; }
.admin-compact .form-control{ height:38px; }

/* Dark toggle (optional) */
.admin-dark :root{
  --bg:#0b1220; --bg-soft:#0f172a; --txt:#e5e7eb; --muted:#9ca3af; --bd:#1f2937; --acc:#22d3ee; --acc-2:#083344;
}
.admin-dark #content .container-fluid,
.admin-dark .panel,
.admin-dark .table,
.admin-dark .well,
.admin-dark .modal-content{ background: var(--bg) !important; color: var(--txt); border-color: var(--bd); }
.admin-dark .table > thead > tr > th{ background: #0f172a; color: var(--muted); }
.admin-dark .btn-default{ background:#0f172a; color: var(--txt); border-color: var(--bd); }