/* Design tokens */
:root{
  --color-primary: #5865F2;
  --color-primary-600:#4353E6;
  --color-secondary:#ffffff;
  --color-text:#0f172a; /* slate-900 */
  --color-muted:#64748b; /* slate-500 */
  --color-surface:#ffffff;
  --color-border:#e5e7eb; /* gray-200 */
  --gray-50:#F7F8FA; --gray-100:#EFF1F5; --gray-300:#D6DAE1; --gray-700:#3B4251; --gray-900:#111827;
  --success-500:#33C38C; --danger-500:#F04438;
  --radius-md:12px;
  --radius-lg:16px;
  --shadow-1:0 8px 28px rgba(16,24,40,.08);
  --shadow-focus:0 0 0 3px rgba(88,101,242,.25);
  /* New brand and theme tokens (blue-first + violet finish) */
  /* Navy-leaning blue palette */
  --brand-900:#0B1E6D; --brand-700:#1E3A8A; --brand-600:#1D4ED8; --brand-500:#2563EB; 
  --brand-300:#93C5FD; --brand-50:#EFF6FF;
  --accent-700:#6D28D9; --accent-600:#7C3AED;
  /* Blue-only gradients (bez fioletu) */
  /* Proporcje: mocniejszy 0-60%, jaśniejszy 60-100% */
  --grad-sidebar: linear-gradient(180deg, var(--brand-900) 0%, var(--brand-900) 60%, var(--brand-700) 100%);
  --grad-button:  linear-gradient(90deg,  var(--brand-700) 0%, var(--brand-700) 60%, var(--brand-500) 100%);
  --grad-hero: linear-gradient(135deg, var(--brand-50) 0%, #dbeafe 45%, var(--brand-300) 100%);
  --bg:#F8FAFC; --surface:#FFFFFF; --surface-2:#F1F5F9; --border:#E5E7EB;
  --text:#0F172A; --text-muted:#475569; --ring:#60A5FA;
  --success:#10B981; --warning:#F59E0B; --error:#EF4444; --info:#3B82F6;
  --elev-1: 0 8px 28px rgba(16,24,40,.18);
  --elev-2: 0 12px 48px rgba(124,58,237,.18);
}



@font-face {
  font-family: 'Inter';
  src: url('/fonts/inter/InterVariable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('/fonts/inter/InterVariable-Italic.woff2') format('woff2');
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

html, body {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
  margin: 0;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  scroll-behavior: smooth;
}

/* Remove forced scrollbar reservation; only show when needed */

a, .btn-link { color: var(--brand-700); }
a:hover{ color: var(--brand-500); }

/* Buttons */
.btn-primary{
  color:#fff; border:0; border-radius: var(--radius-md);
  background: var(--brand-700);
  box-shadow: 0 0 0 0 rgba(96,165,250,0);
  transition: box-shadow .25s ease, transform .05s ease, background-color .2s ease;
}
.btn-primary:hover{ background: var(--brand-900); box-shadow: 0 0 0 3px rgba(11,30,109,.28), 0 6px 18px rgba(37,99,235,.22); transform: none; }
.btn-primary:focus-visible{ outline:none; box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--ring); }
.btn-primary:disabled{ opacity:.6; cursor:not-allowed; }

/* Usunięto wyjątek: hover dla primary jest spójny globalnie */

.btn-secondary{
  color: var(--text);
  background: var(--surface);
  border:1px solid var(--border);
  border-radius: var(--radius-md);
  box-shadow: var(--elev-1);
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.btn-secondary:hover{ background:#e3e8ff; border-color:#7c89ff; box-shadow:0 0 0 3px rgba(88,101,242,.18), var(--elev-1); transform: translateY(-1px); }
.btn-secondary:active{ background:#dbe1ff; border-color:#6c78ff; box-shadow:0 0 0 3px rgba(88,101,242,.24), 0 2px 8px rgba(16,24,40,.12); }
.btn-secondary:focus-visible{ outline:2px solid rgba(88,101,242,.45); outline-offset:2px; }

/* Outline secondary (used w list/table actions) */
.btn-outline-secondary{
  color: var(--text);
  background: var(--surface);
  border:1px solid var(--border);
  border-radius: var(--radius-md);
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.btn-outline-secondary:hover{ background:#e3e8ff; border-color:#7c89ff; box-shadow:0 0 0 3px rgba(88,101,242,.18), var(--elev-1); transform: translateY(-1px); }
.btn-outline-secondary:focus-visible{ outline:2px solid rgba(88,101,242,.45); outline-offset:2px; }
/* Align success button style with outline-secondary: same radius and subtle lift on hover */
.btn-success{
  color:#fff;
  background-color: var(--success) !important; /* ciemniejszy odcien */
  border-color: var(--success) !important;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-1);
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .12s ease;
}
.btn-success:hover{ background-color:#0f9d74 !important; border-color:#0f9d74 !important; box-shadow:0 0 0 3px rgba(16,185,129,.18), var(--elev-1); transform: translateY(-1px); }
.btn-success:focus{ box-shadow: 0 0 0 3px var(--ring); }
.btn-success:active{ background-color:#0c7a5b !important; border-color:#0c7a5b !important; }
/* Gdy przycisk jest nieaktywny, zachowaj pelna nieprzezroczystosc */
.btn-success:disabled, .btn-success.disabled{
  background-color:var(--success) !important; border-color:var(--success) !important; opacity:1; filter:none;
}
/* Ikonowy toggle kierunku sortowania: bez stałej szerokości */
.btn-sort-dir{ min-width:auto; white-space:nowrap; text-align:center; display:inline-flex; align-items:center; justify-content:center; line-height:1; }
.btn-sort-dir .bi-mini{ width:1.35em; height:1.35em; display:block; background-position:center center; vertical-align:middle; }

/* Simple carets (bez obramowania) */
.bi-caret-up-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 10 L8 6 L12 10' stroke='currentColor' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.bi-caret-down-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6 L8 10 L12 6' stroke='currentColor' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }

/* Refresh (dwie goniące się strzałki) */
.bi-refresh-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4.5 6.5A4 4 0 0 1 12 6.5' stroke='currentColor' stroke-width='1.2' stroke-linecap='round'/%3E%3Cpath d='M4 6l.5 1.5L6 7' stroke='currentColor' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M11.5 9.5A4 4 0 0 1 4 9.5' stroke='currentColor' stroke-width='1.2' stroke-linecap='round'/%3E%3Cpath d='M12 10l-.5-1.5L10 8' stroke='currentColor' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }

/* Copy icon (double squares) */
.bi-copy-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Crect x='5' y='2.5' width='8' height='10.5' rx='1.5' stroke='currentColor' stroke-width='1.2'/%3E%3Crect x='2.5' y='5' width='8' height='8.5' rx='1.5' stroke='currentColor' stroke-width='1.2'/%3E%3C/svg%3E"); }

/* Lock / unlock icons */
.bi-lock-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Crect x='3' y='7' width='10' height='7' rx='1.5' stroke='currentColor' stroke-width='1.2'/%3E%3Cpath d='M5.5 7V5a2.5 2.5 0 0 1 5 0v2' stroke='currentColor' stroke-width='1.2' stroke-linecap='round'/%3E%3Ccircle cx='8' cy='10.5' r='0.9' fill='currentColor'/%3E%3Cpath d='M8 11.4v1.3' stroke='currentColor' stroke-width='1.1' stroke-linecap='round'/%3E%3C/svg%3E"); }
.bi-unlock-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Crect x='3' y='7' width='10' height='7' rx='1.5' stroke='currentColor' stroke-width='1.2'/%3E%3Cpath d='M10.5 7V5a2.5 2.5 0 1 0-5 0' stroke='currentColor' stroke-width='1.2' stroke-linecap='round'/%3E%3Ccircle cx='8' cy='10.5' r='0.9' fill='currentColor'/%3E%3Cpath d='M8 11.4v1.3' stroke='currentColor' stroke-width='1.1' stroke-linecap='round'/%3E%3C/svg%3E"); }

/* Większa ikona i lekka animacja przy Odśwież */
.btn-refresh .bi-mini{ width:1.5em; height:1.5em; display:block; background-position:center; }
.btn-refresh .bi-refresh-mini{ transform: rotate(0deg); transition: transform .4s ease; }
.btn-refresh:active .bi-refresh-mini{ transform: rotate(360deg); }

/* Mini icon system (global) */
.bi-mini{ display:inline-block; width:1em; height:1em; background-repeat:no-repeat; background-size:1em 1em; vertical-align:-0.125em; }
.bi-list-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'%3E%3Cpath d='M2 12.5a.5.5 0 0 1 .5-.5H14a.5.5 0 0 1 0 1H2.5a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5H14a.5.5 0 0 1 0 1H2.5a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5H14a.5.5 0 0 1 0 1H2.5a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E"); }
.bi-sort-asc-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Ccircle cx='8' cy='8' r='6.2' stroke='currentColor' stroke-width='1.2'/%3E%3Cpath d='M5.4 9.6L8 7l2.6 2.6' stroke='currentColor' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.bi-sort-desc-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Ccircle cx='8' cy='8' r='6.2' stroke='currentColor' stroke-width='1.2'/%3E%3Cpath d='M5.4 6.4L8 9l2.6-2.6' stroke='currentColor' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.bi-share-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Crect x='3' y='2' width='10' height='12' rx='1.5' ry='1.5' fill='none' stroke='currentColor' stroke-width='1' stroke-linejoin='round'/%3E%3Cpath d='M10 2.75 L13 5.75' fill='none' stroke='currentColor' stroke-width='1' stroke-linecap='round'/%3E%3C/svg%3E"); }
/* Alias for share icon, used in some components */
.bi-link-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Crect x='3' y='2' width='10' height='12' rx='1.5' ry='1.5' fill='none' stroke='currentColor' stroke-width='1' stroke-linejoin='round'/%3E%3Cpath d='M10 2.75 L13 5.75' fill='none' stroke='currentColor' stroke-width='1' stroke-linecap='round'/%3E%3C/svg%3E"); }
/* Fullscreen (arrows to corners) */
.bi-fullscreen-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='currentColor'%3E%3Cpath d='M5 1.5a.5.5 0 0 1 .5.5v2h2a.5.5 0 0 1 0 1H4.5A.5.5 0 0 1 4 4.5V1.5a.5.5 0 0 1 1 0z'/%3E%3Cpath d='M11 1.5a.5.5 0 0 1 .5.5v3.5H8a.5.5 0 0 1 0-1h2V2a.5.5 0 0 1 .5-.5z'/%3E%3Cpath d='M12 8a.5.5 0 0 1 .5.5V12a.5.5 0 0 1-.5.5H8a.5.5 0 0 1 0-1h3.5V8.5A.5.5 0 0 1 12 8z'/%3E%3Cpath d='M4 8a.5.5 0 0 1 .5.5V11h2a.5.5 0 0 1 0 1H4a.5.5 0 0 1-.5-.5V8.5A.5.5 0 0 1 4 8z'/%3E%3C/svg%3E"); }
/* Maximize (corner brackets) */
.bi-maximize-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2.5 5V2.5H5' stroke='currentColor' stroke-width='1.2' stroke-linecap='round'/%3E%3Cpath d='M11 2.5h2.5V5' stroke='currentColor' stroke-width='1.2' stroke-linecap='round'/%3E%3Cpath d='M11 13.5h2.5V11' stroke='currentColor' stroke-width='1.2' stroke-linecap='round'/%3E%3Cpath d='M5 13.5H2.5V11' stroke='currentColor' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E"); }
/* External/Open in new (arrow to NE) */
.bi-open-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Crect x='2.75' y='4.25' width='8.5' height='8.5' rx='1.25' stroke='currentColor' stroke-width='1.2'/%3E%3Cpath d='M8.5 3.5H13v4.5' stroke='currentColor' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M7 9l6-6' stroke='currentColor' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E"); }
/* Expand corners (four corner marks) */
.bi-expand-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3 6V3h3' stroke='currentColor' stroke-width='1.2' stroke-linecap='round'/%3E%3Cpath d='M10 3h3v3' stroke='currentColor' stroke-width='1.2' stroke-linecap='round'/%3E%3Cpath d='M13 10v3h-3' stroke='currentColor' stroke-width='1.2' stroke-linecap='round'/%3E%3Cpath d='M6 13H3v-3' stroke='currentColor' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E"); }

/* Clock icon used by "Grafik" buttons (global) */
.bi-clock-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'%3E%3Cpath d='M8 3.5a.5.5 0 0 1 .5.5v3.25l2.5 1.5a.5.5 0 1 1-.5.866l-2.75-1.65A.5.5 0 0 1 7.5 7V4a.5.5 0 0 1 .5-.5z'/%3E%3Cpath d='M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16zM1 8a7 7 0 1 1 14 0A7 7 0 0 1 1 8z'/%3E%3C/svg%3E"); }

/* Info symbol (i) */
.bi-info-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='currentColor'%3E%3Cpath d='M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14z' fill='none' stroke='currentColor' stroke-width='1.2'/%3E%3Cpath d='M7.25 7.25h1.5v5h-1.5zM8 4.75a.75.75 0 1 1 0 1.5.75.75 0 0 1 0-1.5z'/%3E%3C/svg%3E"); }

/* Question mark for empty notes */
.bi-question-mini{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='currentColor'%3E%3Cpath d='M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14z' fill='none' stroke='currentColor' stroke-width='1.2'/%3E%3Cpath d='M6.5 6.75a2 2 0 1 1 3.2 1.6c-.5.36-.7.56-.7 1.4h-1.5c0-1.22.36-1.78 1.02-2.25.33-.24.48-.48.48-.8a.8.8 0 0 0-1.6 0H6.5zM8 12.5a.9.9 0 1 1 0-1.8.9.9 0 0 1 0 1.8z'/%3E%3C/svg%3E"); }

/* Table helpers */
.table-modern .col-fit { width: 1%; white-space: nowrap; }
/* Row state colors for table-modern (Bootstrap-like) */
.table-modern tbody tr.table-danger{ background:#f8d7da; }
.table-modern tbody tr.table-warning{ background:#fff3cd; }
.table-modern tbody tr.table-success{ background:#d1e7dd; }

/* Stronger shared hover for white buttons */
.btn-secondary:hover:not(:disabled),
.btn-outline-secondary:hover:not(:disabled){ color: var(--text); }
.btn-sm{ padding:.25rem .5rem; font-size:.875rem; border-radius: var(--radius-md); }

/* Icon-only buttons for row actions */
.btn-icon{ width:32px; height:32px; border-radius:9999px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--border); background:var(--surface); color:var(--text); box-shadow: var(--elev-1); padding:0; }
.btn-icon:hover{ background:#f8fafc; border-color:#d1d5db; }
.btn-icon:focus{ box-shadow: 0 0 0 3px var(--ring); outline:none; }
.btn-icon .ic{ display:inline-block; width:16px; height:16px; background-size:16px 16px; background-repeat:no-repeat; }
/* Generic inline icon utility */
.ic{ display:inline-block; width:16px; height:16px; background-size:16px 16px; background-repeat:no-repeat; vertical-align:-0.125em; }

/* Minimal inline SVG icons (data-URI) */
.ic-edit{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M11.013 1.427a1.5 1.5 0 0 1 2.12 2.12l-8.2 8.2-3.46.77.77-3.46 8.77-7.63z' fill='%2327346b'/%3E%3C/svg%3E"); }
.ic-link{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 8.5a3 3 0 0 1 0-4.24l2.12-2.12a3 3 0 0 1 4.24 4.24L11.9 7.24' stroke='%2327346b' stroke-width='1.5' fill='none'/%3E%3Cpath d='M9.5 7.5a3 3 0 0 1 0 4.24l-2.12 2.12a3 3 0 1 1-4.24-4.24L4.1 8.76' stroke='%2327346b' stroke-width='1.5' fill='none'/%3E%3C/svg%3E"); }
.ic-copy{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Crect x='3' y='3' width='9' height='9' rx='2' ry='2' fill='none' stroke='%2327346b' stroke-width='1.3'/%3E%3Crect x='5' y='5' width='9' height='9' rx='2' ry='2' fill='none' stroke='%2327346b' stroke-width='1.3'/%3E%3C/svg%3E"); }
.ic-end{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='8' fill='%235865F2'/%3E%3Cpath d='M11 6L7.25 9.75 5.5 8' fill='none' stroke='white' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E"); }
.ic-delete{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='8' fill='%23F04438'/%3E%3Cpath d='M5.5 5.5l5 5m0-5l-5 5' stroke='white' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E"); }
.ic-schedule{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Crect x='2' y='3' width='12' height='11' rx='2' ry='2' fill='none' stroke='%2327346b' stroke-width='1.3'/%3E%3Cpath d='M4 1.5v3M12 1.5v3M2 6h12' stroke='%2327346b' stroke-width='1.3'/%3E%3C/svg%3E"); }
/* User icon for topbar greeting */
.ic-user{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='6' r='3' fill='%2327346b'/%3E%3Cpath d='M2.5 14c0-3 2.5-5 5.5-5s5.5 2 5.5 5' fill='none' stroke='%2327346b' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E"); }

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-select:focus, .form-check-input:focus { box-shadow: 0 0 0 3px var(--ring); }

.content {
    padding-top: 1.1rem;
    padding-bottom: 4rem; /* extra space so bottom buttons aren't clipped */
}

/* Extra safe area on mobile browsers (iOS bottom bar) */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
  .content { padding-bottom: calc(1.5rem + env(safe-area-inset-bottom)); }
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

/* Cards, inputs, selects */
.card{ border-radius: var(--radius-lg); box-shadow: var(--elev-1); border: 1px solid var(--border); background: var(--surface); }
.card .card-body{ color: var(--text); }
.form-control,.form-select{ border-radius: var(--radius-md); background: var(--surface); color: var(--text); border:1px solid var(--border); }
.form-control::placeholder{ color:#94a3b8; }
.form-control:focus, .form-select:focus{ border-color: var(--brand-500); }

/* Modern table within cards */
.table-modern{ width:100%; border-collapse: separate; border-spacing:0; background:var(--surface); color:var(--text); }
.table-modern thead th{ background: var(--surface-2); color: var(--text); font-weight:600; border-bottom:1px solid var(--border); }
.table-modern th,.table-modern td{ padding:12px 16px; }
.table-modern tbody tr+tr td{ border-top:1px solid var(--border); }
/* Zebra striping for readability */
.table-modern tbody tr:nth-child(odd) td{ background:var(--brand-50); }
.table-modern tbody tr:hover td{ background:#eef3ff; }
/* Ensure row state colors win over zebra/hover */
.table-modern tbody tr.table-danger td{ background:#f8d7da !important; }
.table-modern tbody tr.table-warning td{ background:#fff3cd !important; }
.table-modern tbody tr.table-success td{ background:#d1e7dd !important; }

/* Responsive behavior for non-schedule tables */
@media (max-width: 1400px) and (min-width: 1281px){
  .table-modern{ font-size:.96rem; table-layout: fixed; }
  .table-modern th, .table-modern td{
    padding:10px 12px;
    white-space: normal;
    word-break: break-word;
    overflow-wrap:anywhere;
    hyphens:auto;
    min-width:0;
  }
  .table-modern .text-nowrap{ white-space: normal !important; }
  .table-modern .col-fit{ width:auto; white-space: normal; }
  .table-modern thead th[style], .table-modern tbody td[style]{ width:auto !important; }
}
@media (max-width: 1280px) and (min-width: 1200px){
  .table-modern{ font-size:.90rem; table-layout: fixed; }
  .table-modern th, .table-modern td{
    padding:9px 10px;
    white-space: normal;
    word-break: break-word;
    overflow-wrap:anywhere;
    hyphens:auto;
    min-width:0;
  }
  .table-modern td a{ overflow-wrap:anywhere; word-break:break-word; }
}
@media (max-width: 1199.98px){
  .table-modern{ font-size:.90rem; table-layout: fixed; }
  .table-modern th, .table-modern td{
    padding:8px 10px;
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
    hyphens: auto;
    min-width: 0;
  }
  /* Neutralize nowrap helpers and fixed-width hints on small screens */
  .table-modern .text-nowrap{ white-space: normal !important; }
  .table-modern .col-fit{ width:auto; white-space: normal; }
  .table-modern thead th[style], .table-modern tbody td[style]{ width:auto !important; }
  .table-modern td a{ overflow-wrap:anywhere; word-break:break-word; }
}
@media (max-width: 767.98px){
  .table-modern{ font-size:.85rem; }
  .table-modern th, .table-modern td{ padding:6px 8px; }
}
@media (max-width: 575.98px){
  .table-modern{ font-size:.82rem; }
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: #fff;
}

.blazor-error-boundary::after {
    content: "Wystąpił błąd.";
}

/* Section wrap fix for medium/compact screens (1200-1559px) */
@media (max-width: 1559.98px) and (min-width: 1200px){
  html, body { overflow-x: auto; }
  .content{ max-width:100%; overflow-x: visible; }
  .card{ max-width:100%; overflow-x: visible; }
  /* Ensure header row wraps instead of pushing width */
  .form-header{ flex-wrap: wrap; gap:.5rem; }
  .form-header > *{ min-width:0; }
  .form-header h1{ white-space: normal; text-overflow: clip; overflow: visible; }
}

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}
/* Validation bubble tooltip */
.alert{ border-radius:12px; padding:.9rem 1.1rem; border:1px solid transparent; }
.alert-success{ background: rgba(16,185,129,.1); border-color: rgba(16,185,129,.35); color: var(--success); }
.alert-warning{ background: rgba(245,158,11,.1); border-color: rgba(245,158,11,.35); color: var(--warning); }
.alert-error{ background: rgba(239,68,68,.1); border-color: rgba(239,68,68,.35); color: var(--error); }
.alert-info{ background: rgba(59,130,246,.1); border-color: rgba(59,130,246,.35); color: var(--info); }
.position-wrapper { position: relative; }
.validation-bubble {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: .25rem;
    background: rgba(239,68,68, .95);
    color: #fff;
    border-radius: .25rem;
    padding: .2rem .5rem;
    font-size: .875rem;
    line-height: 1.2;
    box-shadow: 0 2px 6px rgba(0,0,0,.15);
    white-space: nowrap;
}


/* Toasts for copy feedback */
.grafio-toast{
  opacity:0;
  transform:translateY(6px);
  transition:opacity .2s ease, transform .2s ease;
  background:#1f2937;
  color:#f8fafc;
  padding:.6rem .9rem;
  border-radius:var(--radius-md);
  box-shadow:0 8px 24px rgba(15,23,42,.25);
  font-size:.9rem;
  border-left:4px solid transparent;
  cursor:pointer;
  user-select:none;
}
.grafio-toast.show{opacity:1; transform:translateY(0)}
.grafio-toast.hide{opacity:0; transform:translateY(6px)}
.grafio-toast:hover{
  box-shadow:0 12px 32px rgba(15,23,42,.35);
  transform:translateY(0);
}
.grafio-toast.info{background:var(--brand-700); border-left-color:var(--brand-300);}
.grafio-toast.success{background:var(--success); border-left-color:var(--success-500);}
.grafio-toast.error{background:var(--danger-500); border-left-color:#fee2e2;}

/* Password visibility toggle */
.form-control.has-toggle { padding-right: 2.25rem; }
.password-toggle {
  position: absolute;
  top: 50%;
  right: .5rem;
  transform: translateY(-50%);
  background: transparent;
  border: 0;
  color: #6c757d;
  padding: .25rem;
  line-height: 1;
  z-index: 5;
  pointer-events: auto;
}
.password-toggle:focus { outline: none; }
.password-toggle:active { color: #343a40; }
.password-toggle._persist{ color:#212529; }

/* moved local row height to AvailabilityForm.razor.css (scoped) */

/* Auth pages: center panels and modern look */
.auth-center{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  box-sizing:border-box;
}
.page.no-sidebar{
  min-height:100vh;
  overflow:visible;
}
.page.no-sidebar .content{
  flex:1;
  display:flex;
  flex-direction:column;
}
.page.no-sidebar .auth-center{
  flex:1;
  min-height:0;
}
/* Mobile-first: single column form, brand hidden by default */
.auth-wrap{display:grid;grid-template-columns:1fr;gap:24px;align-items:stretch;width:100%;max-width:980px;margin:0 auto}
.auth-box{width:100%; display:flex; flex-direction:column}
.auth-title{font-size:2rem;font-weight:700;margin:0 0 .75rem 0;color:var(--text);text-align:center}
.auth-card{padding:20px 20px; flex:1; display:flex; flex-direction:column; justify-content:center}
/* Center narrow forms inside auth cards */
.auth-card form{ max-width: 520px; margin: 0 auto; width:100%; display:flex; flex-direction:column; gap:1rem; }
.auth-card a{word-break:break-all; overflow-wrap:anywhere}
/* Mobile-first: akcje na pełną szerokość */
.auth-actions{display:flex;flex-direction:column;align-items:stretch;gap:1.25rem}
.auth-card .auth-actions{ margin-top:0; }
/* Dodatkowy oddech nad przyciskiem (gap 1rem + 0.5rem = 1.5rem) */
.auth-card form .auth-actions{ margin-top:1rem; }
/* Zerujemy dolny margines grup w auth i używamy gap, aby odstępy były identyczne */
.auth-card form > .mb-3{ margin-bottom:0 !important; }
.auth-actions{min-width:0}
.auth-actions .btn-primary{min-width:140px; width:100%}
.auth-actions .btn-link{white-space:normal; overflow-wrap:anywhere}

/* Softer auth links (obok przycisku) */
.auth-actions .btn-link, .auth-card .btn-link{
  color: var(--text-muted);
  text-decoration: none;
  padding: 0 .25rem;
  font-weight: 500;
}
.auth-actions .btn-link:hover, .auth-card .btn-link:hover{ color: var(--brand-500); text-decoration: underline; }
.auth-actions .btn-link:focus-visible, .auth-card .btn-link:focus-visible{ outline:2px solid rgba(37,99,235,.35); outline-offset:2px; border-radius:6px; }

/* Label + link w jednej linii (Hasło | Przypomnij hasło) */
.label-row{ display:flex; align-items:baseline; justify-content:space-between; gap:.75rem; }
.form-aside-link{ background:none; border:0; padding:0; margin:0; color: var(--text-muted); font-size:.9rem; cursor:pointer; text-decoration: none; }
.form-aside-link:hover{ color: var(--brand-500); text-decoration: underline; }
.form-aside-link:focus-visible{ outline:2px solid rgba(37,99,235,.35); outline-offset:2px; border-radius:6px; }

/* (revert) Nie powiększamy pól w auth - zostają domyślne rozmiary Bootstrap */

/* Ghost button (drugi wiersz w auth) */
.btn-ghost{ display:inline-block; text-align:center; background:var(--surface); color:var(--text); border:1px solid var(--border); border-radius: var(--radius-md); padding:.375rem .75rem; font-weight:500; }
.btn-ghost:hover{ background:#f8fafc; border-color:#d1d5db; }
.btn-ghost:focus-visible{ outline:2px solid rgba(88,101,242,.35); outline-offset:2px; }

/* Blokowa szerokość (np. mobilne CTA) */
.btn-block{ width:100%; }

/* Long helper link under actions */
.auth-note-link{ display:block; margin-top:.5rem; color: var(--text-muted); text-decoration: underline; word-break: break-word; overflow-wrap:anywhere; }
.auth-note-link:hover{ color: var(--brand-500); }

/* Brand panel for auth */
.auth-brand{
  position:relative;
  background: linear-gradient(135deg, #050f24 0%, #0f254a 46%, #264aa3 100%);
  color:#fff;
  border-radius:16px;
  box-shadow: var(--elev-2, 0 24px 54px rgba(9,16,31,.28));
  padding:24px;
  display:none;
  flex-direction:column;
  justify-content:space-between;
  overflow:hidden;
  isolation:isolate;
  border:1px solid rgba(255,255,255,.16);
  gap:16px;
}
.auth-brand::before{
  content:"";
  position:absolute;
  inset:-6px;
  background-image:
    radial-gradient(circle at 16% 18%, rgba(255,255,255,.2) 0, rgba(255,255,255,0) 42%),
    radial-gradient(circle at 78% 4%, rgba(173,216,255,.2) 0, rgba(255,255,255,0) 34%),
    linear-gradient(180deg, rgba(255,255,255,.12) 0, rgba(255,255,255,0) 38%);
  background-size: auto, auto, auto;
  opacity:.8;
  pointer-events:none;
  mix-blend-mode:screen;
  z-index:0;
}
.auth-brand > *{ position:relative; z-index:1; }
.auth-brand .brand-head{font-size:1.4rem; font-weight:700; letter-spacing:.02em; display:flex; align-items:center; gap:.7rem; margin-top:.25rem}
.auth-brand .brand-sub{opacity:.9; margin-top:.5rem; font-size:1.05rem; line-height:1.5; max-width: 260px;}
.auth-brand .brand-logo{ display:block; width:140px; height:auto; margin-bottom:.5rem; filter: drop-shadow(0 2px 4px rgba(0,0,0,.08)); }
.auth-brand .brand-head .brand-favicon{ width:28px; height:28px; display:inline-block; border-radius:4px; box-shadow: 0 1px 2px rgba(0,0,0,.08); }
.brand-link{ color:inherit; text-decoration:none; display:inline-flex; align-items:center; gap:.7rem; }
.brand-link:hover{ color:inherit; text-decoration:none; }
.brand-link:focus-visible{ outline:2px solid rgba(255,255,255,.4); outline-offset:4px; border-radius:10px; }
.brand-bullets{list-style:none; padding:0; margin:18px 0 0 0}
.brand-bullets li{display:flex; align-items:flex-start; gap:.6rem; margin:.6rem 0; color:#f5f7ff; line-height:1.4;}
.brand-bullets li::before{
  content:"\2713";
  width:22px;
  height:22px;
  flex:0 0 22px;
  border-radius:10px;
  background:linear-gradient(180deg, rgba(255,255,255,.24), rgba(255,255,255,.14));
  border:1px solid rgba(255,255,255,.2);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#e9edff;
  box-shadow:0 10px 22px rgba(0,0,0,.18);
}
.brand-foot{opacity:.88; font-size:.9rem; border-top:1px solid rgba(255,255,255,.18); padding-top:12px; margin-top:12px;}

/* Desktop enhancements */
@media (min-width: 900px){
  .auth-wrap{grid-template-columns:360px minmax(320px,560px)}
  .auth-brand{display:flex}
  /* Przy widocznym panelu brand nagłówek wyrównany do lewej */
  .auth-title{ text-align:left; }
}


/* Fallback dla bardzo niskich okien - włącz przewijanie formularza */
@media (max-height: 760px){
  .auth-center{
    min-height:auto;
    height:auto;
    overflow:auto;
  }
}


/* Extra tightening for very narrow screens */
/* Mobile-first: pełna szerokość; utrzymujemy 100% także powyżej 600px */
.auth-actions .btn-primary{ min-width: 120px; width:100%; }
@media (min-width: 600px){
  .auth-actions{ align-items:stretch; }
  .auth-actions .btn-primary{ min-width: 140px; width:100%; }
}


/* Remove inner horizontal scrollbar on desktop/medium screens;
   rely on page-level horizontal scroll if needed */
@media (min-width: 1200px){
  .content .table-responsive,
  .card .table-responsive,
  .table-responsive{ overflow-x: visible !important; }
}

.legal-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.legal-links a {
  color: var(--brand, #1d4ed8);
  text-decoration: none;
  font-weight: 500;
}

.legal-links a:hover,
.legal-links a:focus-visible {
  text-decoration: underline;
}

.auth-legal-note {
  font-size: 0.85rem;
  color: #64748b;
  text-align: center;
  margin-bottom: 0.75rem;
}

.auth-legal-note a {
  color: var(--brand, #1d4ed8);
  font-weight: 500;
}


.layout-root {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.layout-root > main {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.layout-root .content {
    flex: 1;
}