/* Front-end console + trade account area.
   Uses the theme's brand tokens where present, with its own fallbacks so it
   still looks right under any theme. */
.ata-c,.ata-acct,.ata-apply,.ata-table--front,.ata-note,.ata-btn,.ata-pill,.ata-field,.ata-card{
  --navy:var(--brand-navy,#163259);--red:var(--brand-red,#ED1C24);
  --n50:#f7f9fb;--n100:#eef2f6;--n200:#e0e6ed;--n400:#9aa8b6;--n500:#6b7b8c;--n700:#33414f;
  --ok:#1B7F4C;--warn:#B26B00;--err:#B3261E;
  --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
}

/* The plugin's own border-box reset.
   Every field here is `width:100%` with padding and a border on top. Under a
   theme that sets `box-sizing:border-box` globally that is correct; under one
   that does not, each input renders ~25px wider than its column and every
   two-column form spills out of its card. This plugin is meant to drop into
   other builds, so it cannot assume the theme did it. Scoped to our own
   containers so we never reset a page we do not own. */
.ata-c,.ata-acct,.ata-apply,.ata-acct-banner,
.ata-c *,.ata-c *::before,.ata-c *::after,
.ata-acct *,.ata-acct *::before,.ata-acct *::after,
.ata-apply *,.ata-apply *::before,.ata-apply *::after,
.ata-acct-banner *{box-sizing:border-box}

/* ---- console shell ---- */
.ata-c{display:grid;grid-template-columns:232px 1fr;gap:0;max-width:1440px;margin:0 auto;
  min-height:70vh;font-family:var(--font);background:#fff;border:1px solid var(--n200);
  border-radius:14px;overflow:hidden;box-shadow:0 1px 2px rgba(22,50,89,.06),0 8px 30px rgba(22,50,89,.07)}
.ata-c__nav{background:var(--navy);padding:18px 0}
.ata-c__user{padding:0 18px 16px;margin-bottom:10px;border-bottom:1px solid rgba(255,255,255,.12)}
.ata-c__user .nm{color:#fff;font-weight:700;font-size:14px}
.ata-c__user .rl{color:#8fabcb;font-size:11.5px;margin-top:3px;display:flex;align-items:center;gap:6px}
.ata-c__user .rl::before{content:"";width:6px;height:6px;border-radius:50%;background:#5fd39a}
.ata-c__link{display:flex;align-items:center;gap:8px;padding:10px 18px;color:#c2d3e6;font-size:13.5px;
  text-decoration:none;border-left:3px solid transparent;transition:.16s}
.ata-c__link:hover{background:rgba(255,255,255,.07);color:#fff}
.ata-c__link.is-active{background:rgba(255,255,255,.11);color:#fff;border-left-color:var(--red);font-weight:650}
.ata-c__link.is-locked{opacity:.32;cursor:not-allowed}
.ata-c__link--exit{margin-top:14px;border-top:1px solid rgba(255,255,255,.12);padding-top:14px;font-size:12.5px}
.ata-c__badge{margin-left:auto;background:var(--red);color:#fff;font-size:10.5px;font-weight:800;
  padding:1px 7px;border-radius:10px}
.ata-c__body{padding:26px 28px 40px;background:var(--n50);overflow:auto}
.ata-c__head{margin-bottom:20px}
.ata-c__head h1{margin:0;font-size:24px;color:var(--navy);letter-spacing:-.01em}
.ata-c__head p{margin:4px 0 0;color:var(--n500);font-size:14px}

/* ---- shared bits ---- */
.ata-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:13px;margin-bottom:22px}
.ata-stat{background:#fff;border:1px solid var(--n200);border-radius:11px;padding:16px}
.ata-stat .l{font-size:10.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--n500)}
.ata-stat .v{font-size:25px;font-weight:800;color:var(--navy);margin-top:6px;line-height:1.1;letter-spacing:-.02em}
.ata-stat .d{font-size:11.5px;color:var(--n500);margin-top:5px;font-weight:600}
.ata-stat .d.warn{color:var(--warn)}.ata-stat .d.err{color:var(--err)}

.ata-card{background:#fff;border:1px solid var(--n200);border-radius:11px;overflow:hidden;margin-bottom:20px}
.ata-card__h{padding:13px 17px;border-bottom:1px solid var(--n200);background:var(--n50)}
.ata-card__h h2{margin:0;font-size:14.5px;color:var(--navy)}
.ata-card__b{padding:17px;font-size:13.5px;color:var(--n700);line-height:1.65}

table.ata-table{width:100%;border-collapse:collapse;font-size:13px;background:#fff}
table.ata-table th{background:var(--n50);padding:10px 14px;text-align:left;font-size:10.5px;font-weight:800;
  letter-spacing:.07em;text-transform:uppercase;color:var(--n500);border-bottom:1px solid var(--n200);white-space:nowrap}
table.ata-table td{padding:11px 14px;border-bottom:1px solid var(--n100);vertical-align:middle;color:var(--n700)}
table.ata-table tr:last-child td{border-bottom:0}
table.ata-table tbody tr:hover{background:var(--n50)}
table.ata-table .mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;color:var(--n500)}
.ata-empty{text-align:center;color:var(--n500);padding:34px!important}
.ata-dim{color:var(--n500);font-size:12.5px}
.ata-num{width:92px;padding:7px 9px;border:1.5px solid var(--n200);border-radius:6px;font:inherit;font-size:13px}
.ata-num:focus{outline:0;border-color:var(--navy);box-shadow:0 0 0 3px rgba(22,50,89,.09)}

.ata-pill{display:inline-block;font-size:11px;font-weight:750;padding:3px 9px;border-radius:11px;white-space:nowrap}
.ata-pill--ok{background:#e6f4ec;color:var(--ok)}
.ata-pill--wn{background:#fdf3e3;color:var(--warn)}
.ata-pill--er{background:#fcebea;color:var(--err)}
.ata-pill--nv{background:#e8eef7;color:var(--navy)}
.ata-pill--nu{background:var(--n100);color:var(--n500)}

.ata-btn{display:inline-block;padding:7px 14px;border:1.5px solid var(--n200);background:#fff;border-radius:7px;
  font-size:12.5px;font-weight:700;color:var(--navy);text-decoration:none;cursor:pointer;transition:.16s;font-family:inherit}
.ata-btn:hover{border-color:var(--navy);color:var(--navy)}
.ata-btn--primary{background:var(--red);border-color:var(--red);color:#fff}
.ata-btn--primary:hover{background:#c8151c;border-color:#c8151c;color:#fff}

.ata-note{padding:13px 16px;border-radius:10px;font-size:13.5px;line-height:1.55;margin-bottom:18px;border:1px solid;
  background:#eef4fb;border-color:#cddef2;color:#1d4275}
.ata-note--ok{background:#e9f6ef;border-color:#bfe3ce;color:#12693d}
.ata-note--err{background:#fdeeed;border-color:#f5cfcd;color:#8d1d17}

.ata-2col{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.ata-kv{display:grid;grid-template-columns:130px 1fr;gap:6px 14px;margin:12px 0 0;font-size:13px}
.ata-kv dt{color:var(--n500);font-weight:600}
.ata-kv dd{margin:0;color:var(--navy);font-weight:650}
.ata-field{display:block;margin-bottom:12px}
.ata-field span{display:block;font-size:12px;font-weight:700;color:var(--n500);margin-bottom:5px}
.ata-field input{width:100%;padding:9px 11px;border:1.5px solid var(--n200);border-radius:7px;font:inherit;font-size:14px}
.ata-field input:focus{outline:0;border-color:var(--navy);box-shadow:0 0 0 3px rgba(22,50,89,.09)}
.ata-search{display:flex;gap:8px;margin-bottom:16px}
.ata-search input{flex:1;max-width:340px;padding:9px 12px;border:1.5px solid var(--n200);border-radius:7px;font:inherit;font-size:13.5px}

.ata-list__row{display:flex;align-items:center;gap:14px;padding:13px 17px;border-bottom:1px solid var(--n100)}
.ata-list__row:last-child{border-bottom:0}
.ata-list__row div{flex:1}
.ata-list__row strong{display:block;color:var(--navy);font-size:13.5px}
.ata-list__row span{display:block;color:var(--n500);font-size:12.5px;margin-top:2px}

table.ata-matrix td{text-align:center;font-size:15px}
table.ata-matrix td.yes{color:var(--ok)}
table.ata-matrix td.no{color:var(--n400)}
table.ata-matrix .lbl{text-align:left;font-weight:650;color:var(--navy);font-size:12.5px}

/* ---- trade account area on the storefront ---- */
.ata-acct{border:1px solid var(--n200);border-radius:12px;padding:20px;margin-bottom:26px;background:#fff;font-family:var(--font)}
.ata-acct__head{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.ata-acct__head h2{margin:0;font-size:19px;color:var(--navy)}
table.ata-table--front{border:1px solid var(--n200);border-radius:11px;overflow:hidden;margin-bottom:14px}

/* ---- product form, activity log, accounting ---- */
.ata-prodform{max-width:820px}
.ata-prodform .ata-card{margin-bottom:18px}
.ata-field textarea,.ata-field select{width:100%;padding:9px 11px;border:1.5px solid var(--n200);border-radius:7px;
  font:inherit;font-size:14px;background:#fff;color:var(--navy)}
.ata-field textarea{resize:vertical;min-height:96px;line-height:1.55}
.ata-field textarea:focus,.ata-field select:focus{outline:0;border-color:var(--navy);box-shadow:0 0 0 3px rgba(22,50,89,.09)}
.ata-field input[type=file]{padding:8px;background:var(--n50,#f7f8fa);border-style:dashed;cursor:pointer;font-size:13px}
.ata-field select[disabled]{background:var(--n100);color:var(--n500);cursor:not-allowed}
.ata-field small{display:block;margin-top:5px;font-size:11.5px;color:var(--n500);line-height:1.5}

.ata-check{display:flex;align-items:flex-start;gap:9px;padding:12px 14px;border:1.5px solid var(--n200);
  border-radius:9px;cursor:pointer;margin-bottom:6px;transition:.16s}
.ata-check:hover{border-color:var(--navy)}
.ata-check input{margin-top:2px;width:16px;height:16px;accent-color:var(--red);flex:0 0 auto}
.ata-check span{font-size:13.5px;font-weight:650;color:var(--navy);line-height:1.45}

.ata-thumb{margin-bottom:14px}
.ata-thumb img{width:104px;height:104px;object-fit:contain;border:1px solid var(--n200);border-radius:9px;background:#fff;padding:6px}

.ata-btn--big{padding:11px 22px;font-size:14px}

.ata-link{color:var(--navy);font-weight:700;text-decoration:none;border-bottom:1.5px solid rgba(22,50,89,.25)}
.ata-link:hover{color:var(--red);border-bottom-color:var(--red)}

table.ata-log td{vertical-align:top;font-size:12.5px}
table.ata-log td:first-child{white-space:nowrap}
.ata-search select{padding:9px 12px;border:1.5px solid var(--n200);border-radius:7px;font:inherit;font-size:13.5px;background:#fff;color:var(--navy)}

@media(max-width:900px){
  .ata-c{grid-template-columns:1fr}
  .ata-c__nav{display:flex;overflow-x:auto;padding:8px}
  .ata-c__link{border-left:0;border-bottom:3px solid transparent;white-space:nowrap;padding:10px 14px}
  .ata-c__link.is-active{border-left:0;border-bottom-color:var(--red)}
  .ata-c__user{display:none}
  .ata-2col{grid-template-columns:1fr}
}
.ata-bullets{margin:10px 0 14px;padding-left:20px;font-size:13.5px;color:var(--navy);line-height:1.7}
.ata-bullets li{margin-bottom:3px}

/* ---- pricing, shipping, bulk markup ---- */
.ata-worked{margin:14px 0 18px;max-width:460px}
.ata-worked table{margin:0}
.ata-worked td{font-variant-numeric:tabular-nums}

.ata-paysbox{margin:2px 0 14px;padding:11px 14px;border-radius:9px;background:#eef4fb;border:1px solid #cddef2;
  font-size:13px;color:#1d4275;line-height:1.6}
.ata-paysbox strong{font-size:16px;font-variant-numeric:tabular-nums}
.ata-paysbox em{font-style:normal;color:var(--n500);display:block;font-size:12px;margin-top:2px}

.ata-pays{color:var(--n500);font-variant-numeric:tabular-nums}

.ata-note--warn{background:#fdf5e8;border-color:#f0dcb4;color:#7a5312}

.ata-filters{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap}
.ata-filters .ata-field{margin-bottom:0;min-width:180px}
.ata-filters button{margin-bottom:1px}

.ata-markup-bar{display:flex;gap:20px;align-items:flex-end;flex-wrap:wrap}
.ata-markup-count{font-size:13px;color:var(--n500);padding-bottom:9px}
.ata-markup-count strong{font-size:19px;color:var(--navy);display:inline-block;min-width:26px}
.ata-markup-bar button{margin-bottom:2px}

table.ata-markup td{font-variant-numeric:tabular-nums}
table.ata-markup tr.is-off{opacity:.4}
table.ata-markup input[type=checkbox]{width:16px;height:16px;accent-color:var(--red)}
/* Any table where rows are picked, not just the bulk-price one. */
table.ata-table input[type=checkbox]{width:16px;height:16px;accent-color:var(--red)}
/* A subheading inside a card, for a screen that holds two lists at once. */
.ata-card__b h3{font-size:14px;font-weight:800;color:var(--navy);margin:22px 0 10px;
  text-transform:uppercase;letter-spacing:.05em}
.ata-card__b h3:first-child{margin-top:4px}
.ata-new.is-up{color:var(--err);font-weight:750}
.ata-new.is-down{color:var(--ok);font-weight:750}

.ata-card--undo{border-color:#f0dcb4;background:#fdf9f1}

/* shipping option notes at checkout (storefront, not console) */
.ata-rate-note{display:block;font-size:12.5px;color:#5b6472;line-height:1.5;margin:2px 0 4px}

/* ---- people, enrollment, application ---- */
.ata-3col{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px}
.ata-inline{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
/* A labelled field sitting on the same line as its button. Without a flex
   basis the label collapses narrower than the input inside it and the button
   lands on top of the text box; --bottom lines the button up with the input
   rather than with the label above it. */
.ata-inline>.ata-field{flex:0 1 340px;margin:0;min-width:200px}
.ata-inline--bottom{align-items:flex-end}
.ata-inline select{padding:7px 10px;border:1.5px solid var(--n200);border-radius:7px;font:inherit;font-size:13px;background:#fff;color:var(--navy)}
.ata-inline form{margin:0}
.ata-subhead{margin:18px 0 6px;font-size:13px;font-weight:750;color:var(--n500);
  text-transform:uppercase;letter-spacing:.05em}
.ata-subhead:first-of-type{margin-top:4px}
.ata-card--opt{border-color:#cddef2;background:#f7fafd}

/* the public application page (storefront, not console) */
.ata-apply{max-width:780px;margin:0 auto;padding:40px 20px 60px;font-family:var(--font)}
.ata-apply h1{font-size:31px;color:var(--navy);margin:0 0 10px}
.ata-apply .ata-lede{font-size:16px;color:var(--n500);line-height:1.65;margin:0 0 26px}
.ata-apply .ata-card{margin-bottom:18px}

@media(max-width:760px){
  .ata-3col{grid-template-columns:1fr}
}

/* payout breakdown row */
tr.ata-breakdown td{background:var(--n50);padding:16px 18px}
tr.ata-breakdown .ata-kv{max-width:340px;margin:0}
tr.ata-breakdown p{margin:12px 0 0}

/* ---- destructive actions ---- */
.ata-btn--danger{border-color:#f0c8c5;color:var(--err);background:#fff}
.ata-btn--danger:hover{background:var(--err);border-color:var(--err);color:#fff}

/* A delete that is not allowed: shown, greyed, and it says why on hover. */
.ata-danger-off{display:inline-block;padding:7px 14px;font-size:12.5px;font-weight:700;
  color:var(--n400);border:1.5px dashed var(--n200);border-radius:7px;cursor:not-allowed;white-space:nowrap}

/* Forms that exist only to be targeted by a button's form attribute. */
.ata-hidden-form{display:none}
.ata-inline-form{display:inline-block;margin:0}

/* Edit and Delete sit together on the product's own row, hard right, so the
   eye travels along the line it is already reading instead of hunting for a
   detached control further down the page. */
.ata-col-actions{width:1%}
.ata-table td.ata-row-actions{text-align:right;white-space:nowrap}
.ata-table td.ata-row-actions>*{vertical-align:middle}
.ata-table td.ata-row-actions>*+*{margin-left:12px}
.ata-btn--sm{padding:5px 11px;font-size:12px;line-height:1.35}
.ata-row-actions .ata-danger-off{padding:5px 11px;font-size:12px;line-height:1.35}

/* A figure someone is scanning the column for, as opposed to a reference
   number. `.mono` is deliberately quiet, which is right for a SKU and wrong
   for lifetime spend — the most useful number on the row should not be the
   faintest thing on it. Tabular figures so the decimal points line up. */
table.ata-table td.ata-money{font-variant-numeric:tabular-nums;font-weight:700;color:var(--navy);white-space:nowrap}
table.ata-table td.ata-money--off{font-weight:600;color:var(--err)}

/* Previous / next on any list longer than one page. */
.ata-pager{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:16px 0 4px}
.ata-pager .ata-dim{margin:0}

.ata-card--danger{border-color:#f0c8c5}
.ata-card--danger .ata-card__h{background:#fdeeed;border-bottom-color:#f0c8c5}
.ata-card--danger .ata-card__h h2{color:var(--err)}
