/* ==========================================================================
   Payee Global — app2 skin (pg-app.css)  ·  v1, 27 Sep 2026
   Blood on cream, liquid glass, one constellation, Plex numbers.
   Additive + reversible: load AFTER the existing theme CSS. Every value
   resolves to ~/Desktop/PayeeGlobal-App-Design-Guide.md §2–§5.
   All pg styling is scoped to `body.pg-app` (or a `.pg-scope` wrapper) so it
   never leaks into un-migrated pages.
   ========================================================================== */

/* ---------- self-hosted fonts ---------- */
@font-face{ font-family:'Archivo'; src:url('/assets/pg/fonts/archivo-var.woff2') format('woff2-variations');
  font-weight:100 900; font-stretch:62% 125%; font-style:normal; font-display:swap; }
@font-face{ font-family:'Inter'; src:url('/assets/pg/fonts/inter-latin-var.woff2') format('woff2');
  font-weight:300 700; font-style:normal; font-display:swap; }
@font-face{ font-family:'IBM Plex Mono'; src:url('/assets/pg/fonts/plex-400.woff2') format('woff2'); font-weight:400; font-display:swap; }
@font-face{ font-family:'IBM Plex Mono'; src:url('/assets/pg/fonts/plex-500.woff2') format('woff2'); font-weight:500; font-display:swap; }
@font-face{ font-family:'IBM Plex Mono'; src:url('/assets/pg/fonts/plex-600.woff2') format('woff2'); font-weight:600; font-display:swap; }

/* animated glare ring angle (site .glare) */
@property --pg-ang{ syntax:'<angle>'; initial-value:0deg; inherits:false; }
@keyframes pg-glare{ to{ --pg-ang:360deg; } }

/* ---------- tokens ----------
   v3 (28 Sep 2026): SITE PARITY. Values are copied from the live payeeglobal.com login + white-label demo
   (public/assets/pg-demo.css v11 + pg-login.css v11), which Ashnab approved as the brand reference.
   Token names are unchanged from v2 so every rule inherits the new values. */
body.pg-app, .pg-scope{
  /* brand: blood maroon (sidebar, primary CTA) + the site's red accent family */
  --blood:#8C1D22; --blood-deep:#641418; --blood-mid:#7A181D; --rose:#F0B3AB;
  --acc:#D24B44; --acc-lite:#E1786F; --acc-deep:#B23A33; --acc-rgb:210,75,68; --acc-wash:rgba(210,75,68,.14);
  --blood-lite:#D24B44;                    /* charts (pay-outs), bar gradients: the site's --acc */
  --cream:#F6F1E8; --cream-raised:#FBF7F2; --white:#FFFFFF;
  /* ink: the site's slate scale */
  --navy:#1A2436;                          /* page / card titles (site --navy) */
  --ink:#2B3444; --ink-soft:#3C4658; --ink-mute:#6B7280; --ink-grey:#5A6273; --faint:#9AA1AE;
  --line:rgba(26,36,54,.10); --hair:rgba(26,36,54,.055);
  /* glass (site .glass) */
  --glass:rgba(255,255,255,.26); --glass-hi:rgba(255,255,255,.50); --glass-edge:rgba(255,255,255,.60);
  --glass-blur:blur(34px) saturate(155%);
  --shadow:0 10px 34px rgba(24,16,16,.09), inset 0 1px 0 rgba(255,255,255,.7);
  --shadow-up:0 14px 38px rgba(24,16,16,.16), inset 0 1px 0 rgba(255,255,255,.8);
  --maroon-grad:linear-gradient(158deg,#8C1D22 0%,#7A181D 52%,#641418 100%);
  --cta-grad:linear-gradient(158deg,#8C1D22,#641418);
  --cta-shadow:0 12px 28px rgba(100,20,24,.3), inset 0 1px 0 rgba(255,255,255,.26);
  --cta-shadow-up:0 16px 34px rgba(100,20,24,.36), inset 0 1px 0 rgba(255,255,255,.32);
  /* on maroon: the site sets every sidebar label in pure white */
  --on-maroon:#FFFFFF; --on-maroon-soft:#FFFFFF; --on-maroon-mute:#FFFFFF;
  /* states (site) */
  --pos:#177245; --pos-dot:#29B06C; --pos-wash:rgba(41,176,108,.16);
  --warn:#8A5D00; --warn-dot:#D9A51E; --warn-wash:rgba(224,168,0,.18);
  --err:#B23A33; --err-dot:#D24B44; --err-wash:rgba(210,75,68,.14);
  --info:#3C4658; --info-wash:rgba(43,52,68,.09);
  --code:#16100F; --code-ink:#F3EDE4;
  /* geometry (site): panels 18, inputs 10, buttons 11, pills 6, sidebar 24 */
  --r:18px; --r-in:14px; --r-btn:11px; --r-pill:999px; --r-side:24px; --r-field:10px; --r-cta:14px;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:64px;
  --ease:cubic-bezier(.16,1,.3,1); --ease-hover:cubic-bezier(.2,.7,.2,1); --ease-io:cubic-bezier(.4,0,.2,1);
  --t-micro:160ms; --t-hover:180ms; --t-enter:520ms;
  /* field: white, two red washes, the site's red constellation (exact copy of pg-demo.css --field) */
  --app-field:linear-gradient(180deg,#FFFFFF 0%,#FCFBFB 100%);
  --app-wash-a:radial-gradient(70% 60% at 100% 0%, rgba(210,75,68,.12), transparent 58%);
  --app-wash-b:radial-gradient(60% 55% at 0% 100%, rgba(210,75,68,.10), transparent 60%);
  --app-glass:rgba(255,255,255,.26); --app-glass-strong:rgba(255,255,255,.50); --app-glass-edge:rgba(255,255,255,.60);
  --app-blur:blur(34px) saturate(155%);
  --modal-surface:rgba(255,250,248,.94);  /* site .modal */
  --scrim:rgba(40,20,22,.26); --row-hover:rgba(255,255,255,.55); --focus-ring:0 0 0 3px rgba(210,75,68,.14);
  --t-drawer:320ms;
  --pg-field:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 900' preserveAspectRatio='xMidYMid slice'%3E%3Cpath d='M -40 847 Q 642 230 1257 -240' fill='none' stroke='%23C0392F' stroke-width='2.1' stroke-opacity='0.5'/%3E%3Cpath d='M -40 875 Q 854 214 1082 -200' fill='none' stroke='%23C0392F' stroke-width='2.2' stroke-opacity='0.32'/%3E%3Cpath d='M -40 899 Q 914 249 1403 -93' fill='none' stroke='%23C0392F' stroke-width='2.3' stroke-opacity='0.46'/%3E%3Cpath d='M -40 806 Q 773 285 1202 -195' fill='none' stroke='%23C0392F' stroke-width='1.9' stroke-opacity='0.38'/%3E%3Cpath d='M -40 605 Q 576 96 1471 -172' fill='none' stroke='%23C0392F' stroke-width='1.6' stroke-opacity='0.46'/%3E%3Cpath d='M -40 953 Q 512 348 1188 -104' fill='none' stroke='%23C0392F' stroke-width='1.9' stroke-opacity='0.38'/%3E%3Cpath d='M -40 647 Q 639 115 1069 -167' fill='none' stroke='%23C0392F' stroke-width='1.6' stroke-opacity='0.42'/%3E%3Cpath d='M -40 649 Q 525 229 1092 -111' fill='none' stroke='%23C0392F' stroke-width='1.5' stroke-opacity='0.52'/%3E%3Cg fill='%23B23A33'%3E%3Ccircle cx='554' cy='455' r='3.4' fill-opacity='0.46'/%3E%3Ccircle cx='964' cy='36' r='4.2' fill-opacity='0.46'/%3E%3Ccircle cx='452' cy='555' r='4.2' fill-opacity='0.46'/%3E%3Ccircle cx='1214' cy='887' r='3.6' fill-opacity='0.78'/%3E%3Ccircle cx='428' cy='593' r='2' fill-opacity='0.8'/%3E%3Ccircle cx='879' cy='653' r='2.4' fill-opacity='0.66'/%3E%3Ccircle cx='1110' cy='432' r='3.3' fill-opacity='0.66'/%3E%3Ccircle cx='311' cy='779' r='4.3' fill-opacity='0.74'/%3E%3Ccircle cx='22' cy='383' r='2.6' fill-opacity='0.74'/%3E%3Ccircle cx='389' cy='440' r='3.1' fill-opacity='0.54'/%3E%3Ccircle cx='997' cy='511' r='3' fill-opacity='0.44'/%3E%3Ccircle cx='674' cy='131' r='2.9' fill-opacity='0.42'/%3E%3Ccircle cx='195' cy='454' r='2.7' fill-opacity='0.52'/%3E%3Ccircle cx='611' cy='842' r='2' fill-opacity='0.76'/%3E%3Ccircle cx='758' cy='500' r='3.5' fill-opacity='0.48'/%3E%3Ccircle cx='288' cy='346' r='4' fill-opacity='0.46'/%3E%3Ccircle cx='573' cy='256' r='2.9' fill-opacity='0.76'/%3E%3Ccircle cx='984' cy='604' r='4' fill-opacity='0.66'/%3E%3Ccircle cx='300' cy='423' r='2.8' fill-opacity='0.58'/%3E%3Ccircle cx='333' cy='174' r='2.6' fill-opacity='0.7'/%3E%3Ccircle cx='971' cy='63' r='3.9' fill-opacity='0.48'/%3E%3Ccircle cx='1384' cy='725' r='2.6' fill-opacity='0.56'/%3E%3Ccircle cx='242' cy='565' r='3.6' fill-opacity='0.64'/%3E%3Ccircle cx='205' cy='337' r='4.4' fill-opacity='0.46'/%3E%3Ccircle cx='418' cy='149' r='3' fill-opacity='0.58'/%3E%3Ccircle cx='270' cy='124' r='3.8' fill-opacity='0.78'/%3E%3Ccircle cx='501' cy='153' r='3.7' fill-opacity='0.58'/%3E%3Ccircle cx='40' cy='684' r='2.5' fill-opacity='0.76'/%3E%3Ccircle cx='1162' cy='460' r='2.5' fill-opacity='0.78'/%3E%3Ccircle cx='214' cy='266' r='3.3' fill-opacity='0.76'/%3E%3Ccircle cx='885' cy='108' r='3.3' fill-opacity='0.52'/%3E%3Ccircle cx='1267' cy='891' r='4.4' fill-opacity='0.42'/%3E%3Ccircle cx='1190' cy='619' r='4.3' fill-opacity='0.42'/%3E%3Ccircle cx='124' cy='246' r='1.7' fill-opacity='0.78'/%3E%3Ccircle cx='1356' cy='570' r='3.4' fill-opacity='0.7'/%3E%3Ccircle cx='921' cy='855' r='3.4' fill-opacity='0.42'/%3E%3Ccircle cx='1289' cy='366' r='2.8' fill-opacity='0.74'/%3E%3Ccircle cx='1013' cy='144' r='4.1' fill-opacity='0.56'/%3E%3Ccircle cx='733' cy='280' r='3' fill-opacity='0.76'/%3E%3Ccircle cx='140' cy='560' r='3' fill-opacity='0.62'/%3E%3Ccircle cx='450' cy='540' r='3.2' fill-opacity='0.72'/%3E%3Ccircle cx='1120' cy='110' r='3' fill-opacity='0.6'/%3E%3Ccircle cx='690' cy='220' r='2.8' fill-opacity='0.58'/%3E%3C/g%3E%3C/svg%3E");
  /* sidebar white constellation (exact copy of pg-demo.css --side) */
  --pg-side:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 260 900' preserveAspectRatio='xMidYMid slice'%3E%3Cg fill='none' stroke='%23ffffff' stroke-width='1.4'%3E%3Cpath d='M -20 760 Q 130 300 300 40' stroke-opacity='0.16'/%3E%3Cpath d='M -20 840 Q 160 360 330 90' stroke-opacity='0.12'/%3E%3Cpath d='M -20 900 Q 110 420 320 150' stroke-opacity='0.1'/%3E%3C/g%3E%3Cg fill='%23ffffff'%3E%3Ccircle cx='40' cy='120' r='2.2' fill-opacity='.5'/%3E%3Ccircle cx='190' cy='80' r='1.8' fill-opacity='.4'/%3E%3Ccircle cx='120' cy='230' r='2.4' fill-opacity='.5'/%3E%3Ccircle cx='210' cy='300' r='1.9' fill-opacity='.35'/%3E%3Ccircle cx='60' cy='360' r='2' fill-opacity='.45'/%3E%3Ccircle cx='170' cy='450' r='2.3' fill-opacity='.4'/%3E%3Ccircle cx='90' cy='520' r='1.7' fill-opacity='.5'/%3E%3Ccircle cx='200' cy='600' r='2.1' fill-opacity='.38'/%3E%3Ccircle cx='50' cy='650' r='2.4' fill-opacity='.42'/%3E%3Ccircle cx='150' cy='720' r='1.8' fill-opacity='.5'/%3E%3Ccircle cx='95' cy='800' r='2.2' fill-opacity='.4'/%3E%3Ccircle cx='205' cy='840' r='2' fill-opacity='.44'/%3E%3C/g%3E%3C/svg%3E");
  /* on-maroon surfaces (site sidebar) */
  --on-maroon-glass:rgba(255,255,255,.16); --on-maroon-hover:rgba(255,255,255,.13); --on-maroon-active:rgba(255,255,255,.13);
  --on-maroon-edge:rgba(255,255,255,.22); --on-maroon-line:rgba(255,255,255,.16); --on-maroon-tag:rgba(255,255,255,.18);
  --side-shadow:0 22px 55px rgba(100,20,24,.40), inset 0 1px 0 rgba(255,255,255,.28);
  /* state edges (site pills) */
  --pos-edge:rgba(41,176,108,.35); --warn-edge:rgba(224,168,0,.40); --err-edge:rgba(210,75,68,.30); --info-edge:rgba(26,36,54,.10);
  --r-sm:6px; --r-seg:9px;
  /* shell geometry (site): 252px column = 224px panel + 14px inset; topbar 66px + 14px margins */
  --sb-w:224px; --sb-inset:14px; --shell-left:calc(var(--sb-w) + var(--sb-inset) * 2); --shell-top:98px;
  --pg-head-h:66px; --pg-content-max:1440px;
  --btn-shadow:0 10px 30px rgba(210,75,68,.06); --field-glow:radial-gradient(120% 80% at 78% 0%, rgba(210,75,68,.06), rgba(255,255,255,0) 56%);
  /* site component surfaces (pg-demo.css / pg-login.css) */
  --ctrl-bg:rgba(255,255,255,.72); --seg-track:rgba(255,255,255,.4); --dest-bg:rgba(255,255,255,.66);
  --safe-bg:rgba(210,75,68,.07); --safe-edge:rgba(210,75,68,.22);
  --topbar-bg:rgba(255,255,255,.5); --topbar-blur:blur(16px) saturate(150%);
  --topbar-shadow:0 10px 30px rgba(210,75,68,.06), inset 0 1px 0 rgba(255,255,255,.7);
  --iconbtn-bg:radial-gradient(120% 110% at 30% 22%, rgba(255,255,255,.95), rgba(255,255,255,.52));
  --iconbtn-edge:rgba(255,255,255,.55);
  --iconbtn-shadow:0 5px 16px rgba(24,16,16,.13), inset 0 1px 0 rgba(255,255,255,.95);
  --iconbtn-shadow-up:0 9px 22px rgba(24,16,16,.17), inset 0 1px 0 rgba(255,255,255,.95);
  --tile-bg:linear-gradient(150deg, rgba(255,251,248,.58), rgba(210,75,68,.08)); --tile-edge:rgba(255,255,255,.55);
  --tile-blur:blur(36px) saturate(150%); --tile-shadow:0 12px 34px rgba(24,16,16,.08), inset 0 1px 0 rgba(255,255,255,.65);
  --modal-shadow:0 30px 80px rgba(24,16,16,.32); --tip-bg:rgba(255,255,255,.72);
  --flash-bg:rgba(30,20,22,.92); --on-maroon-dim:rgba(255,255,255,.82); --nav-glow:0 0 10px rgba(255,255,255,.8);
  --glare-acc:conic-gradient(from var(--pg-ang), rgba(210,75,68,.3) 0deg, rgba(255,255,255,.95) 44deg, rgba(210,75,68,.42) 96deg, rgba(210,75,68,.25) 155deg, rgba(255,255,255,.9) 220deg, rgba(210,75,68,.38) 275deg, rgba(210,75,68,.3) 340deg);
  --glare-btn:conic-gradient(from var(--pg-ang), rgba(210,75,68,.45) 0deg, rgba(255,255,255,1) 40deg, rgba(120,175,255,.55) 76deg, rgba(255,224,150,.6) 116deg, rgba(210,75,68,.35) 162deg, rgba(255,255,255,.98) 214deg, rgba(150,255,215,.5) 256deg, rgba(255,200,150,.55) 300deg, rgba(210,75,68,.45) 344deg);
  --wm-size:8.84px;                        /* PAYEE GLOBAL wordmark: the site's 13.6px made 35% smaller (Ashnab, 28 Sep) */
  --disp:'Archivo','Helvetica Neue',Arial,sans-serif;
  --body:'Inter',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;
  /* cream-field constellation (from pg-site.css: 12 curves + 38 dots) */
  --pg-tile-c:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1920' height='1180' viewBox='0 0 1920 1180'%3E%3Cg fill='none' stroke='%238C1D22'%3E%3Cpath d='M -40 110.6 Q 1198 84.9 1960 24.0' stroke-width='1' stroke-opacity='0.27'/%3E%3Cpath d='M -40 250.5 Q 924 184.9 1960 53.4' stroke-width='1.5' stroke-opacity='0.19'/%3E%3Cpath d='M -40 334.2 Q 982 242.6 1960 220.9' stroke-width='1' stroke-opacity='0.32'/%3E%3Cpath d='M -40 462.6 Q 1174 312.2 1960 220.6' stroke-width='1.5' stroke-opacity='0.31'/%3E%3Cpath d='M -40 555.2 Q 1068 443.1 1960 331.0' stroke-width='1.5' stroke-opacity='0.18'/%3E%3Cpath d='M -40 674.4 Q 888 556.5 1960 420.3' stroke-width='1' stroke-opacity='0.29'/%3E%3Cpath d='M -40 805.3 Q 659 718.8 1960 671.5' stroke-width='1' stroke-opacity='0.33'/%3E%3Cpath d='M -40 993.7 Q 576 785.3 1960 697.3' stroke-width='1' stroke-opacity='0.24'/%3E%3Cpath d='M -40 1131.4 Q 835 968.0 1960 872.9' stroke-width='1' stroke-opacity='0.33'/%3E%3C/g%3E%3C/svg%3E");
  --pg-tile-d:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1920' height='1370' viewBox='0 0 1920 1370'%3E%3Cg fill='%238C1D22'%3E%3Ccircle cx='894' cy='667' r='3.2' fill-opacity='0.20'/%3E%3Ccircle cx='1651' cy='1324' r='3' fill-opacity='0.46'/%3E%3Ccircle cx='49' cy='264' r='4' fill-opacity='0.33'/%3E%3Ccircle cx='1106' cy='69' r='1.9' fill-opacity='0.28'/%3E%3Ccircle cx='30' cy='834' r='3.6' fill-opacity='0.26'/%3E%3Ccircle cx='711' cy='849' r='1.8' fill-opacity='0.33'/%3E%3Ccircle cx='1590' cy='195' r='2.5' fill-opacity='0.34'/%3E%3Ccircle cx='601' cy='319' r='3' fill-opacity='0.37'/%3E%3Ccircle cx='866' cy='457' r='3.3' fill-opacity='0.31'/%3E%3Ccircle cx='1807' cy='806' r='3.8' fill-opacity='0.29'/%3E%3Ccircle cx='1787' cy='1004' r='1.8' fill-opacity='0.45'/%3E%3Ccircle cx='1827' cy='164' r='3.4' fill-opacity='0.35'/%3E%3Ccircle cx='1172' cy='710' r='3.4' fill-opacity='0.25'/%3E%3Ccircle cx='487' cy='866' r='3.5' fill-opacity='0.38'/%3E%3Ccircle cx='154' cy='103' r='2.3' fill-opacity='0.18'/%3E%3C/g%3E%3C/svg%3E");
  /* white constellation for maroon blocks */
  --pg-tile-w:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='900' viewBox='0 0 300 900'%3E%3Cg fill='none' stroke='%23ffffff'%3E%3Cpath d='M -20 200 Q 150 120 340 40' stroke-width='1' stroke-opacity='0.14'/%3E%3Cpath d='M -20 430 Q 180 330 340 250' stroke-width='1' stroke-opacity='0.11'/%3E%3Cpath d='M -20 700 Q 150 560 340 470' stroke-width='1' stroke-opacity='0.12'/%3E%3C/g%3E%3Cg fill='%23ffffff'%3E%3Ccircle cx='48' cy='120' r='2' fill-opacity='.42'/%3E%3Ccircle cx='210' cy='90' r='1.7' fill-opacity='.36'/%3E%3Ccircle cx='120' cy='250' r='2.2' fill-opacity='.45'/%3E%3Ccircle cx='240' cy='330' r='1.6' fill-opacity='.32'/%3E%3Ccircle cx='60' cy='400' r='1.9' fill-opacity='.4'/%3E%3Ccircle cx='190' cy='500' r='2.1' fill-opacity='.38'/%3E%3Ccircle cx='96' cy='560' r='1.6' fill-opacity='.5'/%3E%3Ccircle cx='220' cy='650' r='2' fill-opacity='.35'/%3E%3Ccircle cx='60' cy='720' r='2.3' fill-opacity='.42'/%3E%3Ccircle cx='170' cy='800' r='1.7' fill-opacity='.46'/%3E%3C/g%3E%3C/svg%3E");
}

/* ---------- base field + constellation ---------- */
body.pg-app{ background:var(--white); color:var(--ink); font-family:var(--body); line-height:1.45;
  -webkit-font-smoothing:antialiased; }
/* field sits at z-index:-1 in the root stacking context; body stays transparent so nothing covers it
   and no body child needs repositioning (modals, toasts, pickers keep their own positioning) */
body.pg-app::before{ content:''; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:var(--pg-field) center / cover no-repeat, var(--app-wash-a), var(--app-wash-b), var(--app-field); }

.pg-app h1,.pg-app h2,.pg-app h3,.pg-app h4{ font-family:var(--disp); color:var(--ink); margin:0; }
.pg-app .num,.pg-app .pg-num{ font-family:var(--mono); font-variant-numeric:tabular-nums; font-weight:600; letter-spacing:-.02em; }
.pg-eyebrow{ font-family:var(--mono); font-weight:500; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--blood-deep); }
.pg-label{ font-family:var(--mono); font-weight:500; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-mute); }

/* ---------- logo (PG monogram) ---------- */
.pg-mk{ display:inline-flex; flex-direction:column; align-items:center; flex:none; }
.pg-mk .pg-l{ display:flex; font-family:var(--disp); font-size:28px; line-height:.78; letter-spacing:0;
  font-variation-settings:'wght' 900,'wdth' 125; padding-top:2px; }
.pg-mk .pg-p,.pg-mk .pg-g{ display:inline-block; text-align:left; }
.pg-mk .pg-p{ color:var(--ink); width:.771em; }
.pg-mk .pg-g{ color:var(--blood); width:1.01em; }
.pg-mk .pg-dash{ display:block; width:66%; height:1px; margin-top:7px; background:var(--blood); border-radius:1px; }
.pg-wm{ font-family:var(--disp); font-size:var(--wm-size); line-height:1; display:inline-flex; white-space:nowrap; }
.pg-wm .a{ letter-spacing:.288em; font-variation-settings:'wght' 560,'wdth' 96; }
.pg-wm .a:first-child{ color:var(--ink); } .pg-wm .a:last-child{ color:var(--blood); }
/* maroon variant */
.pg-on-maroon .pg-mk .pg-p,.pg-on-maroon .pg-mk .pg-dash{ color:var(--cream); background:var(--cream); }
.pg-on-maroon .pg-mk .pg-p{ background:none; }
.pg-on-maroon .pg-mk .pg-g{ color:var(--rose); }
.pg-on-maroon .pg-wm .a:first-child{ color:var(--cream); } .pg-on-maroon .pg-wm .a:last-child{ color:var(--rose); }

/* ---------- glass card ---------- */
.pg-card{ background:var(--glass); -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  border:1px solid var(--glass-edge); border-radius:var(--r); box-shadow:var(--shadow); padding:var(--s5); }
.pg-card .pg-card-h{ display:flex; align-items:flex-start; justify-content:space-between; gap:var(--s4); margin-bottom:var(--s4); }
.pg-card-title{ font-family:var(--disp); font-weight:700; font-size:19px; letter-spacing:-.01em; color:var(--ink); }

/* ---------- buttons ---------- */
.pg-btn{ display:inline-flex; align-items:center; justify-content:center; gap:var(--s2); min-height:44px; padding:0 var(--s5);
  border-radius:var(--r-btn); font-family:var(--body); font-weight:600; font-size:14px; border:1px solid transparent;
  cursor:pointer; transition:background var(--t-hover) var(--ease-hover), transform var(--t-hover) var(--ease-hover), box-shadow var(--t-hover); text-decoration:none; }
.pg-btn-primary{ background:var(--blood); color:var(--cream); box-shadow:var(--btn-shadow); }
.pg-btn-primary:hover{ background:var(--blood-deep); transform:translateY(-1px); color:var(--cream); }
.pg-btn-primary:active{ transform:translateY(0); }
.pg-btn-secondary{ background:var(--glass-hi); -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  border-color:var(--line); color:var(--blood-deep); }
.pg-btn-secondary:hover{ background:var(--cream-raised); color:var(--blood-deep); }
.pg-btn-ghost{ background:none; color:var(--blood-deep); min-height:auto; padding:var(--s2) 0; }
.pg-btn-ghost:hover{ text-decoration:underline; }
.pg-btn[disabled],.pg-btn.disabled{ opacity:.45; cursor:not-allowed; transform:none; }
.pg-btn-block{ width:100%; }

/* ---------- inputs ---------- */
.pg-field{ display:flex; flex-direction:column; gap:var(--s2); margin-bottom:var(--s4); }
.pg-field > label,.pg-field .pg-label{ font-family:var(--mono); font-weight:500; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-mute); }
.pg-input-wrap{ position:relative; display:flex; align-items:center; }
.pg-input{ width:100%; min-height:48px; padding:0 var(--s4); border-radius:var(--r-btn); background:var(--cream-raised);
  border:1px solid var(--line); color:var(--ink); font-family:var(--body); font-size:15px; transition:border var(--t-micro), box-shadow var(--t-micro); }
