/* Afrodite — tema del centro estetico Le Fate. Estetica beauty/spa, mobile-first. */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Nunito+Sans:ital,wght@0,400;0,600;0,700;1,400&display=swap');

:root{
  --af-bg:#FBF8F4; --af-surface:#FFFFFF;
  --af-primary:#7C5A77; --af-primary-700:#5E4259;
  --af-gold:#C9A35B; --af-rose:#EADAD4; --af-sage:#A9B89E;
  --af-text:#3A3340; --af-muted:#8A8290; --af-border:#ECE5DE;
  --af-ok:#6E8B6A; --af-warn:#C58A4E; --af-err:#B5635B;
  --af-radius:16px; --af-radius-sm:11px;
  --af-shadow:0 6px 24px rgba(92,66,89,.10), 0 1px 3px rgba(92,66,89,.06);
  --af-font:'Nunito Sans',system-ui,sans-serif; --af-display:'Cormorant Garamond',Georgia,serif;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--af-bg);color:var(--af-text);font-family:var(--af-font);
  font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--af-display);font-weight:600;color:var(--af-primary-700);margin:.2em 0 .4em;letter-spacing:.2px}
h1{font-size:2rem} h2{font-size:1.5rem} a{color:var(--af-primary);text-decoration:none}

/* barra in alto */
.af-appbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:.75rem;
  padding:1rem 1.1rem;padding-top:calc(1rem + env(safe-area-inset-top));
  background:linear-gradient(180deg,#fff, #fffef9);border-bottom:1px solid var(--af-border)}
.af-appbar .af-title{font-family:var(--af-display);font-size:1.5rem;color:var(--af-primary-700);font-weight:600}
.af-appbar .af-sub{font-size:.8rem;color:var(--af-muted)}

/* layout */
.af-page{max-width:880px;margin:0 auto;padding:1.1rem 1rem 6rem}

/* card */
.af-card{background:var(--af-surface);border:1px solid var(--af-border);border-radius:var(--af-radius);
  box-shadow:var(--af-shadow);padding:1.1rem;margin:0 0 1rem}

/* liste */
.af-list{display:flex;flex-direction:column;gap:.7rem}
.af-list-item{display:flex;align-items:center;gap:.9rem;background:var(--af-surface);
  border:1px solid var(--af-border);border-radius:var(--af-radius);box-shadow:var(--af-shadow);
  padding:.9rem 1rem;transition:transform .12s,box-shadow .12s;cursor:pointer}
.af-list-item:active{transform:scale(.99)}
.af-list-item .nome{font-weight:700} .af-list-item .meta{color:var(--af-muted);font-size:.9rem}

/* bottoni */
.af-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:46px;
  padding:.6rem 1.3rem;border:none;border-radius:999px;background:var(--af-primary);color:#fff;
  font-family:var(--af-font);font-size:1rem;font-weight:700;cursor:pointer;
  box-shadow:0 4px 14px rgba(124,90,119,.28);transition:background .15s,transform .1s}
.af-btn:hover{background:var(--af-primary-700)} .af-btn:active{transform:translateY(1px)}
.af-btn--ghost{background:transparent;color:var(--af-primary);border:1.5px solid var(--af-border);box-shadow:none}
.af-btn--gold{background:var(--af-gold);box-shadow:0 4px 14px rgba(201,163,91,.3)}

/* campi */
.af-field{display:flex;flex-direction:column;gap:.35rem;margin-bottom:.9rem}
.af-field label{font-size:.85rem;color:var(--af-muted);font-weight:600}
.af-input,select.af-input,textarea.af-input{width:100%;min-height:46px;padding:.6rem .85rem;
  border:1.5px solid var(--af-border);border-radius:var(--af-radius-sm);background:#fff;
  font-family:var(--af-font);font-size:1rem;color:var(--af-text);transition:border-color .15s,box-shadow .15s}
.af-input:focus{outline:none;border-color:var(--af-primary);box-shadow:0 0 0 3px rgba(124,90,119,.12)}

/* chip di stato */
.af-chip{display:inline-flex;align-items:center;gap:.35rem;padding:.2rem .7rem;border-radius:999px;
  font-size:.78rem;font-weight:700;background:var(--af-rose);color:var(--af-primary-700)}
.af-chip--ok{background:#E4EEE0;color:var(--af-ok)} .af-chip--warn{background:#F6E8D6;color:var(--af-warn)}
.af-chip--err{background:#F3DEDC;color:var(--af-err)} .af-chip--gold{background:#F4E9D2;color:#9A7A32}

/* sezione dati sensibili */
.af-sensibile{background:var(--af-rose);border-radius:var(--af-radius);padding:1rem;border:1px dashed #D9BFB6}
.af-sensibile h3{color:var(--af-primary-700)}

/* FAB */
.af-fab{position:fixed;right:1.1rem;bottom:calc(1.3rem + env(safe-area-inset-bottom));z-index:30;
  min-height:56px;padding:0 1.4rem;border:none;border-radius:999px;background:var(--af-primary);
  color:#fff;font-weight:700;font-size:1rem;box-shadow:0 8px 22px rgba(124,90,119,.4);cursor:pointer}

/* ricerca */
.af-search{width:100%;min-height:48px;padding:.7rem 1rem;border:1.5px solid var(--af-border);
  border-radius:999px;background:#fff;font-size:1rem;margin-bottom:1rem}
.af-search:focus{outline:none;border-color:var(--af-primary)}