/* Centro Hara — design system. Moderno, minimalista, luminoso. Blanco + violeta (logo).
   Tipografía del sistema (sin Google Fonts → respeta RGPD: no expone IPs del visitante). */
:root {
  --violet:      #a83ccc;   /* violeta de marca (del logo) */
  --violet-deep: #8c2bae;   /* hover / énfasis */
  --violet-soft: #f0e1f9;   /* fondos suaves (lavanda) */
  --violet-tint: #faf5fe;   /* casi blanco con tinte */
  --lavanda:     #d8a8fc;   /* acento claro del logo */

  --bg:        #fcfbfe;
  --surface:   #ffffff;
  --text:      #251a2d;
  --muted:     #8b7e96;
  --primary:   var(--violet);
  --primary-fg:#ffffff;
  --accent:    var(--violet-soft);
  --border:    #ece5f3;
  --danger:    #d64763;

  --radius:    16px;
  --radius-sm: 10px;
  --shadow:    0 6px 28px rgba(140,43,174,.09);
  --shadow-sm: 0 2px 10px rgba(140,43,174,.06);
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
* { box-sizing: border-box; }
body { margin:0; font-family:var(--font); background:var(--bg); color:var(--text);
  font-size:15px; line-height:1.55; -webkit-font-smoothing:antialiased; }
h1,h2,h3 { font-weight:600; line-height:1.2; letter-spacing:-.01em; margin:0 0 .4em; }
a { color:var(--violet); text-decoration:none; }

.card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
  box-shadow:var(--shadow); padding:24px; }

.btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; cursor:pointer;
  background:var(--violet); color:#fff; border:none; padding:11px 20px; border-radius:var(--radius-sm);
  font-size:14px; font-weight:600; font-family:var(--font); transition:background .15s, transform .1s; }
.btn:hover { background:var(--violet-deep); transform:translateY(-1px); }
.btn:active { transform:translateY(0); }
.btn.secundario { background:var(--violet-soft); color:var(--violet-deep); }
.btn.secundario:hover { background:#e7d2f5; }
.btn.peligro { background:var(--danger); }
.btn:disabled { opacity:.45; cursor:default; transform:none; }

input,select,textarea { width:100%; padding:11px 13px; border:1px solid var(--border);
  border-radius:var(--radius-sm); font-size:14px; font-family:var(--font); background:#fff;
  color:var(--text); transition:border-color .15s, box-shadow .15s; }
input:focus,select:focus,textarea:focus { outline:none; border-color:var(--violet);
  box-shadow:0 0 0 3px var(--violet-soft); }
label { display:block; font-size:13px; font-weight:500; color:var(--muted); margin:12px 0 5px; }

table { width:100%; border-collapse:collapse; font-size:14px; }
th,td { text-align:left; padding:11px 10px; border-bottom:1px solid var(--border); }
th { color:var(--muted); font-weight:600; font-size:11px; text-transform:uppercase; letter-spacing:.06em; }
tr:last-child td { border-bottom:none; }

.fila { display:flex; gap:14px; flex-wrap:wrap; } .fila>* { flex:1; min-width:140px; }
.muted { color:var(--muted); }
.pill { display:inline-block; padding:3px 11px; border-radius:999px; font-size:12px; font-weight:500; color:#fff; }
.tag-color { width:12px; height:12px; border-radius:4px; display:inline-block; vertical-align:middle; }