:root{
      --bg:#f6f7fb;
      --card:#ffffff;
      --text:#1f2937;
      --muted:#6b7280;
      --line:#94a3b8; /* Zmieniono z #e5e7eb na wyraźniejszy, ciemniejszy szary */
      --primary:#2563eb;
      --primary-hover:#1d4ed8;
      --danger:#ff2424;
      --warn:#ff9800;
      --ok:#00cc33;
    }

    *{ box-sizing:border-box; }

    body{
      margin:0;
      background:var(--bg);
      color:var(--text);
      font-family:Inter, Segoe UI, Roboto, Arial, sans-serif;
      font-size:12px;
      line-height:1.35;
    }

    /* === STYLE ZAKŁADEK === */
    .tabs-container {
      max-width: 1400px;
      margin: 0 auto;
    }
    .tabs-header {
      display: flex;
      gap: 4px;
      padding: 10px 10px 0 10px;
      border-bottom: 1px solid var(--line);
      overflow-x: auto;
    }
    .tab-btn {
      padding: 10px 18px;
      background: transparent;
      border: 1px solid transparent;
      border-bottom: none;
      border-radius: 8px 8px 0 0;
      cursor: pointer;
      font-weight: 700;
      color: var(--muted);
      font-size: 13px;
      transition: all 0.2s;
      white-space: nowrap;
    }
    .tab-btn:hover {
      color: var(--text);
      background: #e5e7eb;
    }
    .tab-btn.active {
      background: var(--bg);
      color: var(--primary);
      border-color: var(--line);
      margin-bottom: -1px; 
      border-bottom-color: var(--bg);
    }
    .tab-content {
      display: none;
      padding-top: 10px;
    }
    .tab-content.active {
      display: block;
    }

    /* === FORMATOWANIE TABEL EXCELA - POLE DO WKLEJANIA === */
    .excel-preview-card {
      background: var(--card);
      border: 1px solid var(--line);
      border-radius: 10px;
      padding: 15px;
      box-shadow: 0 2px 8px rgba(0,0,0,.04);
      margin: 0 10px;
    }
    .excel-header-bar {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 8px;
    }
    .excel-header-bar h2 {
      margin: 0;
    }
    .excel-table-wrapper {
      overflow: auto;
      max-height: 75vh;
      min-height: 150px;
      margin-top: 12px;
      border: 1px dashed #9ca3af;
      background: #fff;
      padding: 10px;
      border-radius: 6px;
      outline: none;
      transition: border-color 0.2s, box-shadow 0.2s;
    }
    .excel-table-wrapper:focus {
      border-color: var(--primary);
      box-shadow: 0 0 0 3px rgba(37,99,235,0.15);
      border-style: solid;
    }
    .excel-table-wrapper:empty:before {
      content: attr(data-placeholder);
      color: #9ca3af;
      font-style: italic;
      font-size: 13px;
    }
    
    .excel-table-wrapper table {
      border-collapse: collapse;
      font-family: Calibri, Arial, sans-serif;
      font-size: 13px;
      margin: 0;
      width: max-content;
    }
    .excel-table-wrapper td, .excel-table-wrapper th {
      border: 1px solid #94a3b8; /* Wyraźniejsze obramowanie komórek tabeli z Excela */
      padding: 4px 8px;
      white-space: pre-wrap;
      empty-cells: show;
      min-width: 60px;
      vertical-align: bottom;
    }
    .excel-table-wrapper tr:hover td {
      filter: brightness(0.95);
    }
    .excel-table-wrapper table .excel-data-row td:nth-child(-n+2) {
      text-align: left !important;
    }
    .excel-table-wrapper table .excel-data-row td:nth-child(2) {
      max-width: 320px;
      white-space: pre-wrap !important;
      overflow-wrap: anywhere;
      word-break: break-word;
    }
    .excel-table-wrapper table .excel-data-row td:nth-child(n+3) {
      text-align: center !important;
    }
    #out-wspol table .excel-data-row td,
    #out-stawki table .excel-data-row td,
    #out-koszyki table .excel-data-row td {
      text-align: center !important;
    }
    #out-stawki table .excel-data-row .product-option-cell {
      text-align: left !important;
    }
    .excel-filter {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px;
      margin-top: 12px;
    }
    .excel-filter input {
      min-width: 260px;
      padding: 7px 9px;
      border: 1px solid var(--line);
      border-radius: 6px;
      font: inherit;
    }
    .excel-filter-result {
      font-size: 13px;
      color: var(--muted);
    }
    #out-smartfon-pkt table,
    #out-smartfon-pkt table * {
      font-family: Calibri, Arial, sans-serif !important;
      font-size: 13px !important;
    }

    /* === STANDARDOWE STYLE APLIKACJI === */
    .container{
      padding: 0 10px 10px 10px;
      display:grid;
      gap:10px;
    }
    .card{
      background:var(--card);
      border:1px solid var(--line);
      border-radius:10px;
      padding:10px;
      box-shadow:0 2px 8px rgba(0,0,0,.04);
    }
    h1{ margin:0 0 10px; font-size:20px; }
    h2{ margin:0 0 8px; font-size:16px; }
    .muted{ color:var(--muted); }

    .top-grid{
      display:grid;
      grid-template-columns:1fr 360px;
      gap:12px;
      align-items:stretch;
    }

    .goal-panel{
      border:1px solid var(--line);
      border-radius:12px;
      padding:12px;
      background:linear-gradient(180deg,#ffffff,#f8fafc);
      box-shadow:0 6px 14px rgba(0,0,0,.05);
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .goal-title{
      font-size:16px;
      font-weight:800;
      margin-bottom:8px;
      color:#111827;
    }
    .goal-percent{
      font-size:42px;
      line-height:1;
      font-weight:900;
      letter-spacing:.2px;
      margin-bottom:10px;
      text-align:right;
    }
    .goal-bar-wrap{
      width:100%;
      height:16px;
      border-radius:999px;
      background:#e5e7eb;
      overflow:hidden;
      border:1px solid #94a3b8; /* Wyraźniejsze obramowanie paska postępu */
    }
    .goal-bar{
      height:100%;
      width:0%;
      background:var(--danger);
      transition:width .25s ease, background-color .25s ease;
    }

    .accessories-wrap{
      margin-top:10px;
      display:grid;
      gap:6px;
    }
    .accessories-label{
      font-size:13px;
      color:var(--muted);
    }
    .accessories-input{
      height:30px;
      text-align:right;
      border:1px solid #94a3b8; /* Wyraźniejsze obramowanie inputów */
      border-radius:7px;
      padding:6px 8px;
      font-size:12px;
    }
    .accessories-info{
      font-size:12px;
      color:var(--muted);
    }

    .baskets{
      margin-top:0;
      display:grid;
      grid-template-columns:repeat(3,minmax(210px,1fr));
      grid-auto-rows: 1fr;
      gap:8px;
    }
    .basket{
      border:1px solid var(--line);
      border-radius:9px;
      padding:8px;
      background:#fafafa;
      display:grid;
      align-content: start;
      gap:6px;
    }
    .basket .name{
      font-size:14px;
      font-weight:800;
      color:#374151;
      min-height:22px;
      display:flex;
      align-items:center;
      justify-content:center;
      text-align:center;
    }
    .basket .row{
      display:grid;
      grid-template-columns:1fr 72px;
      gap:6px;
      align-items:center;
    }
    .basket .label{
      color:var(--muted);
      font-size:12px;
    }
    .basket input{
      width:100%;
      border:1px solid #94a3b8; /* Wyraźniejsze obramowanie inputów w koszykach */
      border-radius:6px;
      padding:4px 5px;
      font-size:12px;
      text-align:center;
      background:#fff;
      height:26px;
    }
    .basket .value{
      font-size:16px;
      font-weight:800;
      text-align:center;
    }
    .basket .result{
      font-size:12px;
      color:var(--muted);
      text-align:center;
    }

    .kpi-progress{
      width:100%;
      height:8px;
      border-radius:999px;
      background:#e5e7eb;
      overflow:hidden;
      margin-top:1px;
    }
    .kpi-progress-bar{
      width:0%;
      height:100%;
      background:var(--danger);
      transition:width .25s ease, background-color .25s ease;
    }

    .toolbar{
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:8px;
      margin-bottom:6px;
      flex-wrap:wrap;
    }
    .left-tools,.right-tools{
      display:flex;
      gap:6px;
      align-items:center;
      flex-wrap:wrap;
    }

    button, select, input{
      border:1px solid #94a3b8; /* Wyraźniejsze obramowanie elementów interaktywnych */
      border-radius:7px;
      padding:6px 8px;
      font-size:12px;
      background:#fff;
      color:var(--text);
    }
    button{
      background:var(--primary);
      border-color:var(--primary);
      color:#fff;
      font-weight:700;
      cursor:pointer;
    }
    @media (hover:hover){
      button:hover{ background:var(--primary-hover); }
    }
    button.btn-secondary{
      background:#fff;
      border-color:#94a3b8; /* Wyraźniejsze obramowanie szarych przycisków */
      color:#374151;
    }
    @media (hover:hover){
      button.btn-secondary:hover{ background:#f3f4f6; }
    }
    button.btn-sync{
      background:#059669;
      border-color:#059669;
    }
    @media (hover:hover){
      button.btn-sync:hover{ background:#047857; }
    }

    .sync-bar{
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:8px;
      flex-wrap:wrap;
      margin-bottom:8px;
      padding:8px 10px;
      border:1px solid var(--line);
      border-radius:8px;
      background:#f9fafb;
    }
    .sync-tools{
      display:flex;
      gap:6px;
      flex-wrap:wrap;
      align-items:center;
    }
    .sync-status{
      font-size:11px;
      color:var(--muted);
      max-width:420px;
    }
    .sync-status.ok{ color:#047857; }
    .sync-status.warn{ color:#b45309; }

    button:focus-visible, select:focus-visible, input:focus-visible{
      outline:2px solid var(--primary);
      outline-offset:2px;
    }

    .table-wrap{
      overflow:auto;
      max-height:70vh;
      border:1px solid var(--line);
      border-radius:9px;
      background:#fff;
    }
    table{
      width:100%;
      min-width:1180px;
      border-collapse:separate;
      border-spacing:0;
      table-layout:fixed;
    }
    thead th{
      position:sticky;
      top:0;
      z-index:10;
      background:#f9fafb;
      border-bottom:1px solid var(--line);
      color:#374151;
      text-align:center;
      font-size:11px;
      padding:7px 6px;
      white-space:nowrap;
    }
    thead th.col-opis{ text-align:left; }
    tbody td{
      border-bottom:1px solid var(--line);
      padding:5px 6px;
      vertical-align:middle;
      text-align:center;
      transition:background-color .15s ease;
    }
    tbody tr:last-child td{ border-bottom:none; }

    .col-nr{ width:150px; }
    .col-opis{ width:34%; }
    .col-data{ width:112px; }
    .col-status{ width:130px; }
    .col-small{ width:60px; }
    .col-del{ width:64px; }

    td input[type="text"],
    td input[type="date"],
    td input[type="number"],
    td select{
      width:100%;
      min-width:0;
      padding:4px 5px;
      border-radius:6px;
      border:1px solid #94a3b8; /* Wyraźniejsze obramowanie w głównej tabeli */
      font-size:11px;
      background:#fff;
      text-align:center;
      height:24px;
    }
    td.col-opis-cell input[type="text"]{ text-align:left; }
    input[type=number]::-webkit-outer-spin-button,
    input[type=number]::-webkit-inner-spin-button{
      -webkit-appearance:none;
      margin:0;
    }
    input[type=number]{
      -moz-appearance:textfield;
      appearance:textfield;
    }

    .status-select{ font-weight:700; }
    .status-w-realizacji{ color:#c2410c; background:#fde047; border-color:#f59e0b; }
    .status-kompletne{ color:#15803d; background:#4ade80; border-color:#22c55e; }

    .delete-btn{
      width:100%;
      padding:4px 5px;
      border-radius:6px;
      border:1px solid #f87171;
      background:#fff;
      color:#ef4444;
      font-size:11px;
      cursor:pointer;
    }
    @media (hover:hover){
      .delete-btn:hover{ background:#fee2e2; border-color:#ef4444; }
    }
    tr.row-status-kompletne td{ background:#bbf7d0; }
    tr.row-status-w-realizacji td{ background:#fef08a; }
    td input.readonly-cell{
      background:#f3f4f6 !important;
      color:#6b7280;
      border-color:#cbd5e1; /* Wyraźniejsze obramowanie zablokowanych pól */
      cursor:not-allowed;
    }
    tr.search-match td{
      outline:2px solid #93c5fd;
      outline-offset:-2px;
    }

    .count-cell{ position:relative; }
    .count-toggle{
      display:none;
      align-items:center;
      justify-content:center;
      gap:3px;
      margin-top:3px;
      font-size:9px;
      font-weight:700;
      color:#92400e;
      white-space:nowrap;
      cursor:pointer;
    }
    .count-toggle input[type="checkbox"]{
      width:13px;
      height:13px;
      min-width:13px;
      padding:0;
      margin:0;
      accent-color:#2563eb;
      cursor:pointer;
    }
    tr.row-status-w-realizacji .count-toggle{ display:flex; }

    @media (max-width:1200px){
      .baskets{ grid-template-columns:repeat(2,minmax(210px,1fr)); }
      .top-grid{ grid-template-columns:1fr; }
    }
    @media (max-width:640px){
      .baskets{ grid-template-columns:1fr; }
    }
  
    /* === PROWIZJA === */
    .commission-summary{display:grid;grid-template-columns:280px 1fr;gap:12px;margin:0 10px 10px;}
    .commission-total{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px;box-shadow:0 2px 8px rgba(0,0,0,.04);}
    .commission-total .label{font-size:13px;color:var(--muted);font-weight:700;}
    .commission-total .value{font-size:32px;font-weight:900;margin-top:4px;color:#047857;}
    .commission-settings{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
    .commission-settings input{width:100px;text-align:center;}
    .commission-card{margin:0 10px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px;box-shadow:0 2px 8px rgba(0,0,0,.04);}
    .commission-table-wrap{overflow:auto;max-height:calc(100vh - 220px);border:1px solid var(--line);border-radius:9px;background:#fff;}
    .commission-table{min-width:1180px;table-layout:fixed;}
    .commission-table th.col-nr, .commission-table td.col-nr{width:150px;min-width:150px;max-width:150px;}
    .commission-table th.col-opis, .commission-table td.col-opis{width:34%;text-align:left;}
    .commission-table th{position:sticky;top:0;z-index:3;background:#f9fafb;white-space:normal;overflow:visible;text-overflow:clip;line-height:1.2;}
    .commission-table td.col-nr, .commission-table td.col-opis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
    .commission-table td{padding:5px 6px;text-align:center;border-bottom:1px solid var(--line);}
    .commission-table input{width:100%;height:26px;text-align:center;}
    .commission-table .commission-readonly{background:#f3f4f6;color:#4b5563;}
    .commission-table .commission-value{font-weight:800;color:#047857;}
    .commission-extra-row td{background:#f8fafc;}
    .commission-extra-label{text-align:right!important;font-weight:800;color:#475569;}
    .commission-extra-actions{display:flex;gap:5px;align-items:center;margin-top:4px;}
    .commission-extra-actions button{padding:3px 6px;font-size:10px;}
    /* PROWIZJA: pola do wpisywania węższe o 25%, więcej miejsca na opis */
    .commission-table{min-width:1280px;}
    .commission-table th.col-opis, .commission-table td.col-opis{width:43%;}
    .commission-table th:nth-child(3){width:120px;}
    .commission-table th:nth-child(4){width:130px;}
    .commission-table th:nth-child(5){width:120px;}
    .commission-table th:nth-child(6){width:72px;}
    .commission-table th:nth-child(7){width:125px;}
    .commission-table th:nth-child(8){width:100px;}
    .commission-table input[type="number"]{width:75%;margin-left:auto;margin-right:auto;display:block;}
    @media(max-width:700px){.commission-summary{grid-template-columns:1fr;}}

  
    /* === STAŁY PORADNIK SYNCHRONIZACJI === */
    .calculator-with-guide{
      display:grid;
      grid-template-columns:minmax(0,1fr) 260px;
      gap:16px;
      align-items:start;
      width:100%;
    }
    .calculator-with-guide > .container{
      min-width:0;
      width:100%;
    }
    #tab-kalkulator .table-wrap{
      width:100%;
      max-width:100%;
      overflow:auto;
    }
    #tab-kalkulator .sync-guide{
      min-width:0;
      width:260px;
    }
    @media (min-width:1101px){
      .tabs-container{max-width:1700px;}
    }
    .sync-guide{
      position:sticky;
      top:58px;
      background:var(--card);
      border:1px solid var(--line);
      border-radius:10px;
      padding:12px;
      box-shadow:0 2px 8px rgba(0,0,0,.04);
      font-size:12px;
      line-height:1.45;
    }
    .sync-guide h3{margin:0 0 9px;font-size:14px;}
    .sync-guide ol{margin:5px 0 12px;padding-left:20px;}
    .sync-guide li{margin:0 0 6px;}
    .sync-guide p{margin:6px 0;}
    .sync-guide .guide-warning{
      margin-top:10px;
      padding:8px;
      border:1px solid #f59e0b;
      border-radius:7px;
      background:#fffbeb;
      color:#92400e;
    }
    @media (max-width:1100px){
      .calculator-with-guide{grid-template-columns:1fr;}
      .sync-guide{position:static;}
    }
  
    .excel-readonly {
      cursor: default !important;
      user-select: text;
    }
    .excel-readonly:focus {
      outline: 2px solid rgba(100, 116, 139, .35);
      outline-offset: -2px;
    }

    /* === ADMINISTRACJA === */
    .admin-card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:18px;margin:0 10px;box-shadow:0 2px 8px rgba(0,0,0,.04)}
    .admin-toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:12px 0}
    .admin-toolbar input{min-width:280px;padding:9px 10px;border:1px solid var(--line);border-radius:7px}
    .admin-table{width:100%;border-collapse:collapse;margin-top:12px}
    .admin-table th,.admin-table td{border:1px solid var(--line);padding:9px;text-align:left}
    .admin-table th{background:#f1f5f9}
    .admin-status{font-weight:700}
    .admin-status.registered{color:var(--ok)}
    .admin-status.pending{color:var(--warn)}
    .admin-message{margin-top:10px;min-height:18px}

.admin-reset-password-btn{white-space:nowrap}
.admin-reset-password-btn:disabled{opacity:.65;cursor:wait}

/* === PREMIA — ORANGE AUTH UI === */
#authOverlay{
  position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;
  padding:24px;overflow:auto;background:#f3f4f6;
  background-image:radial-gradient(circle at 86% 12%,rgba(255,121,0,.12),transparent 34%),linear-gradient(135deg,#ffffff 0%,#f5f5f5 62%,#eeeeee 100%);
}
#authOverlay::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg,transparent 0 68%,rgba(255,121,0,.055) 68% 100%);
}
#authOverlay::after{
  content:"";position:absolute;right:-15vw;bottom:-25vh;width:52vw;height:58vh;
  background:linear-gradient(145deg,#ff7900,#ff8a00);clip-path:polygon(48% 0,100% 0,100% 100%,0 100%);opacity:.96;pointer-events:none;
}
#authCard{
  position:relative;z-index:1;width:min(480px,100%);padding:42px 44px 34px;
  background:#fff;border:1px solid #d9d9d9;border-radius:22px;overflow:hidden;
  box-shadow:0 28px 75px rgba(0,0,0,.16),0 8px 25px rgba(0,0,0,.06);
}
#authCard::after{content:"";position:absolute;left:0;right:0;bottom:0;height:6px;background:#ff7900}
.auth-logo-wrap{display:flex;justify-content:center;margin:0 0 22px}
.auth-logo{display:block;width:78px;height:78px;object-fit:contain}
#authCard h2{
  margin:0;text-align:center;color:#111;font-size:42px;line-height:1.05;
  letter-spacing:-.045em;font-weight:800;
}
#authCard .auth-login-title{
  font-size:34px;letter-spacing:-.035em;font-weight:800;
}
#authCard .auth-credit{
  position:absolute;right:18px;bottom:14px;color:#777;font-size:11px;font-weight:500;
}
#authCard .auth-subtitle{
  margin:11px 0 28px;text-align:center;color:#6b6b6b;font-size:14px;line-height:1.45;font-weight:500;
}
#authCard .auth-divider{height:1px;background:#e7e7e7;margin:0 0 23px}
.auth-field{margin:0 0 16px}
.auth-field label{display:block;margin:0 0 7px;color:#222;font-size:13px;font-weight:800}
.auth-field input{
  width:100%;height:48px;padding:0 14px;border:1px solid #cfcfcf;border-radius:9px;
  background:#fff;color:#111;font:inherit;font-size:14px;outline:none;
  transition:border-color .18s,box-shadow .18s;
  box-sizing:border-box;
}
.auth-field input:focus{border-color:#ff7900;box-shadow:0 0 0 4px rgba(255,121,0,.13)}
.auth-password-wrap{position:relative}
.auth-password-wrap input{padding-right:48px}
.auth-eye{
  position:absolute;right:9px;bottom:8px;width:32px;height:32px;border:0;background:transparent;
  color:#777;border-radius:7px;cursor:pointer;font-size:15px;box-shadow:none!important;padding:0;
}
.auth-eye:hover{background:#f4f4f4;color:#111}
#authLoginBtn,#authRegisterSubmitBtn{
  width:100%;height:50px;margin-top:7px;padding:0 18px;border:0;border-radius:9px;
  background:#ff7900;color:#fff;font-weight:800;font-size:14px;cursor:pointer;
  box-shadow:0 8px 18px rgba(255,121,0,.22);transition:transform .15s,background .15s,box-shadow .15s;
}
#authLoginBtn:hover,#authRegisterSubmitBtn:hover{background:#e86f00;transform:translateY(-1px);box-shadow:0 11px 22px rgba(255,121,0,.28)}
#authLoginBtn:active,#authRegisterSubmitBtn:active{transform:translateY(0)}
#authLoginBtn:disabled,#authRegisterSubmitBtn:disabled{opacity:.65;cursor:wait;transform:none}
#authRegisterBtn{
  width:100%;margin-top:17px;padding:9px;border:0;background:transparent;color:#ff7900;
  font-size:13px;font-weight:800;cursor:pointer;box-shadow:none;
}
#authRegisterBtn:hover{text-decoration:underline;text-underline-offset:3px;background:transparent}
#authForgotBtn{
  width:100%;margin-top:7px;padding:6px 9px;border:0;background:transparent;color:#666;
  font-size:12px;font-weight:700;cursor:pointer;box-shadow:none;
}
#authForgotBtn:hover{color:#ff7900;text-decoration:underline;text-underline-offset:3px;background:transparent}
#authResetView h2{font-size:32px}
#authResetView .auth-subtitle{margin-bottom:22px}
#authMfaSetupBtn,#authMfaChallengeBtn{display:block;width:100%;border:0;border-radius:10px;padding:13px 15px;background:#ff7900;color:#fff;font-weight:900;cursor:pointer;box-shadow:0 8px 18px rgba(255,121,0,.22)}
.auth-mfa-actions .auth-back-btn{display:block;width:100%;border:0;border-radius:10px;padding:11px 15px;background:#f4f4f4;color:#555;font-weight:800;cursor:pointer}
#authResetSubmitBtn{
  width:100%;height:50px;margin-top:7px;padding:0 18px;border:0;border-radius:9px;
  background:#ff7900;color:#fff;font-weight:800;font-size:14px;cursor:pointer;
  box-shadow:0 8px 18px rgba(255,121,0,.22);transition:transform .15s,background .15s,box-shadow .15s;
}
#authResetSubmitBtn:hover{background:#e86f00;transform:translateY(-1px);box-shadow:0 11px 22px rgba(255,121,0,.28)}
#authResetSubmitBtn:disabled{opacity:.65;cursor:wait;transform:none}
#authBackResetBtn{
  width:100%;margin-top:10px;padding:9px;border:0;border-radius:8px;background:transparent;
  color:#666;font-size:12px;font-weight:700;cursor:pointer;box-shadow:none;
}
#authBackResetBtn:hover{color:#111;background:#f7f7f7}
#authBackBtn{
  width:100%;margin-top:10px;padding:9px;border:0;border-radius:8px;background:transparent;
  color:#666;font-size:12px;font-weight:700;cursor:pointer;box-shadow:none;
}
#authBackBtn:hover{color:#111;background:#f7f7f7}
#authRegisterView h2{font-size:32px}
#authRegisterView .auth-subtitle{margin-bottom:22px}
#authStatus{margin-top:16px;padding:11px 12px;border-radius:9px;white-space:pre-wrap;font-size:12px;line-height:1.45}
#authStatus:empty{display:none}
.auth-mfa-box{margin-top:8px}
.auth-mfa-box h2{font-size:28px}
.auth-mfa-help{font-size:13px;line-height:1.5;color:#555;margin-bottom:18px}
.auth-mfa-qr{display:flex;justify-content:center;margin:12px 0 18px}
.auth-mfa-qr img{width:190px;height:190px;border:1px solid #e5e5e5;border-radius:12px;padding:8px;background:#fff}
.auth-mfa-code{letter-spacing:.28em;text-align:center;font-size:22px;font-weight:800}
.auth-mfa-actions{display:flex;gap:8px;flex-direction:column}
.auth-mfa-trust{display:flex;align-items:center;gap:8px;font-size:12px;color:#555;margin:12px 0 16px}
.auth-mfa-trust input{width:16px;height:16px;accent-color:#ff7900}
#authStatus.err{background:#fff0ed;color:#b22d16;border:1px solid #f2c0b6}
#authStatus.ok{background:#edf9ee;color:#20752b;border:1px solid #bfe5c2}
#appUserBar{position:fixed;right:12px;bottom:12px;z-index:1000;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:7px 10px;box-shadow:0 5px 20px rgba(0,0,0,.1);font-size:11px;display:none}
#appUserBar button{margin-left:8px;border:0;border-radius:6px;padding:5px 8px;cursor:pointer}
@media (max-width:640px){
  #authOverlay{padding:16px}
  #authCard{width:min(470px,100%);padding:34px 25px 29px;border-radius:18px}
  .auth-logo{width:66px;height:66px}
  #authCard h2{font-size:36px}
  #authOverlay::after{right:-35vw;width:85vw;height:45vh}
}

/* =========================================================
   PREMIA — ORANGE PREMIUM APP THEME
   Visual-only redesign. Existing HTML/JS/data logic unchanged.
   ========================================================= */
:root{
  --orange:#ff7900;
  --orange-dark:#e86f00;
  --orange-soft:#fff4e8;
  --orange-pale:#fff9f3;
  --ink:#111111;
  --text:#242424;
  --muted:#6b6b6b;
  --line:#dedede;
  --line-strong:#c8c8c8;
  --bg:#f5f5f5;
  --card:#ffffff;
  --primary:var(--orange);
  --primary-hover:var(--orange-dark);
  --danger:#e53935;
  --warn:#f59e0b;
  --ok:#1d9b45;
}

html{background:var(--bg)}
body{
  background:
    radial-gradient(circle at 100% 0, rgba(255,121,0,.07), transparent 24rem),
    linear-gradient(180deg,#f7f7f7 0,#f3f3f3 100%);
  color:var(--text);
}

/* Main application navigation */
.tabs-container{
  max-width:1700px;
  margin:0 auto;
  padding:0 12px 22px;
}
.tabs-header{
  position:sticky;
  top:0;
  z-index:500;
  gap:3px;
  padding:10px 12px 0;
  min-height:58px;
  background:rgba(255,255,255,.96);
  border:1px solid #d9d9d9;
  border-top:4px solid var(--orange);
  border-radius:0 0 14px 14px;
  box-shadow:0 8px 24px rgba(0,0,0,.07);
  backdrop-filter:blur(10px);
}
.tabs-header:before{
  content:"";
  flex:0 0 76px;
  height:30px;
  margin:4px 10px 8px 2px;
  background:url('https://boosted.orange.com/docs/5.3/assets/brand/orange-logo.svg') center/contain no-repeat;
}
.tab-btn{
  position:relative;
  padding:12px 17px;
  color:#5b5b5b;
  font-size:12px;
  letter-spacing:.02em;
  border:0;
  border-radius:9px 9px 0 0;
  background:transparent;
  transition:color .18s,background .18s,transform .18s;
}
.tab-btn:hover{color:var(--ink);background:var(--orange-soft);transform:translateY(-1px)}
.tab-btn.active{
  color:var(--ink);
  background:var(--orange-soft);
  border:0;
  margin-bottom:0;
}
.tab-btn.active:after{
  content:"";
  position:absolute;
  left:16px;right:16px;bottom:0;
  height:3px;
  border-radius:3px 3px 0 0;
  background:var(--orange);
}
.tab-btn.admin-only-tab{color:#b34f00}
.tab-content{padding-top:14px}

/* Cards / section surfaces */
.card,.excel-preview-card,.commission-total,.commission-settings,.commission-card,.admin-card,.sync-guide{
  background:rgba(255,255,255,.98);
  border:1px solid var(--line);
  border-radius:16px;
  box-shadow:0 10px 30px rgba(0,0,0,.055);
}
.card{padding:16px}
.card>h1,.card>h2{color:var(--ink);letter-spacing:-.02em}
h1{font-size:22px}
h2{font-size:17px}

/* Section headings gain a subtle Orange accent */
.card>h1:first-child:after,.card>h2:first-child:after{
  content:"";
  display:block;
  width:42px;
  height:3px;
  margin-top:7px;
  border-radius:3px;
  background:var(--orange);
}

/* KPI baskets */
.baskets{gap:10px}
.basket{
  border:1px solid #e1e1e1;
  border-radius:13px;
  padding:11px;
  background:linear-gradient(180deg,#fff,#fafafa);
  box-shadow:0 5px 15px rgba(0,0,0,.035);
  transition:transform .16s,box-shadow .16s,border-color .16s;
}
.basket:hover{transform:translateY(-2px);border-color:#ffc58f;box-shadow:0 10px 22px rgba(255,121,0,.09)}
.basket .name{color:var(--ink);font-size:13px;letter-spacing:.04em}
.basket input,.accessories-input,
button,select,input{
  border-color:var(--line-strong);
}
.basket input:focus,.accessories-input:focus,input:focus,select:focus{
  border-color:var(--orange)!important;
  box-shadow:0 0 0 3px rgba(255,121,0,.12);
  outline:none;
}
.kpi-progress,.goal-bar-wrap{background:#eee;border-color:#ddd}
.kpi-progress-bar,.goal-bar{background:var(--orange)}
.goal-panel{
  border:1px solid #e2e2e2;
  border-radius:16px;
  background:linear-gradient(145deg,#fff 0%,#fff9f3 100%);
  box-shadow:0 10px 28px rgba(255,121,0,.08);
}
.goal-title{color:var(--ink)}
.goal-percent{color:var(--ink)}
.accessories-label{color:#555}

/* General controls */
button{
  background:var(--orange);
  border-color:var(--orange);
  border-radius:9px;
  padding:7px 11px;
  box-shadow:0 3px 9px rgba(255,121,0,.14);
}
button:hover{background:var(--orange-dark)}
button.btn-secondary{
  background:#fff;
  color:#333;
  border-color:#cfcfcf;
  box-shadow:none;
}
button.btn-secondary:hover{background:var(--orange-soft);border-color:#ffbd7c;color:#111}
button.btn-sync{background:#111;border-color:#111}
button.btn-sync:hover{background:#2b2b2b}
button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--orange);outline-offset:2px}

/* Data tables */
.table-wrap,.commission-table-wrap,.excel-table-wrapper{
  border-color:#d8d8d8;
  border-radius:12px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
thead th,.commission-table th{
  background:#171717;
  color:#fff;
  border-bottom-color:#171717;
}
tbody td,.commission-table td{border-bottom-color:#e4e4e4}
tbody tr:hover td{background:#fff9f3}
td input[type="text"],td input[type="date"],td input[type="number"],td select{
  border-color:#d0d0d0;
  border-radius:7px;
  background:#fff;
}
td input[type="text"]:focus,td input[type="date"]:focus,td input[type="number"]:focus,td select:focus{
  border-color:var(--orange)!important;
  box-shadow:0 0 0 3px rgba(255,121,0,.11);
}
tr.row-status-kompletne td{background:#eaf8ef}
tr.row-status-w-realizacji td{background:#fff4d8}
.status-w-realizacji{color:#a65300;background:#fff1c7;border-color:#ffc15c}
.status-kompletne{color:#147b36;background:#e4f7ea;border-color:#8dd3a1}
.delete-btn{border-color:#efb0a8;color:#d93c2e;background:#fff}
.delete-btn:hover{background:#fff0ed;border-color:#e05b4d}

/* Excel views */
.excel-preview-card{padding:16px}
.excel-table-wrapper{background:#fff;padding:10px}
.excel-table-wrapper:focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,121,0,.11)}
.excel-table-wrapper td,.excel-table-wrapper th{border-color:#d2d2d2}

/* Sync area */
.sync-bar{
  background:#fafafa;
  border-color:#dedede;
  border-radius:12px;
}
.sync-status.ok{color:#1d7c3b}
.sync-status.warn{color:#a45a00}

/* Commission */
.commission-summary{margin:0 10px 12px}
.commission-total .value{color:var(--orange)}
.commission-extra-row td{background:#fffaf5}
.commission-value{color:#c95f00!important}

/* Administration */
.admin-card{padding:20px}
.admin-card h2,.admin-card h3{color:var(--ink)}
.admin-table th{background:#171717;color:#fff;border-color:#333}
.admin-table td{border-color:#dedede}
.admin-table tr:hover td{background:#fff9f3}
.admin-status.registered{color:#16823a}
.admin-status.pending{color:#c05b00}

/* User status / logout */
#appUserBar{
  right:16px;bottom:16px;
  background:#171717;
  color:#fff;
  border:1px solid #2c2c2c;
  border-radius:12px;
  box-shadow:0 12px 30px rgba(0,0,0,.2);
}
#appUserBar .user{color:#ffad66}
#appUserBar button{background:var(--orange);border-color:var(--orange);box-shadow:none}
#appUserBar button:hover{background:var(--orange-dark)}

/* Responsive navigation */
@media(max-width:900px){
  .tabs-container{padding:0 6px 14px}
  .tabs-header{padding-left:7px;padding-right:7px;overflow-x:auto}
  .tabs-header:before{flex-basis:58px;width:58px;margin-right:4px}
  .tab-btn{padding:11px 12px}
}
@media(max-width:640px){
  .tabs-header{border-radius:0 0 10px 10px}
  .tabs-header:before{display:none}
  .card{padding:12px;border-radius:13px}
  .admin-card,.excel-preview-card,.commission-card{margin-left:4px;margin-right:4px}
}

.is-hidden{display:none!important}.ml-8{margin-left:8px}.m-0{margin:0}.mt-0{margin-top:0}