:root{
  --m3-primary:#3559e0;
  --m3-on-primary:#ffffff;
  --m3-primary-container:#dbe2ff;
  --m3-on-primary-container:#0f1b4d;
  --m3-secondary:#5d5f77;
  --m3-secondary-container:#e2e2f9;
  --m3-tertiary:#7a4d7c;
  --m3-surface:#f7f8fc;
  --m3-surface-2:#f1f3fb;
  --m3-surface-3:#ebeffb;
  --m3-surface-container:#ffffffcc;
  --m3-surface-container-high:#ffffffee;
  --m3-outline:#c5c8d6;
  --m3-outline-2:#d8dbe7;
  --m3-text:#1a1c23;
  --m3-text-soft:#5f6372;
  --m3-danger:#b3261e;
  --m3-danger-container:#ffdad6;
  --m3-success:#266d2f;
  --m3-warning:#8a5b00;
  --m3-shadow:0 1px 2px rgba(20,24,40,.08),0 8px 28px rgba(20,24,40,.07);
  --m3-shadow-hover:0 4px 14px rgba(33,40,70,.12),0 18px 44px rgba(33,40,70,.10);
  --radius-xs:10px;
  --radius-sm:14px;
  --radius-md:18px;
  --radius-lg:24px;
  --radius-xl:32px;
}
html,body{min-height:100%}
body{
  font-family:Vazirmatn,system-ui,-apple-system,Segoe UI,Roboto,sans-serif !important;
  color:var(--m3-text);
  background:
    radial-gradient(circle at top right, rgba(53,89,224,.16), transparent 22%),
    radial-gradient(circle at bottom left, rgba(122,77,124,.10), transparent 26%),
    linear-gradient(180deg,#f9faff 0%,#f4f7ff 50%,#f6f7fb 100%);
}
a{color:inherit}
.wrap,.app{width:min(1520px,calc(100% - 20px));margin:0 auto}
.wrap{padding:10px 0 18px}
.app{padding:12px 0 18px}

.m3-appbar{
  position:sticky;top:0;z-index:60;
  display:flex;align-items:center;justify-content:center;
  min-height:64px;padding:10px 14px;
  background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.62));
  backdrop-filter:blur(16px) saturate(150%);
  border-bottom:1px solid rgba(197,200,214,.55);
  box-shadow:0 1px 0 rgba(255,255,255,.55);
}
.m3-appbar__inner{width:min(1520px,calc(100% - 20px));display:flex;align-items:center;justify-content:space-between;gap:12px}
.m3-brand{display:flex;align-items:center;gap:8px;min-width:0}
.m3-brand__logo{
  width:46px;height:46px;border-radius:14px;padding:6px;
  background:linear-gradient(145deg,rgba(53,89,224,.12),rgba(122,77,124,.08));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.75),0 8px 20px rgba(53,89,224,.08);
  object-fit:contain;display:block;
}
.m3-brand__title{font-size:.9rem;font-weight:900;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m3-brand__subtitle{font-size:.74rem;color:var(--m3-text-soft);font-weight:600}

.card,.modal-card,.panel,.card2,.inv-kpi,.acc-debt,.home-card,.login-brand,.card-footer,.send-tabs,.adv-panel,.dev-panel{
  border:1px solid rgba(197,200,214,.72) !important;
  background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(250,251,255,.92)) !important;
  box-shadow:0 1px 2px rgba(20,24,40,.06),0 4px 14px rgba(20,24,40,.05) !important;
}
.card,.panel,.card2,.acc-debt,.modal-card,.dev-panel{border-radius:18px !important}
.home-card,.inv-kpi{border-radius:18px !important}
.send-tabs,.adv-panel{border-radius:18px !important}

.home-top,.acc-topbar,.send-top,.header,.inv-kpis{
  gap:8px;
}
.home-top,.acc-topbar,.send-top,.header{
  background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(255,255,255,.4));
  border:1px solid rgba(197,200,214,.55);
  border-radius:20px;
  padding:12px 14px;
  box-shadow:var(--m3-shadow);
  backdrop-filter:blur(10px);
}
.home-title,h1,h2,h3,.acc-title{letter-spacing:-.03em}
.home-title{font-size:1.45rem !important;font-weight:950 !important}
.home-sub,.muted,.small-note,.hint,.note,.send-sub,.kpi-k{color:var(--m3-text-soft) !important}

