/* ProstyNet — panel klienta (front-end).
   Struktura i skala odstępów świadomie lustrzane wobec booking-front.css
   (ten sam box pełnej szerokości, ten sam podział na dwie kolumny 32px
   padding), żeby panel logowania wyglądał jak naturalna część tej samej
   strony, a nie osobny, wąski komponent. Zmienne z fallbackiem: jeśli
   motyw definiuje --ink/--orange/itd. (jak motyw ProstyNet), panel
   automatycznie dopasuje się do jego palety. */

.pn-account-box{
	background:var(--ink-2, #12212F);
	border:1px solid var(--line-light, rgba(11,22,32,0.14));
	border-radius:2px;
	overflow:hidden;
	color:var(--paper, #F1EFE6);
}

.pn-eyebrow{
	font-family:'JetBrains Mono', monospace;
	font-size:11px; letter-spacing:0.12em; text-transform:uppercase;
	color:var(--ice, #8FD3E8);
}

/* ---- Pasek górny (tylko widok zalogowany: powitanie + wyloguj) ---- */
.pn-account-top{
	display:flex; justify-content:space-between; align-items:flex-start; gap:16px;
	padding:32px; flex-wrap:wrap;
	border-bottom:1px solid var(--line-dark, rgba(241,239,230,0.14));
}
.pn-account-top h3{
	margin:8px 0 0; font-size:22px; font-weight:700;
	font-family:'Space Grotesk', sans-serif;
	text-transform:none !important; letter-spacing:normal !important;
	color:var(--paper, #F1EFE6);
}
.pn-logout{
	font-family:'JetBrains Mono', monospace;
	font-size:12px; text-transform:uppercase; letter-spacing:0.04em;
	color:var(--steel-2, #8A929A); border:1px solid var(--line-dark, rgba(241,239,230,0.14));
	padding:8px 14px; border-radius:2px; white-space:nowrap;
}
.pn-logout:hover{ color:var(--paper, #F1EFE6); border-color:var(--paper,#F1EFE6); }

/* ---- Siatka dwukolumnowa — ten sam wzorzec co kalendarz rezerwacji ---- */
.pn-account-grid{ display:grid; grid-template-columns:1fr 1fr; }
@media(max-width:820px){ .pn-account-grid{ grid-template-columns:1fr; } }

.pn-account-col-info{ padding:32px; border-right:1px solid var(--line-dark, rgba(241,239,230,0.14)); }
.pn-account-col-form{ padding:32px; }
@media(max-width:820px){
	.pn-account-col-info{ border-right:none; border-bottom:1px solid var(--line-dark, rgba(241,239,230,0.14)); }
}

.pn-account-error{
	background:rgba(224,58,58,0.15); color:#ff9d9d;
	padding:10px 14px; border-radius:2px; font-size:13.5px; margin:0 0 20px;
}
.pn-account-note{
	font-family:'Inter', sans-serif; font-size:13.5px; color:var(--steel-2, #8A929A); line-height:1.6; margin:10px 0 28px;
}
.pn-account-empty{
	font-family:'Inter', sans-serif; font-size:13.5px; color:var(--steel-2, #8A929A); margin:0 0 24px;
}

/* ---- Karta logowania (widok niezalogowany) — wyśrodkowana, kompaktowa ---- */
.pn-account-box--login{
	display:flex; justify-content:center; padding:56px 32px;
}
.pn-login-card{ width:100%; max-width:520px; }
.pn-login-card .pn-eyebrow{ display:block; margin-bottom:10px; }

/* Specyficzność + !important celowo: nagłówki motywu (h1,h2,h3) narzucają
   globalnie wielkie litery — tutaj to jawnie wyłączamy, żeby tytuł karty
   logowania nie renderował się jak nagłówek sekcji strony. */
.pn-login-card h3{
	margin:0 0 4px; font-size:22px; line-height:1.3; font-weight:700;
	font-family:'Space Grotesk', sans-serif;
	text-transform:none !important; letter-spacing:normal !important;
	color:var(--paper, #F1EFE6);
}

.pn-login-actions{
	grid-column:1 / -1;
	display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:2px;
}

/* ---- Formularz logowania: e-mail i hasło obok siebie w dwóch kolumnach ---- */
.pn-login-form{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media (max-width:480px){
	.pn-login-form{ grid-template-columns:1fr; }
}
.pn-field label{
	display:block; font-family:'JetBrains Mono', monospace; font-size:11px;
	text-transform:uppercase; letter-spacing:0.06em; color:var(--steel-2, #8A929A); margin-bottom:8px;
}
.pn-required-mark{
	color:var(--orange, #FF5A1F); font-weight:700;
}
.pn-field input{
	width:100%; padding:11px 12px; border:1px solid var(--line-dark, rgba(241,239,230,0.14));
	background:rgba(241,239,230,0.04); color:var(--paper, #F1EFE6); border-radius:2px; font-size:14px; font-family:'Inter', sans-serif;
}
.pn-field input:focus{ outline:none; border-color:var(--ice, #8FD3E8); }

.pn-field textarea{
	width:100%; padding:11px 12px; border:1px solid var(--line-dark, rgba(241,239,230,0.14));
	background:rgba(241,239,230,0.04); color:var(--paper, #F1EFE6); border-radius:2px;
	font-size:14px; font-family:'Inter', sans-serif; resize:vertical;
}
.pn-field textarea:focus{ outline:none; border-color:var(--ice, #8FD3E8); }

/* ---- Checkbox "załóż konto" na formularzu dokończenia rezerwacji ---- */
.pn-checkbox-field label{
	display:flex; align-items:flex-start; gap:10px;
	font-family:'Inter', sans-serif; font-size:13px; font-weight:400;
	text-transform:none; letter-spacing:normal;
	color:var(--paper, #F1EFE6); cursor:pointer; line-height:1.5;
}
.pn-checkbox-field input[type="checkbox"]{
	width:16px; height:16px; flex-shrink:0; margin-top:2px; accent-color:var(--orange, #FF5A1F);
}

.pn-btn-primary{
	display:inline-flex; align-items:center; justify-content:center;
	background:var(--orange, #FF5A1F); color:var(--ink, #0B1620);
	font-family:'Space Grotesk', sans-serif; font-weight:600; font-size:13.5px;
	text-transform:uppercase; letter-spacing:0.04em; padding:12px 20px;
	border:none; border-radius:2px; cursor:pointer; white-space:nowrap;
}
.pn-btn-primary:hover{ background:var(--orange-dim, #C7431A); }

.pn-btn-secondary{
	display:inline-flex; align-items:center; justify-content:center;
	background:transparent; color:var(--ice, #8FD3E8);
	font-family:'Space Grotesk', sans-serif; font-weight:600; font-size:12.5px;
	text-transform:uppercase; letter-spacing:0.04em; padding:11px 18px;
	border:1px solid var(--ice, #8FD3E8); border-radius:2px; cursor:pointer;
}
.pn-btn-secondary:hover{ background:rgba(143,211,232,0.12); }
.pn-btn-secondary:disabled{ opacity:0.5; cursor:not-allowed; }

#pn-geowidget-container{
	height:420px; border:1px solid var(--line-dark, rgba(241,239,230,0.14));
	border-radius:2px; overflow:hidden; margin-bottom:12px;
}
#pn-geowidget-container inpost-geowidget{ display:block; width:100%; height:100%; }

.pn-lost-password{
	font-family:'Inter', sans-serif; font-size:12.5px; color:var(--steel-2, #8A929A); text-decoration:underline;
}
.pn-lost-password:hover{ color:var(--paper, #F1EFE6); }

/* ---- Listy rezerwacji (aktualne / zakończone) ---- */
.pn-account-subhead{
	font-family:'Space Grotesk', sans-serif; font-size:13px; text-transform:uppercase;
	letter-spacing:0.04em; color:var(--steel-2, #8A929A); margin:0 0 16px;
}

.pn-booking-list{ display:flex; flex-direction:column; gap:1px; }
.pn-booking-row{
	display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px;
	background:rgba(241,239,230,0.04); padding:14px 16px;
}
.pn-booking-main{ display:flex; flex-direction:column; gap:4px; }
.pn-booking-device{ font-family:'Space Grotesk', sans-serif; font-size:15px; }
.pn-booking-dates{ font-family:'JetBrains Mono', monospace; font-size:12px; color:var(--steel-2, #8A929A); }
.pn-booking-side{ display:flex; align-items:center; gap:14px; }
.pn-booking-price{ font-family:'JetBrains Mono', monospace; font-size:14px; font-weight:600; }

.pn-status-pill{
	font-family:'JetBrains Mono', monospace; font-size:11px; text-transform:uppercase;
	letter-spacing:0.04em; padding:4px 10px; border-radius:20px; white-space:nowrap;
}
.pn-status-pill--nowa{ background:rgba(138,146,154,0.25); color:#c7cdd2; }
.pn-status-pill--potwierdzona{ background:rgba(143,211,232,0.2); color:var(--ice, #8FD3E8); }
.pn-status-pill--wyslana{ background:rgba(143,211,232,0.3); color:#bfe7f2; }
.pn-status-pill--w_trakcie{ background:rgba(255,90,31,0.2); color:#ffb08a; }
.pn-status-pill--zakonczona{ background:rgba(73,214,138,0.2); color:var(--green, #49D68A); }
.pn-status-pill--anulowana{ background:rgba(224,58,58,0.2); color:#ff9d9d; }

@media (max-width:600px){
	.pn-account-top, .pn-account-col-info, .pn-account-col-form{ padding:22px; }
	.pn-account-box--login{ padding:36px 22px; }
}
