/* =========================================================================
   Atelier Pilates — cabinetul personal.
   Aceeași paletă ca orarul; pagina se citește pe telefon la fel ca pe desktop.
   ========================================================================= */

.ap-cab {
	--c-green: #435540;
	--c-dark: #334234;
	--c-mid: #596b55;
	--c-soft: #eef1ea;
	--c-line: rgba(48, 68, 51, .14);
	--c-line-2: rgba(48, 68, 51, .24);
	--c-ink: #172116;
	--c-ink-2: #5b6455;
	--c-terra: #b5673f;
	font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
	color: var(--c-ink);
	max-width: 660px;
	margin: 0 auto;
	padding: 8px 16px 48px;
	box-sizing: border-box;
}
.ap-cab *, .ap-cab *::before, .ap-cab *::after { box-sizing: border-box; }

/* ---- Autentificare ------------------------------------------------------- */
.ap-cab-card { border: 1px solid var(--c-line); border-radius: 20px; background: #fffdf6; padding: 30px 26px; box-shadow: 0 20px 48px rgba(31, 45, 32, .09); }
.ap-cab-logo { text-align: center; margin-bottom: 16px; }
.ap-cab-logo img { height: 52px; width: auto; }
.ap-cab-login h1 { margin: 0 0 6px; font-family: "DM Serif Display", Georgia, serif; font-weight: 400; font-size: 27px; line-height: 1.1; color: var(--c-dark); text-align: center; }
.ap-cab-sub { margin: 0 0 20px; font-size: 13.5px; line-height: 1.5; color: var(--c-ink-2); text-align: center; }

.ap-cab-field { margin-bottom: 13px; }
.ap-cab-field label { display: block; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--c-ink-2); margin-bottom: 5px; }
.ap-cab-field input { width: 100%; height: 48px; border: 1px solid #d8ddca; border-radius: 11px; padding: 0 14px; font-size: 15px; color: var(--c-ink); background: #fff; font-family: inherit; }
.ap-cab-field input:focus { border-color: var(--c-mid); outline: none; box-shadow: 0 0 0 2px rgba(89, 107, 85, .18); }
.ap-cab-field input:disabled { background: #f5f5ef; color: #8a9184; }
.ap-cab-hint { display: block; margin-top: 5px; font-size: 11.5px; color: #8a9184; line-height: 1.45; }
.ap-cab-pass-wrap { position: relative; }
.ap-cab-pass-wrap input { padding-right: 84px; }
.ap-cab-show { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); border: 0; background: transparent; color: var(--c-green); font-family: inherit; font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; cursor: pointer; padding: 8px; }
.ap-cab-check { display: flex; align-items: flex-start; gap: 9px; margin: 4px 0 16px; font-size: 13px; color: var(--c-ink-2); cursor: pointer; }
.ap-cab-check input { width: 18px; height: 18px; margin-top: 1px; accent-color: var(--c-mid); flex: none; }

.ap-cab-btn { display: block; width: 100%; border: 0; border-radius: 999px; background: var(--c-green); color: #fffdf6; font-family: inherit; font-size: 14.5px; font-weight: 800; padding: 14px 20px; margin-top: 8px; text-align: center; text-decoration: none; cursor: pointer; transition: background .2s; }
.ap-cab-btn:hover { background: var(--c-dark); color: #fffdf6; }
.ap-cab-btn:disabled { opacity: .5; cursor: default; }
.ap-cab-ghost { background: transparent; color: var(--c-green); border: 1px solid var(--c-line-2); }
.ap-cab-ghost:hover { background: var(--c-soft); color: var(--c-dark); }
.ap-cab-mini { margin: 12px 0 0; font-size: 12.5px; text-align: center; color: var(--c-ink-2); }
.ap-cab-mini a { color: var(--c-green); font-weight: 700; }
.ap-cab-msg { font-size: 13px; margin: 10px 0 0; min-height: 18px; text-align: center; line-height: 1.45; }
.ap-cab-msg.ok { color: #2e7d32; }
.ap-cab-msg.err { color: #c0392b; }
.ap-cab-msg-global { position: sticky; bottom: 0; background: #fffdf6; padding: 8px 0; }

/* ---- Antet panou --------------------------------------------------------- */
.ap-cab-flash { display: flex; gap: 8px; padding: 12px 15px; border-radius: 12px; background: var(--c-soft); border: 1px solid rgba(67, 85, 64, .22); color: #3a4a37; font-size: 13px; line-height: 1.5; margin-bottom: 14px; }
.ap-cab-hello { display: flex; align-items: center; gap: 13px; padding: 15px 17px; border-radius: 16px; margin-bottom: 14px; color: #fffdf5; background: linear-gradient(105deg, #4b614e, #66785f 60%, #3b513d); }
.ap-cab-av { flex: none; width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .18); border: 1px solid rgba(255, 255, 255, .5); font-size: 14px; font-weight: 700; }
.ap-cab-name { font-family: "DM Serif Display", Georgia, serif; font-weight: 400; font-size: 21px; line-height: 1.1; }
.ap-cab-next { font-size: 12.5px; opacity: .86; margin-top: 2px; }

.ap-cab-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin-bottom: 16px; }
.ap-cab-stat { border: 1px solid var(--c-line); border-radius: 13px; background: #fff; padding: 12px 13px; text-align: center; }
.ap-cab-stat .v { display: block; font-family: "DM Serif Display", Georgia, serif; font-size: 25px; line-height: 1; color: var(--c-dark); }
.ap-cab-stat .k { display: block; font-size: 10px; letter-spacing: .05em; text-transform: uppercase; color: var(--c-ink-2); margin-top: 4px; line-height: 1.3; }

.ap-cab-tabs { display: flex; gap: 18px; border-bottom: 1px solid var(--c-line); margin-bottom: 16px; overflow-x: auto; scrollbar-width: none; }
.ap-cab-tabs::-webkit-scrollbar { display: none; }
.ap-cab-tab { flex: none; border: 0; background: transparent; font-family: inherit; font-size: 13px; font-weight: 700; color: var(--c-ink-2); padding: 0 0 10px; border-bottom: 2px solid transparent; cursor: pointer; }
.ap-cab-tab.is-on { color: var(--c-green); border-bottom-color: var(--c-green); }

/* ---- Programări ---------------------------------------------------------- */
.ap-cab-item { border: 1px solid var(--c-line); border-radius: 14px; background: #fff; padding: 14px 15px; margin-bottom: 10px; }
.ap-cab-item.is-cancelled { opacity: .55; }
.ap-cab-when { font-size: 11.5px; font-weight: 800; letter-spacing: .03em; color: var(--c-green); }
.ap-cab-what { font-size: 15.5px; font-weight: 700; color: var(--c-dark); margin-top: 2px; }
.ap-cab-who { font-size: 12.5px; color: var(--c-ink-2); margin-top: 1px; }
.ap-cab-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 11px; padding-top: 11px; border-top: 1px dashed var(--c-line); }
.ap-cab-chip { border: 1px solid var(--c-line-2); border-radius: 999px; background: #fff; color: var(--c-ink-2); font-family: inherit; font-size: 12.5px; font-weight: 700; padding: 9px 15px; cursor: pointer; }
.ap-cab-chip:hover { background: var(--c-soft); }
.ap-cab-chip.is-off { border-style: dashed; color: #8a9184; cursor: default; }
.ap-cab-item.is-confirming .ap-cab-cancel { background: var(--c-terra); border-color: var(--c-terra); color: #fff; }
.ap-cab-empty { font-size: 13.5px; color: #8a9184; padding: 14px 0; }
.ap-cab-note { font-size: 12.5px; color: #8a9184; line-height: 1.55; margin: 12px 0 0; padding: 12px 14px; border-radius: 11px; background: #faf8f0; border: 1px solid var(--c-line); }

/* ---- Datele mele --------------------------------------------------------- */
.ap-cab-box { border: 1px solid var(--c-line); border-radius: 14px; background: #fff; padding: 15px 16px; margin: 18px 0; }
.ap-cab-box h3 { margin: 0 0 11px; font-family: "DM Serif Display", Georgia, serif; font-weight: 400; font-size: 18px; color: var(--c-dark); }
.ap-cab-agree { display: flex; gap: 9px; align-items: flex-start; font-size: 13px; color: var(--c-ink-2); padding: 5px 0; }
.ap-cab-agree span { flex: none; width: 18px; height: 18px; border-radius: 5px; display: grid; place-items: center; border: 1.5px solid var(--c-line-2); background: #fff; font-size: 11px; color: #a4ab9b; }
.ap-cab-agree.is-on span { background: var(--c-green); border-color: var(--c-green); color: #fff; }

.ap-cab-panel[hidden] { display: none; }

@media (max-width: 600px) {
	.ap-cab { padding: 4px 16px 40px; }
	.ap-cab-card { padding: 24px 18px; border-radius: 16px; }
	.ap-cab-stats { gap: 7px; }
	.ap-cab-stat { padding: 10px 8px; }
	.ap-cab-stat .v { font-size: 21px; }
	.ap-cab-stat .k { font-size: 9px; }
	.ap-cab-tabs { gap: 14px; }
}

/* Stări de buton — aceeași problemă ca în orar.css: tema încarcă după noi
   `[type="button"] { color:#cc3366 }` și varianta pe :hover/:focus. Selectorul
   de atribut cântărește cât o clasă, deci adăugăm `.ap-cab` ca strămoș de scop. */
.ap-cab .ap-cab-btn { background: var(--c-green); color: #fffdf6; }
.ap-cab .ap-cab-btn:hover,
.ap-cab .ap-cab-btn:focus,
.ap-cab .ap-cab-btn:active { background: var(--c-dark); color: #fffdf6; }
.ap-cab .ap-cab-btn:disabled,
.ap-cab .ap-cab-btn:disabled:hover { background: var(--c-green); color: #fffdf6; }
.ap-cab .ap-cab-ghost { background: transparent; color: var(--c-green); }
.ap-cab .ap-cab-ghost:hover,
.ap-cab .ap-cab-ghost:focus,
.ap-cab .ap-cab-ghost:active { background: var(--c-soft); color: var(--c-dark); }
.ap-cab .ap-cab-show { background: transparent; color: var(--c-green); }
.ap-cab .ap-cab-show:hover,
.ap-cab .ap-cab-show:focus,
.ap-cab .ap-cab-show:active { background: transparent; color: var(--c-dark); }
.ap-cab .ap-cab-tab { background: transparent; color: var(--c-ink-2); }
.ap-cab .ap-cab-tab:hover,
.ap-cab .ap-cab-tab:focus,
.ap-cab .ap-cab-tab:active { background: transparent; color: var(--c-green); }
.ap-cab .ap-cab-tab.is-on,
.ap-cab .ap-cab-tab.is-on:hover,
.ap-cab .ap-cab-tab.is-on:focus { color: var(--c-green); border-bottom-color: var(--c-green); }
.ap-cab .ap-cab-chip { background: #fff; color: var(--c-ink-2); }
.ap-cab .ap-cab-chip:hover,
.ap-cab .ap-cab-chip:focus,
.ap-cab .ap-cab-chip:active { background: var(--c-soft); color: var(--c-ink-2); }
.ap-cab .ap-cab-item.is-confirming .ap-cab-cancel,
.ap-cab .ap-cab-item.is-confirming .ap-cab-cancel:hover,
.ap-cab .ap-cab-item.is-confirming .ap-cab-cancel:focus { background: var(--c-terra); border-color: var(--c-terra); color: #fff; }
.ap-cab button:focus-visible { outline: 2px solid var(--c-green); outline-offset: 2px; }

/* =========================================================================
   Fotografia de profil, calendarul și navigarea (v0.12)
   ========================================================================= */

/* ---- Avatar -------------------------------------------------------------- */
.ap-cab-av-wrap { position: relative; flex: none; }
.ap-cab .ap-cab-av { overflow: hidden; }
.ap-cab-av-img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 50%; }
.ap-cab .ap-cab-av.has-foto { background: transparent; border-color: rgba(255,255,255,.7); }
.ap-cab .ap-cab-av-edit { position: absolute; right: -3px; bottom: -3px; width: 24px; height: 24px; padding: 0; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.6); border-radius: 50%; background: var(--c-green); color: #fffdf6; cursor: pointer; }
.ap-cab .ap-cab-av-edit:hover, .ap-cab .ap-cab-av-edit:focus { background: var(--c-dark); color: #fffdf6; }
.ap-cab-foto-row { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.ap-cab .ap-cab-av-mare { position: relative; width: 84px; height: 84px; border-radius: 50%; display: grid; place-items: center; background: var(--c-soft); border: 1px solid var(--c-line-2); color: var(--c-green); font-size: 24px; font-weight: 700; flex: none; }
.ap-cab-foto-actiuni { display: flex; flex-direction: column; gap: 8px; flex: 1 1 200px; min-width: 0; }
.ap-cab-foto-actiuni .ap-cab-btn { margin-top: 0; width: auto; }
.ap-cab-foto-actiuni .ap-cab-hint { margin-top: 2px; }
.ap-cab-foto-actiuni .ap-cab-btn[hidden] { display: none; }

/* ---- Titluri de secțiune în panouri -------------------------------------- */
.ap-cab-h { margin: 4px 0 10px; font-family: "DM Serif Display", Georgia, serif; font-weight: 400; font-size: 19px; color: var(--c-dark); }
.ap-cab-h + .ap-cal-wrap { margin-top: 0; }
.ap-cab-sub-left { margin: -4px 0 14px; font-size: 13px; line-height: 1.55; color: var(--c-ink-2); }

/* ---- Calendar ------------------------------------------------------------ */
.ap-cal-wrap { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
@media (max-width: 560px) { .ap-cal-wrap { grid-template-columns: 1fr; } }
.ap-cal { border: 1px solid var(--c-line); border-radius: 14px; background: #fff; padding: 13px 13px 15px; }
.ap-cal-luna { font-size: 12.5px; font-weight: 800; letter-spacing: .04em; color: var(--c-green); text-align: center; margin-bottom: 9px; }
.ap-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; }
.ap-cal-cap { font-size: 9.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #a4ab9b; text-align: center; padding-bottom: 4px; }
.ap-cal-gol { aspect-ratio: 1; }
.ap-cal-zi { position: relative; aspect-ratio: 1; display: grid; place-items: center; border-radius: 8px; font-size: 12px; color: var(--c-ink-2); }
.ap-cal-zi.past { color: #b7bcb2; }
.ap-cal-zi.today { outline: 1.5px solid var(--c-mid); outline-offset: -1.5px; font-weight: 800; color: var(--c-dark); }
.ap-cal-zi.has { background: var(--c-soft); color: var(--c-dark); font-weight: 800; }
.ap-cal-zi.has.past { background: #f1f1ec; color: #9aa394; }
.ap-cal-n { line-height: 1; }
.ap-cal-pt { position: absolute; left: 50%; bottom: 3px; transform: translateX(-50%); width: 5px; height: 5px; border-radius: 50%; background: var(--c-green); }
.ap-cal-zi.has.past .ap-cal-pt { background: #b7bcb2; }
.ap-cal-pt[data-n]::after { content: attr(data-n); position: absolute; left: 50%; bottom: -1px; transform: translateX(-50%); font-size: 7px; font-weight: 800; color: #fff; line-height: 7px; }
.ap-cal-pt[data-n] { width: 11px; height: 9px; border-radius: 5px; }
.ap-cal-legenda { display: flex; gap: 16px; flex-wrap: wrap; margin: 0 0 18px; font-size: 11.5px; color: var(--c-ink-2); }
.ap-cal-cheie { display: inline-flex; align-items: center; gap: 6px; }
.ap-cal-cheie .ap-cal-pt { position: static; transform: none; }
.ap-cal-azi { width: 11px; height: 11px; border-radius: 4px; outline: 1.5px solid var(--c-mid); outline-offset: -1.5px; display: inline-block; }

/* ---- Rândul de navigare -------------------------------------------------- */
.ap-cab-actions-row { display: flex; gap: 9px; flex-wrap: wrap; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--c-line); }
.ap-cab-actions-row .ap-cab-btn { flex: 1 1 170px; margin-top: 0; }
@media (max-width: 520px) { .ap-cab-actions-row .ap-cab-btn { flex: 1 1 100%; } }

/* ---- Orarul studioului în interiorul cabinetului ------------------------- */
.ap-cab.is-wide { max-width: 1180px; }
.ap-cab-orar { margin: 0 -4px; }
.ap-cab-orar .ap-orar-wrap { background: transparent; padding-top: 0; }
.ap-cab-orar .ap-orar { padding-left: 0; padding-right: 0; }
.ap-cab-orar .ap-hero-banner { display: none; }
