/* PL: Wspólny motyw (panel, logowanie, okna modalne na stronie publicznej) – kolorystyka z szablonu
       "Studio Treningowe by Anka" (wariant unisex).
   EN: Shared theme (panel, login, modals on the public website) – colours taken from the
       "Studio Treningowe by Anka" template (unisex variant). */
:root,
[data-bs-theme=dark] {
  --brand-accent: #ffad38;
  --brand-accent-dark: #e8902a;
  --brand-bg: #0e0b0a;
  --brand-surface: #19100d;
  --brand-surface-2: #140d0a;
  --brand-border: #3d2414;
  --brand-text: #f4e6da;
  --brand-text-muted: #c8b9ad;

  --bs-body-bg: var(--brand-bg);
  --bs-body-color: var(--brand-text);
  --bs-body-font-family: Manrope, Arial, sans-serif;
  --bs-secondary-color: var(--brand-text-muted);
  --bs-secondary-bg: var(--brand-surface);
  --bs-tertiary-bg: var(--brand-surface-2);
  --bs-border-color: var(--brand-border);
  --bs-primary: var(--brand-accent);
  --bs-primary-rgb: 255, 173, 56;
  --bs-primary-text-emphasis: #ffc87a;
  --bs-primary-bg-subtle: #3a2410;
  --bs-primary-border-subtle: #7a4a16;
  --bs-link-color: var(--brand-accent);
  --bs-link-color-rgb: 255, 173, 56;
  --bs-link-hover-color: #ffc87a;
  --bs-link-hover-color-rgb: 255, 200, 122;
  --bs-focus-ring-color: rgba(255, 173, 56, .35);
  --bs-emphasis-color: #fff;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: 'DM Sans', Arial, sans-serif; font-weight: 800; }

.btn-primary {
  --bs-btn-color: #160b02;
  --bs-btn-bg: var(--brand-accent);
  --bs-btn-border-color: var(--brand-accent);
  --bs-btn-hover-color: #160b02;
  --bs-btn-hover-bg: #ffbd5e;
  --bs-btn-hover-border-color: #ffbd5e;
  --bs-btn-active-color: #160b02;
  --bs-btn-active-bg: var(--brand-accent-dark);
  --bs-btn-active-border-color: var(--brand-accent-dark);
  --bs-btn-disabled-color: #160b02;
  --bs-btn-disabled-bg: var(--brand-accent);
  --bs-btn-disabled-border-color: var(--brand-accent);
  font-weight: 800;
}
.btn-outline-secondary { --bs-btn-color: var(--brand-text); --bs-btn-border-color: #6b4220; --bs-btn-hover-bg: #2a1a10; --bs-btn-hover-border-color: var(--brand-accent); --bs-btn-hover-color: #fff; }
.text-bg-primary { color: #160b02 !important; }
.form-control, .form-select { background-color: var(--brand-surface-2); border-color: #4a2c18; }
.form-control:focus, .form-select:focus { border-color: var(--brand-accent); box-shadow: 0 0 0 .2rem var(--bs-focus-ring-color); background-color: var(--brand-surface-2); }
.form-check-input:checked { background-color: var(--brand-accent); border-color: var(--brand-accent); }
.table { --bs-table-bg: transparent; --bs-table-hover-bg: #ffffff08; }
.table > thead th { font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--brand-text-muted); font-weight: 800; }

.eyebrow { color: var(--brand-accent); letter-spacing: 3px; font-size: 11px; font-weight: 800; text-transform: uppercase; margin-bottom: .25rem; }

/* PL: Logo + nazwa / EN: Logo + name */
.brand-mark { display: inline-flex; align-items: center; gap: 9px; font-family: 'DM Sans', Arial, sans-serif; font-weight: 900; font-size: 13px; line-height: 1.05; color: #fff; letter-spacing: -.3px; }
.brand-mark img { width: 42px; height: 44px; object-fit: contain; }
.brand-mark small { display: block; color: var(--brand-accent); font-size: 13px; font-style: italic; font-weight: 700; padding-top: 3px; }

/* PL: Okna modalne Unpoly / EN: Unpoly modals */
up-modal-box { background: var(--brand-surface); border: 1px solid #5a3415; border-radius: 12px; color: var(--brand-text); padding: 8px; }
/* PL: Okno na środku ekranu w pionie i poziomie; "safe" – wysokie okno przewija się od góry.
   EN: Centre the modal vertically and horizontally; "safe" – a tall modal still scrolls from the top. */
up-modal-viewport { align-items: safe center; }
up-modal-backdrop { background: rgba(0, 0, 0, .7); }
up-modal-dismiss { color: var(--brand-text-muted); }
up-modal .panel-card { border: 0; padding: 16px; max-width: none; }
up-progress-bar { background-color: var(--brand-accent); }

/* PL: Logowanie / EN: Login */
body.login-page { min-height: 100vh; display: grid; place-items: center; padding: 16px;
  background: radial-gradient(ellipse at top, #2a1508 0%, var(--brand-bg) 60%); }
.login-box { width: min(420px, 100%); background: var(--brand-surface); border: 1px solid #5a3415; border-radius: 14px; padding: 32px; box-shadow: 0 0 50px #f9731615; }
.login-box a { text-decoration: none; }