/* public.css — јавни, најава и профил (Фаза 3 G4). Само pg-public-* правила; компонентите се во app.css. */

/* reset_password: корисничкото име во поднасловот (тежина и прекршување: u-fw-600 u-break) */
.pg-public-auth-user { color: var(--text); }

/* new_client: успешна пријава во auth картичката */
.pg-public-reg-done .c-empty { padding: 16px 0 0; }

/* profile: заглавна картичка */
.pg-public-profile-head { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.pg-public-profile-who { flex: 1 1 200px; min-width: 0; }
.pg-public-profile-name { font-size: var(--fs-xl); font-weight: 600; letter-spacing: -0.01em; overflow-wrap: anywhere; }
.pg-public-profile-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin-top: 4px; color: var(--muted); font-size: var(--fs-sm); }

/* profile: услови за нова лозинка */
.pg-public-profile-checks { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 0; padding: 0; list-style: none; color: var(--text-3); font-size: var(--fs-xs); }
.pg-public-profile-meta > span, .pg-public-profile-checks > li { display: inline-flex; align-items: center; gap: 4px; }
.pg-public-profile-checks > li.is-ok { color: var(--success-text); font-weight: 600; }
.pg-public-profile-checks .icon { display: none; }
/* ✓/✗ ги поставува public-profile.js — без JS условите се само текст (не вечно ✗) */
html.js .pg-public-profile-checks > li:not(.is-ok) .pg-public-profile-x,
html.js .pg-public-profile-checks > li.is-ok .pg-public-profile-ok { display: inline-block; }
.pg-public-profile-match { min-height: 18px; margin: 0; font-size: var(--fs-xs); }
.pg-public-profile-match[data-tone="danger"] { color: var(--danger-strong); }
.pg-public-profile-match[data-tone="success"] { color: var(--success-text); }

/* profile: статична напомена над копчето (не е role=alert — не се најавува при отворање на табот) */
.pg-public-profile-note { display: flex; align-items: flex-start; gap: 6px; }
.pg-public-profile-note > .icon { flex: none; margin-top: 2px; }

@media (max-width: 768px) {
    .pg-public-profile-head > .c-btn { width: 100%; }
}

/* profile без JS: сите панели видливи, табовите скриени (копчето за лозинка го оневозможува само public-profile.js).
   !important е потребно: [hidden] во app.css е со !important, а меѓу !important правилата победува поспецифичниот селектор */
html.no-js .pg-public-profile .c-tabs { display: none; }
html.no-js .pg-public-profile .c-tabpanel[hidden] { display: block !important; }
html.no-js .pg-public-profile .c-tabs + .c-tabpanel { padding-top: 0; }   /* без двоен размак над првиот панел */