.pg-input::placeholder{ color:var(--ink-mute); }
.pg-input:focus{ outline:none; border-color:var(--blood); box-shadow:var(--focus-ring); }
.pg-input.has-icon{ padding-left:44px; } .pg-input.has-toggle{ padding-right:44px; }
.pg-input-ic{ position:absolute; left:14px; color:var(--blood); pointer-events:none; display:flex; }
.pg-input-toggle{ position:absolute; right:12px; color:var(--ink-mute); cursor:pointer; background:none; border:0; padding:6px; display:flex; }
.pg-input-toggle:hover{ color:var(--blood); }
.pg-help{ font-size:13px; color:var(--ink-mute); } .pg-help.pg-err{ color:var(--err); }
.pg-check{ display:inline-flex; align-items:center; gap:var(--s2); font-size:14px; color:var(--ink-soft); cursor:pointer; }
.pg-check input{ width:16px; height:16px; accent-color:var(--blood); }

/* ---------- status pills ---------- */
.pg-pill{ display:inline-flex; align-items:center; gap:6px; font-family:var(--mono); font-weight:500; font-size:11px;
  letter-spacing:.06em; text-transform:uppercase; padding:4px 10px; border-radius:var(--r-sm); border:1px solid transparent; }
.pg-pill::before{ content:''; width:6px; height:6px; border-radius:50%; }
.pg-pill.is-pos{ color:var(--pos); background:var(--pos-wash); border-color:var(--pos-edge); } .pg-pill.is-pos::before{ background:var(--pos-dot); }
.pg-pill.is-warn{ color:var(--warn); background:var(--warn-wash); border-color:var(--warn-edge); } .pg-pill.is-warn::before{ background:var(--warn-dot); }
.pg-pill.is-err{ color:var(--err); background:var(--err-wash); border-color:var(--err-edge); } .pg-pill.is-err::before{ background:var(--err-dot); }
.pg-pill.is-info{ color:var(--info); background:var(--info-wash); border-color:var(--info-edge); } .pg-pill.is-info::before{ background:var(--info); }

/* ---------- alerts ---------- */
.pg-alert{ display:flex; align-items:flex-start; gap:var(--s2); padding:var(--s3) var(--s4); border-radius:var(--r-in);
  font-size:14px; margin-bottom:var(--s4); border:1px solid transparent; }
.pg-alert.is-err{ color:var(--err); background:var(--err-wash); border-color:var(--line); }
.pg-alert.is-pos{ color:var(--pos); background:var(--pos-wash); border-color:var(--pos-edge); }

/* ---------- auth shell (login / 2FA / reset) — payeeglobal.com/login parity ----------
   Sidebar panel + glass top bar + one glass card with a header strip. Every strip and row is a
   flex row with align-items:center, so text sits on the vertical centre of its container. */
