/* =====================================================================
   UX v2 - light & minimal theme for the merchant (non-admin) section
   ===================================================================== */
:root{
  --ux-bg:#F6F7F9; --ux-surface:#FFFFFF; --ux-subtle:#FAFBFC;
  --ux-border:#E5E7EB; --ux-border-strong:#D1D5DB;
  --ux-text:#0F172A; --ux-text-2:#334155; --ux-muted:#64748B;
  --ux-accent:#2F5BEA; --ux-accent-hover:#2449C7; --ux-accent-soft:#EEF2FF;
  --ux-success:#0F7B55; --ux-success-soft:#E7F6EF;
  --ux-warn:#B45309; --ux-warn-soft:#FEF4E6;
  --ux-danger:#C0262D; --ux-danger-soft:#FDECEC;
  --ux-radius:12px; --ux-radius-sm:8px;
  --ux-shadow:0 1px 2px rgba(15,23,42,.04),0 1px 3px rgba(15,23,42,.06);
  --ux-font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --ux-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
/* ---------- base ---------- */
body.ux{background:var(--ux-bg)!important;color:var(--ux-text);font-family:var(--ux-font)!important;font-size:14px;padding-top:0!important;-webkit-font-smoothing:antialiased}
body.ux h1,body.ux h2,body.ux h3,body.ux h4,body.ux h5,body.ux h6{font-family:var(--ux-font)!important;color:var(--ux-text);letter-spacing:-.01em}
body.ux a{color:var(--ux-accent)}
body.ux .text-muted{color:var(--ux-muted)!important}

/* ---------- top bar ---------- */
.ux-top{position:sticky;top:0;z-index:1030;background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--ux-border)}
.ux-top__row{max-width:1320px;margin:0 auto;padding:0 24px;height:60px;display:flex;align-items:center;gap:20px}
.ux-brand{display:flex;align-items:center;gap:10px;text-decoration:none!important;color:var(--ux-text)!important;font-weight:700}
.ux-brand img{height:34px;width:auto}
.ux-nav{display:flex;gap:2px;flex:1;margin:0;padding:0;list-style:none}
.ux-nav>li{position:relative}
.ux-nav>li>a,.ux-nav>li>button{display:flex;align-items:center;gap:6px;height:36px;padding:0 12px;border-radius:8px;border:0;background:none;color:var(--ux-text-2)!important;font-weight:500;font-size:14px;text-decoration:none!important;cursor:pointer}
.ux-nav>li>a:hover,.ux-nav>li>button:hover,.ux-nav>li.open>button{background:#F1F3F6;color:var(--ux-text)!important}
.ux-nav>li.is-active>a,.ux-nav>li.is-active>button{color:var(--ux-accent)!important;background:var(--ux-accent-soft)}
.ux-nav .ux-caret{width:10px;height:10px;opacity:.6}
.ux-menu{display:none;position:absolute;top:42px;left:0;min-width:240px;background:#fff;border:1px solid var(--ux-border);border-radius:12px;box-shadow:0 12px 32px rgba(15,23,42,.12);padding:6px;z-index:1040}
.ux-nav>li.open>.ux-menu{display:block}
.ux-menu a{display:block;padding:9px 12px;border-radius:8px;color:var(--ux-text)!important;text-decoration:none!important;font-size:14px}
.ux-menu a small{display:block;color:var(--ux-muted);font-size:12px;margin-top:1px}
.ux-menu a:hover,.ux-menu a.is-active{background:#F4F6FA}
.ux-menu__label{padding:8px 12px 4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--ux-muted)}
.ux-top__right{display:flex;align-items:center;gap:10px;margin-left:auto}
.ux-chip{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border:1px solid var(--ux-border);border-radius:999px;background:#fff;font-size:13px;color:var(--ux-text-2)}
.ux-chip b{color:var(--ux-text);font-weight:600}
.ux-avatar{width:34px;height:34px;border-radius:50%;background:var(--ux-accent-soft);color:var(--ux-accent);display:flex;align-items:center;justify-content:center;font-weight:600;border:0;cursor:pointer}
.ux-burger{display:none;border:1px solid var(--ux-border);background:#fff;border-radius:8px;width:36px;height:36px;align-items:center;justify-content:center}
.ux-user-menu{right:0;left:auto}
@media (max-width:1100px){.ux-chip.ux-hide-md{display:none}}
@media (max-width:900px){
  .ux-burger{display:flex}
  .ux-nav{display:none;position:absolute;top:60px;left:0;right:0;flex-direction:column;background:#fff;border-bottom:1px solid var(--ux-border);padding:8px 16px 16px}
  .ux-top.nav-open .ux-nav{display:flex}
  .ux-menu{position:static;box-shadow:none;border:0;padding:0 0 0 12px}
  .ux-chip{display:none}
}

/* ---------- page ---------- */
.ux-main{max-width:1320px;margin:0 auto;padding:28px 24px 64px}
.ux-pagehead{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.ux-pagehead h1{font-size:24px;font-weight:700;margin:0}
.ux-crumb{font-size:13px;color:var(--ux-muted);margin-bottom:4px}
.ux-news{display:flex;gap:10px;align-items:center;background:var(--ux-warn-soft);color:var(--ux-warn);border-radius:10px;padding:10px 14px;margin-bottom:20px;font-size:13px}

/* ---------- cards ---------- */
.ux-card{background:var(--ux-surface);border:1px solid var(--ux-border);border-radius:var(--ux-radius);box-shadow:var(--ux-shadow)}
.ux-card__head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--ux-border)}
.ux-card__head h3{font-size:15px;font-weight:600;margin:0}
.ux-card__body{padding:20px}
.ux-grid{display:grid;gap:16px}
.ux-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.ux-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ux-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ux-grid-main{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}
@media (max-width:1000px){.ux-grid-4,.ux-grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}.ux-grid-main{grid-template-columns:1fr}}
@media (max-width:600px){.ux-grid-4,.ux-grid-3,.ux-grid-2{grid-template-columns:1fr}.ux-main{padding:20px 16px 48px}}
.ux-stat{padding:18px 20px}
.ux-stat__label{font-size:13px;color:var(--ux-muted);display:flex;align-items:center;justify-content:space-between}
.ux-stat__value{font-size:26px;font-weight:700;margin-top:6px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.ux-stat__sub{font-size:12px;color:var(--ux-muted);margin-top:4px}
.ux-wallet{position:relative;overflow:hidden}
.ux-wallet--primary{background:var(--ux-text);color:#fff;border-color:var(--ux-text)}
.ux-wallet--primary .ux-stat__label,.ux-wallet--primary .ux-stat__sub{color:#CBD5E1}
.ux-wallet--primary .ux-stat__value{color:#fff}
.ux-badge{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:999px;font-size:12px;font-weight:500;background:#F1F5F9;color:var(--ux-text-2)}
.ux-badge--success{background:var(--ux-success-soft);color:var(--ux-success)}
.ux-badge--warn{background:var(--ux-warn-soft);color:var(--ux-warn)}
.ux-badge--danger{background:var(--ux-danger-soft);color:var(--ux-danger)}
.ux-badge--accent{background:var(--ux-accent-soft);color:var(--ux-accent)}

/* quick actions */
.ux-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:700px){.ux-actions{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ux-action{display:flex;flex-direction:column;gap:10px;padding:16px;border:1px solid var(--ux-border);border-radius:12px;background:#fff;text-decoration:none!important;color:var(--ux-text)!important;transition:border-color .15s,box-shadow .15s}
.ux-action:hover{border-color:var(--ux-accent);box-shadow:0 0 0 3px var(--ux-accent-soft)}
.ux-action__icon{width:36px;height:36px;border-radius:10px;background:var(--ux-accent-soft);color:var(--ux-accent);display:flex;align-items:center;justify-content:center}
.ux-action b{font-weight:600;font-size:14px}
.ux-action span{font-size:12px;color:var(--ux-muted)}

/* list rows */
.ux-list{list-style:none;margin:0;padding:0}
.ux-list li{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;border-top:1px solid var(--ux-border);font-size:14px}
.ux-list li:first-child{border-top:0}
.ux-num{font-variant-numeric:tabular-nums;font-weight:600}

/* buttons */
.ux-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 18px;border-radius:10px;border:1px solid transparent;font-weight:600;font-size:14px;cursor:pointer;text-decoration:none!important;transition:background .15s,border-color .15s}
.ux-btn--primary{background:var(--ux-accent);color:#fff!important}
.ux-btn--primary:hover{background:var(--ux-accent-hover)}
.ux-btn--ghost{background:#fff;border-color:var(--ux-border-strong);color:var(--ux-text)!important}
.ux-btn--ghost:hover{background:#F8FAFC}
.ux-btn--block{width:100%}
.ux-btn[disabled]{opacity:.55;cursor:not-allowed}

/* forms */
.ux-field{margin-bottom:16px}
.ux-field label{display:block;font-size:13px;font-weight:500;color:var(--ux-text-2);margin-bottom:6px}
.ux-input{width:100%;height:44px;padding:0 14px;border:1px solid var(--ux-border-strong);border-radius:10px;background:#fff;font-size:15px;color:var(--ux-text);outline:none;transition:border-color .15s,box-shadow .15s}
.ux-input:focus{border-color:var(--ux-accent);box-shadow:0 0 0 3px var(--ux-accent-soft)}
.ux-hint{font-size:12px;color:var(--ux-muted);margin-top:6px}
.ux-error{font-size:13px;color:var(--ux-danger);margin-top:6px}

/* stepper */
.ux-steps{display:flex;gap:0;margin:0 0 24px;padding:0;list-style:none;counter-reset:s}
.ux-steps li{flex:1;display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ux-muted);font-weight:500;position:relative}
.ux-steps li:not(:last-child)::after{content:"";flex:1;height:2px;background:var(--ux-border);margin:0 12px}
.ux-steps li .dot{width:28px;height:28px;flex:0 0 28px;border-radius:50%;border:2px solid var(--ux-border-strong);display:flex;align-items:center;justify-content:center;font-size:12px;background:#fff}
.ux-steps li.is-current{color:var(--ux-text)}
.ux-steps li.is-current .dot{border-color:var(--ux-accent);color:var(--ux-accent)}
.ux-steps li.is-done .dot{background:var(--ux-accent);border-color:var(--ux-accent);color:#fff}
.ux-steps li.is-done::after{background:var(--ux-accent)}
@media (max-width:600px){.ux-steps li span.lbl{display:none}}

/* ======= legacy component re-skin (Limitless/Bootstrap3 pages inside the new shell) ======= */
body.ux .panel{border:1px solid var(--ux-border)!important;border-radius:var(--ux-radius)!important;box-shadow:var(--ux-shadow)!important;background:#fff}
body.ux .panel-heading{background:#fff!important;color:var(--ux-text)!important;border-bottom:1px solid var(--ux-border)!important;border-radius:var(--ux-radius) var(--ux-radius) 0 0!important;padding:14px 20px!important}
body.ux .panel-title{font-size:15px!important;font-weight:600!important;color:var(--ux-text)!important}
body.ux .panel-flat>.panel-heading{border-bottom:1px solid var(--ux-border)!important}
body.ux .content{padding:0!important}
body.ux .table>thead>tr>th{background:var(--ux-subtle)!important;color:var(--ux-muted)!important;font-size:12px!important;font-weight:600!important;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--ux-border)!important}
body.ux .table>tbody>tr>td{border-top:1px solid var(--ux-border)!important;color:var(--ux-text-2)}
body.ux .table-bordered,body.ux .table-bordered>tbody>tr>td,body.ux .table-bordered>thead>tr>th{border-color:var(--ux-border)!important}
body.ux .form-control{border:1px solid var(--ux-border-strong)!important;border-radius:10px!important;height:40px;padding:8px 12px!important;box-shadow:none!important;background:#fff!important}
body.ux textarea.form-control{height:auto}
body.ux .form-control:focus{border-color:var(--ux-accent)!important;box-shadow:0 0 0 3px var(--ux-accent-soft)!important}
body.ux .select2-selection{border-radius:10px!important;border-color:var(--ux-border-strong)!important;min-height:40px}
body.ux .btn{border-radius:10px!important;box-shadow:none!important;text-transform:none!important;font-weight:600}
body.ux .btn.bg-slate,body.ux .btn-primary,body.ux .bg-slate{background:var(--ux-accent)!important;border-color:var(--ux-accent)!important;color:#fff!important}
body.ux .btn-warning{background:#fff!important;color:var(--ux-text)!important;border:1px solid var(--ux-border-strong)!important}
body.ux .btn-labeled>b{background:transparent!important}
body.ux .modal-content{border-radius:16px!important;border:0!important;box-shadow:0 24px 60px rgba(15,23,42,.25)!important}
body.ux .modal-header,body.ux .modal-header.bg-slate{background:#fff!important;color:var(--ux-text)!important;border-bottom:1px solid var(--ux-border)!important;border-radius:16px 16px 0 0}
body.ux .modal-header .close{color:var(--ux-muted)!important}
body.ux .label{border-radius:999px!important;font-weight:500}
body.ux .nav-tabs{border-bottom:1px solid var(--ux-border)}
body.ux .nav-tabs>li.active>a{border-color:transparent!important;border-bottom:2px solid var(--ux-accent)!important;color:var(--ux-accent)!important}
body.ux .dataTables_wrapper .dataTables_paginate .paginate_button.current{background:var(--ux-accent)!important;color:#fff!important;border-radius:8px}
body.ux .dataTables_length,body.ux .dataTables_filter,body.ux .datatable-header,body.ux .datatable-footer{padding:12px 20px!important}
body.ux .page-header{display:none!important} /* legacy header replaced by .ux-pagehead */
body.ux .ux-filters .panel{margin-bottom:20px}
body.ux .page-container{padding-top:28px;min-height:0!important}
