/* ==========================================================================
   Portada — módulos adicionales (noticias, dólar, accesos)
   Lo carga index.html. Usa los mismos tokens de styles.css.
   ========================================================================== */

:root{
  --indatta-navy:#0E3A5A;      /* Pantone 302 C */
  --indatta-cyan:#00A9CD;      /* Pantone 3125 C */
  --indatta-sky:#A4D2E2;       /* Pantone 544 C */
  --indatta-yellow:#FFCE32;    /* Pantone 123 C */
  --indatta-orange:#FF8300;    /* Pantone 1585 C */
  --indatta-blue:#4085C6;      /* Pantone 660 C */
  --indatta-red:#E1251B;       /* Pantone 1795 C */
  --navy-hairline:#2C5A7C;
  --navy-text:#EEF1F4;
  --navy-muted:#A4D2E2;
}

/* La portada compacta un poco el hero para dar aire a los módulos */
.hero{ margin:26px auto 30px; }


/* ---------- Barra superior: Reservar sala + Mis solicitudes ---------- */
.topbar-actions{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }

.groups{ margin-bottom:40px; }

/* ---------- Panel: noticias + dólar ---------- */
.home-panel{
  display:grid; grid-template-columns:minmax(0, 1.5fr) minmax(280px, 1fr); gap:14px; margin:0 0 34px;
  align-items:stretch;
}

