/* ── CSS Variables (used by JS-generated HTML) ── */
:root {
  --orange:#FA8C16; --orange-1:#FFF7E6; --orange-3:#FFD591; --orange-5:#FFA940; --orange-7:#D46B08;
  --green:#52C41A;  --green-1:#F6FFED;  --green-3:#B7EB8F;  --green-7:#389E0D;
  --red:#FF4D4F;    --red-1:#FFF2F0;    --red-3:#FFCCC7;
  --gold:#B45309;   --gold-1:#FEFCE8;   --gold-3:#FDE68A;
  --blue:#1677FF;   --blue-1:#E6F4FF;   --blue-3:#91CAFF;
  --purple:#722ED1; --purple-1:#F9F0FF; --purple-3:#D3ADF7;
  --navi:#3D8B72;   --navi-1:#EAF4F0;   --navi-3:#8EC5B0;
  --indigo:#4F46E5; --indigo-1:#EEF2FF; --indigo-3:#C7D2FE; --indigo-7:#3730A3;
  /* backward-compat aliases */
  --violet:#FA8C16; --violet-dim:rgba(250,140,22,.1); --violet-light:#FFF7E6;
  --amber:#4F46E5;  --amber-light:#EEF2FF; --amber-dim:rgba(79,70,229,.1);
  --green-light:#F6FFED; --green-dim:rgba(82,196,26,.1);
  --red-light:#FFF2F0; --blue-light:#E6F4FF;
  /* neutrals */
  --bg:#F3F4F6; --surface:#fff;
  --border:#E5E7EB; --border-strong:#D1D5DB;
  --text-primary:rgba(0,0,0,.88); --text-secondary:rgba(0,0,0,.60);
  --text-muted:rgba(0,0,0,.40);   --text-disabled:rgba(0,0,0,.25);
  --radius-xs:3px; --radius-sm:6px; --radius:8px; --radius-lg:10px;
  --shadow-sm:0 1px 2px rgba(0,0,0,.05); --shadow:0 1px 4px rgba(0,0,0,.08); --shadow-md:0 4px 16px rgba(0,0,0,.08);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Inter',system-ui,sans-serif;background:var(--bg);color:var(--text-primary);-webkit-font-smoothing:antialiased;font-size:14px}

/* page visibility */
.page{display:none} .page.active{display:block}
.admin-section{display:none} .admin-section.active{display:block}
.hidden{display:none!important}

/* ── Money ── */
.money{font-variant-numeric:tabular-nums}

/* ── Utility classes — używać w JS templatach zamiast inline-style ── */
.u-flex-1         {flex:1}
.u-flex-1-min0    {flex:1;min-width:0}
.u-cursor-pointer {cursor:pointer}
.u-t-right        {text-align:right}
.u-t-center       {text-align:center}
.u-t-muted        {color:var(--text-muted)}
.u-t-secondary    {color:var(--text-secondary)}
.u-row-name       {font-weight:500;font-size:13px}
.u-meta-sm        {font-size:12px;color:var(--text-muted)}
.u-meta-xs        {font-size:11.5px;color:var(--text-muted)}
.u-num            {font-variant-numeric:tabular-nums}
.u-section-label  {font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);margin-bottom:8px}
.u-section-title  {font-weight:700;font-size:15px}
.u-pad-row        {padding:10px 16px}
.u-mb-8           {margin-bottom:8px}
.u-mb-12          {margin-bottom:12px}
.u-mt-8           {margin-top:8px}
.u-row-flex       {display:flex;align-items:center;gap:12px}
.u-row-flex-gap8  {display:flex;align-items:center;gap:8px}

/* ── Buttons ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:0 15px;height:32px;border-radius:var(--radius-sm);font-size:13.5px;font-weight:500;cursor:pointer;border:1px solid transparent;transition:all .15s;white-space:nowrap;font-family:inherit;user-select:none}
.btn-primary{background:var(--orange);color:#fff;border-color:var(--orange)}
.btn-primary:hover{background:var(--orange-5);border-color:var(--orange-5)}
.btn-secondary{background:#fff;color:var(--text-primary);border-color:var(--border-strong)}
.btn-secondary:hover{color:var(--orange);border-color:var(--orange)}
.btn-danger{background:#fff;color:var(--red);border-color:var(--red)}
.btn-danger:hover{background:var(--red-1)}
.btn-success{background:var(--green);color:#fff;border-color:var(--green)}
.btn-success:hover{filter:brightness(.92)}
.btn-ghost{background:transparent;color:var(--text-secondary);border-color:transparent}
.btn-ghost:hover{color:var(--orange);background:var(--orange-1)}
.btn-sm{height:26px;padding:0 10px;font-size:12px}
.btn-lg{height:42px;padding:0 24px;font-size:15px}
.btn:disabled{opacity:.4;pointer-events:none}

/* ── Badges ── */
.badge,.tag{display:inline-flex;align-items:center;padding:0 7px;height:20px;border-radius:4px;font-size:11px;font-weight:500;border:1px solid transparent;white-space:nowrap}
.badge-green,.tag-green{color:var(--green-7);background:var(--green-1);border-color:var(--green-3)}
.badge-gray,.tag-default{color:var(--text-secondary);background:#F3F4F6;border-color:var(--border-strong)}
.badge-amber,.tag-gold{color:var(--indigo-7);background:var(--indigo-1);border-color:var(--indigo-3)}
.badge-violet,.tag-orange{color:var(--orange-7);background:var(--orange-1);border-color:var(--orange-3)}
.badge-red,.tag-red{color:var(--red);background:var(--red-1);border-color:var(--red-3)}
.tag-blue{color:var(--blue);background:var(--blue-1);border-color:var(--blue-3)}
.tag-purple{color:var(--purple);background:var(--purple-1);border-color:var(--purple-3)}

/* ── Form inputs ── */
.form-group{margin-bottom:16px}
.form-label{display:block;font-size:13.5px;color:var(--text-primary);margin-bottom:7px;font-weight:500}
.form-input{width:100%;padding:5px 12px;height:34px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-size:13.5px;color:var(--text-primary);background:#fff;outline:none;transition:all .15s;font-family:inherit}
.form-input:hover{border-color:var(--orange)}
.form-input:focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(250,140,22,.12)}
.form-input::placeholder{color:var(--text-disabled)}
textarea.form-input{height:auto;padding:8px 12px;resize:vertical}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:24px}

