/* Druga Runda — Panel administracyjny (osobna aplikacja) */

:root{
  color-scheme: dark;
  --surface-page: #0d0d0d;
  --surface-1: #17171a;
  --surface-2: #1e1e22;
  --surface-3: #232328;
  --border: #2c2c2f;
  --border-soft: #232328;

  --text-primary: #ffffff;
  --text-secondary: #c3c2c7;
  --text-muted: #8b8a90;

  --brand-accent: #b7e33a;      /* akcent marki Druga Runda (limonka) */
  --brand-accent-ink: #14150f;

  /* Kategorialne (2 nieprzylegające sloty z referencyjnej palety — bezpieczne dla CVD) */
  --cat-blue: #3987e5;
  --cat-violet: #9085e9;

  /* Paleta statusów — stała, nie tematyzowana (z references/palette.md) */
  --status-good: #0ca30c;
  --status-warning: #fab219;
  --status-serious: #ec835a;
  --status-critical: #d03b3b;

  --gridline: #2c2c2a;
  --baseline: #383835;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--surface-page);
  color:var(--text-primary);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
button, input, select{font-family:inherit}

h1,h2,h3,.dr-heading{font-family:'Space Grotesk',sans-serif;font-weight:800}

/* ---------- Layout logowania ---------- */
.dr-login-screen{
  min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;
  background:radial-gradient(circle at 20% 10%, #1c2010 0%, var(--surface-page) 55%);
}
.dr-login-card{
  width:100%;max-width:380px;background:var(--surface-1);border:1px solid var(--border);
  border-radius:14px;padding:36px 32px;
}
.dr-login-brand{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.dr-login-brand-dot{width:10px;height:10px;border-radius:50%;background:var(--brand-accent)}
.dr-login-title{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}
.dr-login-heading{font-size:22px;margin:14px 0 26px}
.dr-field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}
.dr-field label{font-size:12px;color:var(--text-muted)}
.dr-field input{
  border:1px solid var(--border);border-radius:8px;padding:12px 14px;font-size:14px;
  color:var(--text-primary);background:var(--surface-2);
}
.dr-field input:focus{outline:none;border-color:var(--brand-accent)}
.dr-login-error{
  background:rgba(208,59,59,0.12);border:1px solid rgba(208,59,59,0.4);color:#ff9d9d;
  font-size:13px;padding:10px 12px;border-radius:8px;margin-bottom:16px;display:none;
}
.dr-login-error.show{display:block}
.dr-login-hint{font-size:12px;color:var(--text-muted);margin-top:18px;line-height:1.5}

.dr-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:14px;
  padding:13px 20px;border-radius:8px;border:none;cursor:pointer;letter-spacing:.01em;
}
.dr-btn-primary{background:var(--brand-accent);color:var(--brand-accent-ink)}
.dr-btn-primary:hover{filter:brightness(1.07)}
.dr-btn-primary:disabled{opacity:.5;cursor:not-allowed}
.dr-btn-block{width:100%}
.dr-btn-ghost{background:transparent;border:1px solid var(--border);color:var(--text-secondary)}
.dr-btn-ghost:hover{border-color:var(--text-muted);color:var(--text-primary)}
.dr-btn-sm{padding:8px 14px;font-size:12px}
.dr-shipment-error{color:var(--status-critical);font-size:12.5px;line-height:1.5;margin-bottom:10px}

/* ---------- Layout aplikacji (sidebar + topbar) ---------- */
.dr-app{display:flex;min-height:100vh}
.dr-sidebar{
  width:230px;flex:none;background:var(--surface-1);border-right:1px solid var(--border);
  display:flex;flex-direction:column;padding:24px 16px;position:sticky;top:0;height:100vh;
}
.dr-sidebar-brand{display:flex;align-items:center;gap:10px;padding:0 8px;margin-bottom:32px}
.dr-sidebar-brand-dot{width:10px;height:10px;border-radius:50%;background:var(--brand-accent);flex:none}
.dr-sidebar-brand-text{font-family:'Space Grotesk',sans-serif;font-weight:800;font-size:15px;text-transform:uppercase;line-height:1.2}
.dr-sidebar-brand-sub{font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em}
.dr-nav{display:flex;flex-direction:column;gap:2px}
.dr-nav a{
  display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:8px;
  font-size:13px;font-weight:500;color:var(--text-secondary);
}
.dr-nav a:hover{background:var(--surface-2);color:var(--text-primary)}
.dr-nav a.active{background:var(--surface-2);color:var(--text-primary);font-weight:700}
.dr-nav-icon{width:16px;text-align:center;flex:none;opacity:.85}
.dr-sidebar-footer{margin-top:auto;padding-top:16px;border-top:1px solid var(--border-soft)}
.dr-sidebar-user{font-size:12px;color:var(--text-muted);padding:0 8px 10px}

.dr-main{flex:1;min-width:0}
.dr-topbar{
  display:flex;align-items:center;justify-content:space-between;padding:22px 32px;
  border-bottom:1px solid var(--border-soft);
}
.dr-topbar h1{font-size:20px;margin:0;text-transform:uppercase}
.dr-topbar-sub{font-size:13px;color:var(--text-muted);margin-top:4px}
.dr-content{padding:28px 32px 60px}

/* ---------- Stat tiles ---------- */
.dr-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:28px}
@media (max-width:1000px){.dr-stat-grid{grid-template-columns:repeat(2,1fr)}}
.dr-stat-tile{
  background:var(--surface-1);border:1px solid var(--border);border-radius:12px;padding:20px;
}
.dr-stat-label{font-size:12px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px}
.dr-stat-value{font-family:'Space Grotesk',sans-serif;font-weight:800;font-size:28px;font-variant-numeric:tabular-nums}
.dr-stat-delta{font-size:12px;color:var(--text-muted);margin-top:6px}
.dr-stat-delta.good{color:var(--status-good)}
.dr-stat-delta.warn{color:var(--status-warning)}

