/* ═══════════════════════════════════════════
   ISFIS Panel CSS v1.3 — 100% Responsive
   Breakpoints: 768px · 600px · 480px · 360px
   ═══════════════════════════════════════════ */

/* ── Contenedor principal ── */
.isfis-panel {
    font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
    font-size:14px; color:#1a1a2e;
    background:#f8f9fc; border-radius:16px;
    overflow:hidden; border:1px solid #e5e7eb;
    box-shadow:0 2px 16px rgba(0,0,0,.06);
    width:100%; box-sizing:border-box;
}

/* ── Header ── */
.isfis-panel__header {
    background:#0f2557; padding:16px 20px;
    display:flex; align-items:center; justify-content:space-between;
    flex-wrap:wrap; gap:.8rem;
}
.isfis-panel__header-left { display:flex; align-items:center; gap:12px; min-width:0; }
.isfis-panel__header-icon { font-size:1.8rem; flex-shrink:0; }
.isfis-panel__titulo { font-size:1.2rem!important; font-weight:700!important; color:#fff!important; margin:0 0 2px!important; line-height:1.2!important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.isfis-panel__subtitulo { font-size:.76rem; color:rgba(255,255,255,.65); margin:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.isfis-panel__user { background:rgba(255,255,255,.12); border-radius:20px; padding:5px 12px; font-size:.8rem; color:rgba(255,255,255,.85); white-space:nowrap; }

/* ── Tabs ── */
.isfis-panel__tabs {
    display:flex; gap:0; overflow-x:auto; -webkit-overflow-scrolling:touch;
    background:#0f2557; border-bottom:3px solid rgba(255,255,255,.1);
    padding:0 16px; scrollbar-width:none;
}
.isfis-panel__tabs::-webkit-scrollbar { display:none; }
.isfis-panel__tab {
    background:transparent; border:none;
    padding:12px 18px; font-size:.85rem; font-weight:600;
    color:rgba(255,255,255,.6); cursor:pointer; white-space:nowrap;
    border-bottom:3px solid transparent; margin-bottom:-3px;
    transition:all .2s; flex-shrink:0;
    -webkit-tap-highlight-color:transparent; touch-action:manipulation;
}
.isfis-panel__tab:hover { color:rgba(255,255,255,.9); }
.isfis-panel__tab--active { color:#f0b429!important; border-bottom-color:#f0b429!important; }

/* ── Contenido ── */
.isfis-panel__content { display:none; padding:20px; box-sizing:border-box; }
.isfis-panel__content--active { display:block; }

/* ── Stats grid ── */
.isfis-panel__stats-grid {
    display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr));
    gap:10px; margin-bottom:20px;
}
.isfis-panel__stat {
    background:#fff; border:1px solid #e5e7eb;
    border-radius:12px; padding:14px 12px; text-align:center;
}
.isfis-panel__stat--accent { border-color:#f0b429; }
.isfis-panel__stat-num { font-size:1.9rem; font-weight:800; color:#0f2557; line-height:1; margin-bottom:4px; }
.isfis-panel__stat--accent .isfis-panel__stat-num { color:#d4a017; }
.isfis-panel__stat-label { font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; color:#888; line-height:1.3; }

/* ── Gráficos ── */
.isfis-panel__charts-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:8px; }
.isfis-panel__chart-card { background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:16px; box-sizing:border-box; }
.isfis-panel__chart-titulo { font-size:.86rem!important; font-weight:600!important; color:#0f2557!important; margin:0 0 12px!important; }
.isfis-panel__chart-wrap { position:relative; height:180px; min-height:180px; }

/* ── Top tabla ── */
.isfis-panel__top-table { width:100%; border-collapse:collapse; font-size:.82rem; }
.isfis-panel__top-table th { text-align:left; padding:6px 8px; font-size:.68rem; text-transform:uppercase; letter-spacing:.06em; color:#888; border-bottom:1px solid #e5e7eb; }
.isfis-panel__top-table td { padding:7px 8px; border-bottom:1px solid #f3f4f6; }
.isfis-panel__top-table tr:last-child td { border-bottom:none; }

/* ── Mini stats ── */
.isfis-panel__mini-stats {
    display:flex; gap:1rem; background:#fff;
    border:1px solid #e5e7eb; border-radius:10px;
    padding:10px 14px; margin-bottom:12px;
    flex-wrap:wrap; font-size:.84rem; color:#555;
}
.isfis-panel__mini-stats strong { color:#0f2557; }

/* ── Filtros ── */
.isfis-panel__filters { display:flex; gap:7px; align-items:center; flex-wrap:wrap; margin-bottom:12px; }
.isfis-panel__filter-input,
.isfis-panel__filter-estado {
    padding:7px 10px!important; border:1px solid #d1d5db!important;
    border-radius:8px!important; font-size:.84rem!important;
    background:#fff!important; color:#1a1a2e!important;
    outline:none!important; box-shadow:none!important;
    -webkit-appearance:none; box-sizing:border-box!important;
}
.isfis-panel__filter-input { min-width:0; width:100%; max-width:200px; }
.isfis-panel__filter-estado { max-width:160px; }
.isfis-panel__filter-input:focus,
.isfis-panel__filter-estado:focus { border-color:#0f2557!important; }

/* ── Botones del panel ── */
.isfis-panel__btn {
    padding:7px 13px!important; border-radius:8px!important;
    font-size:.82rem!important; font-weight:600!important;
    cursor:pointer!important; border:1px solid #d1d5db!important;
    background:#fff!important; color:#333!important;
    transition:all .18s!important; white-space:nowrap;
    -webkit-tap-highlight-color:transparent; touch-action:manipulation;
    min-height:36px!important;
}
.isfis-panel__btn:hover { background:#f3f4f6!important; }
.isfis-panel__btn--primary { background:#0f2557!important; color:#fff!important; border-color:#0f2557!important; }
.isfis-panel__btn--primary:hover { background:#1a3a8f!important; }
.isfis-panel__btn--danger { color:#991b1b!important; border-color:#fca5a5!important; }
.isfis-panel__btn--danger:hover { background:#fee2e2!important; }

/* ── Tabla de resultados ── */
.isfis-panel__table-wrap { overflow-x:auto; border-radius:10px; margin-bottom:10px; -webkit-overflow-scrolling:touch; }
.isfis-panel__table { width:100%; border-collapse:collapse; background:#fff; font-size:.82rem; min-width:520px; }
.isfis-panel__table th {
    background:#0f2557; color:#fff; padding:9px 10px;
    text-align:left; font-size:.7rem; text-transform:uppercase;
    letter-spacing:.05em; font-weight:600; white-space:nowrap; position:sticky; top:0;
}
.isfis-panel__table td { padding:8px 10px; border-bottom:1px solid #f3f4f6; color:#333; vertical-align:middle; }
.isfis-panel__table tr:last-child td { border-bottom:none; }
.isfis-panel__table tr.row-ok td  { background:#f0faf4; }
.isfis-panel__table tr.row-fail td { background:#fff5f5; }
.isfis-panel__table tbody tr:hover td { filter:brightness(.97); }

/* ── Badges ── */
.isfis-panel__badge { display:inline-block; border-radius:20px; padding:2px 9px; font-size:.76rem; font-weight:700; white-space:nowrap; }
.isfis-panel__badge--ok   { background:#d1fae5; color:#065f46; }
.isfis-panel__badge--fail { background:#fee2e2; color:#991b1b; }

/* ── Empty ── */
.isfis-panel__empty { background:#f9fafb; border:1px dashed #d1d5db; border-radius:10px; padding:2rem; text-align:center; color:#6b7280; font-size:.88rem; }

/* ── Paginación ── */
.isfis-panel__pagination { display:flex; gap:5px; flex-wrap:wrap; padding-top:4px; }
.isfis-panel__page-btn {
    padding:6px 11px!important; border:1px solid #d1d5db!important;
    border-radius:6px!important; font-size:.8rem!important;
    cursor:pointer!important; background:#fff!important; color:#333!important;
    transition:all .15s!important; min-width:34px!important; text-align:center!important;
    -webkit-tap-highlight-color:transparent; touch-action:manipulation;
}
.isfis-panel__page-btn:hover { background:#f3f4f6!important; }
.isfis-panel__page-btn--active { background:#0f2557!important; color:#fff!important; border-color:#0f2557!important; }

/* ── Login panel (fallback) ── */
.isfis-panel-login-wall { display:flex; align-items:center; justify-content:center; padding:3rem 1rem; }
.isfis-panel-login-card { background:#fff; border:1px solid #e5e7eb; border-radius:16px; padding:2.5rem 2rem; max-width:400px; width:100%; text-align:center; box-shadow:0 4px 24px rgba(0,0,0,.08); box-sizing:border-box; }
.isfis-panel-login-icon { font-size:2.5rem; display:block; margin-bottom:.8rem; }
.isfis-panel-login-card h3 { font-size:1.25rem; margin-bottom:.4rem; color:#0f2557; }
.isfis-panel-login-card p  { font-size:.9rem; color:#666; margin-bottom:1.2rem; }
.isfis-panel__tab-section { }

/* ════════════ RESPONSIVE ════════════ */

/* ── Tablet (≤ 768px) ── */
@media (max-width:768px) {
    .isfis-panel__content { padding:16px; }
    .isfis-panel__header { padding:14px 16px; }
    .isfis-panel__charts-grid { grid-template-columns:1fr; }
    .isfis-panel__chart-wrap { height:160px; min-height:160px; }
    .isfis-panel__stats-grid { grid-template-columns:repeat(3,1fr); gap:8px; }
    .isfis-panel__stat-num { font-size:1.6rem; }
    .isfis-panel__filter-input { max-width:100%; }
    .isfis-panel__filter-estado { max-width:100%; }
}

/* ── Móvil grande (≤ 600px) ── */
@media (max-width:600px) {
    .isfis-panel { border-radius:10px; }
    .isfis-panel__tabs { padding:0 8px; }
    .isfis-panel__tab { padding:10px 14px; font-size:.8rem; }
    .isfis-panel__stats-grid { grid-template-columns:repeat(2,1fr); }
    .isfis-panel__filters { flex-direction:column; align-items:stretch; }
    .isfis-panel__filter-input,
    .isfis-panel__filter-estado { max-width:100%; width:100%; }
    .isfis-panel__btn { width:100%!important; justify-content:center; }
    .isfis-panel__mini-stats { flex-direction:column; gap:.4rem; }
    .isfis-panel__top-table th:nth-child(3),
    .isfis-panel__top-table td:nth-child(3) { display:none; }
}

/* ── Móvil (≤ 480px) ── */
@media (max-width:480px) {
    .isfis-panel__content { padding:12px; }
    .isfis-panel__header { padding:12px; }
    .isfis-panel__header-icon { font-size:1.5rem; }
    .isfis-panel__titulo { font-size:1rem!important; }
    .isfis-panel__subtitulo { display:none; }
    .isfis-panel__stats-grid { grid-template-columns:repeat(2,1fr); gap:7px; }
    .isfis-panel__stat { padding:11px 8px; }
    .isfis-panel__stat-num { font-size:1.4rem; }
    .isfis-panel__stat-label { font-size:.66rem; }
    .isfis-panel__chart-wrap { height:140px; min-height:140px; }
    .isfis-panel__table { min-width:420px; font-size:.78rem; }
    .isfis-panel__table th,
    .isfis-panel__table td { padding:7px 8px; }
    .isfis-panel__pagination { gap:4px; }
    .isfis-panel__page-btn { padding:5px 8px!important; min-width:30px!important; font-size:.76rem!important; }
}

/* ── Móvil pequeño (≤ 360px) ── */
@media (max-width:360px) {
    .isfis-panel__tab { padding:8px 10px; font-size:.76rem; }
    .isfis-panel__stat-num { font-size:1.25rem; }
    .isfis-panel__table { min-width:360px; font-size:.74rem; }
    .isfis-panel__btn { font-size:.78rem!important; padding:6px 10px!important; }
}