/* ── Alerts ── */
.alert{padding:10px 14px;border-radius:var(--radius-sm);font-size:13px;line-height:1.55;border:1px solid transparent}
.alert-error{background:var(--red-1);color:#B91C1C;border-color:var(--red-3)}
.alert-success{background:var(--green-1);color:var(--green-7);border-color:var(--green-3)}
.alert-info{background:var(--blue-1);color:var(--blue);border-color:var(--blue-3)}
.alert-warning{background:var(--indigo-1);color:var(--indigo-7);border-color:var(--indigo-3)}

/* ── Cards ── */
.card{background:#fff;border-radius:var(--radius-lg);border:1px solid var(--border);box-shadow:var(--shadow-sm)}
.card-p{padding:20px 24px}

/* ── Tables ── */
.table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius-lg);background:#fff}
table{width:100%;border-collapse:collapse;font-size:13px}
thead th{background:#F9FAFB;color:var(--text-secondary);font-weight:500;font-size:12.5px;padding:10px 16px;text-align:left;border-bottom:1px solid var(--border);white-space:nowrap}
td{padding:11px 16px;border-bottom:1px solid var(--border);color:var(--text-primary);vertical-align:middle}
tr:last-child td{border-bottom:none}
tbody tr:hover td{background:#FAFAFA}

/* ── Progress ── */
.progress{height:5px;background:#F3F4F6;border-radius:100px;overflow:hidden}
.progress-fill{height:100%;background:var(--orange);border-radius:100px;transition:width .4s ease}
.progress-fill.over{background:var(--red)}
.divider{border:none;border-top:1px solid var(--border);margin:20px 0}

/* ── Stat cards (JS-generated) ── */
.stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin-bottom:20px}
.stat-card{background:#fff;border-radius:var(--radius-lg);border:1px solid var(--border);padding:18px 20px;border-top:3px solid var(--border-strong)}
.stat-card.orange{border-top-color:var(--orange)}
.stat-card.green{border-top-color:var(--green)}
.stat-card.amber{border-top-color:var(--indigo)}
.stat-card.violet{border-top-color:var(--orange)}
.stat-card.navi{border-top-color:var(--navi)}
.stat-label{font-size:12px;color:var(--text-secondary);margin-bottom:6px;font-weight:500}
.stat-value{font-size:22px;font-weight:700;letter-spacing:-.4px;color:var(--text-primary);margin-bottom:4px}
.stat-sub{font-size:12px;color:var(--text-muted)}

/* ── Employee financial rows (JS-generated) ── */
.emp-fin-row{display:flex;gap:10px;align-items:stretch;margin-bottom:10px}
.emp-fin-left{flex:3;min-width:0;background:#fff;border:1px solid var(--border);border-radius:14px;padding:18px 20px}
.emp-fin-right{flex:2;min-width:0;border-radius:14px;padding:18px 20px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}

/* ── Dashboard labels / pool split (JS-generated) ── */
.dash-section-label{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:5px 10px;border-radius:var(--radius-sm);display:inline-block;margin-bottom:14px}
.dash-section-label.raises{background:#FFF7E6;color:var(--orange-7);border:1px solid var(--orange-3)}
.dash-section-label.bonuses{background:var(--green-1);color:var(--green-7);border:1px solid var(--green-3)}
.dash-pool-split{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.dash-pool-block{border-radius:var(--radius);padding:16px;border:1px solid rgba(0,0,0,.06)}
.dash-pool-block-label{font-size:12px;font-weight:600;margin-bottom:6px}
.dash-pool-block-value{font-size:20px;font-weight:700;letter-spacing:-.3px;margin-bottom:2px}
.dash-pool-block-sub{font-size:12px;opacity:.7}

/* pools-grid (financial page, JS-generated) */
.pools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin-top:12px}
.pool-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;border-top:3px solid var(--orange)}
.pool-card.green{border-top-color:var(--green)}
.pool-label{font-size:11.5px;color:var(--text-secondary);margin-bottom:4px;font-weight:500}
.pool-value{font-size:18px;font-weight:700;color:var(--text-primary)}
.pool-sub{font-size:11px;color:var(--text-muted);margin-top:2px}

/* ── Voting page ── */
#vote-page{min-height:calc(100vh - 56px)}
.vote-closed,.vote-done{text-align:center;padding:80px 24px}
.vote-closed-icon,.vote-done-icon{font-size:48px;margin-bottom:16px}
.vote-closed h2,.vote-done h2{font-size:22px;font-weight:600;margin-bottom:8px}
.vote-closed p,.vote-done p{color:var(--text-secondary);font-size:14px;max-width:400px;margin:0 auto;line-height:1.6}

.vote-hero{text-align:center;padding:60px 24px 28px}
.vote-hero-tag{display:inline-flex;align-items:center;gap:5px;background:var(--orange-1);color:var(--orange-7);border:1px solid var(--orange-3);padding:0 12px;height:24px;border-radius:4px;font-size:12px;font-weight:500;margin-bottom:18px}
.vote-hero h1{font-size:26px;font-weight:700;letter-spacing:-.3px;margin-bottom:8px}
.vote-hero p{color:var(--text-secondary);font-size:14px;line-height:1.6}

.token-section{max-width:400px;margin:0 auto 40px}
.token-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow)}
.token-card h3{font-size:15px;font-weight:600;margin-bottom:4px}
.token-card p{font-size:13px;color:var(--text-secondary);margin-bottom:16px;line-height:1.5}
.token-input-row{display:flex;gap:8px}
.token-input{flex:1;padding:0 14px;height:42px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-size:18px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-family:'SF Mono','Fira Code',monospace;outline:none;transition:all .15s}
.token-input:focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(250,140,22,.12)}

.vote-grid-section{max-width:860px;margin:0 auto;padding:0 24px 100px}
.vote-grid-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.vote-grid-header h2{font-size:16px;font-weight:600;margin-bottom:4px}
.vote-grid-header p{font-size:13px;color:var(--text-secondary)}
.vote-counter{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex-shrink:0}
.counter-pips{display:flex;gap:5px}
.counter-pip{width:8px;height:8px;border-radius:50%;background:#E5E7EB;transition:background .2s}
.counter-pip.filled{background:var(--orange)}
.counter-label{font-size:12px;color:var(--text-muted);font-weight:500}
.employees-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}
.emp-card{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 8px;background:#fff;border:2px solid var(--border);border-radius:var(--radius-lg);cursor:pointer;user-select:none;transition:all .15s}
.emp-card:hover{border-color:var(--orange-3);background:var(--orange-1)}
.emp-card.selected{border-color:var(--orange);background:var(--orange-1)}
.emp-card.disabled{opacity:.4;pointer-events:none}
.emp-avatar{width:48px;height:48px;border-radius:50%;color:#fff;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;position:relative}
.emp-check{position:absolute;inset:0;background:rgba(0,0,0,.5);border-radius:50%;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .15s}
.emp-check svg{width:18px;height:18px}
.emp-card.selected .emp-check{opacity:1}
.emp-name{font-size:12px;font-weight:500;text-align:center;line-height:1.3;color:var(--text-primary)}
.vote-bar{position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid var(--border);padding:12px 24px;display:flex;align-items:center;justify-content:flex-end;gap:10px;z-index:50;box-shadow:0 -2px 12px rgba(0,0,0,.06)}
.vote-bar-hint{color:var(--text-muted);font-size:13px;margin-right:auto}

/* ── Admin layout ── */
.admin-layout{display:flex;min-height:calc(100vh - 56px)}
.admin-sidebar{width:220px;flex-shrink:0;background:#fff;border-right:1px solid var(--border);padding:10px 8px;position:sticky;top:56px;height:calc(100vh - 56px);overflow-y:auto;overflow-x:hidden;transition:width .22s ease}
.admin-sidebar.collapsed{width:52px}
.admin-sidebar.collapsed .sidebar-group-label,.admin-sidebar.collapsed .sidebar-item-label,.admin-sidebar.collapsed .sidebar-toggle-label{display:none!important}
.admin-sidebar.collapsed .sidebar-item{justify-content:center;padding:9px 0;gap:0}
.admin-sidebar.collapsed .sidebar-toggle-btn{justify-content:center;padding:8px 0}
.sidebar-group-label{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted);white-space:nowrap;flex:1}

/* Collapsible group toggle — wygląd jak sidebar-item, ale z chevronem po prawej */
.sidebar-group-toggle{display:flex;align-items:center;gap:9px;width:100%;padding:7px 10px;margin:14px 0 4px;background:none;border:none;cursor:pointer;font-family:inherit;text-align:left;border-radius:var(--radius-sm);transition:background .12s}
.sidebar-group-toggle:hover{background:#F3F4F6}
.sidebar-group-toggle:hover .sidebar-group-label{color:var(--text-secondary)}
.sidebar-group-toggle:first-of-type{margin-top:6px}
.sidebar-group-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:16px;height:16px;color:var(--text-muted)}
.sidebar-group-arrow{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:14px;height:14px;color:var(--text-muted);transition:transform .18s ease}
.sidebar-group-toggle.collapsed .sidebar-group-arrow{transform:rotate(-90deg)}

/* Group container + items wewnątrz są wcięte i mają pionową linię prowadzącą */
.sidebar-group{display:flex;flex-direction:column;gap:0;position:relative;padding-left:14px;margin-left:11px}
.sidebar-group::before{content:'';position:absolute;left:0;top:2px;bottom:2px;width:1.5px;background:var(--border);border-radius:1px}
.sidebar-group .sidebar-item{padding-left:8px}
.sidebar-group .sidebar-item .sidebar-icon{width:14px;height:14px}
.sidebar-group.collapsed{display:none}

/* Bottom-fixed sekcja System */
.sidebar-bottom{margin-top:auto;padding-top:8px}
.sidebar-bottom .sidebar-divider{margin:6px 0 8px}

/* Sidebar musi być flex-column żeby margin-top:auto działał */
.admin-sidebar{display:flex;flex-direction:column}

/* W trybie collapsed: ukryj kompletnie group-toggle (są niesensownie nieklikalne
 * w tym widoku, mylą użytkownika) i wymuś display:flex na items wszystkich grup.
 * Zostaje cienki divider między grupami — patrz reguły niżej. */
.admin-sidebar.collapsed .sidebar-group-toggle{display:none !important}
.admin-sidebar.collapsed .sidebar-group{padding-left:0;margin-left:0}
.admin-sidebar.collapsed .sidebar-group::before{display:none}
.admin-sidebar.collapsed .sidebar-group .sidebar-item{padding-left:0;justify-content:center}
.admin-sidebar.collapsed .sidebar-group{display:flex !important;flex-direction:column}
.admin-sidebar.collapsed .sidebar-group.collapsed{display:flex !important}
/* Divider przed każdą grupą — zachowuje wizualne pogrupowanie items bez headerów */
.admin-sidebar.collapsed .sidebar-group{margin-top:8px;padding-top:8px;border-top:1px solid var(--border)}
.sidebar-item{width:100%;display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:var(--radius-sm);font-size:13.5px;color:var(--text-secondary);font-weight:500;background:none;border:none;cursor:pointer;text-align:left;transition:all .12s;font-family:inherit}
.sidebar-item:hover{background:#F3F4F6;color:var(--text-primary)}
.sidebar-item.active{background:var(--orange-1);color:var(--orange-7);font-weight:600}
.sidebar-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:16px;height:16px}
.sidebar-item-label{white-space:nowrap;overflow:hidden}
.sidebar-toggle-btn{width:100%;display:flex;align-items:center;gap:7px;padding:6px 10px;border-radius:var(--radius-sm);background:none;border:none;cursor:pointer;color:var(--text-muted);font-size:12.5px;font-family:inherit;transition:all .12s;white-space:nowrap}
.sidebar-toggle-btn:hover{background:#F3F4F6;color:var(--text-primary)}
.sidebar-divider{border:none;border-top:1px solid var(--border);margin:8px 0}
.admin-content{flex:1;padding:28px 32px;min-width:0}

/* ── Section headers ── */
.section-title{font-size:18px;font-weight:700;letter-spacing:-.2px;margin-bottom:4px}
.section-subtitle{font-size:13.5px;color:var(--text-secondary);margin-bottom:20px}
.section-header-row{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:20px}

/* ── Tabs ── */
.tabs{display:flex;border-bottom:1px solid var(--border);margin-bottom:20px}
.tab-btn{padding:8px 18px;background:none;border:none;border-bottom:2px solid transparent;font-size:13.5px;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .15s;font-family:inherit;margin-bottom:-1px}
.tab-btn:hover{color:var(--text-primary)}
.tab-btn.active{color:var(--orange);border-bottom-color:var(--orange)}

/* ── Voting status card ── */
/* ── Vacation filter — tab strip ── */
.vac-tab-strip{display:flex;border-bottom:1.5px solid var(--border);margin-bottom:14px;gap:2px}
.vac-tab{padding:8px 16px 9px;font-size:13px;font-weight:500;color:var(--text-secondary);background:transparent;border:none;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1.5px;transition:color .12s,border-color .12s;white-space:nowrap;display:flex;align-items:center;gap:6px}
.vac-tab:hover{color:var(--text-primary)}
.vac-tab.active{color:var(--text-primary);border-bottom-color:var(--text-primary);font-weight:600}
.vac-tab-badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:18px;padding:0 5px;border-radius:9px;font-size:11px;font-weight:600;background:#E9ECEF;color:var(--text-secondary)}
.vac-tab-badge.bp{background:#FFF7E6;color:#D46B08}
.vac-tab-badge.ba{background:#F6FFED;color:#389E0D}
.vac-tab-badge.br{background:#FFF1F0;color:#CF1322}
/* ── Saved views bar ── */
.vac-views-bar{display:flex;align-items:center;gap:8px;margin-bottom:14px;padding:6px 0;flex-wrap:wrap}
.vac-views-label{font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);margin-right:2px}
.vac-views-list{display:flex;gap:4px;flex-wrap:wrap}
.vac-view-tab{display:inline-flex;align-items:center;gap:6px;padding:5px 10px 5px 12px;background:#F3F4F6;border:1px solid transparent;border-radius:6px;font-size:12.5px;color:var(--text-secondary);cursor:pointer;transition:all .12s;white-space:nowrap;font-family:inherit}
.vac-view-tab:hover{background:#fff;border-color:var(--border-strong);color:var(--text-primary)}
.vac-view-tab.active{background:#fff;border-color:var(--orange);color:var(--orange-7);font-weight:500;box-shadow:0 1px 3px rgba(250,140,22,.15)}
.vac-view-tab.builtin{background:transparent;border:1px dashed var(--border-strong)}
.vac-view-tab.builtin.active{background:#fff;border:1px solid var(--orange)}
.vac-view-menu-btn{background:none;border:none;color:var(--text-muted);cursor:pointer;padding:0;font-size:14px;line-height:1;opacity:.6;font-family:inherit}
.vac-view-menu-btn:hover{opacity:1;color:var(--text-primary)}
.vac-view-add{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;background:transparent;border:1px dashed var(--border-strong);border-radius:6px;cursor:pointer;color:var(--text-muted);font-size:16px;line-height:1;font-family:inherit;transition:all .12s}
.vac-view-add:hover{border-color:var(--orange);color:var(--orange);background:var(--orange-1)}
/* ── View context menu ── */
.vac-view-menu{position:absolute;background:#fff;border:1px solid var(--border);border-radius:8px;box-shadow:0 4px 16px rgba(0,0,0,.1);padding:4px;min-width:140px;z-index:100}
.vac-view-menu button{display:block;width:100%;padding:7px 12px;border:none;background:none;text-align:left;font-size:12.5px;color:var(--text-primary);cursor:pointer;border-radius:4px;font-family:inherit}
.vac-view-menu button:hover{background:#F3F4F6}
.vac-view-menu button.danger{color:var(--red)}
.vac-view-menu button.danger:hover{background:var(--red-1)}

/* ── Vacation filter strip — z labelami ── */
.vac-filter-strip{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-bottom:14px;padding:10px 12px;background:#FAFAFA;border:1px solid var(--border);border-radius:8px}
.vac-filter-field{display:flex;flex-direction:column;gap:3px;min-width:0}
.vac-filter-label{font-size:10.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted);white-space:nowrap}
.vac-filter-input{height:30px;font-size:12.5px;padding:3px 8px;background:#fff}
.vac-filter-input::placeholder{color:var(--text-disabled);font-size:12px}
.vac-filter-field select.vac-filter-input{width:160px}
.vac-search-wrap{position:relative;min-width:180px}
.vac-search-wrap input{padding-left:30px}
.vac-search-wrap svg{position:absolute;left:9px;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none}

/* ── Sort button + menu ── */
.vac-sort-btn{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;background:#fff;border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-size:12.5px;color:var(--text-primary);cursor:pointer;font-family:inherit;white-space:nowrap;transition:border-color .12s}
.vac-sort-btn:hover{border-color:var(--orange)}
.vac-sort-menu{position:absolute;background:#fff;border:1px solid var(--border);border-radius:8px;box-shadow:0 4px 16px rgba(0,0,0,.1);padding:4px;min-width:170px;z-index:100}
.vac-sort-menu-title{font-size:10.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted);padding:6px 10px 4px}
.vac-sort-opt{display:flex;align-items:center;justify-content:space-between;width:100%;padding:7px 10px;border:none;background:none;text-align:left;font-size:12.5px;color:var(--text-primary);cursor:pointer;border-radius:4px;font-family:inherit}
.vac-sort-opt:hover{background:#F3F4F6}
.vac-sort-opt.active{background:var(--orange-1);color:var(--orange-7);font-weight:500}
.vac-sort-opt.active::after{content:attr(data-dir);font-size:11px;opacity:.8}

/* ── Sortable column headers ── */
.vac-sort-th{cursor:pointer;user-select:none;white-space:nowrap}
.vac-sort-th:hover{background:#F3F4F6}
.vac-sort-icon{font-size:10px;color:var(--text-muted);margin-left:3px;opacity:.6}
/* List dots removed — informacja statusowa pojawia się jako tekst w meta. */

/* Ukryj wszystko związane z % udziałów dla org_admin (klasa role-org-admin na body) */
body.role-org-admin .col-ownership { display: none !important; }
/* ── */
.voting-status-card{border-radius:var(--radius-lg);padding:20px 24px;border:1px solid var(--border);margin-bottom:16px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.voting-status-card.open{background:var(--green-1);border-color:var(--green-3)}
.voting-status-card.closed{background:#F9FAFB}
.voting-status-pill{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.voting-dot{width:7px;height:7px;border-radius:50%;background:var(--text-muted)}
.voting-status-card.open .voting-dot{background:var(--green)}
.voting-status-title{font-size:15px;font-weight:600;flex:1}

/* ── Token/record list (JS-generated) ── */
.record-list{list-style:none;display:flex;flex-direction:column;border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;background:#fff;counter-reset:list-num}
.record-item{display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:1px solid var(--border);font-size:13px;counter-increment:list-num}
.record-item:last-child{border-bottom:none}
.record-item.voted{background:var(--green-1)}
.record-item::before{content:counter(list-num) ".";color:var(--text-muted);font-weight:500;font-size:12px;min-width:22px;text-align:right;flex-shrink:0;font-variant-numeric:tabular-nums}
.record-name{font-weight:500;flex:1}
.record-meta{display:flex;align-items:center;gap:10px}
.token-code{font-family:'SF Mono','Fira Code',monospace;font-size:13px;font-weight:700;letter-spacing:.1em;background:#F3F4F6;padding:2px 8px;border-radius:4px;color:var(--text-primary)}
.token-voted-label{font-size:12px;color:var(--green-7);font-weight:500}

/* ── Management (JS-generated) ── */
.mgmt-budget-bar{height:5px;background:#F3F4F6;border-radius:100px;overflow:hidden;margin:8px 0}
.mgmt-budget-fill{height:100%;background:var(--orange);border-radius:100px;transition:width .4s ease}
.mgmt-budget-fill.over{background:var(--red)}
.mgmt-input{width:160px!important;text-align:right}
.mgmt-monthly{font-size:12px;color:var(--text-muted);min-width:90px;text-align:right}

/* ── Financial pools — kompaktowa lista (zamiast 4 wielkich kart) ─────── */
.fin-pool-block{background:#fff;border:1px solid var(--border);border-radius:10px;margin-bottom:14px;overflow:hidden}
.fin-pool-block-head{padding:10px 14px;background:#FAFAFA;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.fin-pool-row{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--border);font-size:13px}
.fin-pool-row:last-child{border-bottom:none}
.fin-pool-row.total{background:#FFF7E6;font-weight:600}
.fin-pool-label{display:flex;align-items:center;gap:8px;color:var(--text-primary)}
.fin-pool-bullet{width:8px;height:8px;border-radius:50%;flex-shrink:0;display:inline-block}
.fin-pool-amount{font-weight:700;font-size:14px;font-variant-numeric:tabular-nums;text-align:right;min-width:90px}
.fin-pool-monthly{font-size:11.5px;color:var(--text-muted);text-align:right;min-width:110px}

/* ── Dashboard (kokpit firmy, skalowalny pod kolejne moduły) ──────────── */
.dash-alerts{display:flex;flex-direction:column;gap:8px;margin-bottom:24px}
.dash-alert{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:10px;border:1px solid transparent;font-size:13px}
.dash-alert-icon{font-size:14px;flex-shrink:0;line-height:1}
.dash-alert-text{flex:1;line-height:1.4;color:var(--text-primary)}
.dash-alert-cta{flex-shrink:0;background:transparent;border:none;font-size:12.5px;font-weight:600;cursor:pointer;font-family:inherit;padding:4px 8px;border-radius:6px;transition:background .12s;white-space:nowrap}
.dash-alert-cta:hover{background:rgba(0,0,0,.06)}
.dash-alert-warning{background:#FFFBEB;border-color:#FDE68A}
.dash-alert-warning .dash-alert-cta{color:#92400E}
.dash-alert-info{background:var(--blue-1);border-color:var(--blue-3)}
.dash-alert-info .dash-alert-cta{color:var(--blue)}
.dash-section{margin-bottom:28px}
.dash-section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:8px}
.dash-section-title{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-primary)}
.dash-section-link{font-size:12.5px;color:var(--orange-7);cursor:pointer;font-weight:500;text-decoration:none}
.dash-section-link:hover{color:var(--orange);text-decoration:underline}
.dash-kpi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.dash-kpi{background:#fff;border:1px solid var(--border);border-radius:10px;padding:14px 16px;transition:all .12s}
.dash-kpi[onclick]:hover{border-color:var(--orange-3);box-shadow:0 2px 8px rgba(250,140,22,.08)}
.dash-kpi.disabled{background:#FAFAFA;opacity:.7}
.dash-kpi-label{font-size:11.5px;color:var(--text-secondary);margin-bottom:6px;font-weight:500}
.dash-kpi-value{font-size:22px;font-weight:700;letter-spacing:-.3px;color:var(--text-primary);margin-bottom:3px;font-variant-numeric:tabular-nums}
.dash-kpi-sub{font-size:11.5px;color:var(--text-muted)}

/* ── Settings template (skalowalne dla wszystkich modułów) ─────────────── */
.settings-page{max-width:680px;display:flex;flex-direction:column;gap:18px}
.settings-subtabs{display:flex;gap:2px;border-bottom:1px solid var(--border);margin-bottom:6px}
.settings-subtab{padding:8px 16px 9px;font-size:13px;font-weight:500;color:var(--text-secondary);background:transparent;border:none;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .12s,border-color .12s;font-family:inherit}
.settings-subtab:hover{color:var(--text-primary)}
.settings-subtab.active{color:var(--text-primary);border-bottom-color:var(--orange);font-weight:600}
.settings-section-label{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);margin:8px 0 -4px}
.setting-card{background:#fff;border:1px solid var(--border);border-radius:10px;overflow:hidden;display:flex;flex-direction:column}
.setting-card.disabled{background:#FAFAFA}
.setting-card-header{padding:14px 16px;display:flex;align-items:flex-start;gap:12px;border-bottom:1px solid var(--border)}
.setting-card.disabled .setting-card-header{border-bottom:none}
.setting-card-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.setting-card-meta{flex:1;min-width:0}
.setting-card-title{font-weight:600;font-size:13.5px;color:var(--text-primary);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.setting-card-desc{font-size:12px;color:var(--text-muted);margin-top:2px;line-height:1.45}
.setting-card-status{font-size:11.5px;color:var(--text-muted);font-variant-numeric:tabular-nums;flex-shrink:0;transition:opacity .2s;opacity:0;white-space:nowrap}
.setting-card-status.visible{opacity:1}
.setting-card-status.saved{color:var(--green-7)}
.setting-card-status.error{color:var(--red)}
.setting-card-body{padding:14px 16px;display:flex;flex-direction:column;gap:8px}
.setting-card-body.row{flex-direction:row;align-items:center;gap:12px}
.setting-badge{font-size:10.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;padding:2px 8px;border-radius:4px;flex-shrink:0;line-height:1.4}
.setting-badge.coming{background:#F3F4F6;color:var(--text-muted)}
.setting-badge.beta{background:var(--blue-1);color:var(--blue);border:1px solid var(--blue-3)}
.setting-badge.new{background:var(--orange-1);color:var(--orange-7);border:1px solid var(--orange-3)}
.setting-badge.system{background:var(--red-1);color:var(--red);border:1px solid var(--red-3)}
/* Radio choice cards */
.setting-radio-opt{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border:1.5px solid var(--border);border-radius:8px;cursor:pointer;transition:all .12s;background:#fff}
.setting-radio-opt:hover{border-color:var(--orange-3);background:var(--orange-1)}
.setting-radio-opt.selected{border-color:var(--orange);background:var(--orange-1)}
.setting-radio-dot{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--border-strong);flex-shrink:0;margin-top:2px;display:flex;align-items:center;justify-content:center;background:#fff;transition:all .12s}
.setting-radio-opt.selected .setting-radio-dot{border-color:var(--orange);background:var(--orange)}
.setting-radio-opt.selected .setting-radio-dot::after{content:'';width:6px;height:6px;border-radius:50%;background:#fff}
.setting-radio-meta{flex:1;min-width:0}
.setting-radio-label{font-weight:500;font-size:13px;color:var(--text-primary);display:flex;align-items:center;gap:8px}
.setting-radio-desc{font-size:12px;color:var(--text-muted);margin-top:2px;line-height:1.4}
/* Number with unit */
.setting-number-input{width:90px;font-size:18px;font-weight:700;text-align:center;height:40px}
.setting-unit-label{font-size:13.5px;color:var(--text-secondary);font-weight:500}

/* ── Command palette (Cmd+K / Ctrl+K) ────────────────────────────────────── */
.cmdk-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:2500;display:flex;align-items:flex-start;justify-content:center;padding-top:14vh;backdrop-filter:blur(2px)}
.cmdk-box{background:#fff;border-radius:12px;width:100%;max-width:560px;box-shadow:0 24px 60px rgba(0,0,0,.25);animation:modalIn .15s ease;overflow:hidden;display:flex;flex-direction:column;max-height:70vh}
.cmdk-input-wrap{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--border)}
.cmdk-input-wrap svg{color:var(--text-muted);flex-shrink:0}
.cmdk-input{flex:1;border:none;outline:none;font-size:15px;color:var(--text-primary);font-family:inherit;background:transparent}
.cmdk-input::placeholder{color:var(--text-disabled)}
.cmdk-kbd{font-size:10px;color:var(--text-muted);font-family:'SF Mono','Fira Code',monospace;background:#F3F4F6;padding:2px 6px;border-radius:4px;border:1px solid var(--border)}
.cmdk-list{overflow-y:auto;flex:1;padding:4px}
.cmdk-empty{padding:32px 18px;text-align:center;color:var(--text-muted);font-size:13px}
.cmdk-section{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);padding:10px 14px 6px}
.cmdk-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;cursor:pointer;font-size:13.5px;color:var(--text-primary)}
.cmdk-item:hover, .cmdk-item.cmdk-active{background:var(--orange-1)}
.cmdk-item.cmdk-active{color:var(--orange-7)}
.cmdk-item-icon{flex-shrink:0;width:16px;height:16px;color:var(--text-muted);display:flex;align-items:center;justify-content:center}
.cmdk-item.cmdk-active .cmdk-item-icon{color:var(--orange-7)}
.cmdk-item-name{flex:1}
.cmdk-item-group{font-size:11px;color:var(--text-muted)}
.cmdk-footer{padding:8px 14px;border-top:1px solid var(--border);display:flex;gap:14px;font-size:11px;color:var(--text-muted)}

/* ── Modal ── */
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;z-index:1000;backdrop-filter:blur(2px)}
.modal-box{background:#fff;border-radius:12px;padding:28px;max-width:460px;width:calc(100% - 40px);box-shadow:0 8px 40px rgba(0,0,0,.15);animation:modalIn .18s ease}
.modal-box.wide{max-width:660px}
@keyframes modalIn{from{opacity:0;transform:scale(.97) translateY(6px)}to{opacity:1;transform:none}}
.modal-title{font-size:16px;font-weight:700;margin-bottom:4px}
.modal-subtitle{font-size:13px;color:var(--text-secondary);margin-bottom:20px;line-height:1.55}
.modal-footer{display:flex;gap:8px;margin-top:20px;justify-content:flex-end}

/* ── Employee SaaS layout ── */
.emp-layout{display:flex;min-height:calc(100vh - 56px)}
.emp-sidebar{width:220px;flex-shrink:0;background:#fff;border-right:1px solid var(--border);padding:10px 8px;position:sticky;top:56px;height:calc(100vh - 56px);overflow-y:auto;overflow-x:hidden;transition:width .22s ease}
.emp-sidebar.collapsed{width:52px}
.emp-sidebar.collapsed .sidebar-group-label,.emp-sidebar.collapsed .sidebar-item-label,.emp-sidebar.collapsed .sidebar-toggle-label{display:none!important}
.emp-sidebar.collapsed .sidebar-item{justify-content:center;padding:9px 0;gap:0}
.emp-sidebar.collapsed .sidebar-toggle-btn{justify-content:center;padding:8px 0}
.emp-content-wrap{flex:1;min-width:0;display:flex;flex-direction:column}
.emp-topbar{display:flex;align-items:center;padding:0 24px;height:52px;border-bottom:1px solid var(--border);background:#fff;flex-shrink:0;gap:16px;position:sticky;top:56px;z-index:10}
.emp-topbar-title{font-size:15px;font-weight:600;color:var(--text-primary);flex:1}
.emp-topbar-user{display:flex;align-items:center;gap:10px;flex-shrink:0}
.emp-topbar-info{display:flex;flex-direction:column;align-items:flex-end}
.emp-topbar-name{font-size:13px;font-weight:600;color:var(--text-primary);line-height:1.2}
.emp-topbar-subtitle{font-size:11px;color:var(--text-secondary);line-height:1.3;margin-top:1px}
.emp-topbar-avatar{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:white;flex-shrink:0;box-shadow:0 2px 8px rgba(0,0,0,.14)}
.emp-main{flex:1;padding:20px 28px 40px}

/* ── Pulsująca ikona głosowania ── */
@keyframes vote-ring{
  0%{box-shadow:0 0 0 0 rgba(250,140,22,.55)}
  70%{box-shadow:0 0 0 7px rgba(250,140,22,.0)}
  100%{box-shadow:0 0 0 0 rgba(250,140,22,.0)}
}
.vote-notify.sidebar-item{color:var(--orange-7)!important}
.vote-notify .sidebar-icon{background:var(--orange-1);border-radius:5px;animation:vote-ring 2s ease-out infinite}

/* ── Employee bottom nav ── */
.emp-bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;height:58px;background:#fff;border-top:1px solid var(--border);z-index:100;box-shadow:0 -2px 12px rgba(0,0,0,.06)}
.emp-nav-tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:10.5px;font-weight:500;color:var(--text-muted);background:none;border:none;cursor:pointer;font-family:inherit;transition:color .15s;position:relative;padding-bottom:4px}
.emp-nav-tab.active{color:var(--orange)}
.emp-nav-tab svg{width:20px;height:20px;flex-shrink:0}
.emp-nav-tab .nav-pulse-dot{position:absolute;top:8px;right:calc(50% - 18px);width:8px;height:8px;border-radius:50%;background:var(--orange);border:2px solid #fff;display:none}
.emp-nav-tab.vote-notify .nav-pulse-dot{display:block;animation:vote-ring 2s ease-out infinite}

/* ── Waste Radar pulse ── */
@keyframes waste-pulse{
  0%{box-shadow:0 0 0 0 rgba(250,140,22,.6)}
  70%{box-shadow:0 0 0 6px rgba(250,140,22,0)}
  100%{box-shadow:0 0 0 0 rgba(250,140,22,0)}
}

/* ── Admin drawer overlay ── */
.admin-drawer-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:149}
.admin-drawer-overlay.visible{display:block}
#btn-admin-hamburger{display:none;align-items:center;justify-content:center;width:36px;height:36px;padding:0;flex-shrink:0}
.header-page-title-wrap{display:flex}
@media(max-width:768px){.header-logos-wrap{opacity:.55!important}}

/* ── Responsive ── */
@media(max-width:768px){
  /* ── Header ── */
  #btn-admin-hamburger{display:flex}
  .header-page-title-wrap{display:none}

  /* ── Admin: sidebar staje się szufladą ── */
  .admin-sidebar{
    position:fixed!important;
    top:0;left:-265px;bottom:0;
    width:250px!important;
    height:100dvh!important;
    z-index:150;
    transition:left .25s ease!important;
    padding-top:56px;
    overflow-y:auto;
  }
  .admin-sidebar.collapsed{width:250px!important;left:-265px!important}
  .admin-sidebar.collapsed .sidebar-group-label,
  .admin-sidebar.collapsed .sidebar-item-label,
  .admin-sidebar.collapsed .sidebar-toggle-label{display:block!important}
  .admin-sidebar.collapsed .sidebar-item{justify-content:flex-start!important;padding:7px 10px!important;gap:9px!important}
  .admin-sidebar.collapsed .sidebar-toggle-btn{justify-content:flex-start!important;padding:6px 10px!important}
  .admin-sidebar.mobile-open{left:0!important;box-shadow:4px 0 24px rgba(0,0,0,.15)}
  .admin-layout{display:block}
  .admin-content{padding:16px}

  /* ── Employee: sidebar → bottom nav ── */
  .emp-layout{display:block}
  .emp-sidebar{display:none!important}
  .emp-bottom-nav:not(.hidden){display:flex!important}
  .emp-main{padding:14px 16px 72px}
  .emp-content-wrap{display:block}

  /* ── Formularze i siatki ── */
  .form-row{grid-template-columns:1fr}
  .stats-grid{grid-template-columns:1fr 1fr}
  .section-header-row{gap:12px}
  .section-header-row > div:last-child{flex-wrap:wrap}

  /* ── Modalne ── */
  .modal-box{width:calc(100% - 32px);max-width:none;margin:0 16px}

  /* ── Header user menu: ukryj imię na bardzo małych ekranach ── */
  #header-user-name{display:none}

  /* ── Karty finansowe pracownika: stack pionowy ── */
  .emp-fin-row{flex-direction:column}
  .emp-fin-right{min-height:120px}
}

@media(max-width:480px){
  .stats-grid{grid-template-columns:1fr}
  .counter-pips{gap:4px}
  .employees-grid{grid-template-columns:repeat(auto-fill,minmax(90px,1fr))}
  .admin-content{padding:12px}
  .emp-main{padding:10px 12px 72px}

  /* ── OTP login — pola mieszczą się w karcie ── */
  #otp-card{padding:20px 16px!important}
  #otp-boxes{gap:5px!important}
}

/* ─── Component classes (zastępują powtarzające się inline-style) ──────── */
/* Idea: zamiast 30× powielać `style="background:#fff;border:1px solid var(--border);
 * border-radius:12px;padding:14px 16px"` używamy `.card`. Zmiana koloru = 1 miejsce. */

.card{background:#fff;border:1px solid var(--border);border-radius:12px;padding:14px 16px}
.card-sm{background:#fff;border:1px solid var(--border);border-radius:10px;padding:10px 12px}
.card-elevated{background:#fff;border:1px solid var(--border);border-radius:12px;padding:14px 16px;box-shadow:var(--shadow-sm)}

/* Pasek nagłówka sekcji w modułach: tytuł + sub + akcje po prawej */
.section-header-row{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:14px}

/* Empty state: dashed border, text-muted, ikona/tytuł/sub */
.empty-state{
  text-align:center;padding:32px 24px;background:#FAFAFA;
  border:1.5px dashed var(--border-strong);border-radius:12px;
}
.empty-state__icon{font-size:28px;margin-bottom:8px}
.empty-state__title{font-size:13px;color:var(--text-secondary);margin-bottom:4px;font-weight:500}
.empty-state__sub{font-size:12px;color:var(--text-muted);max-width:320px;margin:0 auto;line-height:1.5}

/* KPI cards (label + value + sub) — używane w dashboardach */
.kpi{display:flex;flex-direction:column;min-width:120px}
.kpi__label{font-size:10.5px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}
.kpi__value{font-size:24px;font-weight:800;line-height:1.05;letter-spacing:-.5px}
.kpi__value--red{color:var(--red)}
.kpi__value--green{color:var(--green-7)}
.kpi__value--orange{color:var(--orange-7)}
.kpi__sub{font-size:11.5px;color:var(--text-muted);margin-top:3px}

/* Pill / chip — krótkie statusowe etykiety (np. role, kategorie) */
.chip{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:6px;font-size:11px;font-weight:600;line-height:1.4}
.chip--blue   { background:var(--blue-1);    color:var(--blue) }
.chip--green  { background:var(--green-1);   color:var(--green-7) }
.chip--orange { background:var(--orange-1);  color:var(--orange-7) }
.chip--red    { background:#FEF2F2;          color:#B91C1C }
.chip--purple { background:var(--purple-1);  color:var(--purple) }
.chip--gray   { background:#F3F4F6;          color:var(--text-muted) }

/* Status badge — zaokrąglone, kontrastowe (statusy zgłoszeń, urlopów itp.) */
.status-badge{display:inline-block;padding:2px 10px;border-radius:20px;font-size:11px;font-weight:600;border:1px solid transparent}
.status-badge--pending     { background:#FFF7E6; border-color:#FFD591; color:#D46B08 }
.status-badge--approved    { background:#EEF2FF; border-color:#C7D2FE; color:#3730A3 }
.status-badge--rejected    { background:#FEF2F2; border-color:#FECACA; color:#B91C1C }
.status-badge--in_progress { background:#EFF6FF; border-color:#BFDBFE; color:#1D4ED8 }
.status-badge--resolved    { background:#F0FDF4; border-color:#BBF7D0; color:#15803D }
.status-badge--active      { background:#FEF3C7; border-color:#FCD34D; color:#92400E }

/* Utility classes (mała biblioteka — nie pełen Tailwind) */
.u-flex          { display:flex }
.u-flex-col      { display:flex;flex-direction:column }
.u-flex-1        { flex:1;min-width:0 }
.u-items-center  { align-items:center }
.u-justify-between{justify-content:space-between}
.u-gap-1         { gap:4px }
.u-gap-2         { gap:8px }
.u-gap-3         { gap:12px }
.u-gap-4         { gap:16px }
.u-mt-1          { margin-top:4px }
.u-mt-2          { margin-top:8px }
.u-mt-3          { margin-top:12px }
.u-mt-4          { margin-top:16px }
.u-mb-2          { margin-bottom:8px }
.u-mb-3          { margin-bottom:12px }
.u-text-muted    { color:var(--text-muted) }
.u-text-secondary{ color:var(--text-secondary) }
.u-text-sm       { font-size:12px }
.u-text-xs       { font-size:11px }
.u-font-semibold { font-weight:600 }
.u-font-bold     { font-weight:700 }
.u-tabular       { font-variant-numeric:tabular-nums }
.u-truncate      { white-space:nowrap;overflow:hidden;text-overflow:ellipsis }

/* ─── Lunch (employee) — kompaktowe items per dzień ─────────────────────── */
.emp-lunch-items-wrap > button:last-child{border-bottom:none !important}

/* Lunch calendar: zapobiegaj rozpychaniu kolumn przez długie nazwy potraw */
.lunch-cell{min-width:0;overflow:hidden}
.lunch-cell *{min-width:0}
.lunch-week-row > *{min-width:0}

/* Mobile (< 600px): mniejsze cells + węższa kolumna numeru tygodnia */
@media (max-width:600px){
  .lunch-week-row{grid-template-columns:30px repeat(5,minmax(0,1fr)) !important;gap:3px !important}
  .lunch-cell{padding:5px 6px !important;min-height:54px !important}
  .lunch-cell .lunch-cell__name{font-size:9.5px !important}
  /* Nagłówek dni tygodnia + grid-template-columns dla pierwszej linii ("Tydz.") */
  .lunch-dow-header{grid-template-columns:30px repeat(5,minmax(0,1fr)) !important;gap:3px !important}
  .lunch-dow-header > *{font-size:9px !important;padding:2px 3px !important}
}

/* ─── Bottom sheet "Więcej" (mobile employee nav overflow) ─────────────── */
.emp-more-backdrop{
  position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:1200;
  display:flex;align-items:flex-end;justify-content:center;
  backdrop-filter:blur(2px);
  animation:fadeIn .15s ease;
}
.emp-more-backdrop.hidden{display:none}
.emp-more-sheet{
  width:100%;max-width:520px;
  background:#fff;border-radius:16px 16px 0 0;
  padding:8px 16px 24px;
  box-shadow:0 -4px 24px rgba(0,0,0,.12);
  animation:sheetUp .22s cubic-bezier(.2,.9,.3,1);
}
@keyframes sheetUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.emp-more-handle{
  width:36px;height:4px;background:#D1D5DB;border-radius:2px;
  margin:0 auto 12px;
}
.emp-more-title{
  font-size:12px;font-weight:700;color:var(--text-muted);
  text-transform:uppercase;letter-spacing:.06em;
  padding:0 4px 8px;border-bottom:1px solid var(--border);margin-bottom:6px;
}
.emp-more-list{display:flex;flex-direction:column;gap:2px;margin-bottom:10px}
.emp-more-item{
  display:flex;align-items:center;gap:12px;
  width:100%;background:#fff;border:none;border-radius:10px;
  padding:12px 12px;cursor:pointer;font-family:inherit;text-align:left;
  transition:background .12s ease;
}
.emp-more-item:hover,.emp-more-item:active{background:#F3F4F6}
.emp-more-icon{
  width:38px;height:38px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.emp-more-text{flex:1;min-width:0}
.emp-more-name{font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:2px}
.emp-more-desc{font-size:12px;color:var(--text-muted);line-height:1.4}
.emp-more-arrow{font-size:20px;color:var(--text-muted);font-weight:300;flex-shrink:0}
.emp-more-badge{
  display:inline-block;color:var(--orange);font-size:8px;
  vertical-align:middle;margin-left:4px;animation:waste-pulse 2s ease-out infinite;
}
.emp-more-cancel{
  width:100%;background:#F3F4F6;border:none;border-radius:10px;
  padding:12px;font-size:14px;font-weight:600;color:var(--text-primary);
  cursor:pointer;font-family:inherit;
}
.emp-more-cancel:hover{background:#E5E7EB}

/* ─── Custom hover tooltip ──────────────────────────────────────────────── */
/* JS w utils.js przenosi atrybuty `title=` na nasz styled tooltip — natywny
 * dymek przeglądarki znika, na jego miejsce wskakuje ten ładniejszy. */
#app-tooltip{
  position:fixed;
  background:#1F2937;color:#F9FAFB;
  padding:6px 10px;border-radius:6px;
  font-size:11.5px;font-weight:500;line-height:1.4;
  pointer-events:none;
  z-index:99999;
  box-shadow:0 4px 14px rgba(0,0,0,.18);
  max-width:260px;
  opacity:0;
  transform:translateY(-2px);
  transition:opacity .12s ease, transform .12s ease;
  white-space:nowrap;
}
#app-tooltip.long{white-space:normal}
#app-tooltip.visible{opacity:1;transform:translateY(0)}
#app-tooltip::after{
  /* mała strzałka pod dymkiem (gdy tooltip jest u góry elementu) */
  content:'';position:absolute;left:50%;transform:translateX(-50%);
  width:0;height:0;border:4px solid transparent;
}
#app-tooltip.below::after{
  top:-8px;border-bottom-color:#1F2937;
}
#app-tooltip.above::after{
  bottom:-8px;border-top-color:#1F2937;
}

/* ─── Impersonation banner ──────────────────────────────────────────────── */
#impersonation-banner{
  position:sticky;top:0;left:0;right:0;z-index:9000;
  background:linear-gradient(90deg,#FEF3C7 0%,#FDE68A 100%);
  border-bottom:2px solid #D97706;
  color:#92400E;
  font-size:13px;font-weight:500;
  box-shadow:0 2px 8px rgba(217,119,6,.15);
}
#impersonation-banner .imp-banner-inner{
  max-width:1400px;margin:0 auto;
  display:flex;align-items:center;gap:12px;
  padding:10px 20px;
}
#impersonation-banner .imp-banner-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:28px;height:28px;border-radius:50%;
  background:#D97706;color:#fff;flex-shrink:0;
}
#impersonation-banner .imp-banner-text{
  flex:1;min-width:0;line-height:1.4;
}
#impersonation-banner .imp-banner-text strong{
  color:#7C2D12;font-weight:700;
}
#impersonation-banner .imp-banner-origin{
  font-size:11.5px;color:#A16207;font-weight:400;margin-left:4px;
}
#impersonation-banner .imp-banner-exit{
  background:#fff;border:1.5px solid #D97706;color:#92400E;
  padding:6px 14px;border-radius:6px;font-size:12px;font-weight:600;
  cursor:pointer;flex-shrink:0;white-space:nowrap;
  transition:background .15s,color .15s;
}
#impersonation-banner .imp-banner-exit:hover{
  background:#D97706;color:#fff;
}

/* Subtelna pomarańczowa ramka całej aplikacji w trybie testowym */
body.is-impersonating{
  box-shadow:inset 0 0 0 3px #D97706;
}

@media (max-width:600px){
  #impersonation-banner .imp-banner-inner{padding:8px 12px;gap:8px;flex-wrap:wrap}
  #impersonation-banner .imp-banner-origin{display:block;margin-left:0;margin-top:2px}
  #impersonation-banner .imp-banner-exit{font-size:11.5px;padding:5px 10px}
}

/* ─── Support / Zgłoszenia ─────────────────────────────────────────────────── */

/* FAB — pływający przycisk pomocy (każda strona po zalogowaniu) */
.support-fab{
  position:fixed; bottom:20px; right:20px; width:48px; height:48px;
  border-radius:50%; background:var(--orange); color:#fff; border:none;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  box-shadow:0 4px 14px rgba(250,140,22,.4); z-index:900;
  transition:transform .15s, box-shadow .15s, background .15s;
}
.support-fab:hover{ background:var(--orange-5); transform:translateY(-2px); box-shadow:0 6px 20px rgba(250,140,22,.5); }
.support-fab:active{ transform:translateY(0); }
.support-fab-badge{
  position:absolute; top:-4px; right:-4px; min-width:18px; height:18px;
  background:#dc2626; color:#fff; border:2px solid #fff; border-radius:9px;
  font-size:10px; font-weight:700; display:flex; align-items:center;
  justify-content:center; padding:0 4px;
}
.support-fab-badge.hidden{ display:none; }

/* Sidebar badge nieprzeczytanych — wspólny styl dla support i ownership */
.support-sidebar-badge,
.ownership-sidebar-badge{
  margin-left:auto; min-width:18px; height:18px; background:#dc2626; color:#fff;
  border-radius:9px; font-size:10px; font-weight:700; padding:0 5px;
  display:inline-flex; align-items:center; justify-content:center;
}
.support-sidebar-badge.hidden,
.ownership-sidebar-badge.hidden{ display:none; }

/* Modal nowego zgłoszenia */
.support-modal{ position:fixed; inset:0; z-index:1100; display:flex; align-items:center; justify-content:center; padding:20px; }
.support-modal.hidden{ display:none; }
.support-modal-backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.5); backdrop-filter:blur(2px); }
.support-modal-card{
  position:relative; background:#fff; border-radius:14px; width:100%; max-width:520px;
  max-height:90vh; overflow-y:auto; box-shadow:0 8px 40px rgba(0,0,0,.2);
  animation:modalIn .18s ease;
}
.support-modal-head{ padding:18px 20px 12px; display:flex; align-items:flex-start; justify-content:space-between; gap:12px; border-bottom:1px solid var(--border); }
.support-modal-title{ font-size:15px; font-weight:700; }
.support-modal-sub{ font-size:12px; color:var(--text-muted); margin-top:2px; }
.support-modal-close{
  width:30px; height:30px; border:none; background:#F3F4F6; border-radius:8px;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  color:var(--text-secondary); flex-shrink:0;
}
.support-modal-close:hover{ background:var(--orange-1); color:var(--orange); }
.support-modal-body{ padding:16px 20px; display:flex; flex-direction:column; gap:14px; }
.support-modal-foot{ padding:12px 20px 16px; display:flex; gap:8px; justify-content:flex-end; border-top:1px solid var(--border); }

.support-field{ display:flex; flex-direction:column; gap:5px; }
.support-field-label{ font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); }
.support-field input[type=text], .support-field textarea{
  width:100%; padding:8px 12px; border:1px solid var(--border-strong);
  border-radius:var(--radius-sm); font-size:13.5px; color:var(--text-primary);
  font-family:inherit; outline:none; transition:border-color .15s; resize:vertical;
}
.support-field input[type=text]:focus, .support-field textarea:focus{ border-color:var(--orange); }

.support-screen-zone{
  border:1.5px dashed var(--border-strong); border-radius:8px; padding:14px;
  background:#FAFAFA; transition:border-color .15s, background .15s;
}
.support-screen-zone:focus-within{ border-color:var(--orange); background:#FFFAF0; }
.support-screen-empty{
  display:flex; flex-direction:column; align-items:center; gap:6px;
  color:var(--text-muted); font-size:12.5px; padding:8px 0;
}
.support-screen-empty.hidden{ display:none; }
.support-screen-empty-text strong{ color:var(--text-primary); }
.support-screen-link{ color:var(--orange); cursor:pointer; text-decoration:underline; }
.support-screen-preview{ position:relative; }
.support-screen-preview.hidden{ display:none; }
.support-screen-preview img{ max-width:100%; max-height:280px; border-radius:6px; display:block; margin:0 auto; }
.support-screen-remove{
  position:absolute; top:4px; right:4px; width:26px; height:26px; border:none;
  background:rgba(0,0,0,.55); color:#fff; border-radius:50%; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.support-screen-remove:hover{ background:rgba(220,38,38,.9); }

.support-modal-error{
  background:#FEF2F2; border:1px solid #FECACA; color:#991B1B;
  padding:8px 12px; border-radius:6px; font-size:12.5px;
}
.support-modal-error.hidden{ display:none; }

/* Lista zgłoszeń */
.support-loading,.support-error,.support-empty,.support-empty-mini{
  text-align:center; padding:30px; color:var(--text-muted); font-size:13px;
}
.support-error{ color:#991B1B; }
.support-empty-icon{ display:flex; justify-content:center; margin-bottom:12px; color:var(--text-muted); opacity:.6; }
.support-empty-title{ font-size:14px; font-weight:600; color:var(--text-primary); margin-bottom:4px; }
.support-empty-sub{ font-size:12.5px; color:var(--text-muted); }

.support-tabs{ display:flex; gap:4px; padding:3px; background:#F3F4F6; border-radius:8px; margin-bottom:12px; flex-wrap:wrap; }
.support-tab{
  flex:1; min-width:90px; height:30px; border:none; background:transparent;
  border-radius:6px; font-size:12.5px; font-weight:500; cursor:pointer;
  color:var(--text-secondary); font-family:inherit; transition:all .15s;
  display:inline-flex; align-items:center; justify-content:center; gap:5px;
}
.support-tab.active{ background:#fff; color:var(--text-primary); box-shadow:0 1px 3px rgba(0,0,0,.08); }
.support-tab-count{ font-size:11px; color:var(--text-muted); font-weight:600; }
.support-tab.active .support-tab-count{ color:var(--orange); }

.support-list{ display:flex; flex-direction:column; gap:8px; }
.support-list-item{
  display:grid; grid-template-columns:auto 1fr auto; gap:12px;
  padding:12px 14px; background:#fff; border:1px solid var(--border);
  border-radius:10px; cursor:pointer; align-items:center;
  transition:border-color .15s, box-shadow .15s;
}
.support-list-item:hover{ border-color:var(--orange-3); box-shadow:0 2px 8px rgba(0,0,0,.04); }
.support-list-item.unread{ background:#FFFBF5; }
.support-list-status{
  font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  padding:3px 8px; border-radius:4px; border:1px solid; white-space:nowrap;
}
.support-list-main{ min-width:0; }
.support-list-title{ font-size:13.5px; font-weight:600; color:var(--text-primary); margin-bottom:2px; display:flex; align-items:center; gap:6px; }
.support-list-preview{ font-size:12px; color:var(--text-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:520px; }
.support-list-meta{ display:flex; flex-direction:column; align-items:flex-end; gap:2px; font-size:11.5px; color:var(--text-muted); flex-shrink:0; }
.support-list-author{ font-weight:600; color:var(--text-secondary); }
.support-list-time{ font-size:11px; }
.support-list-msgcount{ font-size:10.5px; opacity:.7; }
.support-unread-dot{ width:7px; height:7px; border-radius:50%; background:var(--orange); display:inline-block; flex-shrink:0; }

/* Wątek */
.support-thread{ display:flex; flex-direction:column; gap:14px; }
.support-thread-head{ display:flex; align-items:flex-start; gap:14px; flex-wrap:wrap; }
.support-thread-back{
  background:#F3F4F6; border:1px solid var(--border); border-radius:6px;
  padding:5px 10px; font-size:12.5px; cursor:pointer; display:inline-flex;
  align-items:center; gap:5px; color:var(--text-secondary); font-family:inherit;
}
.support-thread-back:hover{ color:var(--orange); border-color:var(--orange); }
.support-thread-title-wrap{ flex:1; min-width:0; }
.support-thread-title{ font-size:16px; font-weight:700; color:var(--text-primary); margin-bottom:4px; }
.support-thread-sub{ display:flex; gap:14px; flex-wrap:wrap; font-size:12px; color:var(--text-muted); align-items:center; }
.support-status-pill{
  font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  padding:2px 8px; border-radius:4px; border:1px solid;
}

.support-admin-actions{
  display:flex; gap:6px; align-items:center; flex-wrap:wrap;
  padding:10px 12px; background:#F9FAFB; border:1px solid var(--border); border-radius:8px;
}
.support-admin-actions-label{ font-size:11.5px; color:var(--text-muted); font-weight:600; margin-right:4px; }
.support-status-btn{
  border:1px solid var(--border-strong); background:#fff; color:var(--text-secondary);
  padding:4px 10px; border-radius:6px; font-size:11.5px; font-weight:600; cursor:pointer; font-family:inherit;
  transition:all .15s;
}
.support-status-btn:hover{ border-color:var(--orange); color:var(--orange); }
.support-status-btn.active{ font-weight:700; }

.support-thread-context{
  display:flex; gap:14px; flex-wrap:wrap; padding:8px 12px;
  background:#F9FAFB; border:1px solid var(--border); border-radius:6px;
  font-size:11px; color:var(--text-muted);
}
.support-thread-context code{ background:#fff; padding:1px 5px; border-radius:3px; border:1px solid var(--border); font-size:10.5px; }
.support-thread-ua{ flex-basis:100%; font-size:10.5px; opacity:.75; }

.support-thread-messages{ display:flex; flex-direction:column; gap:10px; }
.support-msg{
  padding:10px 14px; border:1px solid var(--border); border-radius:10px;
  background:#fff; max-width:80%;
}
.support-msg-employee{ align-self:flex-start; }
.support-msg-admin{ align-self:flex-end; background:#FFFBF5; border-color:var(--orange-3); }
.support-msg-author{ display:flex; gap:8px; align-items:baseline; margin-bottom:5px; flex-wrap:wrap; }
.support-msg-name{ font-size:12.5px; font-weight:600; color:var(--text-primary); }
.support-msg-time{ font-size:11px; color:var(--text-muted); }
.support-msg-body{ font-size:13px; color:var(--text-primary); line-height:1.55; word-wrap:break-word; }
.support-msg-attachments{ margin-top:8px; display:flex; gap:6px; flex-wrap:wrap; }
.support-msg-attachment{
  display:inline-flex; align-items:center; gap:5px; padding:4px 9px;
  background:#F3F4F6; border:1px solid var(--border); border-radius:6px;
  font-size:11.5px; color:var(--text-secondary); text-decoration:none; cursor:pointer;
}
.support-msg-attachment:hover{ border-color:var(--orange); color:var(--orange); background:var(--orange-1); }

.support-reply{
  display:flex; flex-direction:column; gap:8px; padding:12px;
  background:#F9FAFB; border:1px solid var(--border); border-radius:8px;
}
.support-reply textarea{
  width:100%; padding:8px 10px; border:1px solid var(--border-strong); border-radius:6px;
  font-size:13px; font-family:inherit; resize:vertical; outline:none;
}
.support-reply textarea:focus{ border-color:var(--orange); }
.support-reply-actions{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.support-reply-screen-btn{
  display:inline-flex; align-items:center; gap:5px; padding:5px 10px;
  background:#fff; border:1px solid var(--border-strong); border-radius:6px;
  font-size:12px; color:var(--text-secondary); cursor:pointer;
}
.support-reply-screen-btn:hover{ border-color:var(--orange); color:var(--orange); }

@media (max-width:600px){
  .support-fab{ bottom:80px; right:14px; }
  .support-list-item{ grid-template-columns:auto 1fr; gap:8px; }
  .support-list-meta{ grid-column:1/-1; flex-direction:row; align-items:center; gap:10px; padding-top:4px; border-top:1px dashed var(--border); }
  .support-msg{ max-width:95%; }
  .support-msg-admin{ align-self:flex-start; }
}

/* ─── Integracje / API keys ───────────────────────────────────────────────── */
.intg-keys-list{ display:flex; flex-direction:column; gap:10px; }
.intg-key-card{
  padding:14px 16px; background:#fff; border:1px solid var(--border); border-radius:10px;
  display:flex; flex-direction:column; gap:8px;
}
.intg-key-card.revoked{ opacity:.6; background:#FAFAFA; }
.intg-key-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.intg-key-title{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.intg-key-prefix{
  font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:11.5px; color:var(--text-muted); background:#F3F4F6; padding:2px 6px;
  border-radius:4px; border:1px solid var(--border);
}
.intg-key-status{
  font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  padding:3px 8px; border-radius:4px; border:1px solid; white-space:nowrap;
}
.intg-key-scopes{ display:flex; flex-wrap:wrap; gap:4px; }
.intg-scope-badge{
  display:inline-block; padding:2px 7px; background:var(--orange-1); color:var(--orange-7);
  border:1px solid var(--orange-3); border-radius:4px; font-size:11px; font-weight:600;
  font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
.intg-key-meta{ display:flex; gap:14px; flex-wrap:wrap; font-size:12px; color:var(--text-muted); }
.intg-key-notes{ font-size:12px; color:var(--text-secondary); padding:6px 10px; background:#F9FAFB; border-radius:6px; }
.intg-key-actions{ display:flex; gap:6px; justify-content:flex-end; flex-wrap:wrap; padding-top:6px; border-top:1px dashed var(--border); }

.intg-scope-table{ display:flex; flex-direction:column; gap:6px; }
.intg-scope-row{
  display:grid; grid-template-columns:1fr auto auto; gap:14px; align-items:center;
  padding:6px 10px; background:#F9FAFB; border:1px solid var(--border); border-radius:6px;
}
.intg-scope-label{ font-size:13px; font-weight:600; }
.intg-scope-cb{ font-size:12.5px; display:inline-flex; align-items:center; gap:5px; cursor:pointer; }
.intg-scope-blocked{ font-size:11.5px; color:var(--text-muted); font-style:italic; }

.intg-key-display{
  display:flex; align-items:center; gap:8px; padding:12px; background:#F3F4F6;
  border:1px solid var(--border); border-radius:8px; margin-bottom:12px;
}
.intg-key-display code{
  flex:1; min-width:0; font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:12.5px; color:var(--text-primary); word-break:break-all; user-select:all;
}

.intg-audit-table{ display:flex; flex-direction:column; }
.intg-audit-row{
  display:grid; grid-template-columns:1.4fr 0.6fr 2fr 0.6fr 0.7fr 1fr 1.2fr; gap:8px;
  padding:8px 10px; border-bottom:1px solid var(--border); font-size:12px; align-items:center;
}
.intg-audit-row.intg-audit-head{
  font-weight:700; color:var(--text-muted); background:#F9FAFB; font-size:11px;
  text-transform:uppercase; letter-spacing:.04em;
}
.intg-method{
  display:inline-block; padding:1px 6px; border-radius:3px; font-size:10.5px; font-weight:700;
  font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
.intg-method-get{ background:#DCFCE7; color:#166534; }
.intg-method-post{ background:#DBEAFE; color:#1E40AF; }
.intg-method-put{ background:#FEF3C7; color:#92400E; }
.intg-method-patch{ background:#EDE9FE; color:#5B21B6; }
.intg-method-delete{ background:#FEE2E2; color:#991B1B; }
.intg-path{
  font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:11.5px; color:var(--text-secondary);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block;
}

@media (max-width:800px){
  .intg-audit-row{ grid-template-columns:1fr 1fr; }
  .intg-audit-row.intg-audit-head{ display:none; }
  .intg-audit-row > div::before{ font-size:10px; color:var(--text-muted); display:block; text-transform:uppercase; }
}

/* ─── Ownership proposals (multi-sig) ────────────────────────────────────── */
.own-proposal-card{
  background:#fff; border:1px solid var(--border); border-radius:12px;
  padding:14px 16px; margin-bottom:10px; display:flex; flex-direction:column; gap:10px;
}
.own-prop-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; flex-wrap:wrap; }
.own-prop-status{
  display:inline-block; padding:3px 9px; border-radius:4px; border:1px solid;
  font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  margin-bottom:4px;
}
.own-prop-proposer{ font-size:12.5px; color:var(--text-secondary); }
.own-prop-desc{ font-size:13px; color:var(--text-primary); padding:8px 12px; background:#F9FAFB; border-left:3px solid var(--orange-3); border-radius:4px; line-height:1.5; }

.own-changes{
  background:#FAFAFA; border:1px solid var(--border); border-radius:8px;
  padding:10px 14px; display:flex; flex-direction:column; gap:6px;
}
.own-change-row{
  display:grid; grid-template-columns:1.4fr 0.7fr auto 0.7fr 0.7fr; gap:10px; align-items:center;
  font-size:12.5px; padding:3px 0;
}
.own-change-name{ font-weight:600; }
.own-change-old{ font-variant-numeric:tabular-nums; color:var(--text-muted); }
.own-change-arrow{ color:var(--text-muted); }
.own-change-new{ font-variant-numeric:tabular-nums; font-weight:600; }
.own-change-delta{ font-variant-numeric:tabular-nums; font-size:11.5px; font-weight:600; text-align:right; }
.own-total-line{
  font-size:12.5px; padding-top:6px; margin-top:4px; border-top:1px dashed var(--border);
  text-align:right; color:var(--text-secondary);
}

.own-progress{ font-size:12px; color:var(--text-muted); }
.own-progress-label{ margin-bottom:4px; }
.own-progress-bar{ height:6px; background:#F3F4F6; border-radius:3px; overflow:hidden; }
.own-progress-fill{ height:100%; background:var(--green-7); transition:width .3s ease; }

.own-votes{ display:flex; flex-direction:column; gap:4px; }
.own-vote-row{
  display:grid; grid-template-columns:auto 1fr auto auto; gap:10px; align-items:baseline;
  padding:6px 12px; border-left:3px solid; background:#FAFAFA; border-radius:4px;
  font-size:12px;
}
.own-vote-icon{ font-size:14px; font-weight:700; }
.own-vote-name{ font-weight:600; color:var(--text-primary); }
.own-vote-pct{ font-variant-numeric:tabular-nums; color:var(--text-muted); font-size:11.5px; }
.own-vote-time{ font-size:11.5px; color:var(--text-muted); }
.own-vote-comment{ grid-column:1/-1; margin-top:4px; font-style:italic; color:var(--text-secondary); font-size:11.5px; }

.own-rejection{
  padding:8px 12px; background:#FEF2F2; border:1px solid #FECACA; color:#991B1B;
  border-radius:6px; font-size:12.5px;
}

.own-actions{ display:flex; gap:8px; justify-content:flex-end; padding-top:8px; border-top:1px dashed var(--border); flex-wrap:wrap; }
.own-my-vote{ font-size:12.5px; }

/* Modal nowego wniosku */
.own-modal-table{ display:flex; flex-direction:column; gap:6px; max-height:50vh; overflow-y:auto; }
.own-modal-row{
  display:grid; grid-template-columns:1.4fr 0.7fr auto 0.9fr auto; gap:10px; align-items:center;
  padding:6px 10px; background:#FAFAFA; border:1px solid var(--border); border-radius:6px;
}
.own-modal-name{ font-weight:600; font-size:13px; }
.own-modal-current{ color:var(--text-muted); font-variant-numeric:tabular-nums; font-size:12.5px; }
.own-modal-arrow{ color:var(--text-muted); }
.own-modal-input{
  width:100%; padding:5px 8px; border:1px solid var(--border-strong); border-radius:5px;
  font-size:13px; font-family:inherit; outline:none; text-align:right; font-variant-numeric:tabular-nums;
}
.own-modal-input:focus{ border-color:var(--orange); }
.own-total-row{
  display:flex; justify-content:space-between; align-items:center;
  padding:10px 14px; background:var(--orange-1); border:1px solid var(--orange-3);
  border-radius:6px; font-size:13.5px; font-weight:600;
}