/* ---------- Karty / panele ---------- */
.dr-panel{background:var(--surface-1);border:1px solid var(--border);border-radius:12px;padding:22px}
.dr-panel + .dr-panel{margin-top:20px}
.dr-panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;gap:12px;flex-wrap:wrap}
.dr-panel-title{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.02em}
.dr-panel-grid-2{display:grid;grid-template-columns:1.4fr 1fr;gap:20px}
@media (max-width:1100px){.dr-panel-grid-2{grid-template-columns:1fr}}

/* ---------- Wykres przychodu ---------- */
.dr-chart-wrap{overflow-x:auto}
.dr-chart-toggle{font-size:12px;color:var(--text-muted);background:none;border:1px solid var(--border);border-radius:6px;padding:6px 10px;cursor:pointer}
.dr-chart-toggle:hover{color:var(--text-primary);border-color:var(--text-muted)}
.dr-bar-tooltip{
  position:absolute;pointer-events:none;background:var(--surface-3);border:1px solid var(--border);
  border-radius:6px;padding:8px 10px;font-size:12px;color:var(--text-primary);opacity:0;
  transition:opacity .1s ease;white-space:nowrap;transform:translate(-50%,-110%);z-index:5;
}
.dr-bar-tooltip.show{opacity:1}
.dr-bar-tooltip .t-date{color:var(--text-muted);margin-bottom:2px;font-size:11px}
.dr-table-simple{width:100%;border-collapse:collapse;font-size:13px}
.dr-table-simple th, .dr-table-simple td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--border-soft)}
.dr-table-simple th{color:var(--text-muted);font-weight:600;font-size:11px;text-transform:uppercase}
.dr-table-simple td{font-variant-numeric:tabular-nums}

/* ---------- Top produkty ---------- */
.dr-top-list{display:flex;flex-direction:column;gap:12px}
.dr-top-row{display:flex;align-items:center;gap:12px}
.dr-top-name{flex:1;font-size:13px;color:var(--text-secondary);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dr-top-bar-track{flex:1;height:6px;background:var(--surface-3);border-radius:3px;overflow:hidden;max-width:140px}
.dr-top-bar-fill{height:100%;background:var(--cat-blue);border-radius:3px}
.dr-top-qty{font-size:12px;color:var(--text-muted);width:26px;text-align:right;font-variant-numeric:tabular-nums}

/* ---------- Filtry ---------- */
.dr-filters{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:18px}
.dr-filters input[type=search]{
  border:1px solid var(--border);border-radius:8px;padding:10px 14px;font-size:13px;
  background:var(--surface-2);color:var(--text-primary);min-width:220px;
}
.dr-filters input[type=search]:focus{outline:none;border-color:var(--brand-accent)}
.dr-select{
  border:1px solid var(--border);border-radius:8px;padding:10px 14px;font-size:13px;
  background:var(--surface-2);color:var(--text-primary);
}
.dr-checkbox-pill{
  display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-secondary);
  border:1px solid var(--border);border-radius:8px;padding:10px 14px;cursor:pointer;user-select:none;
}
.dr-checkbox-pill input{accent-color:var(--brand-accent)}

