/* /theme/profile_edit.css
   Styl edycji profilu (lekki grid, pełna szerokość karty, pastelowe akcenty)
   Kolory z palety: #001427, #708D81, #F4D58D, #BF0603, #8D0801 */

:root{
  --brand:#001427;
  --muted:#708D81;
  --accent:#F4D58D;
  --danger:#BF0603;
  --ink:#111827;
  --edge:#e5e7eb;
  --ink-2:#374151;
  --ink-3:#6b7280;
}

/* KARTA NA PEŁNĄ SZEROKOŚĆ */
.pe-card{
  background:#fff;
  border-radius:12px;
  box-shadow:var(--shadow,0 6px 20px rgba(0,0,0,.06));
  padding:16px 16px 18px;
}

/* Nagłówek mniejszy, treściwy */
.pe-card h1{
  font-size:22px;
  font-weight:800;
  margin:0 0 4px;
  color:var(--ink);
}

/* Delikatny pasek akcentu pod tytułem (jak w mini-kalendarzu) */
.pe-accent{
  height:6px;
  width:72px;
  border-radius:999px;
  background:var(--accent);
  margin:4px 0 14px;
}

/* GRID pól: desktop 2 kolumny, mobile 1 */
.pe-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:14px 20px;
  align-items:start;
}
@media (max-width:900px){ .pe-grid{ grid-template-columns:1fr; } }

/* Pole formularza */
.pe-field label{
  display:block;
  font-size:12px;
  font-weight:700;
  color:var(--ink-2);
  margin:0 0 6px;
}

.pe-card input[type="text"],
.pe-card input[type="file"]{
  width:100%;
  padding:10px 12px;
  border:1px solid var(--edge);
  border-radius:10px;
  background:#fff;
  color:var(--ink);
  font-size:14px;
  line-height:1.25;
}
.pe-card input[type="text"]::placeholder{ color:#9ca3af; }

.pe-card input[type="text"]:focus,
.pe-card input[type="file"]:focus{
  outline:2px solid rgba(112,141,129,.35);   /* muted */
  border-color:var(--muted);
}

/* Checkboxy w jednej linii, czytelne */
.pe-check{
  display:flex; align-items:center; gap:8px;
  font-size:14px; color:var(--ink);
}

/* Akcentowana notatka (opcjonalnie do komunikatów) */
.pe-note{
  background:rgba(244,213,141,.22);
  border:1px solid rgba(244,213,141,.5);
  color:#4b5563;
  border-radius:12px;
  padding:8px 12px;
}

/* Przyciski akcji (prawa strona) */
.pe-actions{
  display:flex; gap:10px; justify-content:flex-end;
  margin-top:16px;
}

.pe-btn{
  display:inline-block;
  padding:9px 14px;
  border-radius:12px;
  font-size:14px;
  text-decoration:none;
  line-height:1;
  border:1px solid transparent;
}

.pe-btn--primary{
  background:var(--brand);
  color:#fff;
}
.pe-btn--primary:hover{ opacity:.92; }

.pe-btn--ghost{
  background:#f3f4f6;
  color:var(--ink-2);
  border-color:#cbd5e1;
}
.pe-btn--ghost:hover{ background:#e5e7eb; }

/* Avatar – jeżeli chcesz podgląd po prawej */
.pe-avatar{
  width:96px;height:96px;border-radius:999px;overflow:hidden;
  border:1px solid var(--edge); background:#f8fafc;
  display:flex;align-items:center;justify-content:center;
  font-weight:800;color:#334155;
}
.pe-avatar img{width:100%;height:100%;object-fit:cover;}