/* JDServer-Webs v6.3 — climate_records (fix overflow móvil) */
#climate-records{ overflow-x:hidden; }                     /* no permitir que el módulo “rompa” la página */
#climate-records .crd-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
#climate-records .crd-head h3{ margin:0; }
#climate-records .crd-body{ margin-top:12px; }

.crd-grid{
  display:grid; gap:12px;
  grid-template-columns: repeat(2, minmax(0,1fr));
}
@media (max-width: 840px){
  .crd-grid{ grid-template-columns: 1fr; }
}

.crd-card{
  border:1px solid var(--border);
  background: var(--card);
  border-radius:16px;
  padding:12px;
  box-shadow: var(--shadow-2);
  overflow:hidden;                                        /* recorta sombras/scroll interno */
}

/* TITULITO */
.crd-card h4{ margin:0 0 8px 0; font-size:1rem; }

/* WRAP con scroll interno a “sangre” para no sumar padding al ancho total */
.crd-table-wrap{
  overflow:auto;
  -webkit-overflow-scrolling: touch;
  width: calc(100% + 24px);                               /* 24px = 2 * padding de .crd-card */
  margin-left: -12px; margin-right: -12px;                /* full-bleed */
  padding: 0 12px;                                        /* mantiene el “acolchado” visual */
}

/* TABLA */
.crd-table{
  width:100%;
  border-collapse: collapse;
  table-layout: fixed;
  min-width: 520px;                                       /* base en desktop */
}
@media (max-width: 540px){
  .crd-table{ min-width: 420px; }                         /* más estrecha en móviles */
}

.crd-table th, .crd-table td{
  padding:8px 10px;
  border-bottom:1px solid var(--border);
  vertical-align: middle;
  white-space: nowrap;                                    /* mantiene filas compactas; el wrap lo hace el scroll */
}
.crd-table th{ text-align:left; opacity:.85; }
.crd-table td{ font-variant-numeric: tabular-nums; }

.crd-empty{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  border:1px dashed var(--border);
  background: color-mix(in oklab, var(--card), var(--brand-50) 8%);
  padding:12px 14px; border-radius:14px;
}
.crd-empty small{ color: var(--muted); }

@media (max-width: 540px){
  .crd-card{ padding:10px; }
  .crd-card h4{ font-size:.98rem; }
  .crd-table th, .crd-table td{ padding:8px; }
}
/* --- FIX solapes en móvil para climate-records --- */

/* Por defecto mantenemos números sin saltos; la 1ª columna (th) puede partir línea */
#climate-records .crd-table th{
  white-space: normal;              /* permite varias líneas */
  line-height: 1.28;                /* más aire entre líneas */
  word-break: break-word;           /* parte palabras largas si toca */
  overflow-wrap: anywhere;
  vertical-align: top;              /* alinea arriba para textos de 2-3 líneas */
}
#climate-records .crd-table td{
  white-space: nowrap;              /* números/fechas compactos */
}

/* En pantallas estrechas, que la tabla reparta ancho de forma natural */
@media (max-width: 540px){
  #climate-records .crd-table{
    min-width: 380px;               /* un pelín más compacta que 420 si hace falta */
    table-layout: auto;             /* deja que el navegador calcule las columnas */
  }
  #climate-records .crd-table th,
  #climate-records .crd-table td{
    font-size: .96rem;              /* micro-ajuste de tamaño */
    padding: 9px 10px;              /* algo más de alto de fila */
  }
}