/* ---------- Tabela zamówień ---------- */
.dr-orders-table{width:100%;border-collapse:collapse;font-size:13px}
.dr-orders-table th{
  text-align:left;padding:10px 14px;color:var(--text-muted);font-weight:600;font-size:11px;
  text-transform:uppercase;letter-spacing:.03em;border-bottom:1px solid var(--border);
}
.dr-orders-table td{padding:14px;border-bottom:1px solid var(--border-soft);vertical-align:middle}
.dr-orders-table tr:last-child td{border-bottom:none}
.dr-order-row{cursor:pointer}
.dr-order-row:hover td{background:var(--surface-2)}
.dr-order-id{font-family:'Space Grotesk',sans-serif;font-weight:700}
.dr-order-total{font-variant-numeric:tabular-nums;font-weight:600}
.dr-cell-muted{color:var(--text-muted);font-size:12px}
.dr-empty-row td{text-align:center;padding:48px;color:var(--text-muted)}

/* ---------- Odznaki statusów ---------- */
.dr-badge{
  display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;
  padding:5px 10px;border-radius:100px;text-transform:uppercase;letter-spacing:.02em;
  white-space:nowrap;
}
.dr-badge::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}
.dr-badge-compact{font-size:10px;padding:4px 8px;gap:5px}
.dr-badge-compact::before{width:5px;height:5px}