.pg-auth{ min-height:100vh; }
.pg-nav-toggle{ position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.pg-auth-aside{ position:fixed; z-index:40; top:var(--sb-inset); left:var(--sb-inset); bottom:var(--sb-inset); width:var(--sb-w);
  display:flex; flex-direction:column; overflow:hidden; border-radius:var(--r-side); color:var(--on-maroon);
  background:var(--pg-side) center / cover no-repeat, var(--maroon-grad); border:1px solid var(--on-maroon-edge); box-shadow:var(--side-shadow);
  transition:transform var(--t-drawer) var(--ease-io); }
.pg-aside-brand{ flex:none; display:flex; align-items:center; justify-content:center; min-height:96px; padding:26px 8px 16px; }
.pg-lock{ display:inline-flex; flex-direction:column; align-items:center; gap:10px; max-width:100%; text-decoration:none; }
.pg-aside-nav{ flex:1 1 auto; min-height:0; overflow-y:auto; padding:10px 12px 16px; scrollbar-width:none; }
.pg-aside-role{ font-family:var(--mono); font-size:9px; letter-spacing:.22em; text-transform:uppercase; color:var(--on-maroon); margin:10px 8px 8px; }
.pg-aside-menu{ list-style:none; margin:0; padding:0; }
.pg-aside-menu .mi{ position:relative; display:flex; align-items:center; gap:12px; min-height:44px; padding:0 12px; border-radius:12px;
  font-family:var(--body); font-weight:500; font-size:11px; line-height:1.3; letter-spacing:.06em; text-transform:uppercase; color:var(--on-maroon); cursor:default; }
.pg-aside-menu .mi svg{ width:16px; height:16px; flex:none; opacity:.9; }
.pg-aside-menu .mi.is-active{ font-weight:700; background:var(--on-maroon-active); }
.pg-aside-menu .mi.is-active::before{ content:''; position:absolute; left:3px; top:50%; transform:translateY(-50%); width:3px; height:18px; border-radius:3px;
  background:var(--white); box-shadow:var(--nav-glow); }
.pg-aside-foot{ flex:none; display:flex; align-items:center; justify-content:center; padding:12px 14px 16px; border-top:1px solid var(--on-maroon-line);
  font-family:var(--mono); font-size:8.5px; letter-spacing:.12em; text-transform:uppercase; }
.pg-aside-foot a{ color:var(--on-maroon); text-decoration:none; } .pg-aside-foot a:hover{ text-decoration:underline; text-underline-offset:3px; }
.pg-scrim{ display:none; }
/* glass top bar (site .topbar) */
.pg-topbar{ position:sticky; top:0; z-index:30; display:flex; align-items:center; gap:14px; min-height:var(--pg-head-h);
  margin:var(--sb-inset) var(--sb-inset) var(--sb-inset) calc(var(--shell-left) + var(--sb-inset)); padding:10px 14px; border-radius:18px;
  background:var(--topbar-bg); -webkit-backdrop-filter:var(--topbar-blur); backdrop-filter:var(--topbar-blur);
  border:1px solid var(--glass-edge); box-shadow:var(--topbar-shadow); transition:margin var(--t-drawer) var(--ease-io); }
.pg-iconbtn{ position:relative; flex:none; width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer;
  color:var(--acc-deep); background:var(--iconbtn-bg); border:1px solid var(--iconbtn-edge); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  box-shadow:var(--iconbtn-shadow); transition:transform var(--t-hover) var(--ease-hover), box-shadow var(--t-hover) var(--ease-hover); }
.pg-iconbtn:hover{ transform:translateY(-1px); box-shadow:var(--iconbtn-shadow-up); }
.pg-crumb{ display:flex; flex-direction:column; justify-content:center; gap:2px; min-width:0; }
.pg-crumb .bc{ font-family:var(--mono); font-size:8.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-mute); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pg-crumb .ttl{ font-family:var(--disp); font-size:13px; font-weight:500; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-grey); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pg-tb-right{ margin-left:auto; display:flex; align-items:center; gap:10px; flex:none; }
/* the card (site .panel.glass.glare + .lg-card) */
.pg-auth-main{ display:flex; justify-content:center; margin-left:var(--shell-left); padding:18px var(--sb-inset) 60px; transition:margin var(--t-drawer) var(--ease-io); }
.pg-auth-card{ position:relative; width:100%; max-width:600px; margin:clamp(8px,4vh,48px) auto 0; padding:0 !important; overflow:hidden; }
.pg-card-h{ position:relative; z-index:3; display:flex; align-items:center; gap:10px; flex-wrap:wrap; min-height:48px; padding:14px 18px; border-bottom:1px solid var(--hair); }
.pg-card-h .pg-eyebrow{ font-size:9.5px; letter-spacing:.2em; color:var(--acc-deep); line-height:1.2; }
.pg-card-h2{ font-family:var(--mono); font-size:10.5px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-mute); line-height:1.2; }
.pg-auth-card > form{ position:relative; z-index:3; padding:22px 24px 26px; }
.pg-auth-card h1{ font-family:var(--disp); font-weight:800; font-size:clamp(24px,2.6vw,30px); line-height:1.12; letter-spacing:-.02em; color:var(--navy); margin:0 0 10px; font-variation-settings:normal; }
.pg-lead{ color:var(--ink-soft); font-size:14.5px; line-height:1.55; margin:0 0 16px; }
.pg-auth-card .pg-field{ margin-bottom:14px; gap:6px; }
.pg-auth-card .pg-field > label{ font-size:8.5px; letter-spacing:.14em; padding-left:2px; }
.pg-auth-card .pg-input{ min-height:44px; background:var(--ctrl-bg); border-radius:var(--r-field); font-size:14px; }
.pg-auth-card .pg-input:focus{ border-color:var(--acc); box-shadow:var(--focus-ring); }
.pg-auth-card .pg-input-ic{ color:var(--acc-deep); }
.pg-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin:4px 0 18px; min-height:32px; }
.pg-row .pg-check{ font-size:13px; line-height:1; } .pg-row .pg-check input{ margin:0; }
.pg-row .pg-btn-ghost{ display:inline-flex; align-items:center; min-height:32px; padding:0; font-size:13px; color:var(--acc-deep); text-underline-offset:3px; }
.pg-recap{ font-size:12px; color:var(--ink-mute); margin-top:10px; text-align:center; }
.pg-safe{ margin-top:16px; padding:13px 15px; border-radius:var(--r-in); background:var(--safe-bg); border:1px solid var(--safe-edge); }
.pg-safe h3, .pg-need h3{ font-family:var(--mono); font-weight:500; font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-mute); margin:0 0 10px; }
.pg-safe ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.pg-safe li{ display:flex; align-items:flex-start; gap:10px; font-size:13.5px; line-height:1.5; color:var(--ink-soft); }
.pg-safe li svg{ width:16px; height:16px; flex:none; margin-top:2px; color:var(--acc); }
.pg-more{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 18px; margin-top:18px; font-size:13px; }
.pg-more a{ color:var(--acc-deep); text-decoration:underline; text-underline-offset:3px; }
.pg-auth-card .pg-alert{ border-radius:12px; font-size:13.5px; align-items:center; }

/* drawer: ☰ hides the panel on desktop, opens it on mobile (site nav-hidden / nav-open), CSS only */
.pg-nav-toggle:checked ~ .pg-auth-aside{ transform:translateX(calc((var(--shell-left) + 20px) * -1)); }
.pg-nav-toggle:checked ~ .pg-topbar{ margin-left:var(--sb-inset); }
.pg-nav-toggle:checked ~ .pg-auth-main{ margin-left:0; }
@media (max-width:820px){
  .pg-auth-aside{ transform:translateX(calc((var(--shell-left) + 20px) * -1)); }
  .pg-topbar, .pg-nav-toggle:checked ~ .pg-topbar{ margin-left:var(--sb-inset); }
  .pg-auth-main, .pg-nav-toggle:checked ~ .pg-auth-main{ margin-left:0; }
  .pg-nav-toggle:checked ~ .pg-auth-aside{ transform:none; }
  .pg-nav-toggle:checked ~ .pg-scrim{ display:block; position:fixed; inset:0; z-index:39; background:var(--scrim); -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); }
}
@media (max-width:560px){
  .pg-topbar{ margin:10px !important; padding:8px 10px; gap:10px; }
  .pg-auth-main{ padding:4px 10px 60px; }
  .pg-auth-card > form{ padding:18px 16px 22px; }
  .pg-card-h{ padding:12px 16px; }
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){ body.pg-app *{ animation:none !important; transition:none !important; } }

/* ==========================================================================
   CONSOLE FIELD (merchant, PSP, admin) — guide §4: white field, two red washes,
   red constellation, fixed behind content. Auth pages keep the cream field.
   ========================================================================== */
body.pg-app, body.pg-app.pg-console{ background:transparent !important; }
body.pg-app.pg-console{ color:var(--ink-soft); overflow-x:hidden; }
body.pg-app.pg-console::before{
  background:var(--pg-field) center / cover no-repeat, var(--app-wash-a), var(--app-wash-b), var(--app-field); }
/* the theme's primary/secondary variables all resolve to the brand tokens */
body.pg-app{
  --theme-deafult:var(--blood); --theme-secondary:var(--blood-deep);
  --primary-color:var(--blood); --primary-hover-color:var(--blood-deep);
  --bs-primary:var(--blood); --bs-primary-rgb:140,29,34; --bs-primary-shade-20:var(--blood-deep);
  --danger-color:var(--err); --danger-hover-color:var(--blood-deep);
  --success-color:var(--pos); --success-hover-color:var(--pos);
  --secondary-color:var(--ink-soft); --secondary-hover-color:var(--ink);
  --bs-body-font-family:var(--body); --bs-body-color:var(--ink-soft); --bs-link-color:var(--blood-deep); --bs-link-hover-color:var(--blood);
  --bs-border-color:var(--line);
}
body.pg-app :focus-visible{ outline:2px solid var(--blood) !important; outline-offset:3px; }
body.pg-app ::selection{ background:var(--err-wash); }
/* on maroon the focus ring is cream (a blood ring on blood fails contrast) */
body.pg-app .sidebar-wrapper :focus-visible, body.pg-app .pc-sidebar :focus-visible, body.pg-app .pg-on-maroon:focus-visible, body.pg-app .pg-on-maroon :focus-visible{ outline-color:var(--cream) !important; }

/* ==========================================================================
   THEME2 SHELL (Cuba/compact-wrapper) — merchant + PSP consoles
   CSS-only over the theme's own markup + JS (sidebar-menu.js, simplebar, feather).
   ========================================================================== */
