/* file: assets/fit-clean.css */
/* =========================================================
   TT24 Fitments – estilos limpios sin Bootstrap
   - Hereda tipografías/colores del tema
   - Opcional: personaliza con variables (puedes no tocarlas)
   ========================================================= */

.tt24fit-clean{
  /* paleta opcional (déjalas en 'inherit' para usar los colores del tema) */
  --tt24-title-color: inherit;        /* ej: #434869 */
  --tt24-head-color:  inherit;        /* ej: #374151 */
  --tt24-bg:          #fff;
  --tt24-row-sep:     #e5e7eb;        /* separator suave para filas (Slate-200) */
  --tt24-badge-bg:    #e5e7eb;
  --tt24-summary-bg:  #fff;
  --tt24-summary-hov: #f8fafc;        /* hover claro */
}

/* --------- Head --------- */
.tt24fit-clean .tt24fit-head{
  display:flex;
  align-items:center;
  gap:.35rem;
  margin-bottom:.5rem;
}

.tt24fit-clean .tt24fit-title-main{
  margin:0;
  font-size:14px;        /* sube a 15/16 si lo deseas */
  line-height:1.2;
  font-weight:600;
  color:var(--tt24-title-color);
}

@media (max-width:480px){
  .tt24fit-clean .tt24fit-title-main{ font-size:15px; }
}

.tt24fit-clean .tt24fit-ic{
  font-size:1em;
  line-height:1;
  display:inline-block;
  transform:translateY(.02em);
}

/* --------- Acordeones nativos (<details>/<summary>) --------- */
.tt24fit-clean details{
  background:var(--tt24-bg);
  border:1px solid #e5e7eb; /* Slate-200 */
  border-radius:.5rem;
}

.tt24fit-clean details + details{
  margin-top:.5rem;
}

.tt24fit-clean summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
  padding:.5rem .75rem;
  cursor:pointer;
  user-select:none;
  border-radius:.5rem;
  background:var(--tt24-summary-bg);
  transition:background-color .12s ease-in-out;
}
.tt24fit-clean summary:hover{
  background:var(--tt24-summary-hov);
}

/* Caret */
.tt24fit-clean summary::marker { content:""; }         /* oculta marcador por defecto */
.tt24fit-clean summary::after{
  content:"▾";
  display:inline-block;
  transform:rotate(0deg);
  transition:transform .12s ease-in-out;
  line-height:1;
}
.tt24fit-clean details[open] > summary::after{
  transform:rotate(-180deg);
}

/* Título + badge en summary */
.tt24fit-clean .tt24fit-title{
  font-weight:600;
  color:var(--tt24-title-color);
}
.tt24fit-clean .tt24fit-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:1.5rem;
  height:1.25rem;
  padding:0 .5rem;
  border-radius:9999px;
  font-size:.75rem;
  background:var(--tt24-badge-bg);
  color:inherit;
}

/* Contenido del acordeón de marca */
.tt24fit-clean details > div{
  padding:.5rem .75rem .75rem;
}

/* --------- Tabla limpia --------- */
.tt24fit-clean .tt24fit-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  font-size: .95rem;
}

.tt24fit-clean .tt24fit-table thead th{
  color:var(--tt24-head-color);
  text-align:center;
  font-weight:600;
  background:#f1f5f9; /* Slate-100 */
  padding:.6rem .65rem;
}

.tt24fit-clean .tt24fit-table tbody td{
  padding:.6rem .65rem;
  text-align:center;
  border:0; /* sin líneas por celda */
}

/* Separación visual entre filas (línea muy suave arriba) */
.tt24fit-clean .tt24fit-table tbody tr + tr td{
  border-top:1px solid var(--tt24-row-sep);
}

/* Variante larga recortada y centrada */
.tt24fit-clean .tt24fit-var{
  max-width:520px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  margin:0 auto;
}

/* --------- Responsive tabla (sin thead en móvil) --------- */
@media (max-width:768px){
  .tt24fit-clean .tt24fit-table thead{ display:none; }

  .tt24fit-clean .tt24fit-table tbody tr{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:.25rem .5rem;
    border-top:1px solid var(--tt24-row-sep);
    padding-top:.5rem;
  }
  .tt24fit-clean .tt24fit-table tbody tr:first-child{
    border-top:0; padding-top:0;
  }

  .tt24fit-clean .tt24fit-table tbody td{
    text-align:left !important;
    padding:.25rem 0;
  }
  .tt24fit-clean .tt24fit-table tbody td:nth-child(1){
    grid-column:1/-1;
    font-weight:600;
    padding-bottom:.25rem;
  }
}

/* --------- Limpieza de restos legacy --------- */
/* Si aún quedaron clases antiguas no afectan, pero por si acaso: */
.tt24fit-clean .accordion-button,
.tt24fit-clean .tt24fit-btn--model { all: unset; }