/*
 * Strony autoryzacji DecisR (login, register, reset hasła) — styl Bricolage, spójny z /welcome (Notes).
 * Wymaga: <body class="auth-bricolage">, <html data-theme="dark|light"> (localStorage: lp2_theme, domyślnie dark).
 * Ładowane PO style.bundle.css; selektory z prefiksem body.auth-bricolage + !important tam, gdzie Metronic używa !important.
 */

/* ─── tokeny ──────────────────────────────────────────────────── */
html {
  --a-ink: #0c1030;
  --a-blue: #2230d6;
  --a-blue-d: #1a23a3;
  --a-sig: #ffd84a;
  --a-paper: #f6f6fb;
  --a-card: #ffffff;
  --a-text: #0c1030;
  --a-text-2: #2f3766;
  --a-muted: #565d8c;
  --a-line: #dfe2f5;
  --a-field: #f3f4fc;
  --a-chip: #e3e6ff;
  --a-chip-ink: #2230d6;
  --a-spring: cubic-bezier(.3, 1.5, .5, 1);
  --a-out: cubic-bezier(.2, .9, .2, 1);
}
html[data-theme="dark"] {
  --a-card: #121748;
  --a-text: #f1f2ff;
  --a-text-2: #c9cdf2;
  --a-muted: #a2a8d8;
  --a-line: rgba(255, 255, 255, .12);
  --a-field: #0d1130;
  --a-chip: rgba(120, 140, 255, .18);
  --a-chip-ink: #b3bdff;
}