body.pg-app .page-body-wrapper,
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper{ background:transparent !important; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper .page-body{
  background:transparent !important; min-height:calc(100vh - var(--shell-top)) !important;
  margin-left:var(--shell-left) !important; margin-top:var(--shell-top) !important;
  padding:0 var(--sb-inset) var(--s6) 0 !important; }
body.pg-app .page-body > .container-fluid{ padding-left:0 !important; padding-right:0 !important; max-width:1440px; }

/* --- floating maroon sidebar --- */
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper{
  width:var(--sb-w) !important; margin:var(--sb-inset) !important; top:0 !important;
  height:calc(100vh - var(--sb-inset) * 2) !important; height:calc(100dvh - var(--sb-inset) * 2) !important;
  border-radius:var(--r-side) !important; overflow:hidden !important;
  background:var(--pg-side) center / cover no-repeat, var(--maroon-grad) !important;
  border:1px solid var(--on-maroon-edge) !important; box-shadow:var(--side-shadow) !important; }
body.pg-app .sidebar-wrapper > div{ display:flex !important; flex-direction:column; height:100%; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .logo-wrapper{
  display:flex !important; justify-content:center; align-items:center; position:relative;
  padding:var(--s5) var(--s2) var(--s4) !important; background:transparent !important; box-shadow:none !important; border:0 !important; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .logo-icon-wrapper{ display:none !important; }
body.pg-app .pg-sb-brand{ display:flex; flex-direction:column; align-items:center; gap:var(--s3); text-decoration:none; }
body.pg-app .sidebar-wrapper .logo-wrapper .back-btn{ position:absolute; right:var(--s4); top:var(--s4); color:var(--on-maroon-soft) !important; font-size:18px; cursor:pointer; }
/* account chip */
body.pg-app .pg-sb-user{ display:flex; align-items:center; gap:var(--s3); margin:0 var(--s3) var(--s2); padding:var(--s3);
  border-radius:var(--r-in); background:var(--on-maroon-glass); border:1px solid var(--on-maroon-edge); flex:none; }
body.pg-app .pg-sb-user .av{ width:38px; height:38px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center;
  background:var(--cream); color:var(--blood); font-family:var(--disp); font-weight:800; font-size:14px; letter-spacing:0; }
body.pg-app .pg-sb-user .who{ display:flex; flex-direction:column; gap:2px; min-width:0; }
body.pg-app .pg-sb-user .nm{ font-family:var(--disp); font-weight:700; font-size:14px; line-height:1.2; color:var(--on-maroon);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
body.pg-app .pg-sb-user .rl{ font-family:var(--mono); font-weight:500; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--on-maroon-mute); }
/* nav area fills the rest and scrolls (simplebar) */
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main{ flex:1 1 auto; min-height:0; position:relative; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main #sidebar-menu{ height:100%; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links{
  height:100% !important; padding:var(--s2) 0 var(--s4) !important; background:transparent !important; }
body.pg-app .sidebar-wrapper .sidebar-links > li.back-btn{ display:none !important; }
/* section captions */
body.pg-app .sidebar-wrapper li.pg-sb-cap{ list-style:none; padding:var(--s4) var(--s5) var(--s2); font-family:var(--mono); font-weight:500;
  font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--on-maroon-mute); }
body.pg-app .sidebar-wrapper li.pg-sb-cap:first-of-type{ padding-top:var(--s2); }
/* items: 44px, 12px radius, Inter 14 600 caps .04em */
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-list{ margin:0 !important; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-link{
  display:flex !important; align-items:center; gap:var(--s3); min-height:44px; margin:2px var(--s3) !important; padding:0 var(--s3) !important;
  border-radius:var(--r-btn) !important; border:0 !important; background:transparent !important; position:relative;
  color:var(--on-maroon-soft) !important; font-family:var(--body) !important; font-weight:600 !important; font-size:13px !important;
  letter-spacing:.04em !important; text-transform:uppercase; white-space:nowrap; transition:background var(--t-micro) var(--ease-hover), color var(--t-micro) var(--ease-hover); }
body.pg-app .sidebar-wrapper .sidebar-link span{ color:inherit !important; font:inherit !important; letter-spacing:inherit !important; }
body.pg-app .sidebar-wrapper .sidebar-link svg{ width:18px !important; height:18px !important; flex:none; margin:0 !important; stroke-width:1.75; vertical-align:middle; }
body.pg-app .sidebar-wrapper .sidebar-link svg, body.pg-app .sidebar-wrapper .sidebar-link svg *{ stroke:currentColor !important; fill:none !important; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-link:hover{
  background:var(--on-maroon-hover) !important; color:var(--on-maroon) !important; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-link.active{
  background:var(--on-maroon-active) !important; color:var(--on-maroon) !important; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-link.active::before{
  content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); width:3px; height:18px; border-radius:3px; background:var(--cream); }
body.pg-app .sidebar-wrapper .sidebar-link .according-menu{ position:static !important; margin-left:auto; color:var(--on-maroon-mute) !important; }
body.pg-app .sidebar-wrapper .sidebar-link .according-menu i{ color:inherit !important; }
/* submenus */
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-list .sidebar-submenu{
  background:transparent !important; padding:var(--s1) 0 var(--s2) !important; margin:0 !important; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-list .sidebar-submenu li a{
  display:flex !important; align-items:center; min-height:36px; margin:0 var(--s3) !important; padding:0 var(--s3) 0 42px !important; border-radius:var(--r-seg) !important;
  color:var(--on-maroon-mute) !important; font-family:var(--body) !important; font-size:13px !important; font-weight:500 !important; letter-spacing:0 !important; text-transform:none; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-list .sidebar-submenu li a::after,
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-list .sidebar-submenu li a::before{ display:none !important; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-list .sidebar-submenu li a:hover,
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-list .sidebar-submenu li a.active{
  color:var(--on-maroon) !important; background:var(--on-maroon-hover) !important; }
body.pg-app .sidebar-wrapper .sidebar-submenu.d-block{ display:block !important; }
body.pg-app .sidebar-wrapper .simplebar-scrollbar::before{ background:var(--on-maroon-tag) !important; }
body.pg-app .sidebar-wrapper .left-arrow, body.pg-app .sidebar-wrapper .right-arrow{ display:none !important; }
body.pg-app .pg-sb-foot{ flex:none; padding:var(--s3) var(--s4) var(--s4); border-top:1px solid var(--on-maroon-edge); text-align:center;
  font-family:var(--mono); font-weight:500; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--on-maroon); }
/* theme pins the nav's simplebar mask at top:80px and forces the logo link to block */
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .logo-wrapper a.pg-sb-brand{
  display:flex !important; flex-direction:column; align-items:center; gap:var(--s3); }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links{ margin-top:0 !important; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-links .simplebar-wrapper{ margin-top:0 !important; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-links .simplebar-mask{ top:0 !important; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-link span{ text-transform:inherit !important; }
body.pg-app .pg-sb-foot a, body.pg-app .pg-aside-foot a{ color:var(--on-maroon) !important; text-decoration:none; }
body.pg-app .pg-sb-foot a:hover, body.pg-app .pg-aside-foot a:hover{ text-decoration:underline; }
/* off-canvas: the theme toggles .close_icon on the sidebar */
body.pg-app .sidebar-wrapper.close_icon,
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon{
  transform:translateX(calc((var(--sb-w) + var(--sb-inset) * 3) * -1)) !important; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper{ transition:transform var(--t-drawer) var(--ease) !important; }
body.pg-app .page-wrapper.compact-wrapper .page-header.close_icon ~ .page-body-wrapper .page-body,
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon ~ .page-body{ margin-left:var(--sb-inset) !important; }

/* --- glass header bar --- */
body.pg-app .page-wrapper.compact-wrapper .page-header,
body.pg-app .page-wrapper .page-header{
  position:fixed !important; inset:0 0 auto 0 !important; width:auto !important; max-width:none !important; margin:0 !important; transform:none !important;
  box-sizing:border-box !important; padding-left:var(--shell-left) !important; padding-right:0 !important;
  background:transparent !important; box-shadow:none !important; z-index:8; transition:padding var(--t-drawer) var(--ease); }
body.pg-app .page-wrapper.compact-wrapper .page-header.close_icon{ padding-left:var(--sb-inset) !important; }
body.pg-app .page-wrapper .page-header .header-wrapper{
  display:flex !important; flex-wrap:nowrap !important; align-items:center; gap:var(--s3); min-height:72px;
  margin:var(--sb-inset) var(--sb-inset) 0 0 !important; padding:var(--s3) var(--s4) !important; border-radius:var(--r) !important;
  background:var(--app-glass-strong) !important; -webkit-backdrop-filter:var(--app-blur); backdrop-filter:var(--app-blur);
  border:1px solid var(--app-glass-edge) !important; box-shadow:var(--shadow) !important; }
body.pg-app .page-header .header-wrapper > *{ flex:0 0 auto !important; width:auto !important; max-width:none !important; padding-left:0 !important; padding-right:0 !important; margin:0 !important; }
body.pg-app .page-header .header-wrapper > .left-side-header{ flex:1 1 auto !important; min-width:0; display:block !important; }
body.pg-app .page-header .header-logo-wrapper{ display:flex !important; align-items:center; }
body.pg-app .page-header .header-logo-wrapper .logo-wrapper{ display:none !important; }
body.pg-app .page-header .toggle-sidebar{ position:static !important; margin:0 !important; }
body.pg-app .page-header .status_toggle.sidebar-toggle{ width:44px; height:44px; border-radius:50%; display:flex !important; align-items:center; justify-content:center; cursor:pointer;
  color:var(--blood); background:var(--app-glass-strong) !important; border:1px solid var(--app-glass-edge);
  box-shadow:var(--shadow); transition:transform var(--t-hover) var(--ease-hover); }
body.pg-app .page-header .status_toggle.sidebar-toggle:hover{ transform:translateY(-1px); }
body.pg-app .page-header .status_toggle.sidebar-toggle svg, body.pg-app .page-header .status_toggle.sidebar-toggle svg path{ stroke:var(--blood) !important; }
body.pg-app .pg-crumb{ display:flex; flex-direction:column; gap:2px; min-width:0; }
body.pg-app .pg-crumb .bc{ font-family:var(--mono); font-weight:500; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-mute);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
body.pg-app .pg-crumb .ttl{ font-family:var(--mono); font-weight:600; font-size:14px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
body.pg-app .page-header .nav-right{ margin-left:auto !important; float:none !important; }
body.pg-app .page-header .nav-menus{ display:flex !important; flex-wrap:nowrap !important; align-items:center; gap:var(--s2); margin:0 !important; padding:0 !important; }
body.pg-app .page-header .nav-menus > li{ float:none !important; padding:0 !important; margin:0 !important; background:transparent !important; }
/* no dark palette in the guide yet — the console stays light, so the light/dark switch is hidden */
body.pg-app .page-header .nav-menus > li:has(> .mode){ display:none !important; }
body.pg-app .page-header .nav-menus .notification-box,
body.pg-app .page-header .nav-menus > li.maximize > a{ width:44px; height:44px; border-radius:50%; display:flex !important; align-items:center; justify-content:center;
  background:var(--app-glass-strong); border:1px solid var(--app-glass-edge); position:relative; }
body.pg-app .page-header .nav-menus svg{ width:20px; height:20px; }
body.pg-app .page-header .nav-menus svg path{ stroke:var(--ink-soft) !important; }
body.pg-app .page-header .notification-box .badge{ position:absolute; top:-2px; right:-2px; min-width:18px; height:18px; padding:0 5px !important; border-radius:var(--r-pill) !important;
  display:inline-flex; align-items:center; justify-content:center; font-family:var(--mono); font-size:11px; font-weight:600;
  background:var(--blood) !important; color:var(--cream) !important; border:0 !important; }
body.pg-app .page-header .header-dropdown, body.pg-app .page-header .header-dropdown .dropdown,
body.pg-app .page-header .header-dropdown .dropbtn{ width:auto !important; min-width:0 !important; }
body.pg-app .page-header .nav-right .dropbtn,
body.pg-app .page-header .nav-right .btn-light{ min-height:44px; display:inline-flex; align-items:center; gap:var(--s2); padding:0 var(--s4) !important;
  background:var(--app-glass-strong) !important; border:1px solid var(--line) !important; border-radius:var(--r-btn) !important;
  color:var(--blood-deep) !important; font-family:var(--mono) !important; font-weight:500; font-size:11px !important; letter-spacing:.12em; text-transform:uppercase; white-space:nowrap; }
body.pg-app .page-header .profile-media{ display:flex; align-items:center; gap:var(--s2); }
body.pg-app .page-header .profile-media > i{ width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:var(--cream); color:var(--blood) !important; font-size:18px !important; border:1px solid var(--line); }
body.pg-app .page-header .profile-media h6{ color:var(--ink) !important; font-family:var(--body) !important; font-weight:600 !important; font-size:14px !important; line-height:1.3; padding-left:var(--s2) !important; }
body.pg-app .page-header .profile-media small{ color:var(--ink-mute) !important; font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
body.pg-app .page-header .profile-media svg path{ stroke:var(--ink-mute) !important; }
/* header dropdowns (theme hover panels + profile switcher) */
body.pg-app .page-header .onhover-show-div,
body.pg-app .page-header .dropdown-content{
  background:var(--glass-hi) !important; -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  border:1px solid var(--app-glass-edge) !important; border-radius:var(--r-in) !important; box-shadow:var(--shadow-up) !important; overflow:hidden; }
body.pg-app .page-header .dropdown-content a,
body.pg-app .page-header .profile-dropdown li a{ color:var(--ink-soft) !important; font-family:var(--body); font-size:14px; }
body.pg-app .page-header .dropdown-content a:hover,
body.pg-app .page-header .profile-dropdown li a:hover{ background:var(--row-hover) !important; color:var(--blood-deep) !important; }
body.pg-app .page-header .profile-dropdown li a svg path, body.pg-app .page-header .profile-dropdown li a svg{ stroke:currentColor !important; }
body.pg-app .page-header .notification-dropdown .dropdown-title{ border-bottom:1px solid var(--hair) !important; background:transparent !important; }
body.pg-app .page-header .notification-dropdown .dropdown-title h3{ font-family:var(--mono) !important; font-size:11px !important; font-weight:500 !important; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-mute) !important; }
body.pg-app .page-header .notification-dropdown li{ border-bottom:1px solid var(--hair) !important; background:transparent !important; }
body.pg-app .footer{ background:transparent !important; border:0 !important; box-shadow:none !important; color:var(--ink-mute) !important;
  margin-left:var(--shell-left) !important; font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
body.pg-app .footer p, body.pg-app .footer a{ color:var(--ink-mute) !important; }
body.pg-app .tap-top{ background:var(--blood) !important; color:var(--cream) !important; border-radius:50% !important; box-shadow:var(--shadow) !important; }

/* ==========================================================================
   PAGE HEADINGS — the in-page breadcrumb row becomes the render's section title
   (4×14 bar + caps title); page actions sit on the right.
   ========================================================================== */
body.pg-app .page-title{ padding:0 !important; margin:0 0 var(--s4) !important; background:transparent !important; }
body.pg-app .page-title > .row{ align-items:center; row-gap:var(--s3); }
body.pg-app .page-title h3{ font-family:var(--disp) !important; font-weight:600 !important; font-size:14px !important; letter-spacing:.09em !important;
  text-transform:uppercase; color:var(--ink-soft) !important; }
body.pg-app .breadcrumb{ background:transparent !important; padding:0 !important; margin:0 !important; align-items:center; }
body.pg-app .breadcrumb .breadcrumb-item{ font-family:var(--mono); font-size:11px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-mute) !important; display:flex; align-items:center; }
body.pg-app .breadcrumb .breadcrumb-item a{ color:var(--ink-mute) !important; display:inline-flex; }
body.pg-app .breadcrumb .breadcrumb-item a svg{ width:14px; height:14px; stroke:currentColor !important; }
body.pg-app .breadcrumb .breadcrumb-item + .breadcrumb-item::before{ content:'\203A' !important; color:var(--ink-mute) !important; padding:0 var(--s2) !important; font-family:var(--mono); }
body.pg-app .page-title .breadcrumb .breadcrumb-item.active{ font-family:var(--disp); font-weight:600; font-size:14px; letter-spacing:.09em; color:var(--ink-soft) !important; }
body.pg-app .page-title .breadcrumb .breadcrumb-item.active::after{ content:none; }
/* the header already carries HOME › …; the in-page row keeps only the page name */
body.pg-app .page-title .breadcrumb .breadcrumb-item:first-child{ display:none !important; }
body.pg-app .page-title .breadcrumb .breadcrumb-item:nth-child(2)::before{ content:none !important; padding:0 !important; }
body.pg-app .page-title .breadcrumb::before{ content:''; width:4px; height:14px; border-radius:3px; margin-right:var(--s3); flex:none;
  background:linear-gradient(180deg, var(--blood-lite), var(--blood-deep)); }
body.pg-app .page-title .text-end{ display:flex; flex-wrap:wrap; justify-content:flex-end; align-items:center; gap:var(--s2); }

/* ==========================================================================
   SHARED COMPONENT LAYER — Bootstrap 5 classes used across app2 views.
   Scoped to body.pg-app; !important only where the themes use it.
   ========================================================================== */
/* ---- type ---- */
body.pg-app{ font-family:var(--body) !important; font-size:15px; }
body.pg-app p, body.pg-app li, body.pg-app td, body.pg-app span, body.pg-app div{ font-family:inherit; }
body.pg-app h1, body.pg-app h2, body.pg-app h3, body.pg-app h4, body.pg-app h5, body.pg-app h6{ font-family:var(--disp); color:var(--ink); letter-spacing:-.01em; }
body.pg-app a{ color:var(--blood-deep); }
body.pg-app a:hover{ color:var(--blood); }
body.pg-app .text-primary{ color:var(--blood) !important; }
body.pg-app .text-success{ color:var(--pos) !important; }
body.pg-app .text-danger{ color:var(--err) !important; }
body.pg-app .text-warning{ color:var(--warn) !important; }
body.pg-app .text-muted, body.pg-app .secondary-color{ color:var(--ink-mute) !important; }
body.pg-app code{ font-family:var(--mono); font-size:13px; color:var(--blood-deep); background:var(--err-wash); padding:1px 6px; border-radius:6px; }
body.pg-app pre{ font-family:var(--mono); font-size:13px; line-height:1.65; background:var(--code) !important; color:var(--code-ink) !important; border-radius:var(--r-in); padding:var(--s4); }
body.pg-app pre code{ background:none; color:inherit; padding:0; }

/* ---- cards ---- */
body.pg-app .card{
  background:var(--app-glass-strong) !important; -webkit-backdrop-filter:var(--app-blur); backdrop-filter:var(--app-blur);
  border:1px solid var(--app-glass-edge) !important; border-radius:var(--r) !important; box-shadow:var(--shadow) !important;
  margin-bottom:var(--s5); color:var(--ink-soft); }
body.pg-app .card .card-header{ display:flex; align-items:center; flex-wrap:wrap; gap:var(--s3); background:transparent !important;
  border-bottom:1px solid var(--hair) !important; padding:var(--s4) var(--s5) !important; border-radius:var(--r) var(--r) 0 0 !important; }
body.pg-app .card .card-header.pb-0{ padding-bottom:var(--s4) !important; }
body.pg-app .card .card-header h5, body.pg-app .card .card-header h4, body.pg-app .card .card-header h3,
body.pg-app .card .card-title, body.pg-app .card .card-header .card-title{
  font-family:var(--mono) !important; font-weight:500 !important; font-size:12px !important; letter-spacing:.14em !important;
  text-transform:uppercase; color:var(--ink) !important; margin:0 !important; }
body.pg-app .card .card-header h5::before, body.pg-app .card .card-header h4::before{ content:''; display:inline-block; width:6px; height:6px; border-radius:50%;
  background:var(--blood); margin-right:var(--s2); vertical-align:middle; }
body.pg-app .card .card-header > span, body.pg-app .card .card-header p{ font-size:13px; color:var(--ink-mute); margin:0; }
body.pg-app .card .card-body{ padding:var(--s5); }
body.pg-app .card .card-body.p-0{ padding:0 !important; }
body.pg-app .card .card-footer{ background:transparent !important; border-top:1px solid var(--hair) !important; padding:var(--s4) var(--s5) !important; }
body.pg-app .card .card-header .form-select{ width:auto !important; min-width:96px; margin-left:auto; }
/* KPI tiles (hook: .pg-kpi on the card) — dot + label + Plex value */
body.pg-app .pg-kpi .card-body{ padding:var(--s5) !important; display:flex; flex-direction:column; }
body.pg-app .pg-kpi .card-body > div{ padding:0 !important; display:flex; flex-direction:column; }
body.pg-app .pg-kpi h3, body.pg-app .pg-kpi .pg-kpi-v{ order:2; font-family:var(--mono) !important; font-weight:600 !important; font-size:28px !important; line-height:1 !important;
  letter-spacing:-.02em !important; font-variant-numeric:tabular-nums; color:var(--ink) !important; margin:var(--s3) 0 var(--s2) !important; }
body.pg-app .card.pg-kpi .badge{ order:1; align-self:flex-start; margin:0 !important; padding:0 !important; background:none !important; border:0 !important;
  color:var(--ink-mute) !important; font-size:11px !important; letter-spacing:.2em !important; gap:var(--s2); }
body.pg-app .card.pg-kpi .badge::before{ content:''; width:6px; height:6px; border-radius:50%; background:var(--info); }
body.pg-app .card.pg-kpi .badge.bg-success::before{ background:var(--pos-dot); }
body.pg-app .card.pg-kpi .badge.bg-danger::before{ background:var(--err-dot); }
body.pg-app .card.pg-kpi .badge.bg-warning::before{ background:var(--warn-dot); }
body.pg-app .card.pg-kpi .badge.bg-primary::before{ background:var(--blood-lite); }
body.pg-app .pg-kpi p{ order:3; font-family:var(--mono); font-size:12px; color:var(--ink-mute); margin:0; }
body.pg-app .pg-kpi p.w-600, body.pg-app .pg-kpi p + p{ order:4; font-weight:600; color:var(--ink-soft); font-variant-numeric:tabular-nums; }

/* ---- tables ---- */
body.pg-app .table-responsive{ border-radius:0 0 var(--r) var(--r); -webkit-overflow-scrolling:touch; }
body.pg-app .table{ --bs-table-bg:transparent; --bs-table-striped-bg:var(--row-hover); --bs-table-hover-bg:var(--row-hover); --bs-table-border-color:var(--hair);
  color:var(--ink-soft) !important; margin-bottom:0 !important; font-size:14px; font-variant-numeric:tabular-nums; border-color:var(--hair) !important; }
body.pg-app .table > :not(caption) > * > *{ background-color:transparent !important; box-shadow:none !important; border-color:var(--hair) !important; }
body.pg-app .table thead th, body.pg-app .table > thead > tr > th, body.pg-app .table-light th, body.pg-app .table thead td{
  font-family:var(--mono) !important; font-weight:500 !important; font-size:11px !important; letter-spacing:.16em !important; text-transform:uppercase;
  color:var(--ink-mute) !important; background:transparent !important; border-bottom:1px solid var(--line) !important; border-top:0 !important;
  padding:var(--s3) var(--s4) !important; white-space:nowrap; vertical-align:middle; }
body.pg-app .table tbody td, body.pg-app .table tbody th{ padding:var(--s3) var(--s4) !important; height:52px; white-space:nowrap; vertical-align:middle !important;
  border-bottom:1px solid var(--hair) !important; border-top:0 !important; color:var(--ink-soft) !important; font-size:14px; }
body.pg-app .table tbody tr:last-child > *{ border-bottom:0 !important; }
body.pg-app .table tbody tr{ transition:background var(--t-micro) var(--ease-hover); }
body.pg-app .table tbody tr:hover > *{ background-color:var(--row-hover) !important; }
body.pg-app .table-striped > tbody > tr:nth-of-type(odd) > *{ background-color:var(--row-hover) !important; }
body.pg-app .table-bordered, body.pg-app .table-bordered > :not(caption) > * > *{ border-width:0 0 1px 0 !important; }
body.pg-app .table td a{ color:var(--blood-deep); font-weight:600; text-decoration:none; }
body.pg-app .table td a:hover{ text-decoration:underline; }
body.pg-app .table td.title a, body.pg-app .table .pg-num, body.pg-app .pg-num{ font-family:var(--mono) !important; font-variant-numeric:tabular-nums; }
body.pg-app .table .pg-num{ font-weight:600; color:var(--ink) !important; text-align:right; white-space:nowrap; }
body.pg-app .table th.pg-num{ font-weight:500; color:var(--ink-mute) !important; }
body.pg-app .table td .badge + .badge{ margin-left:var(--s1); }
body.pg-app .dataTables_wrapper .dataTables_info, body.pg-app .dataTables_wrapper .dataTables_length label, body.pg-app .dataTables_wrapper .dataTables_filter label{
  font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-mute); }

/* ---- status badges → guide pills (rounded rect 8px, tint + 1px edge, Plex 11 caps) ---- */
body.pg-app .badge{ display:inline-flex; align-items:center; gap:6px; font-family:var(--mono) !important; font-weight:500 !important; font-size:11px !important;
  line-height:1.4; letter-spacing:.06em; text-transform:uppercase; padding:4px 10px !important; border-radius:var(--r-sm) !important;
  border:1px solid var(--info-edge) !important; color:var(--info) !important; background:var(--info-wash) !important; }
body.pg-app .badge.bg-success, body.pg-app .badge.bg-soft-success, body.pg-app .badge.badge-success, body.pg-app .badge.badge-light-success{
  color:var(--pos) !important; background:var(--pos-wash) !important; border-color:var(--pos-edge) !important; }
body.pg-app .badge.bg-danger, body.pg-app .badge.bg-soft-danger, body.pg-app .badge.badge-danger, body.pg-app .badge.badge-light-danger{
  color:var(--err) !important; background:var(--err-wash) !important; border-color:var(--err-edge) !important; }
body.pg-app .badge.bg-warning, body.pg-app .badge.bg-soft-warning, body.pg-app .badge.badge-warning, body.pg-app .badge.badge-light-warning,
body.pg-app .badge[style*="dodgerblue"]{
  color:var(--warn) !important; background:var(--warn-wash) !important; border-color:var(--warn-edge) !important; }
body.pg-app .badge[style*="purple"], body.pg-app .badge.bg-dark, body.pg-app .badge.bg-secondary, body.pg-app .badge.bg-info,
body.pg-app .badge.bg-light, body.pg-app .badge.bg-soft-primary, body.pg-app .badge.bg-primary{
  color:var(--info) !important; background:var(--info-wash) !important; border-color:var(--info-edge) !important; }
body.pg-app .badge.rounded-pill{ border-radius:var(--r-pill) !important; }

/* ---- buttons (44px, radius 12, Inter 14 600) ---- */
body.pg-app .btn{ display:inline-flex; align-items:center; justify-content:center; gap:var(--s2); min-height:44px; padding:0 var(--s5) !important;
  border-radius:var(--r-btn) !important; font-family:var(--body) !important; font-weight:600 !important; font-size:14px !important; line-height:1.2;
  letter-spacing:0; text-transform:none; white-space:nowrap; box-shadow:none;
  transition:background var(--t-hover) var(--ease-hover), color var(--t-hover) var(--ease-hover), border-color var(--t-hover) var(--ease-hover), transform var(--t-hover) var(--ease-hover) !important; }
body.pg-app .btn i, body.pg-app .btn svg{ font-size:14px; width:16px; height:16px; }
body.pg-app .btn:hover{ transform:translateY(-1px); }
body.pg-app .btn:active{ transform:none; }
body.pg-app .btn-sm, body.pg-app .btn-group-sm > .btn{ min-height:36px; padding:0 var(--s3) !important; font-size:13px !important; border-radius:var(--r-seg) !important; }
body.pg-app .btn-lg{ min-height:48px; }
body.pg-app .btn-primary, body.pg-app .btn-primary:focus{
  background:var(--blood) !important; border:1px solid var(--blood) !important; color:var(--cream) !important; box-shadow:var(--btn-shadow) !important; }
body.pg-app .btn-primary:hover, body.pg-app .btn-primary:active{ background:var(--blood-deep) !important; border-color:var(--blood-deep) !important; color:var(--cream) !important; }
/* secondary / outline / light → glass with --line edge, blood-deep text */
body.pg-app .btn-secondary, body.pg-app .btn-light, body.pg-app .btn-info, body.pg-app .btn-dark,
body.pg-app .btn-outline-primary, body.pg-app .btn-outline-secondary, body.pg-app .btn-outline-light, body.pg-app .btn-outline-dark, body.pg-app .btn-outline-info{
  background:var(--app-glass-strong) !important; -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  border:1px solid var(--line) !important; color:var(--blood-deep) !important; }
body.pg-app .btn-secondary:hover, body.pg-app .btn-light:hover, body.pg-app .btn-info:hover, body.pg-app .btn-dark:hover,
body.pg-app .btn-outline-primary:hover, body.pg-app .btn-outline-secondary:hover, body.pg-app .btn-outline-light:hover, body.pg-app .btn-outline-dark:hover, body.pg-app .btn-outline-info:hover{
  background:var(--cream-raised) !important; border-color:var(--blood) !important; color:var(--blood-deep) !important; }
/* in app2 btn-danger means dismiss (Close/Cancel/Back = 82 of 97 uses) → neutral secondary, never a second primary */
body.pg-app .btn-danger, body.pg-app .btn-outline-danger{ background:var(--app-glass-strong) !important; border:1px solid var(--line) !important; color:var(--blood-deep) !important; box-shadow:none !important; }
body.pg-app .btn-danger:hover, body.pg-app .btn-outline-danger:hover{ background:var(--cream-raised) !important; border-color:var(--blood) !important; color:var(--blood-deep) !important; }
body.pg-app .btn-success, body.pg-app .btn-outline-success{ background:var(--pos-wash) !important; border:1px solid var(--pos-edge) !important; color:var(--pos) !important; }
body.pg-app .btn-success:hover, body.pg-app .btn-outline-success:hover{ background:var(--pos) !important; border-color:var(--pos) !important; color:var(--white) !important; }
body.pg-app .btn-warning, body.pg-app .btn-outline-warning{ background:var(--warn-wash) !important; border:1px solid var(--warn-edge) !important; color:var(--warn) !important; }
body.pg-app .btn-warning:hover, body.pg-app .btn-outline-warning:hover{ background:var(--warn-dot) !important; color:var(--ink) !important; }
/* one primary per view (guide §9): per-row actions inside tables use the secondary treatment */
body.pg-app .table .btn-primary{ background:var(--app-glass-strong) !important; border:1px solid var(--line) !important; color:var(--blood-deep) !important; box-shadow:none !important; }
body.pg-app .table .btn-primary:hover{ background:var(--blood) !important; border-color:var(--blood) !important; color:var(--cream) !important; }
body.pg-app .btn-link{ background:none !important; border:0 !important; color:var(--blood-deep) !important; min-height:auto; padding:var(--s2) 0 !important; }
body.pg-app .btn:disabled, body.pg-app .btn.disabled, body.pg-app fieldset:disabled .btn{ opacity:.45 !important; cursor:not-allowed !important; transform:none !important; }
body.pg-app .btn[aria-busy="true"]{ cursor:progress; }
body.pg-app .btn-group{ gap:var(--s2); flex-wrap:wrap; }
body.pg-app .btn-group > .btn{ border-radius:var(--r-btn) !important; margin:0 !important; }
body.pg-app .btn-close{ width:36px; height:36px; padding:0 !important; border-radius:50% !important; opacity:.6; background-size:12px; box-shadow:none !important; }
body.pg-app .btn-close:hover{ opacity:1; background-color:var(--row-hover) !important; }
@media (pointer:coarse){ body.pg-app .btn-sm{ min-height:44px; } }

/* ---- forms (48px, radius 12, cream-raised, --line) ---- */
body.pg-app .form-label, body.pg-app label.form-label, body.pg-app .col-form-label, body.pg-app .form-group > label{
  font-family:var(--mono) !important; font-weight:500 !important; font-size:11px !important; letter-spacing:.14em !important; text-transform:uppercase;
  color:var(--ink-mute) !important; margin-bottom:var(--s2) !important; }
body.pg-app .form-control, body.pg-app .form-select, body.pg-app input.form-control, body.pg-app select.form-control{
  min-height:48px; padding:0 var(--s4) !important; border-radius:var(--r-btn) !important; background-color:var(--cream-raised) !important;
  border:1px solid var(--line) !important; color:var(--ink) !important; font-family:var(--body) !important; font-size:15px !important; box-shadow:none !important;
  transition:border-color var(--t-micro) var(--ease-hover), box-shadow var(--t-micro) var(--ease-hover); }
body.pg-app .form-select{ padding-right:var(--s7) !important; background-position:right var(--s4) center !important; }
body.pg-app textarea.form-control{ min-height:96px; padding:var(--s3) var(--s4) !important; line-height:1.5; }
body.pg-app .form-control.form-control-sm, body.pg-app select.form-control.form-control-sm, body.pg-app .form-select.form-select-sm{ min-height:36px; font-size:14px !important; }
body.pg-app .form-control::placeholder{ color:var(--ink-mute) !important; opacity:1; }
body.pg-app .form-control:focus, body.pg-app .form-select:focus{ border-color:var(--blood) !important; box-shadow:var(--focus-ring) !important; outline:none; }
body.pg-app .form-control:disabled, body.pg-app .form-control[readonly], body.pg-app .form-select:disabled{ background-color:var(--info-wash) !important; color:var(--ink-mute) !important; }
body.pg-app .form-control.is-invalid, body.pg-app .form-select.is-invalid{ border-color:var(--err-dot) !important; }
body.pg-app .form-error, body.pg-app .invalid-feedback, body.pg-app .help-block.error, body.pg-app label.error, body.pg-app span.error{
  display:block; color:var(--err) !important; font-family:var(--body) !important; font-size:13px !important; letter-spacing:0 !important; text-transform:none !important; margin-top:var(--s1); }
body.pg-app .form-text{ color:var(--ink-mute); font-size:13px; }
body.pg-app .form-group{ margin-bottom:var(--s4); }
body.pg-app .input-group > .form-control, body.pg-app .input-group > .form-select{ border-radius:var(--r-btn) !important; }
body.pg-app .input-group > :not(:last-child){ border-top-right-radius:0 !important; border-bottom-right-radius:0 !important; }
body.pg-app .input-group > :not(:first-child){ border-top-left-radius:0 !important; border-bottom-left-radius:0 !important; margin-left:-1px !important; }
body.pg-app .input-group-text{ min-height:48px; background:var(--cream-raised) !important; border:1px solid var(--line) !important; color:var(--blood) !important;
  font-family:var(--mono); font-size:13px; border-radius:var(--r-btn); }
body.pg-app .form-check-input{ width:18px; height:18px; border:1px solid var(--line) !important; background-color:var(--cream-raised); box-shadow:none !important; cursor:pointer; }
body.pg-app .form-check-input:checked{ background-color:var(--blood) !important; border-color:var(--blood) !important; }
body.pg-app .form-check-input:focus{ box-shadow:var(--focus-ring) !important; border-color:var(--blood) !important; }
body.pg-app .form-switch .form-check-input{ width:38px; height:22px; border-radius:var(--r-pill); }
body.pg-app .form-check-label{ color:var(--ink-soft); font-size:14px; }
/* select2 (bootstrap-5 theme and default) */
body.pg-app .select2-container .select2-selection--single,
body.pg-app .select2-container .select2-selection--multiple,
body.pg-app .select2-container--bootstrap-5 .select2-selection{
  min-height:48px !important; border-radius:var(--r-btn) !important; background-color:var(--cream-raised) !important; border:1px solid var(--line) !important;
  display:flex; align-items:center; font-family:var(--body); font-size:15px; box-shadow:none !important; }
body.pg-app .select2-container .select2-selection--single .select2-selection__rendered{ color:var(--ink) !important; line-height:46px !important; padding-left:var(--s4) !important; }
body.pg-app .select2-container .select2-selection--single .select2-selection__arrow{ height:46px !important; right:var(--s3) !important; }
body.pg-app .select2-container--focus .select2-selection, body.pg-app .select2-container--open .select2-selection{ border-color:var(--blood) !important; box-shadow:var(--focus-ring) !important; }
body.pg-app .select2-selection__choice{ background:var(--info-wash) !important; border:1px solid var(--info-edge) !important; border-radius:var(--r-sm) !important;
  color:var(--ink-soft) !important; font-family:var(--mono); font-size:12px; }
body.pg-app .select2-dropdown{ background:var(--glass-hi) !important; -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  border:1px solid var(--app-glass-edge) !important; border-radius:var(--r-btn) !important; box-shadow:var(--shadow-up) !important; overflow:hidden; }
body.pg-app .select2-results__option{ font-size:14px; color:var(--ink-soft); padding:var(--s2) var(--s4) !important; }
body.pg-app .select2-results__option--highlighted, body.pg-app .select2-container--default .select2-results__option--highlighted[aria-selected]{
  background:var(--err-wash) !important; color:var(--blood-deep) !important; }
body.pg-app .select2-results__option[aria-selected="true"], body.pg-app .select2-results__option--selected{ background:var(--row-hover) !important; color:var(--blood-deep) !important; font-weight:600; }
body.pg-app .select2-search__field{ border:1px solid var(--line) !important; border-radius:var(--r-seg) !important; background:var(--cream-raised) !important; }
/* date range picker */
body.pg-app .daterangepicker{ background:var(--glass-hi) !important; -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  border:1px solid var(--app-glass-edge) !important; border-radius:var(--r-in) !important; box-shadow:var(--shadow-up) !important; font-family:var(--body); color:var(--ink-soft); }
body.pg-app .daterangepicker .calendar-table{ background:transparent !important; border:0 !important; }
body.pg-app .daterangepicker th, body.pg-app .daterangepicker td{ font-family:var(--mono); font-size:12px; border-radius:var(--r-sm) !important; }
body.pg-app .daterangepicker td.in-range{ background:var(--err-wash) !important; color:var(--blood-deep) !important; }
body.pg-app .daterangepicker td.active, body.pg-app .daterangepicker td.active:hover{ background:var(--blood) !important; color:var(--cream) !important; }
body.pg-app .daterangepicker .ranges li{ font-size:13px; border-radius:var(--r-sm); color:var(--ink-soft); }
body.pg-app .daterangepicker .ranges li.active{ background:var(--blood) !important; color:var(--cream) !important; }
body.pg-app .daterangepicker .ranges li:hover{ background:var(--row-hover); }
body.pg-app .daterangepicker .drp-buttons .btn{ min-height:36px; }
body.pg-app .daterangepicker::before, body.pg-app .daterangepicker::after{ display:none; }
body.pg-app #reportrange, body.pg-app .pagedatarange{ min-height:44px; display:inline-flex; align-items:center; gap:var(--s2); padding:0 var(--s4) !important;
  background:var(--app-glass-strong) !important; border:1px solid var(--line) !important; border-radius:var(--r-btn) !important; color:var(--ink-soft);
  font-family:var(--mono); font-size:12px; cursor:pointer; }
/* dashboard date filter: range + Clear sit in one flexible row (the theme floats Clear absolutely) */
body.pg-app #filterform{ display:flex; align-items:stretch; gap:var(--s2); }
body.pg-app #filterform #reportrange{ flex:1 1 auto; min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
body.pg-app #filterform .clear-btn{ position:static !important; flex:none; }
body.pg-app #reportrange label, body.pg-app .pagedatarange label{ font-family:var(--mono) !important; font-size:12px !important; letter-spacing:.06em; color:var(--ink) !important; text-transform:uppercase; }

/* ---- tabs / pills / segmented (glass track; active = glass-hi + ink + 2px blood underline) ---- */
body.pg-app .nav-tabs, body.pg-app .nav-pills{ display:inline-flex; flex-wrap:wrap; gap:2px; padding:var(--s1); border:1px solid var(--app-glass-edge) !important;
  border-radius:var(--r-btn); background:var(--app-glass) !important; -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur); margin-bottom:var(--s4); }
body.pg-app .nav-tabs .nav-link, body.pg-app .nav-pills .nav-link{ display:inline-flex; align-items:center; gap:var(--s2); min-height:36px; padding:0 var(--s3) !important;
  border:0 !important; border-radius:var(--r-seg) !important; background:transparent !important; color:var(--ink-mute) !important;
  font-family:var(--mono) !important; font-weight:500 !important; font-size:11px !important; letter-spacing:.12em !important; text-transform:uppercase; box-shadow:none; }
body.pg-app .nav-tabs .nav-link:hover, body.pg-app .nav-pills .nav-link:hover{ color:var(--blood-deep) !important; }
body.pg-app .nav-tabs .nav-link.active, body.pg-app .nav-pills .nav-link.active, body.pg-app .nav-tabs .nav-item.show .nav-link{
  background:var(--glass-hi) !important; color:var(--ink) !important; box-shadow:inset 0 -2px 0 var(--blood), var(--shadow) !important; }
body.pg-app .nav-tabs .nav-link::after, body.pg-app .nav-tabs .nav-link::before{ display:none !important; }
body.pg-app .tab-content{ color:var(--ink-soft); }

/* ---- pagination (Plex caps buttons) ---- */
body.pg-app .pagination{ gap:var(--s1); flex-wrap:wrap; margin:0; }
body.pg-app .pagination .page-link{ min-width:36px; min-height:36px; display:inline-flex; align-items:center; justify-content:center; padding:0 var(--s3) !important;
  border-radius:var(--r-seg) !important; border:1px solid var(--line) !important; background:var(--app-glass-strong) !important; color:var(--ink-soft) !important;
  font-family:var(--mono) !important; font-weight:500; font-size:11px !important; letter-spacing:.12em; text-transform:uppercase; box-shadow:none !important; margin:0 !important; }
body.pg-app .pagination .page-link:hover{ border-color:var(--blood) !important; color:var(--blood-deep) !important; }
body.pg-app .pagination .page-item.active .page-link{ background:var(--blood) !important; border-color:var(--blood) !important; color:var(--cream) !important; }
body.pg-app .pagination .page-item.disabled .page-link{ opacity:.45; }
body.pg-app nav[role="navigation"] p, body.pg-app .pagination-info{ font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-mute); }

/* ---- modals (glass-hi, radius --r, scrim) ---- */
body.pg-app .modal-backdrop{ --bs-backdrop-bg:var(--ink); --bs-backdrop-opacity:.35; }
body.pg-app .modal-backdrop.show{ opacity:.35 !important; }
body.pg-app .modal-content{ background:var(--modal-surface) !important; -webkit-backdrop-filter:var(--app-blur); backdrop-filter:var(--app-blur);
  border:1px solid var(--app-glass-edge) !important; border-radius:var(--r) !important; box-shadow:var(--shadow-up) !important; color:var(--ink-soft); overflow:hidden; }
body.pg-app .modal-header{ border-bottom:1px solid var(--hair) !important; padding:var(--s4) var(--s5) !important; background:transparent !important; }
body.pg-app .modal-title{ font-family:var(--disp) !important; font-weight:700 !important; font-size:18px !important; letter-spacing:-.01em; color:var(--ink) !important; }
body.pg-app .modal-body{ padding:var(--s5) !important; }
body.pg-app .modal-footer{ border-top:1px solid var(--hair) !important; padding:var(--s4) var(--s5) !important; gap:var(--s2); background:transparent !important; }
body.pg-app .modal-footer > *{ margin:0 !important; }

/* ---- dropdowns ---- */
body.pg-app .dropdown-menu{ background:var(--glass-hi) !important; -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  border:1px solid var(--app-glass-edge) !important; border-radius:var(--r-btn) !important; box-shadow:var(--shadow-up) !important; padding:var(--s1) !important; }
body.pg-app .dropdown-item{ border-radius:var(--r-sm); font-size:14px; color:var(--ink-soft) !important; padding:var(--s2) var(--s3) !important; }
body.pg-app .dropdown-item:hover, body.pg-app .dropdown-item:focus{ background:var(--row-hover) !important; color:var(--blood-deep) !important; }
body.pg-app .dropdown-item.active, body.pg-app .dropdown-item:active{ background:var(--err-wash) !important; color:var(--blood-deep) !important; }

/* ---- alerts ---- */
body.pg-app .alert{ border-radius:var(--r-in) !important; border:1px solid var(--info-edge) !important; background:var(--info-wash) !important; color:var(--info) !important;
  font-size:14px; padding:var(--s3) var(--s4) !important; box-shadow:none !important; }
body.pg-app .alert-success{ background:var(--pos-wash) !important; border-color:var(--pos-edge) !important; color:var(--pos) !important; }
body.pg-app .alert-danger{ background:var(--err-wash) !important; border-color:var(--err-edge) !important; color:var(--err) !important; }
body.pg-app .alert-warning{ background:var(--warn-wash) !important; border-color:var(--warn-edge) !important; color:var(--warn) !important; }
body.pg-app .alert .btn-close{ width:28px; height:28px; top:50%; transform:translateY(-50%); padding:0 !important; }

/* ---- toasts (jquery.toast) + sweetalert v1 ---- */
/* toasts sit bottom-right (guide §5) whatever position the caller passes */
body.pg-app .jq-toast-wrap{ top:auto !important; left:auto !important; bottom:var(--s5) !important; right:var(--s5) !important; }
body.pg-app .jq-toast-wrap .jq-toast-single{ background:var(--glass-hi) !important; -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  color:var(--ink) !important; border:1px solid var(--app-glass-edge) !important; border-radius:var(--r-in) !important; box-shadow:var(--shadow-up) !important;
  font-family:var(--body) !important; font-size:14px !important; background-image:none !important; padding:var(--s3) var(--s4) var(--s3) 34px !important; }
body.pg-app .jq-toast-single::before{ content:''; position:absolute; left:var(--s4); top:19px; width:6px; height:6px; border-radius:50%; background:var(--info); }
body.pg-app .jq-toast-single.jq-icon-success::before{ background:var(--pos-dot); }
body.pg-app .jq-toast-single.jq-icon-error::before{ background:var(--err-dot); }
body.pg-app .jq-toast-single.jq-icon-warning::before{ background:var(--warn-dot); }
body.pg-app .jq-toast-single h2{ font-family:var(--mono) !important; font-size:11px !important; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-mute) !important; }
body.pg-app .jq-toast-single .close-jq-toast-single{ color:var(--ink-mute); }
body.pg-app .jq-toast-loader{ background:var(--blood) !important; }
body.pg-app .sweet-overlay{ background:var(--scrim) !important; }
body.pg-app .sweet-alert{ background:var(--modal-surface) !important; -webkit-backdrop-filter:var(--app-blur); backdrop-filter:var(--app-blur);
  border:1px solid var(--app-glass-edge); border-radius:var(--r) !important; box-shadow:var(--shadow-up) !important; font-family:var(--body) !important; }
body.pg-app .sweet-alert h2{ font-family:var(--disp) !important; font-weight:800 !important; color:var(--ink) !important; font-size:24px !important; }
body.pg-app .sweet-alert p{ color:var(--ink-soft) !important; font-size:15px !important; }
body.pg-app .sweet-alert button{ min-height:44px; border-radius:var(--r-btn) !important; font-family:var(--body) !important; font-weight:600 !important; font-size:14px !important;
  padding:0 var(--s5) !important; box-shadow:none !important; }
body.pg-app .sweet-alert button.confirm{ background:var(--blood) !important; color:var(--cream) !important; }
body.pg-app .sweet-alert button.cancel{ background:var(--app-glass-strong) !important; color:var(--blood-deep) !important; border:1px solid var(--line) !important; }

/* ---- loaders / misc theme widgets ---- */
body.pg-app .description-loader{ background:var(--glass-hi) !important; border-radius:var(--r); }
body.pg-app .lds-roller div::after{ background:var(--blood) !important; }
body.pg-app .progress{ background:var(--hair) !important; border-radius:var(--r-pill); height:8px; }
body.pg-app .progress-bar{ background:var(--blood) !important; }
body.pg-app hr{ border-color:var(--hair); opacity:1; }
body.pg-app .bg-primary:not(.badge):not(.btn){ background-color:var(--blood) !important; }
body.pg-app .bg-light-primary{ background-color:var(--err-wash) !important; }
body.pg-app .border{ border-color:var(--hair) !important; }
/* inline SVGs filled from themeSetting.primary-color (hook: .pg-fill-brand) + copy/key affordances */
body.pg-app svg .pg-fill-brand{ fill:var(--blood) !important; }
body.pg-app .input-group-text svg path{ fill:currentColor !important; stroke:none !important; }
body.pg-app .input-group-custom .form-control{ font-family:var(--mono) !important; font-size:14px !important; letter-spacing:0; color:var(--ink) !important; }
body.pg-app .input-group-custom .input-group-text{ cursor:pointer; font-family:var(--mono) !important; font-size:11px !important; letter-spacing:.12em; text-transform:uppercase; color:var(--blood-deep) !important; gap:var(--s2); }
/* empty state helper */
body.pg-app .pg-empty{ display:flex; flex-direction:column; align-items:center; gap:var(--s3); padding:var(--s7) var(--s5); color:var(--ink-mute); text-align:center; font-size:14px; }
body.pg-app .pg-empty svg{ width:28px; height:28px; stroke:var(--blood); }
/* ApexCharts: pay-ins pos-dot, pay-outs blood-lite, hair grid, Plex axis (guide §5) */
body.pg-app .apexcharts-gridline, body.pg-app .apexcharts-grid line{ stroke:var(--hair) !important; }
body.pg-app .apexcharts-xaxis-label, body.pg-app .apexcharts-yaxis-label, body.pg-app .apexcharts-text, body.pg-app .apexcharts-legend-text{
  font-family:var(--mono) !important; fill:var(--ink-mute) !important; color:var(--ink-mute) !important; font-size:11px !important; }
body.pg-app .apexcharts-tooltip{ background:var(--glass-hi) !important; border:1px solid var(--app-glass-edge) !important; border-radius:var(--r-btn) !important;
  box-shadow:var(--shadow-up) !important; font-family:var(--body) !important; }

/* ---- entrance motion (guide §7): content rises 12px once, stagger 40ms capped at 6 ---- */
@keyframes pg-rise{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }
body.pg-app .page-body > .container-fluid > .row > [class*="col"] > .card,
body.pg-app .pc-content > .row > [class*="col"] > .card{ animation:pg-rise var(--t-enter) var(--ease) both; }
body.pg-app .page-body > .container-fluid > .row > [class*="col"]:nth-child(2) > .card{ animation-delay:40ms; }
body.pg-app .page-body > .container-fluid > .row > [class*="col"]:nth-child(3) > .card{ animation-delay:80ms; }
body.pg-app .page-body > .container-fluid > .row > [class*="col"]:nth-child(4) > .card{ animation-delay:120ms; }
body.pg-app .page-body > .container-fluid > .row > [class*="col"]:nth-child(5) > .card{ animation-delay:160ms; }
body.pg-app .page-body > .container-fluid > .row > [class*="col"]:nth-child(n+6) > .card{ animation-delay:200ms; }

/* ==========================================================================
   RESPONSIVE — below 992px the sidebar is an off-canvas drawer with a scrim
   ========================================================================== */
@media (max-width:991px){
  body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper .page-body{ margin-left:0 !important; padding:0 var(--s3) var(--s5) !important; margin-top:88px !important; }
  body.pg-app .page-wrapper .page-header,
  body.pg-app .page-wrapper.compact-wrapper .page-header{ padding-left:0 !important; }
  body.pg-app .page-wrapper .page-header .header-wrapper{ margin:var(--s3) !important; min-height:64px; padding:var(--s2) var(--s3) !important; }
  body.pg-app .footer{ margin-left:0 !important; }
  /* the theme adds .close_icon to header + sidebar on mobile: no desktop "collapsed" offsets here */
  body.pg-app .page-wrapper.compact-wrapper .page-header.close_icon{ padding-left:0 !important; }
  body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon ~ .page-body{ margin-left:0 !important; }
  body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper{ z-index:60 !important; }
  body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper:not(.close_icon){ box-shadow:var(--side-shadow), 0 0 0 100vmax var(--scrim) !important; }
}
@media (max-width:575px){
  body.pg-app .page-header .pg-crumb .bc{ display:none; }
  body.pg-app .page-header .nav-menus > li.maximize{ display:none !important; }
  body.pg-app .page-header .profile-media h6{ display:none; }
  body.pg-app .page-header .nav-right .dropbtn{ max-width:132px; overflow:hidden; text-overflow:ellipsis; }
  body.pg-app .page-title .text-end{ justify-content:flex-start; }
  body.pg-app .card .card-body{ padding:var(--s4); }
  body.pg-app .card .card-header{ padding:var(--s3) var(--s4) !important; }
  body.pg-app .pg-mk .pg-l{ font-size:24px; }
}
@media (prefers-reduced-motion:reduce){
  body.pg-app *, body.pg-app *::before, body.pg-app *::after{ animation:none !important; transition:none !important; }
}

/* ==========================================================================
   v3 SITE PARITY LAYER (28 Sep 2026)
   Metrics copied from payeeglobal.com/login + /white-label/demo (pg-demo.css v11, pg-login.css v11).
   Appended last on purpose: same selectors as the v2 rules above, so these win by order.
   Rule of thumb from Ashnab's review: text sits on the vertical centre of every strip/bar/row.
   ========================================================================== */

/* ---- glare rings (site .glare / .iconbtn::before / .btn::before) ---- */
.pg-card::before, body.pg-app .card:not(.pg-kpi)::before{ content:''; position:absolute; inset:0; border-radius:inherit; padding:1.4px; pointer-events:none; z-index:4;
  background:var(--glare-acc); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite:exclude; animation:pg-glare 6s steps(180) infinite; opacity:.6; }
.pg-iconbtn::before, .pg-btn-sm::before,
body.pg-app .page-header .status_toggle.sidebar-toggle::before,
body.pg-app .page-title .btn::before, body.pg-app .card-header .btn::before{ content:''; position:absolute; inset:0; border-radius:inherit; padding:1.4px; pointer-events:none; z-index:2;
  background:var(--glare-btn); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite:exclude; animation:pg-glare 4s steps(120) infinite; opacity:.85; }
.pg-card{ position:relative; background:var(--glass); -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  border:1px solid var(--glass-edge); border-radius:var(--r); box-shadow:var(--shadow); }

/* ---- base pg components ---- */
.pg-eyebrow{ font-size:9.5px; letter-spacing:.2em; color:var(--acc-deep); font-weight:400; }
.pg-label{ font-size:8.5px; letter-spacing:.14em; }
.pg-btn{ position:relative; }
.pg-btn-primary{ min-height:52px; border-radius:var(--r-cta); border:0; background:var(--cta-grad); color:var(--white); font-size:14px; font-weight:600; letter-spacing:.04em;
  box-shadow:var(--cta-shadow); transition:transform .16s var(--ease-hover), box-shadow .16s var(--ease-hover); }
.pg-btn-primary:hover{ background:var(--cta-grad); color:var(--white); transform:translateY(-1px); box-shadow:var(--cta-shadow-up); }
.pg-btn-sm{ min-height:32px; padding:0 11px; border-radius:var(--r-seg); border:1px solid var(--line); background:var(--glass-hi);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); color:var(--ink); font-family:var(--body); font-size:10px; font-weight:500;
  letter-spacing:.06em; text-transform:uppercase; white-space:nowrap; text-decoration:none; }
.pg-btn-sm:hover{ border-color:var(--acc); color:var(--acc-deep); transform:translateY(-1px); }
.pg-pill{ font-size:9.5px; font-weight:400; letter-spacing:.06em; text-transform:lowercase; padding:3px 8px; border-radius:var(--r-sm); gap:5px; }
.pg-pill::before{ width:5px; height:5px; background:currentColor !important; opacity:.8; }
.pg-alert.is-err{ color:var(--err); background:var(--safe-bg); border-color:var(--safe-edge); }

/* ---- console body (site body 13px / 1.45) ---- */
body.pg-app{ font-size:13px; line-height:1.45; }
body.pg-app a{ color:var(--acc-deep); }
body.pg-app a:hover{ color:var(--acc-deep); }
body.pg-app :focus-visible{ outline:2px solid var(--acc) !important; outline-offset:2px; }
body.pg-app ::selection{ background:rgba(var(--acc-rgb),.2); }
body.pg-app .text-primary{ color:var(--acc-deep) !important; }
body.pg-app h1, body.pg-app h2, body.pg-app h3, body.pg-app h4, body.pg-app h5, body.pg-app h6{ color:var(--ink); letter-spacing:-.02em; }

/* ---- theme2 shell: 252px column (224 panel + 14 inset), site topbar ---- */
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper .page-body{
  margin-left:var(--shell-left) !important; margin-top:var(--shell-top) !important; padding:0 var(--sb-inset) 60px var(--sb-inset) !important; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .logo-wrapper{ min-height:96px; padding:26px 8px 16px !important; }
body.pg-app .pg-sb-brand, body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .logo-wrapper a.pg-sb-brand{ gap:10px; }
body.pg-app .pg-sb-user{ margin:0 14px 8px; padding:11px 12px; gap:11px; border-radius:14px; background:var(--on-maroon-glass); }
body.pg-app .pg-sb-user .av{ background:linear-gradient(160deg, var(--white), var(--rose)); color:var(--blood-deep); font-size:14px; }
body.pg-app .pg-sb-user .nm{ font-size:13px; color:var(--on-maroon); }
body.pg-app .pg-sb-user .rl{ font-size:8.5px; letter-spacing:.12em; font-weight:400; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links{ padding:10px 0 16px !important; }
body.pg-app .sidebar-wrapper li.pg-sb-cap{ padding:10px 20px 8px; font-size:9px; letter-spacing:.22em; font-weight:400; color:var(--on-maroon); }
body.pg-app .sidebar-wrapper li.pg-sb-cap:first-of-type{ padding-top:10px; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-link{
  min-height:44px; margin:0 12px !important; padding:0 12px !important; gap:12px; border-radius:12px !important;
  color:var(--on-maroon) !important; font-weight:500 !important; font-size:11px !important; letter-spacing:.06em !important; line-height:1.3; }
body.pg-app .sidebar-wrapper .sidebar-link svg{ width:16px !important; height:16px !important; opacity:.9; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-link.active{ font-weight:700 !important; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-link.active::before{
  left:3px; background:var(--white); box-shadow:var(--nav-glow); }
body.pg-app .sidebar-wrapper .sidebar-link .according-menu{ color:var(--on-maroon) !important; opacity:.7; }
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-list .sidebar-submenu li a{
  min-height:34px; margin:0 12px !important; padding:0 12px 0 40px !important; border-radius:var(--r-seg) !important;
  color:var(--on-maroon-dim) !important; font-size:11.5px !important; font-weight:500 !important; }
body.pg-app .pg-sb-foot{ display:flex; align-items:center; justify-content:center; padding:12px 14px 16px; border-top:1px solid var(--on-maroon-line);
  font-size:8.5px; letter-spacing:.12em; font-weight:400; }
/* topbar */
body.pg-app .page-wrapper .page-header .header-wrapper{
  min-height:var(--pg-head-h); margin:var(--sb-inset) var(--sb-inset) 0 var(--sb-inset) !important; padding:10px 14px !important; gap:14px; border-radius:18px !important;
  background:var(--topbar-bg) !important; -webkit-backdrop-filter:var(--topbar-blur); backdrop-filter:var(--topbar-blur);
  border:1px solid var(--glass-edge) !important; box-shadow:var(--topbar-shadow) !important; align-items:center !important; }
body.pg-app .page-header .header-wrapper > *{ align-self:center; }
body.pg-app .page-header .status_toggle.sidebar-toggle{ position:relative; color:var(--acc-deep); background:var(--iconbtn-bg) !important; border:1px solid var(--iconbtn-edge);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:var(--iconbtn-shadow); }
body.pg-app .page-header .status_toggle.sidebar-toggle:hover{ box-shadow:var(--iconbtn-shadow-up); }
body.pg-app .page-header .status_toggle.sidebar-toggle svg, body.pg-app .page-header .status_toggle.sidebar-toggle svg path{ stroke:var(--acc-deep) !important; }
body.pg-app .pg-crumb .bc{ font-size:8.5px; font-weight:400; letter-spacing:.16em; }
body.pg-app .pg-crumb .ttl{ font-family:var(--disp); font-size:13px; font-weight:500; letter-spacing:.08em; color:var(--ink-grey); }
body.pg-app .page-header .nav-menus{ gap:10px; }
body.pg-app .page-header .nav-menus .notification-box,
body.pg-app .page-header .nav-menus > li.maximize > a{ background:var(--iconbtn-bg); border:1px solid var(--iconbtn-edge); box-shadow:var(--iconbtn-shadow); }
body.pg-app .page-header .nav-menus svg path{ stroke:var(--acc-deep) !important; }
body.pg-app .page-header .notification-box .badge{ background:var(--acc) !important; color:var(--white) !important; font-size:9.5px; }
body.pg-app .page-header .nav-right .dropbtn,
body.pg-app .page-header .nav-right .btn-light{ min-height:32px; padding:0 11px !important; border-radius:var(--r-seg) !important; background:var(--glass-hi) !important;
  border:1px solid var(--line) !important; color:var(--ink) !important; font-family:var(--body) !important; font-size:10px !important; font-weight:500; letter-spacing:.06em; }
body.pg-app .page-header .profile-media > i{ width:38px; height:38px; background:linear-gradient(160deg, var(--white), var(--rose)); color:var(--blood-deep) !important;
  border:1px solid var(--safe-edge); font-size:16px !important; }
body.pg-app .page-header .profile-media h6{ font-family:var(--disp) !important; font-weight:700 !important; font-size:13px !important; color:var(--navy) !important; line-height:1.25; }
body.pg-app .page-header .profile-media small{ font-size:8.5px; letter-spacing:.12em; }
body.pg-app .footer{ margin-left:var(--shell-left) !important; padding-left:var(--sb-inset) !important; font-size:8.5px; letter-spacing:.12em; }
body.pg-app .page-wrapper.compact-wrapper .page-header.close_icon ~ .page-body-wrapper .page-body,
body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon ~ .page-body{ margin-left:0 !important; }

/* ---- page title row (site .panel-title: 4×14 bar + Archivo 13 caps) ---- */
body.pg-app .page-title{ margin:6px 4px 14px !important; }
body.pg-app .page-title > .row{ align-items:center !important; min-height:32px; }
body.pg-app .page-title .breadcrumb{ align-items:center; min-height:32px; }
body.pg-app .page-title .breadcrumb .breadcrumb-item.active{ font-family:var(--disp); font-weight:500; font-size:13px; letter-spacing:.09em; color:var(--ink-grey) !important; }
body.pg-app .page-title .breadcrumb::before{ background:linear-gradient(180deg, var(--acc-lite), var(--acc-deep)); margin-right:10px; }
body.pg-app .page-title h3{ font-weight:500 !important; font-size:13px !important; color:var(--ink-grey) !important; }

/* ---- cards = site .panel.glass (header strip = .panel-h) ---- */
body.pg-app .card{ position:relative; background:var(--glass) !important; -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  border:1px solid var(--glass-edge) !important; border-radius:var(--r) !important; box-shadow:var(--shadow) !important; margin-bottom:16px; color:var(--ink); }
body.pg-app .card .card-header{ align-items:center !important; min-height:48px; gap:10px; padding:14px 18px !important; border-bottom:1px solid var(--hair) !important; position:relative; z-index:3; }
body.pg-app .card .card-header.pb-0{ padding-bottom:14px !important; }
body.pg-app .card .card-header h5, body.pg-app .card .card-header h4, body.pg-app .card .card-header h3,
body.pg-app .card .card-title, body.pg-app .card .card-header .card-title{
  font-size:10.5px !important; font-weight:500 !important; letter-spacing:.14em !important; color:var(--ink-mute) !important; line-height:1.2 !important; }
body.pg-app .card .card-header h5::before, body.pg-app .card .card-header h4::before{ content:none; }
body.pg-app .card .card-body{ padding:16px 18px 18px; position:relative; z-index:3; }
body.pg-app .card .card-footer{ padding:12px 18px !important; position:relative; z-index:3; }
/* KPI tiles = site .tile */
body.pg-app .card.pg-kpi{ background:var(--tile-bg) !important; -webkit-backdrop-filter:var(--tile-blur); backdrop-filter:var(--tile-blur);
  border:1px solid var(--tile-edge) !important; box-shadow:var(--tile-shadow) !important; }
body.pg-app .pg-kpi .card-body{ padding:18px 18px 16px !important; }
body.pg-app .pg-kpi h3, body.pg-app .pg-kpi .pg-kpi-v{ font-size:32px !important; line-height:.95 !important; margin:13px 0 0 !important; }
body.pg-app .card.pg-kpi .badge{ font-size:9.5px !important; letter-spacing:.13em !important; text-transform:uppercase !important; font-weight:400 !important; gap:7px; }
body.pg-app .card.pg-kpi .badge::before{ width:6px; height:6px; opacity:1; }
body.pg-app .pg-kpi p{ font-size:10px; margin-top:9px; }
body.pg-app .pg-kpi p + p, body.pg-app .pg-kpi p.w-600{ margin-top:2px; }

/* ---- tables = site .dt ---- */
body.pg-app .table thead th, body.pg-app .table > thead > tr > th, body.pg-app .table-light th, body.pg-app .table thead td{
  font-size:9px !important; letter-spacing:.1em !important; padding:12px 14px !important; border-bottom:1px solid var(--line) !important; }
body.pg-app .table tbody td, body.pg-app .table tbody th{ height:auto; padding:11px 14px !important; font-size:12.5px; color:var(--ink-soft) !important; border-bottom:1px solid var(--hair) !important; }
body.pg-app .table{ font-size:12.5px; }
body.pg-app .table td a{ color:var(--acc-deep); }
body.pg-app .table td.title a{ font-size:11.5px; }
body.pg-app .table .pg-num{ font-size:12.5px; }

/* ---- pills = site .pill (lowercase, 6px radius, 5px dot) ---- */
body.pg-app .badge{ font-size:9.5px !important; font-weight:400 !important; letter-spacing:.06em; text-transform:lowercase; padding:3px 8px !important; gap:5px;
  border-radius:var(--r-sm) !important; line-height:1.4; }
body.pg-app .badge:not(.rounded-pill)::before{ content:''; width:5px; height:5px; border-radius:50%; background:currentColor; opacity:.8; }
body.pg-app .badge.bg-danger, body.pg-app .badge.bg-soft-danger, body.pg-app .badge.badge-danger, body.pg-app .badge.badge-light-danger{
  color:var(--acc-deep) !important; background:var(--acc-wash) !important; border-color:var(--err-edge) !important; }
body.pg-app .page-header .notification-box .badge::before{ content:none; }

/* ---- buttons = site .btn (40px, 11px caps) + maroon CTA for the one primary ---- */
body.pg-app .btn{ position:relative; min-height:40px; padding:0 15px !important; border-radius:var(--r-btn) !important; font-size:11px !important; font-weight:500 !important;
  letter-spacing:.06em; text-transform:uppercase; gap:7px; }
body.pg-app .btn i, body.pg-app .btn svg{ font-size:13px; width:14px; height:14px; }
body.pg-app .btn-sm, body.pg-app .btn-group-sm > .btn{ min-height:32px; padding:0 11px !important; font-size:10px !important; border-radius:var(--r-seg) !important; }
body.pg-app .btn-primary, body.pg-app .btn-primary:focus{ background:var(--cta-grad) !important; border:0 !important; color:var(--white) !important;
  font-weight:600 !important; box-shadow:var(--cta-shadow) !important; }
body.pg-app .btn-primary:hover, body.pg-app .btn-primary:active{ background:var(--cta-grad) !important; color:var(--white) !important; box-shadow:var(--cta-shadow-up) !important; }
body.pg-app .btn-secondary, body.pg-app .btn-light, body.pg-app .btn-info, body.pg-app .btn-dark, body.pg-app .btn-danger, body.pg-app .btn-outline-danger,
body.pg-app .btn-outline-primary, body.pg-app .btn-outline-secondary, body.pg-app .btn-outline-light, body.pg-app .btn-outline-dark, body.pg-app .btn-outline-info,
body.pg-app .table .btn-primary{
  background:var(--glass-hi) !important; border:1px solid var(--line) !important; color:var(--ink) !important; box-shadow:none !important;
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); font-weight:500 !important; }
body.pg-app .btn-secondary:hover, body.pg-app .btn-light:hover, body.pg-app .btn-info:hover, body.pg-app .btn-dark:hover, body.pg-app .btn-danger:hover, body.pg-app .btn-outline-danger:hover,
body.pg-app .btn-outline-primary:hover, body.pg-app .btn-outline-secondary:hover, body.pg-app .btn-outline-light:hover, body.pg-app .btn-outline-dark:hover, body.pg-app .btn-outline-info:hover,
body.pg-app .table .btn-primary:hover{ background:var(--glass-hi) !important; border-color:var(--acc) !important; color:var(--acc-deep) !important; }
body.pg-app .btn-success, body.pg-app .btn-outline-success{ background:rgba(41,176,108,.18) !important; border:1px solid rgba(41,176,108,.4) !important; color:var(--pos) !important; }
body.pg-app .btn-success:hover, body.pg-app .btn-outline-success:hover{ background:rgba(41,176,108,.28) !important; border-color:rgba(41,176,108,.6) !important; color:var(--pos) !important; }

/* ---- inputs = site .ctrl (40px, radius 10, 72% white) ---- */
body.pg-app .form-label, body.pg-app label.form-label, body.pg-app .col-form-label, body.pg-app .form-group > label{
  font-size:8.5px !important; font-weight:400 !important; letter-spacing:.14em !important; padding-left:2px; margin-bottom:5px !important; }
body.pg-app .form-control, body.pg-app .form-select, body.pg-app input.form-control, body.pg-app select.form-control{
  min-height:40px; padding:0 12px !important; border-radius:var(--r-field) !important; background-color:var(--ctrl-bg) !important; font-size:13px !important; color:var(--ink) !important; }
body.pg-app .form-select{ padding-right:36px !important; background-position:right 12px center !important; }
body.pg-app textarea.form-control{ min-height:72px; padding:10px 12px !important; }
body.pg-app .form-control:focus, body.pg-app .form-select:focus{ border-color:var(--acc) !important; box-shadow:var(--focus-ring) !important; }
body.pg-app .input-group-text{ min-height:40px; background:var(--ctrl-bg) !important; color:var(--acc-deep) !important; font-size:10px; }
body.pg-app .select2-container .select2-selection--single, body.pg-app .select2-container .select2-selection--multiple, body.pg-app .select2-container--bootstrap-5 .select2-selection{
  min-height:40px !important; border-radius:var(--r-field) !important; background-color:var(--ctrl-bg) !important; font-size:13px; }
body.pg-app .select2-container .select2-selection--single .select2-selection__rendered{ line-height:38px !important; padding-left:12px !important; }
body.pg-app .select2-container .select2-selection--single .select2-selection__arrow{ height:38px !important; }
body.pg-app .select2-container--focus .select2-selection, body.pg-app .select2-container--open .select2-selection{ border-color:var(--acc) !important; }
body.pg-app .select2-results__option--highlighted, body.pg-app .select2-container--default .select2-results__option--highlighted[aria-selected]{ background:var(--acc-wash) !important; color:var(--acc-deep) !important; }
body.pg-app .form-check-input:checked{ background-color:var(--acc) !important; border-color:var(--acc) !important; }
body.pg-app .input-group-custom .form-control{ font-size:12.5px !important; }
body.pg-app .input-group-custom .input-group-text{ font-size:10px !important; color:var(--acc-deep) !important; }

/* ---- tabs = site .seg ---- */
body.pg-app .nav-tabs, body.pg-app .nav-pills{ align-items:center; gap:2px; padding:3px; border-radius:12px; background:var(--seg-track) !important; border:1px solid var(--glass-edge) !important;
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
body.pg-app .nav-tabs .nav-link, body.pg-app .nav-pills .nav-link{ min-height:36px; padding:0 13px !important; border-radius:var(--r-seg) !important;
  font-size:10px !important; letter-spacing:.12em !important; color:var(--ink-mute) !important; }
body.pg-app .nav-tabs .nav-link.active, body.pg-app .nav-pills .nav-link.active, body.pg-app .nav-tabs .nav-item.show .nav-link{
  background:var(--glass-hi) !important; color:var(--acc-deep) !important; box-shadow:var(--shadow) !important; }

/* ---- pagination (site .btn.sm) ---- */
body.pg-app .pagination .page-link{ min-width:32px; min-height:32px; padding:0 11px !important; border-radius:var(--r-seg) !important; background:var(--glass-hi) !important;
  font-family:var(--body) !important; font-size:10px !important; letter-spacing:.06em; color:var(--ink) !important; }
body.pg-app .pagination .page-link:hover{ border-color:var(--acc) !important; color:var(--acc-deep) !important; }
body.pg-app .pagination .page-item.active .page-link{ background:var(--cta-grad) !important; border-color:transparent !important; color:var(--white) !important; }

/* ---- modals = site .modal / .overlay ---- */
body.pg-app .modal-backdrop{ --bs-backdrop-bg:rgb(40,20,22); --bs-backdrop-opacity:.26; }
body.pg-app .modal-backdrop.show{ opacity:.26 !important; }
body.pg-app .modal.show{ -webkit-backdrop-filter:blur(10px) saturate(120%); backdrop-filter:blur(10px) saturate(120%); }
body.pg-app .modal-content{ background:var(--modal-surface) !important; border-radius:20px !important; box-shadow:var(--modal-shadow) !important; border:0 !important; }
body.pg-app .modal-header{ align-items:center !important; padding:16px 18px !important; border-bottom:1px solid var(--hair) !important; }
body.pg-app .modal-title{ font-size:15px !important; font-weight:800 !important; color:var(--ink) !important; }
body.pg-app .modal-body{ padding:16px 18px 18px !important; }
body.pg-app .modal-footer{ align-items:center; padding:0 18px 18px !important; border-top:0 !important; gap:10px; }

/* ---- dropdowns + tooltips = site .chart-tip glass ---- */
body.pg-app .dropdown-menu, body.pg-app .page-header .onhover-show-div, body.pg-app .page-header .dropdown-content, body.pg-app .select2-dropdown, body.pg-app .daterangepicker{
  background:var(--tip-bg) !important; -webkit-backdrop-filter:blur(18px) saturate(165%); backdrop-filter:blur(18px) saturate(165%);
  border:1px solid var(--glass-edge) !important; border-radius:13px !important; box-shadow:var(--shadow-up) !important; }
body.pg-app .dropdown-item{ font-size:12.5px; }
body.pg-app .dropdown-item:hover, body.pg-app .dropdown-item:focus{ background:var(--row-hover) !important; color:var(--acc-deep) !important; }

/* ---- alerts, toasts (= site .flash), confirm ---- */
body.pg-app .alert{ border-radius:var(--r-in) !important; font-size:13px; align-items:center; }
body.pg-app .alert-danger{ background:var(--safe-bg) !important; border-color:var(--safe-edge) !important; color:var(--acc-deep) !important; }
body.pg-app .jq-toast-wrap{ top:auto !important; right:auto !important; bottom:22px !important; left:50% !important; transform:translateX(-50%); width:auto !important; max-width:calc(100vw - 32px); }
body.pg-app .jq-toast-wrap .jq-toast-single{ background:var(--flash-bg) !important; -webkit-backdrop-filter:none; backdrop-filter:none; color:var(--white) !important; border:0 !important;
  border-radius:12px !important; font-size:13px !important; font-weight:600; box-shadow:0 12px 40px rgba(0,0,0,.3) !important; padding:11px 20px 11px 30px !important; }
body.pg-app .jq-toast-single h2{ color:rgba(255,255,255,.7) !important; font-size:9.5px !important; }
body.pg-app .jq-toast-single::before{ top:50%; transform:translateY(-50%); left:14px; }
body.pg-app .sweet-alert{ background:var(--modal-surface) !important; border-radius:20px !important; box-shadow:var(--modal-shadow) !important; }
body.pg-app .sweet-alert h2{ font-size:20px !important; }
body.pg-app .sweet-alert button{ min-height:40px; border-radius:var(--r-btn) !important; font-size:11px !important; letter-spacing:.06em; text-transform:uppercase; }
body.pg-app .sweet-alert button.confirm{ background:var(--cta-grad) !important; color:var(--white) !important; }
body.pg-app .sweet-alert button.cancel{ background:var(--glass-hi) !important; color:var(--ink) !important; border:1px solid var(--line) !important; }

/* ---- date filter + misc ---- */
body.pg-app #reportrange, body.pg-app .pagedatarange{ min-height:40px; border-radius:var(--r-field) !important; background:var(--ctrl-bg) !important; font-size:11px; }
body.pg-app #reportrange label, body.pg-app .pagedatarange label{ font-size:11px !important; }
body.pg-app .daterangepicker td.in-range{ background:var(--acc-wash) !important; color:var(--acc-deep) !important; }
body.pg-app .daterangepicker td.active, body.pg-app .daterangepicker td.active:hover, body.pg-app .daterangepicker .ranges li.active{ background:var(--blood) !important; color:var(--white) !important; }
body.pg-app code{ color:var(--acc-deep); background:var(--acc-wash); }
body.pg-app .progress-bar{ background:var(--acc) !important; }

@media (max-width:991px){
  body.pg-app .page-wrapper.compact-wrapper .page-body-wrapper .page-body{ margin-left:0 !important; padding:0 12px 60px !important; margin-top:86px !important; } /* 12 = Bootstrap half-gutter, so rows never overflow */
  body.pg-app .page-wrapper .page-header .header-wrapper{ margin:10px !important; padding:8px 10px !important; gap:10px; min-height:62px; }
  body.pg-app .footer{ margin-left:0 !important; }
}
@media (max-width:560px){
  body.pg-app .pg-kpi h3, body.pg-app .pg-kpi .pg-kpi-v{ font-size:28px !important; }
}
@media (prefers-reduced-motion:reduce){
  .pg-card::before, .pg-iconbtn::before, .pg-btn-sm::before, body.pg-app .card::before, body.pg-app .btn::before,
  body.pg-app .page-header .status_toggle.sidebar-toggle::before{ animation:none !important; }
}

/* v3 auth fixes (review 28 Sep): header strip keeps eyebrow + host together (v1 space-between removed),
   mono heading inside the safe box, no theme letter-spacing on links, remember-me row on one centre line */
.pg-auth-card .pg-card-h{ justify-content:flex-start; align-items:center; margin:0; }
body.pg-app .pg-safe h3{ font-family:var(--mono); font-weight:500; font-size:10px; letter-spacing:.18em; color:var(--ink-mute); line-height:1.2; }
body.pg-app .pg-auth a, body.pg-app .pg-auth .pg-btn-ghost{ letter-spacing:0; }
body.pg-app .pg-auth .pg-btn-sm{ letter-spacing:.06em; }
.pg-auth-card h1{ margin-bottom:18px; }
.pg-row > *{ margin:0 !important; line-height:20px !important; }
.pg-row .pg-check{ display:inline-flex; align-items:center; gap:8px; min-height:32px; }
.pg-row .pg-btn-ghost{ line-height:20px; }
body.pg-app .page-wrapper .page-header .header-wrapper{ width:auto !important; max-width:none !important; }
body.pg-app .table tbody td, body.pg-app .table tbody th{ white-space:nowrap !important; } /* tables scroll inside .table-responsive (site .tscroll) */