/* ===================================================================
   AccountsAllan look for the partner cabinet — an OVERRIDE LAYER.
   partner.css is untouched and still carries the classic design;
   everything here only repaints it. To go back to the old look, delete
   the single <link ... theme-allan.css> line in partner/index.html.
   No markup depends on this file.
   Palette: Tailwind slate (ground/panels) + indigo (accents), glass panels.
   =================================================================== */
:root{
  color-scheme:dark;
  --bg:#0f172a; --panel:rgba(30,41,59,.7); --panel-2:#1e293b; --stroke:#1e293b; --stroke-2:#334155;
  --text:#f8fafc; --muted:#94a3b8; --blue:#6366f1; --blue-2:#818cf8; --green:#34d399;
  --red:#f87171; --amber:#f59e0b; --radius:12px;
  --glass-bd:rgba(255,255,255,.1);
  --indigo-600:#4f46e5; --indigo-500:#6366f1;
}
body{background:var(--bg);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif}

/* Thin slate scrollbars instead of hidden ones (as in the reference). */
*{scrollbar-width:thin;scrollbar-color:#475569 transparent;-ms-overflow-style:auto}
*::-webkit-scrollbar{display:block;width:10px;height:10px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:#475569;border-radius:999px;border:2px solid transparent;background-clip:padding-box}
*::-webkit-scrollbar-thumb:hover{background:#64748b;background-clip:padding-box}

/* ---- Buttons ---- */
.btn{border-radius:8px;font-weight:600}
.btn.primary,.xbtn,.xdo-btn{background:var(--indigo-600);color:#fff}
.btn.primary:hover,.xbtn:hover{background:var(--indigo-500);filter:none}
.btn.ghost{background:#1e293b;border:1px solid transparent;color:#cbd5e1}
.btn.ghost:hover{background:#334155;color:#fff}
.btn-mini{border-radius:8px;background:#1e293b;border-color:#334155;color:#cbd5e1}
.btn-mini:hover{background:#334155;border-color:#475569;color:#fff}
.btn-mini.off{background:rgba(248,113,113,.12);border-color:rgba(248,113,113,.35);color:#fca5a5}
.btn-mini.on{background:rgba(52,211,153,.12);border-color:rgba(52,211,153,.35);color:#6ee7b7}

/* ---- Inputs: slate-900 fields, indigo focus ---- */
textarea,.alt-input,.myref-row input,.reflink-row input,.ilink-attach input,.plog-sel,.plog-inp,
.pe-field input[type=text],.pe-field textarea,.ar-field input,.xbal-edit input,.xdm-row textarea{
  background-color:#0f172a;border:1px solid #334155;border-radius:8px;color:var(--text)}
textarea:focus,.alt-input:focus,.myref-row input:focus,.reflink-row input:focus,.ilink-attach input:focus,
.plog-sel:focus,.plog-inp:focus,.pe-field input[type=text]:focus,.pe-field textarea:focus,.ar-field input:focus,
.xbal-edit input:focus,.xdm-row textarea:focus{outline:none;border-color:var(--indigo-500);box-shadow:0 0 0 1px var(--indigo-500)}

/* ---- Login ---- */
.login-card{background:var(--panel);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-bd);border-radius:12px}

/* ---- Header: glass, sticky, slate-800 rule ---- */
.topbar{background:rgba(30,41,59,.7);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid #1e293b;padding:14px 24px;z-index:20}
.brand-sm{font-size:21px;font-weight:700;letter-spacing:-.01em}
.bal-pill{background:rgba(79,70,229,.2);border:1px solid rgba(99,102,241,.35);border-radius:999px;color:#c7d2fe;padding:5px 14px}
.bal-pill b{color:#fff}
.bal-pill .muted{color:#a5b4fc}
.lang-switch{background:#1e293b;border:1px solid #334155;border-radius:999px}
.lang-switch button{border-radius:999px;color:#94a3b8}
.lang-switch button.active{background:var(--indigo-600);color:#fff}
.cab-av{border-color:#334155}
.cab-av:hover{border-color:var(--indigo-500)}
.nav-menu{background:#1e293b;border-color:#334155;border-radius:12px}
.nm-banner{background:linear-gradient(135deg,#4f46e5,#818cf8)}
.nm-items a.active{color:#818cf8;background:rgba(79,70,229,.2)}
.nm-sep{background:#334155}
.view-banner{position:relative;z-index:21}

/* ---- Panels = glass cards ---- */
.card,.ref-card,.myref-form,.myref-set,.reflink-box,.pad-row,.plog-row,.xbal-card,.xs-set{
  background:var(--panel);border:1px solid var(--glass-bd);border-radius:12px}
.card{padding:20px}
.vcard,.ah-sum-row{background:rgba(15,23,42,.45);border-color:#334155}
h1{font-size:24px;font-weight:700;letter-spacing:-.01em}
h2{font-size:16px;font-weight:600}
.table-wrap{border-color:#334155;border-radius:8px}
th,td{border-bottom-color:#1e293b}
th{color:#94a3b8}
.xd-row:hover{background:#1e293b}
.pmodal-card,.xdo-box{background:#1e293b;border-color:#334155}
.toast{background:#1e293b;border-color:#334155}
.chip.blue{background:rgba(99,102,241,.18);color:#a5b4fc}
.chip.green{background:rgba(52,211,153,.15);color:#6ee7b7}
.chip.amber{background:rgba(245,158,11,.15);color:#fcd34d}
.chip.red{background:rgba(248,113,113,.15);color:#fca5a5}
.sw-btn{border-radius:8px;background:#1e293b;border-color:#334155}
.sw-btn.active{background:rgba(79,70,229,.2);border-color:rgba(99,102,241,.5);color:#818cf8}
.xseg-b.active{background:var(--indigo-600)}
a,.plog-sv,.ilink-url,.vcard-head a{color:#818cf8}
.nm-items a{color:var(--text)}

/* ---- Stat cards: glass + coloured left accent (indigo / emerald / amber / purple) ---- */
.pcards,.xstats{gap:16px}
.pcard{background:var(--panel);border:1px solid var(--glass-bd);border-left:4px solid #6366f1;border-radius:12px;padding:20px}
/* As in the reference (border-l-4 + border-<colour>-500), the colour tints every side. */
.pcard{border-color:#6366f1}
.pcard:nth-child(4n+2){border-color:#10b981}
.pcard:nth-child(4n+3){border-color:#f59e0b}
.pcard:nth-child(4n+4){border-color:#a855f7}
.pcard .k{color:#94a3b8;font-size:12px;font-weight:600;letter-spacing:.04em}
.pcard .v{font-size:28px;font-weight:700;margin-top:8px;line-height:1.15}
.pcard .n{color:#64748b;font-size:12px;margin-top:4px}

/* ---- Section nav: icon + label items ---- */
.p-tabs{gap:6px;border-bottom:0;margin-bottom:0}
.p-tab{display:flex;align-items:center;gap:12px;padding:11px 16px;border-radius:8px;border-bottom:0;margin-bottom:0;color:#94a3b8;font-weight:500;text-align:left}
.p-tab:hover{background:#1e293b;color:#e2e8f0}
.p-tab.active{background:rgba(79,70,229,.2);color:#818cf8}
.p-tab::before{content:"";flex:none;width:18px;height:18px;background:currentColor;
  -webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.p-tab.owner-tab::before{display:none}           /* these labels carry their own emoji */
.p-tab.owner-tab[data-pane="xsettings"]::before{display:block}
.owner-tab{color:#e0a13c}
.owner-tab:hover{color:#f0b357;background:rgba(240,179,87,.08)}
.owner-tab.active{color:#f5c877;background:rgba(240,179,87,.14)}
.p-tab[data-pane="tickets"],.p-tab.p-tab-link{text-decoration:none;--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v3a2 2 0 0 0 0 4v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-3a2 2 0 0 0 0-4V7Z'/%3E%3Cpath d='M13 5v2M13 11v2M13 17v2'/%3E%3C/svg%3E")}
.p-tab[data-pane="overview"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21.2 15.9A10 10 0 1 1 8 2.8'/%3E%3Cpath d='M22 12A10 10 0 0 0 12 2v10z'/%3E%3C/svg%3E")}
.p-tab[data-pane="ads"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 11 18-5v12L3 14v-3z'/%3E%3Cpath d='M11.6 16.8a3 3 0 1 1-5.8-1.6'/%3E%3C/svg%3E")}
.p-tab[data-pane="cards"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M7 15h4M7 10h10'/%3E%3C/svg%3E")}
.p-tab[data-pane="log"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 6h13M8 12h13M8 18h13M3 6h.01M3 12h.01M3 18h.01'/%3E%3C/svg%3E")}
.p-tab[data-pane="refs"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.9M16 3.1a4 4 0 0 1 0 7.8'/%3E%3C/svg%3E")}
.p-tab[data-pane="pay"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 7V4a1 1 0 0 0-1-1H5a2 2 0 0 0 0 4h15a1 1 0 0 1 1 1v4h-3a2 2 0 0 0 0 4h3a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1'/%3E%3Cpath d='M3 5v14a2 2 0 0 0 2 2h15a1 1 0 0 0 1-1v-4'/%3E%3C/svg%3E")}
.p-tab[data-pane="pbot"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='8' width='16' height='12' rx='3'/%3E%3Cpath d='M12 8V5'/%3E%3Ccircle cx='12' cy='4' r='1'/%3E%3Cpath d='M9 13v1.5M15 13v1.5'/%3E%3Cpath d='M2 13v3M22 13v3'/%3E%3C/svg%3E")}
.p-tab[data-pane="autocmd"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='13' r='8'/%3E%3Cpath d='M12 9v4l2 2'/%3E%3Cpath d='M5 3 2 6M22 6l-3-3'/%3E%3C/svg%3E")}
.p-tab[data-pane="modmail"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12h-6l-2 3h-4l-2-3H2'/%3E%3Cpath d='M5.5 5.1 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.5-6.9A2 2 0 0 0 16.8 4H7.2a2 2 0 0 0-1.7 1.1z'/%3E%3C/svg%3E")}
.p-tab[data-pane="dmall"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m22 2-7 20-4-9-9-4Z'/%3E%3Cpath d='M22 2 11 13'/%3E%3C/svg%3E")}
.p-tab[data-pane="xsettings"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='4' y1='21' x2='4' y2='14'/%3E%3Cline x1='4' y1='10' x2='4' y2='3'/%3E%3Cline x1='12' y1='21' x2='12' y2='12'/%3E%3Cline x1='12' y1='8' x2='12' y2='3'/%3E%3Cline x1='20' y1='21' x2='20' y2='16'/%3E%3Cline x1='20' y1='12' x2='20' y2='3'/%3E%3Cline x1='1' y1='14' x2='7' y2='14'/%3E%3Cline x1='9' y1='8' x2='15' y2='8'/%3E%3Cline x1='17' y1='16' x2='23' y2='16'/%3E%3C/svg%3E")}

/* ---- Balance pill: the amount alone, the label is obvious ---- */
.bal-pill .muted{display:none}
.bal-pill{font-size:16px;padding:6px 16px}

/* ---- Type scale of the reference (Tailwind: base 16 / sm 14 / xs 12). The classic
   design runs on 15px with most secondary text at 12-13.5px, which reads small. ---- */
body{font-size:16px}
.sm,.muted.sm{font-size:14px}
.brand-sm{font-size:24px}
h1{font-size:28px}
h2{font-size:20px;font-weight:700;margin-bottom:12px}
.hint{font-size:15px}
table{font-size:14px}
th,td{padding:12px 16px}
th{font-size:12px}
.btn{font-size:15px;padding:11px 18px}
.btn.sm{font-size:14px;padding:8px 14px}
.btn-mini{font-size:14px;padding:7px 13px}
.xbtn{font-size:15px}
.chip{font-size:12.5px;padding:3px 10px}
.lang-switch button{font-size:13px;padding:4px 10px}
textarea,.alt-input,.myref-row input,.reflink-row input,.ilink-attach input,.plog-sel,.plog-inp,
.pe-field input[type=text],.pe-field textarea,.xbal-edit input,.xdm-row textarea{font-size:15px}
.ilink-url{font-size:15px}
.pcard .k{font-size:13px}
.pcard .n{font-size:13px}
.vcard-head{font-size:16px}
.vcard-meta{font-size:14px}
.vcard table{font-size:14px}
.vcard-members{font-size:13px}
.ah-sum-row{font-size:15px;padding:14px 18px}
.ah-kpi b{font-size:17px}
.pad-row{padding:14px 18px}
.pad-name{font-size:16px}
.pad-badge{font-size:12px}
.sw-btn{font-size:14px;padding:7px 14px 7px 9px}
.plog-row{padding:13px 16px}
.plog-title{font-size:15px}
.plog-sub,.plog-why{font-size:13.5px}
.plog-time{font-size:13px}
.plog-amt{font-size:15px}
.plog-tag{font-size:12px}
.ref-card{padding:16px 18px}
.pe-field>label,.ar-field{font-size:13px}
.view-banner{font-size:14.5px}
.toast{font-size:14.5px}
.nm-items a,.nm-items .nav-logout{font-size:15px}
.xbal-card .k{font-size:13px}

/* ---- Desktop: left sidebar + content column ----
   main.wrap only holds #p-cards, nav#p-tabs and the .p-pane blocks (one visible at a
   time), so: nav spans the left column, stat cards sit in row 1, the open pane in row 2. */
@media (min-width:901px){
  /* Full width, sidebar flush to the left edge and running the whole height. The
     column's glass fill and its slate-800 rule are painted on .wrap itself, so they
     reach the bottom however long the open pane is. */
  /* Right-column children are NOT pinned to a row: in admin view partner.js inserts
     #xp-edit and #xp-dm after #p-cards, and a fixed row stacked them on top of the
     open pane. They auto-flow one per row instead; the nav spans a generous run of
     rows, and with row-gap 0 and align-content:start the empty ones take no space. */
  .wrap{max-width:none;margin:0;padding:0;display:grid;grid-template-columns:240px minmax(0,1fr);
    grid-auto-rows:auto;align-content:start;column-gap:0;row-gap:0;align-items:start;min-height:calc(100vh - 72px);
    background:linear-gradient(to right,rgba(30,41,59,.7) 239px,#1e293b 239px,#1e293b 240px,transparent 240px)}
  .wrap>*{grid-column:2;min-width:0;padding-left:24px;padding-right:24px}
  .wrap>#p-cards{padding-top:24px}
  .wrap>.p-pane{padding-top:24px;padding-bottom:60px}
  .wrap>#p-tabs{grid-column:1;grid-row:1 / span 40;align-self:start;position:sticky;top:72px;
    flex-direction:column;flex-wrap:nowrap;gap:8px;padding:16px;background:transparent;border:0;border-radius:0}
  .wrap>#p-cards:empty{display:none}
  .p-pane{gap:24px}
  .p-tab{font-size:16px;padding:12px 16px}
  .p-tab::before{width:20px;height:20px}
  .pcard .v{font-size:30px}
}

/* ---- Tablet/phone: the section nav is an app-style bottom bar, always under the thumb ---- */
@media (max-width:900px){
  .topbar{padding:12px 16px}
  .wrap{padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))}
  #p-tabs{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;flex-wrap:nowrap;overflow:visible;gap:2px;margin:0;
    padding:6px 6px calc(6px + env(safe-area-inset-bottom,0px));background:rgba(15,23,42,.94);
    -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:0;border-top:1px solid #1e293b;border-radius:0}
  #p-tabs .p-tab{flex:1 1 0;min-width:0;flex-direction:column;justify-content:center;gap:4px;padding:7px 2px;min-height:54px;
    font-size:11.5px;line-height:1.1;font-weight:600;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-radius:10px}
  #p-tabs .p-tab::before{width:22px;height:22px}
  /* Stat cards and the admin boxes belong to the Overview; other sections open on their own content. */
  #app[data-pane]:not([data-pane="overview"]) #p-cards,
  #app[data-pane]:not([data-pane="overview"]) #xp-edit,
  #app[data-pane]:not([data-pane="overview"]) #xp-dm{display:none}
  .toast,body .vt-toast{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  .lang-switch button{min-height:32px}
}
@media (max-width:600px){
  .topbar{padding:10px 12px}
  .wrap{gap:20px}
  .pcards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .pcard{padding:12px 12px 12px 11px;border-left-width:3px}
  .pcard .k{font-size:11px;letter-spacing:.03em}
  .pcard .v{font-size:20px;margin-top:6px}
  .pcard .n{font-size:11.5px}
  #ilink-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:12px}
  .view-banner{font-size:12.5px;padding:7px 10px;line-height:1.45}
  /* journal: filters fold behind one button, two per row when open */
  .plog-toggle{display:flex}
  .plog-filters:not(.open){display:none}
  .plog-filters.open{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .plog-filters.open .plog-sel,.plog-filters.open .plog-inp{width:100%;min-width:0;flex:none}
  .plog-filters.open .plog-inp{grid-column:1 / -1}
}
@media (max-width:360px){
  #p-tabs .p-tab{font-size:10.5px}
  #p-tabs .p-tab::before{width:20px;height:20px}
}