/* ─── tło ─────────────────────────────────────────────────────── */
body.auth-bricolage {
  font-family: 'Bricolage Grotesque', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
  color: var(--a-text);
  background: #2230d6 !important;
  min-height: 100vh;
  position: relative;
  overflow-x: hidden;
}
html[data-theme="dark"] body.auth-bricolage { background: #080b24 !important; }
body.auth-bricolage button,
body.auth-bricolage input,
body.auth-bricolage select,
body.auth-bricolage textarea { font-family: inherit; }

.auth-bg { position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.auth-bg::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 70% 60% at 85% 105%, rgba(255, 216, 74, .22) 0%, transparent 60%),
    radial-gradient(ellipse 60% 50% at 8% -10%, rgba(255, 255, 255, .18) 0%, transparent 55%);
}
html[data-theme="dark"] .auth-bg::before {
  background:
    radial-gradient(ellipse 70% 60% at 85% 105%, rgba(255, 216, 74, .16) 0%, transparent 60%),
    radial-gradient(ellipse 65% 60% at 12% -5%, rgba(34, 48, 214, .75) 0%, transparent 60%);
}
.auth-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, .06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .06) 1px, transparent 1px);
  background-size: 52px 52px;
  -webkit-mask-image: radial-gradient(ellipse 80% 80% at 50% 40%, #000 30%, transparent 100%);
          mask-image: radial-gradient(ellipse 80% 80% at 50% 40%, #000 30%, transparent 100%);
}
.auth-bg i { position: absolute; border-radius: 50%; filter: blur(70px); will-change: transform; }
.auth-bg .b1 { width: 26rem; height: 26rem; right: -7rem; top: -8rem; background: rgba(255, 216, 74, .32); animation: authDrift1 22s ease-in-out infinite alternate; }
.auth-bg .b2 { width: 30rem; height: 30rem; left: -11rem; bottom: -14rem; background: rgba(110, 130, 255, .5); animation: authDrift2 27s ease-in-out infinite alternate; }
html[data-theme="dark"] .auth-bg .b1 { background: rgba(255, 216, 74, .2); }
html[data-theme="dark"] .auth-bg .b2 { background: rgba(34, 48, 214, .6); }
@keyframes authDrift1 { to { transform: translate(-6rem, 5rem) scale(1.15); } }
@keyframes authDrift2 { to { transform: translate(7rem, -4rem) scale(1.1); } }

body.auth-bricolage .flex-root { position: relative; z-index: 1; }
/* usuń zdjęcie tła (outdoor.png) z kontenera — inline style bez !important przegrywa */
body.auth-bricolage [class*="bgi-"] { background-image: none !important; }

/* ─── marka ───────────────────────────────────────────────────── */
.auth-brand {
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  color: #fff;
  font-weight: 800;
  font-size: clamp(2.2rem, 6vw, 3.2rem);
  line-height: 1;
  letter-spacing: -.045em;
  text-decoration: none;
  animation: authUp .8s var(--a-out) backwards;
}
.auth-brand svg { width: 1.05em; height: 1.05em; flex: none; transition: transform .5s var(--a-spring); }
.auth-brand:hover { color: #fff; }
.auth-brand:hover svg { transform: rotate(-8deg) scale(1.1); }
.auth-brand b { color: var(--a-sig); font-weight: 800; }
.auth-back-link { color: rgba(255, 255, 255, .85) !important; font-weight: 600; transition: color .2s; animation: authUp .8s .1s var(--a-out) backwards; }
.auth-back-link:hover { color: var(--a-sig) !important; }

/* ─── karta ───────────────────────────────────────────────────── */
body.auth-bricolage .auth-card {
  background: var(--a-card) !important;
  border: 1px solid var(--a-line);
  border-radius: 1.75rem !important;
  box-shadow: 0 30px 80px rgba(5, 8, 60, .45) !important;
  animation: authCard .9s .15s var(--a-out) backwards;
}
@keyframes authUp { from { opacity: 0; transform: translateY(22px) scale(.985); filter: blur(5px); } }
@keyframes authCard { from { opacity: 0; transform: translateY(40px) scale(.96) rotate(1deg); } }

body.auth-bricolage .auth-card h1,
body.auth-bricolage .auth-card .text-dark { color: var(--a-text) !important; }
body.auth-bricolage .auth-card h1 { font-weight: 800; letter-spacing: -.04em; line-height: 1.08; }
body.auth-bricolage .auth-card .text-gray-400,
body.auth-bricolage .auth-card .text-muted,
body.auth-bricolage .auth-card .opt,
body.auth-bricolage .auth-card .register-hero-note { color: var(--a-muted) !important; }
body.auth-bricolage .auth-card .link-primary,
body.auth-bricolage .auth-card a.link-primary { color: var(--a-chip-ink) !important; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 3px; transition: text-decoration-color .2s; }
body.auth-bricolage .auth-card .link-primary:hover { text-decoration-color: currentColor; }
body.auth-bricolage .auth-card .form-label { color: var(--a-text) !important; font-weight: 700; letter-spacing: -.01em; }
body.auth-bricolage .auth-card .form-label .req { color: #f1416c; }
body.auth-bricolage .auth-card a.text-dark { text-decoration: underline; text-underline-offset: 3px; }

/* ─── pola ────────────────────────────────────────────────────── */
body.auth-bricolage .auth-card .form-control.form-control-solid,
body.auth-bricolage .auth-card .form-select.form-select-solid,
body.auth-bricolage .auth-card select.form-control {
  background-color: var(--a-field);
  border: 1.5px solid transparent;
  border-radius: .95rem;
  color: var(--a-text);
  font-weight: 500;
  transition: border-color .2s, box-shadow .2s, background-color .2s;
}
body.auth-bricolage .auth-card .form-control.form-control-solid::placeholder { color: var(--a-muted); opacity: .7; }
body.auth-bricolage .auth-card .form-control.form-control-solid:focus,
body.auth-bricolage .auth-card .form-select.form-select-solid:focus,
body.auth-bricolage .auth-card select.form-control:focus {
  background-color: var(--a-field);
  border-color: var(--a-blue);
  box-shadow: 0 0 0 4px rgba(34, 48, 214, .16);
  color: var(--a-text);
}
html[data-theme="dark"] body.auth-bricolage .auth-card .form-control.form-control-solid:focus,
html[data-theme="dark"] body.auth-bricolage .auth-card select.form-control:focus {
  border-color: var(--a-sig);
  box-shadow: 0 0 0 4px rgba(255, 216, 74, .18);
}
body.auth-bricolage .auth-card select option { background: var(--a-card); color: var(--a-text); }
body.auth-bricolage .auth-card .view-password-toggle { color: var(--a-muted); }
body.auth-bricolage .auth-card .view-password-toggle:hover { color: var(--a-text); }

body.auth-bricolage .auth-card .form-check-input { background-color: var(--a-field); border: 1.5px solid var(--a-muted); }
body.auth-bricolage .auth-card .form-check-input:checked { background-color: var(--a-blue); border-color: var(--a-blue); }
html[data-theme="dark"] body.auth-bricolage .auth-card .form-check-input:checked { background-color: var(--a-sig); border-color: var(--a-sig); }
body.auth-bricolage .auth-card .form-check-label { color: var(--a-text-2); font-weight: 600; }

/* ─── przyciski ───────────────────────────────────────────────── */
body.auth-bricolage .auth-card .btn {
  position: relative;
  overflow: hidden;
  border-radius: 99px;
  font-weight: 800;
  letter-spacing: -.01em;
  transition: transform .3s var(--a-spring), box-shadow .25s, background-color .2s, color .2s, opacity .2s;
}
body.auth-bricolage .auth-card .btn.btn-primary {
  background-color: var(--a-sig) !important;
  border-color: var(--a-sig) !important;
  color: var(--a-ink) !important;
  box-shadow: 0 8px 24px rgba(255, 216, 74, .4);
}
body.auth-bricolage .auth-card .btn.btn-primary::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, .7) 50%, transparent 65%);
  transform: translateX(-130%);
  transition: transform .7s var(--a-out);
}
body.auth-bricolage .auth-card .btn.btn-primary:hover:not(:disabled):not(.disabled) { transform: translateY(-3px) scale(1.02); box-shadow: 0 14px 32px rgba(255, 216, 74, .55); }
body.auth-bricolage .auth-card .btn.btn-primary:hover:not(:disabled):not(.disabled)::after { transform: translateX(130%); }
body.auth-bricolage .auth-card .btn.btn-primary:active:not(:disabled):not(.disabled) { transform: translateY(0) scale(.98); }
body.auth-bricolage .auth-card .btn.btn-primary.disabled,
body.auth-bricolage .auth-card .btn.btn-primary:disabled { opacity: .45; box-shadow: none; }
body.auth-bricolage .auth-card .btn.btn-light {
  background-color: var(--a-chip) !important;
  border-color: transparent !important;
  color: var(--a-chip-ink) !important;
}
body.auth-bricolage .auth-card .btn.btn-light:hover { transform: translateY(-2px); }
body.auth-bricolage .auth-card .btn.btn-light-primary {
  background-color: transparent !important;
  border: 1.5px solid var(--a-line) !important;
  color: var(--a-text-2) !important;
}
body.auth-bricolage .auth-card .btn.btn-light-primary:hover { border-color: var(--a-blue) !important; color: var(--a-text) !important; }
body.auth-bricolage .auth-card .spinner-border.text-primary { color: var(--a-blue) !important; }
html[data-theme="dark"] body.auth-bricolage .auth-card .spinner-border.text-primary { color: var(--a-sig) !important; }
body.auth-bricolage .form-loading-overlay { border-radius: 1.75rem; }

