/* Dopune uz app.css: PIN ekran, centrirane kartice, copy editor,
   i nekoliko ispravki bagova iz template-a. */

html{ min-height:100%; }
body{ margin:0; min-height:100vh; }

/* display:flex iz template-a nadjačava [hidden] — klijent bi video admin traku */
[hidden]{ display:none !important; }

/* strelica u "Sve faze" nema veličinu u template-u */
.back-btn svg{ width:14px; height:14px; flex:none; }

/* Datum podaktivnosti se bira direktno (umesto pomeraja u danima iz template-a);
   pomeraj se i dalje čuva, računa se u odnosu na datum početka plana. */
input.date-pick{ font-variant-numeric:tabular-nums; color:var(--ink); }
input.date-pick:focus{ outline:none; }
input.date-pick:disabled{ opacity:.5; cursor:not-allowed; }
.pill.date-pick-pill{ padding:4px 10px; }
.pill.date-pick-pill input.date-pick{ width:auto; min-width:128px; font-weight:600; }

@media (max-width: 480px){
  .contact-primary{ flex-wrap:wrap; overflow:visible; }
}

/* ---- Copy tekst: editor u adminu, read-only kod klijenta ---- */

.headline-box.admin{ background:var(--surface); }
.headline-field.editor{
  font-family:"Cascadia Mono","Consolas","SF Mono",ui-monospace,monospace;
  font-size:14.3px; line-height:1.65; tab-size:2;
  min-height:58px; white-space:pre-wrap; overflow-wrap:anywhere;
  padding:2px 0;
}
.headline-field.editor:focus{ outline:none; }
.headline-box.admin:focus-within{ border-color:var(--accent); }
.editor-meta{
  display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap;
  margin-top:7px; padding-top:7px; border-top:1px solid var(--border);
  font-size:11.6px; color:var(--muted); font-variant-numeric:tabular-nums;
}
.editor-hint{ opacity:.75; }

/* kod klijenta se tekst ne menja, ali se vide prelomi i razmaci */
.headline-box .headline-field[readonly]{
  cursor:text; resize:none; white-space:pre-wrap; overflow-wrap:anywhere;
}
.headline-box.is-empty .headline-field[readonly]{ color:var(--muted); font-style:normal; }
.copy-btn:disabled{ opacity:.45; cursor:default; }
.copy-btn:disabled:hover{ border-color:var(--border); color:var(--muted); }

/* ---- Centrirana stranica: PIN, login, greške ---- */
.center-app{ max-width:520px; min-height:calc(100vh - 44px); justify-content:center; }
.center-card{ padding:0; }
.center-card-inner{ padding:26px 28px 24px; display:flex; flex-direction:column; gap:14px; }
.center-card h2{ font-size:24.2px; font-weight:700; color:var(--ink); }
.center-card .muted{ margin:0; color:var(--muted); font-size:14.9px; line-height:1.5; }
.eyebrow-dark{ font-size:12.1px; letter-spacing:.09em; text-transform:uppercase; color:var(--accent); font-weight:600; }
.center-footer{ justify-content:center; }

/* PIN forma */
.pin-form{ display:flex; flex-direction:column; gap:12px; }
.pin-field{ display:block; cursor:text; }
.pin-field input{ font-size:28.6px !important; font-weight:700; letter-spacing:.35em; font-family:var(--font-main); font-variant-numeric:tabular-nums; }
.pin-field input:focus{ outline:none; }
.pin-field:focus-within{ border-color:var(--accent); }
.remember-row{ display:flex; align-items:center; gap:8px; font-size:14.3px; color:var(--muted); cursor:pointer; }
.remember-row input{ accent-color:var(--accent); width:16px; height:16px; }
.pin-error{ display:none; font-size:14.3px; color:#C13B54; background:color-mix(in srgb, #C13B54 10%, var(--surface)); border:1px solid color-mix(in srgb, #C13B54 30%, transparent); border-radius:10px; padding:8px 12px; }
.pin-btn{ justify-content:center; padding:11px 16px; font-size:15.4px; border-radius:12px; }
.btn:disabled{ opacity:.6; cursor:default; }

.admin-strip a.btn{ text-decoration:none; }
.admin-strip .btn strong{ font-weight:700; margin-left:2px; }