.home-grid{gap:12px !important}
.home-card{
  position:relative;overflow:hidden;text-align:right;border-radius:30px !important;
  padding:14px !important;min-height:132px;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.home-card:hover{transform:translateY(-2px);box-shadow:var(--m3-shadow-hover) !important;border-color:rgba(53,89,224,.35)!important}
.home-card::before{
  content:"";position:absolute;inset:auto -12% -25% auto;width:160px;height:160px;border-radius:50%;
  background:radial-gradient(circle,rgba(53,89,224,.13),transparent 68%);pointer-events:none;
}
.hc-ico{
  width:44px;
  height:44px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;

  background:#e8edff; /* رنگ ملایم */
  color:#3b5bdb !important; /* آبی رسمی‌تر */

  box-shadow:0 2px 6px rgba(0,0,0,0.06); /* خیلی سبک */
  font-size:1rem !important;
  margin-bottom:10px;
}
.hc-t{font-size:.9rem !important;font-weight:900 !important;margin-bottom:4px}
.hc-d{line-height:1.65;color:var(--m3-text-soft) !important}

.btn,button,.tab,.tgl-btn,.cal-btn,.inv-cal-btn,a.btn{
  position:relative;overflow:hidden;
  font-family:inherit !important;
}
.btn,a.btn,button.btn,.tab,.tgl-btn{
  min-height:36px;border-radius:999px !important;border:1px solid rgba(197,200,214,.88) !important;
  background:rgba(255,255,255,.88) !important;color:var(--m3-text) !important;
  box-shadow:0 1px 1px rgba(20,24,40,.05);
  transition:transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease;
}
.btn:hover,a.btn:hover,button.btn:hover,.tab:hover,.tgl-btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(20,24,40,.09)}
.btn:active,a.btn:active,button.btn:active,.tab:active,.tgl-btn:active{transform:translateY(0)}
.btn.primary,a.btn.primary,button.btn.primary,.tab.active{
  background:linear-gradient(135deg,var(--m3-primary),#5b7aff) !important;
  color:#fff !important;border-color:transparent !important;
  box-shadow:0 6px 14px rgba(53,89,224,.22) !important;
}
.btn.settle-bad,.btn.danger,button.danger,.settle-bad{
  background:var(--m3-danger-container) !important;color:var(--m3-danger) !important;border-color:transparent !important;
}
.btn.settle-good,.settle-good{background:#d9f8dd !important;color:var(--m3-success) !important;border-color:transparent !important}
.btn.close-btn,.close,.close-btn{width:36px;height:36px;min-width:36px;padding:0 !important;border-radius:50% !important}

/* keep bill type buttons visibly highlighted after Material 3 redesign */
.btn.type{
  background:rgba(255,255,255,.96) !important;
  color:var(--m3-text) !important;
  border-color:rgba(197,200,214,.92) !important;
}
.btn.type.active{
  box-shadow:inset 0 0 0 1px rgba(53,89,224,.10), 0 4px 12px rgba(20,24,40,.08) !important;
}
.btn.type[data-type="pakhsh"].active{
  background:linear-gradient(180deg,#e8f7ef,#def3e8) !important;
  color:#0f6b46 !important;
  border-color:rgba(15,107,70,.28) !important;
}
.btn.type[data-type="misc"].active{
  background:linear-gradient(180deg,#eef3ff,#e5edff) !important;
  color:#2643a2 !important;
  border-color:rgba(38,67,162,.28) !important;
}
.btn.type[data-type="freezone"].active{
  background:linear-gradient(180deg,#fff3e6,#ffecd2) !important;
  color:#a3560a !important;
  border-color:rgba(163,86,10,.28) !important;
}
.btn.type[data-type="alanshop"].active{
  background:linear-gradient(180deg,#f7ecff,#f2e2ff) !important;
  color:#7a358f !important;
  border-color:rgba(122,53,143,.28) !important;
}
.btn.type:not(.active):hover{
  background:#f7f9ff !important;
}
.icon{font-size:.95em;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle}
.icon svg,.btn .icon svg{display:block}
svg.icon{flex:0 0 auto}

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),select,textarea,.input,#username,#password{
  width:100%;min-height:40px;border-radius:14px !important;
  border:1px solid rgba(197,200,214,.95) !important;
  background:linear-gradient(180deg,#fff,#fbfbff) !important;
  color:var(--m3-text) !important;
  padding:8px 12px !important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.75),0 1px 2px rgba(20,24,40,.04);
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
textarea{min-height:96px}
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,select:focus,textarea:focus,.input:focus,#username:focus,#password:focus{
  outline:none !important;border-color:rgba(53,89,224,.65) !important;
  box-shadow:0 0 0 4px rgba(53,89,224,.14), inset 0 1px 1px rgba(255,255,255,.75) !important;
  background:#fff !important;
}
label,.label,.mini-label,.lbl,.field label{font-weight:800 !important;color:#2b3140}
.req{color:var(--m3-danger)}
.select,.control,.date-wrap,.inv-date,.acc-date-wrap,.date-input-wrap{position:relative}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,#61677a 50%),linear-gradient(135deg,#61677a 50%,transparent 50%);background-position:calc(1.1rem) calc(50% - 3px),calc(.72rem) calc(50% - 3px);background-size:7px 7px,7px 7px;background-repeat:no-repeat;padding-left:1.9rem !important}
.cal-btn,.inv-cal-btn{
  position:absolute;inset:3px 0 3px 3px;display:flex;align-items:center;justify-content:center;
  width:34px;border:none !important;background:transparent !important;box-shadow:none !important;color:var(--m3-primary) !important;
}
.cal-ico,.inv-cal-ico{width:16px;height:16px}
.date-wrap > .input,.date-wrap > input,.inv-date > .input,.date-input-wrap > .input,.date-input-wrap > input{padding-left:40px !important}

table{width:100%;border-collapse:separate;border-spacing:0 6px !important}
thead th{
  font-size:.76rem !important;color:var(--m3-text-soft) !important;font-weight:900 !important;
  background:transparent !important;border:none !important;padding:0 8px 6px !important;
}
tbody td{
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,250,255,.94)) !important;
  border-top:1px solid rgba(197,200,214,.72) !important;
  border-bottom:1px solid rgba(197,200,214,.72) !important;
  padding:9px 10px !important;vertical-align:middle;
}
tbody tr td:first-child{border-right:1px solid rgba(197,200,214,.72) !important;border-top-right-radius:12px;border-bottom-right-radius:12px}
tbody tr td:last-child{border-left:1px solid rgba(197,200,214,.72) !important;border-top-left-radius:12px;border-bottom-left-radius:12px}
tr.row-selected td,.highlight-row td{background:linear-gradient(180deg,#eaf0ff,#eef4ff)!important;border-color:rgba(53,89,224,.35)!important}

.chip,.bd-chip,.badge,.status{
  display:inline-flex;align-items:center;gap:6px;
  min-height:26px;padding:4px 10px;border-radius:999px;
  background:rgba(53,89,224,.10) !important;color:var(--m3-primary) !important;border:1px solid rgba(53,89,224,.14) !important;
  font-weight:800 !important;
}
.badge{background:rgba(122,77,124,.12)!important;color:var(--m3-tertiary)!important;border-color:rgba(122,77,124,.18)!important}
.err{color:var(--m3-danger) !important;font-weight:700}

.modal{backdrop-filter:none}
.modal-backdrop{background:rgba(18,23,38,.36) !important;backdrop-filter:blur(5px)}
.modal-card{max-height:min(94vh,1100px) !important;overflow:hidden}
.modal-head,.modal-foot,.card2-h,.acc-exp-head,.dev-head{
  background:linear-gradient(180deg,rgba(245,247,255,.9),rgba(255,255,255,.72)) !important;
  border-bottom:1px solid rgba(197,200,214,.65) !important;
}
.modal-head,.modal-foot,.card2-h,.dev-head{padding:10px 12px !important}
.modal-body{padding:8px 10px !important}
.modal-foot{border-top:1px solid rgba(197,200,214,.65) !important;border-bottom:none !important}

.inv-kpis{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px !important;margin-bottom:16px !important}
.inv-kpi{padding:12px 14px !important;position:relative;overflow:hidden}
.inv-kpi::after{content:"";position:absolute;inset:auto -22px -28px auto;width:72px;height:72px;background:radial-gradient(circle,rgba(53,89,224,.15),transparent 70%);border-radius:50%}
.kpi-v{font-size:1.2rem !important;font-weight:950 !important;color:var(--m3-primary) !important;margin-top:10px}

.searchbar,.acc-filter,.dispatcher-form-scroll,.bill-form-scroll,.home-actions,.send-actions,.acc-actions,.actions,.header-actions{gap:8px}
.searchbar,.acc-filter,.dispatcher-form-scroll,.bill-form-scroll,.adv-panel{padding:10px !important}
.searchbar{background:linear-gradient(180deg,rgba(247,249,255,.9),rgba(255,255,255,.65));border-top:1px solid rgba(197,200,214,.55);border-bottom:1px solid rgba(197,200,214,.55)}
.adv-panel{margin:14px;border:1px solid rgba(197,200,214,.65) !important}
.adv-note,#liveHint,.adv-note,.hint{font-size:.78rem !important;line-height:1.65}

.panel-title,.bd-title,.inv-edit-title{font-size:.9rem;font-weight:900;color:#232838}
.panel{padding:8px 10px !important}
.content{gap:12px !important}
.form,.grid,.grid2,.grid3,.inv-edit-grid,.send-grid,.adv-grid{gap:12px !important}
.header-left{font-size:1rem;font-weight:900}
.card-footer{display:flex;justify-content:flex-end;gap:8px;padding:10px 12px !important;margin-top:16px}

.login-brand{width:min(420px,calc(100% - 28px));margin:20px auto 12px;padding:14px;display:flex;align-items:center;gap:12px;border-radius:18px !important}
.login-brand img{width:56px;height:56px;border-radius:16px;padding:7px;background:linear-gradient(145deg,rgba(53,89,224,.12),rgba(122,77,124,.08))}
.login-brand-text{font-size:1.15rem !important;font-weight:950 !important}
body > .card{width:min(460px,calc(100% - 28px));margin:0 auto 24px;border-radius:22px !important;overflow:hidden}
.head{padding:14px 14px 10px !important;background:linear-gradient(180deg,rgba(53,89,224,.08),rgba(255,255,255,.7)) !important;border-bottom:1px solid rgba(197,200,214,.65)}
.title{font-size:1.2rem !important;font-weight:950 !important}
.body{padding:14px !important}
.msg{border-radius:14px !important;padding:8px 10px !important;background:#fff5f5}

.send-tabs{display:flex;gap:8px;padding:6px !important;margin-bottom:10px}
.tab{padding:0 12px !important}
.tabpane.active{animation:m3Fade .22s ease}
@keyframes m3Fade{from{opacity:.45;transform:translateY(6px)}to{opacity:1;transform:none}}
.searchbox{border-radius:14px !important;border:1px solid rgba(197,200,214,.9);background:linear-gradient(180deg,#fff,#fbfbff)}
.searchbox input{border:none !important;box-shadow:none !important;background:transparent !important}

.toast{
  border-radius:14px !important;background:rgba(28,31,39,.95) !important;color:#fff !important;
  box-shadow:0 16px 38px rgba(18,23,38,.28) !important;border:none !important
}

.ripple-host{position:relative;overflow:hidden}
.ripple-host .m3-ripple{
  position:absolute;border-radius:50%;transform:scale(0);animation:m3Ripple .55s ease-out;
  background:rgba(255,255,255,.32);pointer-events:none;
}
@keyframes m3Ripple{to{transform:scale(4);opacity:0}}

@media (max-width: 900px){
  .wrap,.app{width:calc(100% - 12px)}
  .m3-appbar__inner{width:calc(100% - 12px)}
  .home-title{font-size:1.2rem !important}
  .inv-kpis{grid-template-columns:1fr !important}
  .home-card{min-height:160px;padding:8px 10px !important}
  .home-top,.acc-topbar,.send-top,.header{padding:12px}
  .m3-brand__subtitle{display:none}
}
@media (max-width: 640px){
  .m3-brand__logo{width:40px;height:40px;border-radius:12px}
  .m3-brand__title{font-size:.9rem}
  .btn,a.btn,button.btn,.tab,.tgl-btn{min-height:34px}
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),select,textarea,.input,#username,#password{min-height:38px}
  tbody td{padding:8px 10px !important}
}


/* compact tuning for data-dense pages */
body.compact-ui table{font-size:.92rem}
body.compact-ui tbody td{line-height:1.45}
body.compact-ui .btn, body.compact-ui a.btn, body.compact-ui button.btn, body.compact-ui .tab{font-size:.88rem;padding:0 12px !important}
body.compact-ui input, body.compact-ui select, body.compact-ui textarea, body.compact-ui .input{font-size:.92rem}
body.compact-ui .searchbar, body.compact-ui .acc-filter, body.compact-ui .adv-panel{padding:8px !important}
body.compact-ui .panel, body.compact-ui .card, body.compact-ui .card2{border-radius:16px !important}


/* keep native checkbox/radio controls compact after global Material 3 inputs */
input[type="radio"],input[type="checkbox"]{
  width:18px !important;
  min-width:18px !important;
  max-width:18px !important;
  height:18px !important;
  min-height:18px !important;
  padding:0 !important;
  margin:0 !important;
  border:none !important;
  background:transparent !important;
  box-shadow:none !important;
  display:inline-block !important;
  vertical-align:middle;
  flex:0 0 18px;
  accent-color:var(--m3-primary);
}
input[type="checkbox"]{border-radius:4px !important}
input[type="radio"]{border-radius:50% !important}

/* fix Persian datepicker layout after global table/input redesign */
.datepicker-plot-area{
  width:286px !important;
  min-width:286px !important;
  padding:8px !important;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(246,248,255,.98)) !important;
}
.datepicker-plot-area table{
  width:100% !important;
  border-collapse:collapse !important;
  border-spacing:0 !important;
  table-layout:fixed !important;
}
.datepicker-plot-area thead th,
.datepicker-plot-area tbody td,
.datepicker-plot-area tbody tr td:first-child,
.datepicker-plot-area tbody tr td:last-child{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  border-radius:0 !important;
  padding:0 !important;
}
.datepicker-plot-area .datepicker-day-view .month-grid-box{
  min-height:auto !important;
  margin:6px 0 0 !important;
}
.datepicker-plot-area .datepicker-day-view .month-grid-box .header{
  padding-bottom:4px !important;
}
.datepicker-plot-area .datepicker-day-view .month-grid-box .header .header-row{
  height:24px !important;
}
.datepicker-plot-area .datepicker-day-view .month-grid-box .header .header-row-cell{
  height:24px !important;
  line-height:24px !important;
  font-size:11px !important;
}
.datepicker-plot-area .datepicker-day-view .table-days td{
  width:14.2857% !important;
  height:34px !important;
  padding:0 !important;
}
.datepicker-plot-area .datepicker-day-view .table-days td span{
  width:34px !important;
  height:34px !important;
  line-height:34px !important;
  margin:0 auto !important;
  font-size:12px !important;
  border-radius:10px !important;
}
.datepicker-plot-area .datepicker-day-view .table-days td .alter-calendar-day{
  font-size:8px !important;
  bottom:2px !important;
  right:3px !important;
}
.datepicker-plot-area .datepicker-month-view,
.datepicker-plot-area .datepicker-year-view{
  padding-top:6px !important;
}
.datepicker-plot-area .datepicker-month-view .month-item,
.datepicker-plot-area .datepicker-year-view .year-item{
  height:38px !important;
  line-height:38px !important;
  font-size:12px !important;
}
.datepicker-plot-area .datepicker-navigator .pwt-btn,
.datepicker-plot-area .toolbox .pwt-btn{
  height:30px !important;
  line-height:30px !important;
  font-size:12px !important;
}

/* compact and tidy pick-fare select modal */
#pickSelectModal .modal-card{width:min(460px,calc(100% - 24px)) !important}
#pickSelectModal .modal-body{padding-top:12px !important}
#pickSelectModal .modal-foot{padding-top:10px !important}
.pfs-list{gap:6px !important}
.pfs-item{
  min-height:44px;
  padding:8px 10px !important;
  border-radius:14px !important;
}
.pfs-left{gap:8px !important}
.pfs-radio{
  transform:none !important;
  width:16px !important;
  min-width:16px !important;
  height:16px !important;
  min-height:16px !important;
  flex:0 0 16px;
}
.pfs-money{font-size:.92rem}
.pfs-hint{font-size:11.5px !important;margin-top:8px !important}


/* V46 - bills list should look like flat Material rows, not cards */
.bills-page .bills-table{
  border-collapse:collapse !important;
  border-spacing:0 !important;
}
.bills-page .bills-table thead th{
  padding:0 8px 8px !important;
}
.bills-page .bills-table tbody td{
  background:transparent !important;
  border:0 !important;
  border-bottom:1px solid rgba(197,200,214,.72) !important;
  border-radius:0 !important;
  box-shadow:none !important;
  padding:10px 10px !important;
}
.bills-page .bills-table tbody tr td:first-child,
.bills-page .bills-table tbody tr td:last-child{
  border-right:0 !important;
  border-left:0 !important;
  border-radius:0 !important;
}
.bills-page .bills-table tbody tr:hover td{
  background:rgba(53,89,224,.03) !important;
}
.bills-page .bills-table tr.row-selected td,
.bills-page .bills-table .highlight-row td{
  background:linear-gradient(180deg,#eaf0ff,#eef4ff)!important;
  border-bottom-color:rgba(53,89,224,.35)!important;
}
.bills-page .bills-table tr.row-delivering td{
  background-image:linear-gradient(180deg,rgba(255,247,237,.35),rgba(255,247,237,.2)) !important;
}

/* V46 - tighter Persian datepicker sizing */
.datepicker-plot-area{
  min-width:280px !important;
}
.datepicker-plot-area .datepicker-day-view .table-days td{
  height:34px !important;
}
.datepicker-plot-area .datepicker-day-view .table-days td span,
.datepicker-plot-area .datepicker-day-view .table-days td .alter-calendar-day{
  min-width:30px !important;
  min-height:30px !important;
  line-height:30px !important;
  font-size:12px !important;
}
.datepicker-plot-area .datepicker-day-view .month-grid-box .header .header-row-cell{
  font-size:11px !important;
  padding:4px 0 !important;
}


/* V47 - cleaner bills toolbar + table header */
.bills-page .compact-toolbar .toolbar-main{
  flex-wrap:wrap;
  row-gap:8px;
}
.bills-page .compact-toolbar .back-btn{
  margin-inline-start:0 !important;
}
.bills-page .bills-table thead th{
  position:sticky;
  top:0;
  z-index:2;
  background:linear-gradient(180deg,#f8f9fd 0%, #f1f3f9 100%) !important;
  color:#4e5567 !important;
  font-size:.9rem !important;
  font-weight:900 !important;
  padding:14px 12px !important;
  border-top:1px solid rgba(197,200,214,.72) !important;
  border-bottom:1px solid rgba(197,200,214,.92) !important;
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.75);
}
.bills-page .bills-table thead th:first-child{
  border-top-right-radius:14px;
}
.bills-page .bills-table thead th:last-child{
  border-top-left-radius:14px;
}
.bills-page .bills-table thead tr th + th{
  border-right:1px solid rgba(197,200,214,.35) !important;
}
.bills-page .bills-table thead input[type="checkbox"]{
  width:20px;
  height:20px;
}
.bills-page .bills-table tbody td{
  padding:12px 10px !important;
}


/* V50 - clickable sortable table headers */
.bills-page .sortable-col{
  position:relative;
  cursor:pointer;
  user-select:none;
  -webkit-user-select:none;
  outline:none;
  white-space:nowrap;
  text-align:center;
  vertical-align:middle;
  padding-inline:22px 10px !important;
}
.bills-page .sortable-col .th-label{
  display:inline-block;
  line-height:1.35;
  text-align:center;
}
.bills-page .sortable-col .sort-indicator{
  position:absolute;
  inset-inline-start:6px;
  bottom:6px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:10px;
  height:10px;
  opacity:.42;
  transform:none;
  pointer-events:none;
}
.bills-page .sortable-col .sort-indicator svg{
  display:block;
  width:10px !important;
  height:10px !important;
  max-width:10px;
  max-height:10px;
}
.bills-page .sortable-col:hover,
.bills-page .sortable-col:focus-visible{
  background:linear-gradient(180deg,#eef2ff 0%, #e7ecff 100%) !important;
}
.bills-page .sortable-col.is-active{
  color:var(--m3-primary) !important;
  background:linear-gradient(180deg,#eef2ff 0%, #e7ecff 100%) !important;
}
.bills-page .sortable-col.is-active .sort-indicator{
  opacity:.95;
}
.bills-page .sortable-col[data-direction="asc"] .sort-indicator{
  transform:scaleY(-1);
}
.bills-page .sortable-col[data-direction="desc"] .sort-indicator{
  transform:none;
}
.bills-page .sortable-col[data-direction="none"] .sort-indicator{
  opacity:.35;
}

.selected-count-badge{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:0 10px;
  border-radius:999px;
  border:1px solid var(--border);
  background:var(--surface);
  color:var(--muted);
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
}
.selected-count-badge.has-selection{
  color:var(--primary);
  border-color:color-mix(in srgb, var(--primary) 28%, var(--border));
  background:color-mix(in srgb, var(--primary) 10%, white);
}


/* V9 mobile bills toolbar cleanup */
@media (max-width: 768px){
  .bills-page .compact-toolbar{
    display:block !important;
    padding:12px !important;
    border-radius:24px !important;
  }
  .bills-page .compact-toolbar .toolbar-main{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px !important;
    width:100%;
    min-width:0;
  }
  .bills-page .compact-toolbar .toolbar-main > .btn,
  .bills-page .compact-toolbar .toolbar-main > a.btn{
    width:100%;
    min-width:0;
    min-height:46px;
    height:auto;
    padding:10px 12px !important;
    justify-content:center !important;
    text-align:center;
    white-space:normal !important;
    line-height:1.35;
    font-size:.98rem;
    gap:6px !important;
  }
  .bills-page .compact-toolbar .toolbar-main > .btn .icon,
  .bills-page .compact-toolbar .toolbar-main > a.btn .icon,
  .bills-page .compact-toolbar .toolbar-more > summary.btn .icon{
    font-size:15px !important;
    width:15px !important;
    height:15px !important;
    flex:0 0 15px;
  }
  .bills-page .compact-toolbar .toolbar-main > .btn.primary,
  .bills-page .compact-toolbar .toolbar-main > a.btn.primary{
    min-height:52px;
    font-size:1.02rem;
  }
  .bills-page .compact-toolbar .toolbar-more{
    width:100%;
    margin-top:10px;
  }
  .bills-page .compact-toolbar .toolbar-more > summary.btn{
    width:100%;
    min-height:46px;
    justify-content:center !important;
    text-align:center;
    white-space:nowrap;
  }
  .bills-page .compact-toolbar .toolbar-menu{
    right:0;
    left:0;
    min-width:0;
    width:100%;
  }
  .bills-page .compact-toolbar .toolbar-menu .btn,
  .bills-page .compact-toolbar .toolbar-menu a.btn{
    width:100%;
    justify-content:center;
  }
}

@media (max-width: 420px){
  .bills-page .compact-toolbar .toolbar-main{
    grid-template-columns:minmax(0,1fr);
  }
}

/* v43 send page: compact square ellipsis buttons next to package/material inputs */
body.send-page .option-picker-inline{
  grid-template-columns:minmax(0,1fr) 36px !important;
  gap:8px !important;
}
body.send-page .option-picker-inline .option-modal-btn,
body.send-page .option-picker-inline button.option-modal-btn.btn{
  width:36px !important;
  min-width:36px !important;
  max-width:36px !important;
  height:36px !important;
  min-height:36px !important;
  max-height:36px !important;
  padding:0 !important;
  border-radius:10px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 36px !important;
  line-height:1 !important;
  font-size:15px !important;
  font-weight:900 !important;
}
@media (max-width:760px){
  body.send-page .option-picker-inline{
    grid-template-columns:minmax(0,1fr) 34px !important;
    gap:6px !important;
  }
  body.send-page .option-picker-inline .option-modal-btn,
  body.send-page .option-picker-inline button.option-modal-btn.btn{
    width:34px !important;
    min-width:34px !important;
    max-width:34px !important;
    height:34px !important;
    min-height:34px !important;
    max-height:34px !important;
    border-radius:9px !important;
    flex-basis:34px !important;
    font-size:14px !important;
  }
}