/* ─── rejestracja: kroki, zgody ───────────────────────────────── */
body.auth-bricolage .register-progress .bar { height: 5px; background: var(--a-line); transition: background .3s; }
body.auth-bricolage .register-progress button.is-active .bar,
body.auth-bricolage .register-progress button.is-done .bar { background: var(--a-sig); }
body.auth-bricolage .register-progress .label { color: var(--a-muted); font-weight: 700; }
body.auth-bricolage .register-progress button.is-active .label { color: var(--a-text); }
body.auth-bricolage .register-step:not(.is-hidden) { animation: authStep .5s var(--a-out) backwards; }
@keyframes authStep { from { opacity: 0; transform: translateX(18px); } }
body.auth-bricolage .accept-all-checkbox {
  background: var(--a-field);
  border: 1.5px solid var(--a-line);
  border-radius: 1rem;
}
body.auth-bricolage .accept-all-checkbox .checkbox,
body.auth-bricolage .accept-all-checkbox .accept-all-row,
body.auth-bricolage .consents-section .checkbox { color: var(--a-text); }
body.auth-bricolage .consents-section .checkbox > span,
body.auth-bricolage .accept-all-checkbox .checkbox > span {
  background-color: var(--a-field);
  border: 1.5px solid var(--a-muted);
  border-radius: .4rem;
}
body.auth-bricolage .consents-section .checkbox > input:checked ~ span,
body.auth-bricolage .accept-all-checkbox .checkbox > input:checked ~ span {
  background-color: var(--a-sig);
  border-color: var(--a-sig);
}
body.auth-bricolage .consents-section .checkbox > span::after,
body.auth-bricolage .accept-all-checkbox .checkbox > span::after { border-color: var(--a-ink) !important; }
body.auth-bricolage .consents-section label.fw-bold { color: var(--a-text); font-weight: 800 !important; letter-spacing: -.01em; }