/* Carrusel de noticias */
.news-card{
  position:relative; border-radius:var(--radius-lg); overflow:hidden; background:var(--indatta-navy);
  box-shadow:var(--shadow-sm); min-height:230px; display:flex;
}
.news-track{ position:absolute; inset:0; }
.news-slide{
  position:absolute; inset:0; opacity:0; transition:opacity .55s ease; display:flex; align-items:flex-end;
  background-size:cover; background-position:center;
}
.news-slide.active{ opacity:1; }
.news-slide::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(14,58,90,0.05) 20%, rgba(14,58,90,0.72) 62%, rgba(10,32,51,0.94) 100%);
}
.news-slide .ns-body{ position:relative; z-index:1; padding:18px 20px 16px; color:#fff; max-width:520px; }
.news-slide .ns-tag{
  display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:800; letter-spacing:.07em; text-transform:uppercase;
  background:var(--indatta-cyan); color:#fff; padding:4px 9px; border-radius:100px; margin-bottom:8px;
}
.news-slide .ns-tag.evento{ background:var(--indatta-yellow); color:#10233A; }
.news-slide .ns-tag.aviso{ background:var(--indatta-orange); }
.news-slide h3{ font-size:clamp(16px, 1.6vw, 19px); line-height:1.25; margin:0 0 5px; color:#fff; }
.news-slide p{ font-size:12.5px; line-height:1.5; color:rgba(255,255,255,0.82); margin:0 0 9px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.news-slide .ns-meta{ display:flex; align-items:center; gap:12px; font-size:11.5px; color:var(--indatta-sky); }
.news-slide .ns-link{ display:inline-flex; align-items:center; gap:6px; color:#fff; font-weight:700; }
.news-slide .ns-link svg{ width:14px; height:14px; }

.news-nav{
  position:absolute; right:14px; top:14px; z-index:2; display:flex; gap:6px;
}
.news-nav button{
  width:30px; height:30px; border-radius:50%; border:1px solid rgba(255,255,255,0.28); background:rgba(14,58,90,0.45);
  color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; backdrop-filter:blur(6px);
  transition:background .15s ease;
}
.news-nav button:hover{ background:var(--indatta-cyan); border-color:transparent; }
.news-nav button svg{ width:15px; height:15px; }
.news-dots{ position:absolute; right:20px; bottom:18px; z-index:2; display:flex; gap:5px; }
.news-dots button{
  width:8px; height:8px; border-radius:50%; border:none; background:rgba(255,255,255,0.38); cursor:pointer; padding:0;
  transition:width .2s ease, background .2s ease;
}
.news-dots button.active{ width:22px; border-radius:100px; background:var(--indatta-cyan); }

/* Ilustraciones de relleno para diapositivas sin imagen */
.news-slide.ph-1{ background:linear-gradient(135deg, #0E3A5A 0%, #18709C 55%, #00A9CD 100%); }
.news-slide.ph-2{ background:linear-gradient(135deg, #0d3755 0%, #4085C6 100%); }
.news-slide.ph-3{ background:linear-gradient(135deg, #14395C 0%, #259ec5 60%, #77c2d6 100%); }
.news-slide .ph-shape{ position:absolute; right:-8%; top:-18%; width:62%; aspect-ratio:1; border-radius:38% 62% 55% 45% / 45% 40% 60% 55%; background:rgba(255,255,255,0.08); }
.news-slide .ph-shape.two{ right:14%; top:22%; width:34%; background:rgba(255,255,255,0.06); }

/* Tarjeta del dólar (estilo de la tarjeta que ya se envía por correo) */
.fx-card{
  background:var(--indatta-navy); color:var(--navy-text); border-radius:var(--radius-lg); padding:16px 18px 14px;
  box-shadow:var(--shadow-sm); display:flex; flex-direction:column; gap:0; position:relative; overflow:hidden;
}
.fx-head{ display:flex; justify-content:space-between; align-items:center; gap:10px; }
.fx-head .fx-src{ font-size:11px; font-weight:600; color:var(--navy-muted); }
.fx-head img{ height:15px; width:auto; opacity:.95; }
.fx-pair{ display:flex; justify-content:space-between; align-items:center; margin-top:6px; font-size:11px; color:var(--navy-muted); font-weight:600; }
.fx-main{ display:flex; justify-content:space-between; align-items:flex-end; gap:12px; margin-top:2px; }
.fx-price{ font-size:34px; font-weight:800; line-height:1; letter-spacing:-0.02em; color:var(--navy-text); }
.fx-delta{ text-align:right; }
.fx-delta .fx-pct{ display:inline-flex; align-items:center; gap:6px; font-size:15px; font-weight:800; color:var(--indatta-cyan); }
.fx-delta .fx-pct svg{ width:12px; height:12px; }
.fx-delta .fx-pct.down{ color:var(--indatta-sky); }
.fx-delta .fx-vs{ font-size:10.5px; color:var(--navy-muted); margin-top:2px; }
.fx-chart-wrap{ position:relative; margin:10px -4px 0; border-top:1px solid var(--navy-hairline); padding-top:8px; }
.fx-chart{ width:100%; height:100px; display:block; overflow:visible; }
.fx-chart text{ font-family:inherit; font-size:10px; fill:var(--navy-muted); font-variant-numeric:tabular-nums; }
.fx-chart .grid{ stroke:var(--navy-hairline); stroke-width:1; opacity:.8; }
.fx-chart .area{ fill:var(--indatta-cyan); opacity:.12; }
.fx-chart .line{ fill:none; stroke:var(--indatta-cyan); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.fx-chart .end{ fill:var(--indatta-cyan); stroke:var(--indatta-navy); stroke-width:2; }
.fx-chart .xhair{ stroke:var(--navy-text); stroke-width:1; opacity:0; stroke-dasharray:3 3; }
.fx-chart .hover-dot{ fill:var(--indatta-cyan); stroke:var(--navy-text); stroke-width:2; opacity:0; }
.fx-tip{
  position:absolute; top:6px; left:0; transform:translateX(-50%); background:var(--navy-text); color:var(--indatta-navy);
  border-radius:9px; padding:6px 10px; font-size:12px; white-space:nowrap; pointer-events:none; opacity:0; transition:opacity .1s ease;
  box-shadow:0 6px 16px rgba(0,0,0,0.25);
}
.fx-tip strong{ font-weight:800; font-size:13px; display:block; }
.fx-stats{ display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--navy-hairline); margin-top:6px; padding-top:9px; }
.fx-stats div{ padding:0 10px; border-left:1px solid var(--navy-hairline); }
.fx-stats div:first-child{ padding-left:0; border-left:none; }
.fx-stats .lbl{ font-size:10.5px; color:var(--navy-muted); }
.fx-stats .val{ font-size:13.5px; font-weight:800; margin-top:2px; }
.fx-foot{ margin-top:9px; font-size:10px; color:var(--navy-muted); display:flex; justify-content:space-between; gap:8px; }
.fx-foot .fx-live{ display:inline-flex; align-items:center; gap:5px; }
.fx-foot .fx-live::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--indatta-cyan); }
.fx-foot .fx-live.demo::before{ background:var(--indatta-yellow); }


/* ---------- Responsive ---------- */
@media (max-width: 980px){
  .home-panel{ grid-template-columns:1fr; }
  .news-card{ min-height:220px; }
}
@media (max-width: 460px){
  .fx-price{ font-size:30px; }
  .news-slide .ns-body{ padding:20px 18px 22px; }
  .fx-stats{ grid-template-columns:1fr; gap:8px; }
  .fx-stats div{ border-left:none; padding:0; }
}