/* ---------- Zamówienia wg statusu (pulpit) ---------- */
.dr-status-breakdown-grid{display:grid;grid-template-columns:auto 1fr 30px;column-gap:12px;row-gap:12px;align-items:center}
.dr-status-row{display:contents}
.dr-status-row-count{font-size:12px;color:var(--text-muted);text-align:right;font-variant-numeric:tabular-nums}
.dr-badge-nowe{background:rgba(139,138,144,0.15);color:#c3c2c7}
.dr-badge-oczekuje_na_platnosc{background:rgba(250,178,25,0.15);color:var(--status-warning)}
.dr-badge-przygotowywane{background:rgba(144,133,233,0.15);color:var(--cat-violet)}
.dr-badge-wyslane{background:rgba(57,135,229,0.15);color:var(--cat-blue)}
.dr-badge-dostarczone{background:rgba(12,163,12,0.15);color:var(--status-good)}
.dr-badge-anulowane{background:rgba(208,59,59,0.15);color:var(--status-critical)}
.dr-badge-delayed{background:rgba(250,178,25,0.15);color:var(--status-warning)}
.dr-badge-payment-oczekuje{background:rgba(139,138,144,0.15);color:#c3c2c7}
.dr-badge-payment-oplacone{background:rgba(12,163,12,0.15);color:var(--status-good)}
.dr-badge-payment-nieudane{background:rgba(208,59,59,0.15);color:var(--status-critical)}
.dr-badge-payment-zwrocone{background:rgba(57,135,229,0.15);color:var(--cat-blue)}

/* ---------- Produkty ---------- */
.dr-product-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;gap:12px;flex-wrap:wrap}
.dr-product-grid-admin{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.dr-product-card-admin{background:var(--surface-1);border:1px solid var(--border);border-radius:12px;padding:16px;cursor:pointer}
.dr-product-card-admin:hover{border-color:var(--text-muted)}
.dr-product-card-admin.inactive{opacity:.5}
.dr-product-card-admin-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:10px}
.dr-product-card-brand{font-size:11px;color:var(--text-muted);text-transform:uppercase}
.dr-product-card-name{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:14px;margin:2px 0 10px}
.dr-product-card-price{font-family:'Space Grotesk',sans-serif;font-weight:800;font-size:16px;margin-bottom:10px}
.dr-variant-editor{display:flex;flex-direction:column;gap:8px}
.dr-variant-row{display:grid;grid-template-columns:1fr 90px auto;gap:8px;align-items:center}
.dr-variant-row input{
  border:1px solid var(--border);border-radius:6px;padding:8px 10px;font-size:13px;
  background:var(--surface-2);color:var(--text-primary);
}
.dr-variant-remove{background:none;border:none;color:var(--text-muted);font-size:16px;cursor:pointer;width:24px}
.dr-variant-remove:hover{color:var(--status-critical)}
.dr-form-2col{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dr-drawer textarea.tall{min-height:110px}
.dr-danger-zone{border-top:1px solid var(--border-soft);margin-top:24px;padding-top:20px}
.dr-order-row.inactive{opacity:.55}

/* ---------- Faktury ---------- */
.dr-invoice-items-head{
  display:grid;gap:8px;padding:0 10px 6px;font-size:10px;text-transform:uppercase;
  letter-spacing:.03em;color:var(--text-muted);
}
.dr-invoice-items-head-standard{grid-template-columns:1fr 50px 50px 80px 84px 24px}
.dr-invoice-items-head-marza{grid-template-columns:1fr 50px 50px 90px 24px}
.dr-invoice-item-editor{display:flex;flex-direction:column;gap:8px}
.dr-invoice-item-row{display:grid;gap:8px;align-items:center}
.dr-invoice-item-row-standard{grid-template-columns:1fr 50px 50px 80px 84px 24px}
.dr-invoice-item-row-marza{grid-template-columns:1fr 50px 50px 90px 24px}
.dr-invoice-item-row input, .dr-invoice-item-row select{
  border:1px solid var(--border);border-radius:6px;padding:8px 8px;font-size:12.5px;
  background:var(--surface-2);color:var(--text-primary);width:100%;
}
.dr-invoice-item-row select.dr-item-vat{padding:8px 4px;font-size:11.5px}
.dr-invoice-totals{background:var(--surface-2);border:1px solid var(--border-soft);border-radius:10px;padding:14px 16px}
.dr-invoice-totals .dr-drawer-row{border-bottom:none;padding:4px 0}

/* ---------- Drawer szczegółów zamówienia ---------- */
.dr-drawer-backdrop{
  position:fixed;inset:0;background:rgba(0,0,0,0.55);opacity:0;pointer-events:none;
  transition:opacity .15s ease;z-index:40;
}
.dr-drawer-backdrop.open{opacity:1;pointer-events:auto}
.dr-drawer{
  position:fixed;top:0;right:0;bottom:0;width:460px;max-width:92vw;background:var(--surface-1);
  border-left:1px solid var(--border);transform:translateX(100%);transition:transform .2s ease;
  z-index:41;overflow-y:auto;
}
.dr-drawer.open{transform:translateX(0)}
.dr-drawer-head{
  display:flex;align-items:center;justify-content:space-between;padding:22px 24px;
  border-bottom:1px solid var(--border-soft);position:sticky;top:0;background:var(--surface-1);
}
.dr-drawer-close{background:none;border:none;color:var(--text-muted);font-size:20px;cursor:pointer;line-height:1}
.dr-drawer-close:hover{color:var(--text-primary)}
.dr-drawer-body{padding:24px}
.dr-drawer-section{margin-bottom:24px}
.dr-drawer-section-title{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);margin-bottom:10px}
.dr-drawer-row{display:flex;justify-content:space-between;font-size:13px;padding:7px 0;border-bottom:1px solid var(--border-soft)}
.dr-drawer-row span:first-child{color:var(--text-muted)}
.dr-drawer-row span:last-child{text-align:right;max-width:60%}
.dr-item-line{display:flex;justify-content:space-between;font-size:13px;padding:8px 0;border-bottom:1px solid var(--border-soft)}
.dr-item-line-name{color:var(--text-secondary)}
.dr-status-controls{display:flex;flex-direction:column;gap:10px}
.dr-drawer textarea{
  width:100%;border:1px solid var(--border);border-radius:8px;padding:10px 12px;font-size:13px;
  background:var(--surface-2);color:var(--text-primary);resize:vertical;min-height:70px;font-family:inherit;
}
.dr-drawer textarea:focus{outline:none;border-color:var(--brand-accent)}
.dr-save-note{font-size:11px;color:var(--text-muted);margin-top:6px;min-height:14px}
.dr-save-note.saved{color:var(--status-good)}

.dr-loading{padding:60px;text-align:center;color:var(--text-muted);font-size:13px}
.dr-toast{
  position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);
  background:var(--brand-accent);color:var(--brand-accent-ink);font-family:'Space Grotesk',sans-serif;
  font-weight:700;font-size:13px;padding:14px 22px;border-radius:8px;opacity:0;
  transition:opacity .2s ease, transform .2s ease;pointer-events:none;z-index:100;
}
.dr-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ---------- Uploader zdjęć (produkty, treści strony) ---------- */
.dr-image-uploader{display:flex;gap:14px;align-items:flex-start;flex-wrap:wrap}
.dr-image-preview{
  width:120px;height:120px;border-radius:10px;border:1px dashed var(--border);
  background:var(--surface-2);display:flex;align-items:center;justify-content:center;
  overflow:hidden;flex:none;color:var(--text-muted);font-size:11px;text-align:center;padding:8px;
  transition:border-color .15s ease;
}
.dr-image-preview.dragover{border-color:var(--brand-accent);border-style:solid}
.dr-image-preview img{width:100%;height:100%;object-fit:cover;display:block}
.dr-image-actions{display:flex;flex-direction:column;gap:8px;padding-top:2px}
.dr-image-actions .dr-btn{display:inline-flex;align-items:center;justify-content:center}
.dr-image-hint{font-size:11px;color:var(--text-muted);max-width:220px}