/* ─── pasek języka i motywu ───────────────────────────────────── */
body.auth-bricolage .language-switcher {
  position: fixed;
  top: 16px;
  right: 16px;
  z-index: 100;
  display: flex;
  align-items: center;
  gap: .3rem;
}
body.auth-bricolage .language-switcher button:not(.auth-theme-toggle) {
  margin: 0;
  padding: .45rem .8rem;
  border: 0;
  border-radius: 99px;
  background: rgba(255, 255, 255, .16);
  color: #fff;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .05em;
  transition: background .2s, color .2s, transform .3s var(--a-spring);
}
body.auth-bricolage .language-switcher button:not(.auth-theme-toggle):hover { background: rgba(255, 255, 255, .28); transform: translateY(-2px); }
body.auth-bricolage .language-switcher button:not(.auth-theme-toggle).active { background: var(--a-sig); color: var(--a-ink); }
body.auth-bricolage .auth-theme-toggle {
  position: relative;
  width: 2.5rem;
  height: 2.5rem;
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .16);
  color: #fff;
  cursor: pointer;
  margin-left: .25rem;
  transition: transform .4s var(--a-spring), background .2s;
}
body.auth-bricolage .auth-theme-toggle:hover { transform: rotate(18deg) scale(1.1); background: rgba(255, 255, 255, .28); }
body.auth-bricolage .auth-theme-toggle svg { width: 1.15rem; height: 1.15rem; transition: transform .5s var(--a-spring), opacity .25s; }
body.auth-bricolage .auth-theme-toggle .i-sun { position: absolute; opacity: 0; transform: rotate(-90deg) scale(.4); }
html[data-theme="dark"] body.auth-bricolage .auth-theme-toggle .i-sun { opacity: 1; transform: none; color: var(--a-sig); }
html[data-theme="dark"] body.auth-bricolage .auth-theme-toggle .i-moon { opacity: 0; transform: rotate(90deg) scale(.4); }
body.auth-bricolage :focus-visible { outline: 3px solid var(--a-sig); outline-offset: 3px; }

@media (max-width: 575.98px) {
  body.auth-bricolage .language-switcher { top: 10px; right: 10px; }
  body.auth-bricolage .language-switcher button:not(.auth-theme-toggle) { padding: .4rem .65rem; }
}
@media (prefers-reduced-motion: reduce) {
  body.auth-bricolage *, body.auth-bricolage *::before, body.auth-bricolage *::after,
  .auth-bg i { animation: none !important; transition: none !important; }
}