/* assets/css/ventura.css - macOS Ventura vibrante: celeste principal + acentos coloridos */

/* Paleta y tokens */
:root{
  --bg: linear-gradient(180deg,#e9f6ff 0%, #f6fbff 100%);
  --app-bg: #f3f8ff;
  --card: rgba(255,255,255,0.92);
  --muted: #546370;
  --text: #071428;

  --accent-1: #56B4FF;    /* celeste principal */
  --accent-2: #2B9EF4;    /* celeste oscuro */
  --accent-3: #7AE7FF;    /* celeste claro */
  --accent-grad: linear-gradient(135deg, #56B4FF 0%, #7AE7FF 60%, #AEEBFF 100%);

  --highlight: #ffd166;   /* amarillo suave para destacar */
  --danger: #ff4d4f;      /* rojo para alertas */
  --success: #22c55e;

  --glass: rgba(255,255,255,0.7);
  --radius: 14px;
  --shadow-lg: 0 20px 50px rgba(18,40,71,0.12);
  --shadow-md: 0 10px 30px rgba(18,40,71,0.08);
  --border: rgba(18,40,71,0.06);
}

/* Tipografía sistema */
body, input, button, select, textarea {
  font-family: -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--text);
  font-size:15px;
  line-height:1.45;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  margin:0;
  background: var(--bg);
}

/* Root layout */
.ventura-root { min-height:100vh; display:flex; flex-direction:column; }
.ventura-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 26px;
  background: linear-gradient(180deg, rgba(255,255,255,0.82), rgba(255,255,255,0.6));
  backdrop-filter: blur(12px) saturate(120%);
  border-bottom: 1px solid var(--border);
  position:sticky; top:0; z-index:80;
}
.vh-left { display:flex; align-items:center; gap:14px; }
.logo-ic {
  width:48px; height:48px; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-weight:700; font-size:18px;
  background: linear-gradient(135deg, var(--accent-1), var(--accent-2));
  box-shadow: 0 8px 24px rgba(43,158,244,0.18);
}
.app-title { font-weight:800; letter-spacing:0.2px; color:var(--text); font-size:18px; }

.vh-right { display:flex; align-items:center; gap:12px; }
.user-badge {
  background: linear-gradient(180deg,#fff,#f4fbff);
  padding:8px 12px; border-radius:999px; font-size:13px; color:var(--muted);
  border:1px solid var(--border); box-shadow: var(--shadow-md);
}

/* container */
.ventura-container {
  width:100%; max-width:1200px; margin:28px auto; padding:0 22px 72px; box-sizing:border-box; flex:1 0 auto;
}

/* Card */
.card {
  background: var(--card);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  border: 1px solid var(--border);
  padding:22px;
  margin-bottom:20px;
  transition: transform .12s ease, box-shadow .12s ease;
}
.card:hover { transform: translateY(-6px); box-shadow: 0 30px 70px rgba(18,40,71,0.12); }

/* Field styles */
label { display:block; margin-bottom:8px; color:var(--muted); font-size:13px; font-weight:700; }
input[type="text"], input[type="email"], input[type="date"], input[type="password"], select, textarea {
  width:100%; padding:12px 14px; border-radius:12px; border:1px solid rgba(18,40,71,0.06);
  background: linear-gradient(180deg, rgba(255,255,255,0.9), rgba(247,251,255,0.9));
  color:var(--text); margin-bottom:14px; box-sizing:border-box;
  transition: box-shadow .12s ease, border-color .12s ease, transform .06s ease;
}
input:focus, textarea:focus, select:focus {
  outline:none; border-color: var(--accent-2); box-shadow: 0 12px 30px rgba(43,158,244,0.12); transform: translateY(-2px);
}
textarea { min-height:100px; resize:vertical; }

/* radios & check */
input[type="checkbox"], input[type="radio"] { accent-color: var(--accent-1); width:18px; height:18px; }

/* Buttons */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:11px 18px; border-radius:12px; border:none; cursor:pointer; font-weight:800;
  background: var(--accent-grad); color:#052033;
  box-shadow: 0 14px 40px rgba(43,158,244,0.16);
  transition: transform .08s ease, box-shadow .12s ease;
}
.btn:hover { transform: translateY(-3px); }
.btn:active { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(43,158,244,0.12); }

.btn.ghost {
  background:transparent; color:var(--accent-2); border:1px solid rgba(43,158,244,0.12); box-shadow:none; font-weight:700;
}
.btn.danger {
  background: linear-gradient(180deg, var(--danger), #d43b3f); color:#fff;
  box-shadow: 0 12px 36px rgba(255,77,79,0.14);
}

/* small helpers */
.row { display:flex; gap:14px; align-items:flex-start; }
.col { flex:1; min-width:0; }
.kv { color:var(--muted); font-size:13px; margin-bottom:6px; display:block; }

/* Table */
.table { width:100%; border-collapse:collapse; background:transparent; }
.table th, .table td { padding:12px 10px; text-align:left; border-bottom:1px solid rgba(12,18,29,0.04); }
.table thead th { color:var(--muted); font-size:13px; font-weight:800; }

/* Headings */
h1,h2,h3 { margin:0 0 12px 0; font-weight:800; color:var(--text); }

/* footer */
.ventura-footer { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px 20px; border-top:1px solid var(--border); font-size:13px; color:var(--muted); background: linear-gradient(180deg, rgba(255,255,255,0.6), rgba(255,255,255,0.9)); }

/* responsive */
@media (max-width:980px) { .row { flex-direction:column; } .vh-right { display:none; } .ventura-container { padding:0 16px 60px; } }

/* Print style: form clean A4 */
@media print {
  body * { visibility: hidden; }
  .ventura-container, .ventura-container * { visibility: visible; }
  .ventura-container { position: absolute; left:0; top:0; width:100%; margin:0; padding:12px; }
  header, footer, .vh-right, .btn, .btn-link, .table { display:none !important; }
  .card { box-shadow:none; border:none; padding:0; background: transparent; }
  fieldset { border:none; margin: 0 0 12px 0; }
  label { color:#000 !important; font-weight:700; }
  input, textarea { border-bottom:1px solid #000; background:transparent; color:#000; -webkit-print-color-adjust:exact; }
  .card div[style*="border-bottom:1px solid #000"] { height: 32px; border-bottom:1px solid #000; display:block; }
}