/* NexoProCRM v0.17.7 · Fase 5: responsive y legibilidad móvil
   Convierte listados densos en tarjetas móviles y mejora lectura de formularios sin tocar lógica fiscal. */

:root{
  --nxp-mobile-card:#ffffff;
  --nxp-mobile-line:#e6ebf1;
}

/* Tablas más legibles en escritorio: acciones compactas y columnas respirables */
.ch301-table td[data-label="Acciones"],
.ch301-table th:last-child{
  min-width:150px;
}
.ch301-table td[data-label="Estado"],
.ch301-table td[data-label="Prioridad"]{
  min-width:150px;
}
.ch301-table td[data-label="Cliente"]{
  min-width:180px;
}
.ch301-table td strong{
  font-weight:800;
}

/* Formularios internos: botón principal siempre visible y coherente */
.ch301-form > .ch301-btn:last-child,
.ch301-visit-form > .ch301-btn:last-child{
  margin-top:10px;
}
.ch301-form .ch301-grid + label,
.ch301-form label + .ch301-dropzone,
.ch301-form textarea + .ch301-dropzone{
  margin-top:10px;
}

/* Paneles de filtros y exportación más ordenados en pantallas medianas */
.ch301-export-panel .ch301-export-actions,
.ch301-export-form{
  gap:10px!important;
}
.ch301-filters .ch301-btn,
.ch301-client-search-form .ch301-btn{
  min-height:43px;
}

@media(max-width:900px){
  .ch301-header-right{gap:8px!important;}
  .ch301-brand-bosch{display:none!important;}
  .ch301-user-pill{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .ch301-export-panel,
  .ch301-client-title,
  .ch301-month-head{
    align-items:stretch!important;
  }
}

/* Vista móvil tipo tarjeta para tablas operativas */
@media(max-width:760px){
  .ch301-table-wrap{
    border:0!important;
    box-shadow:none!important;
    background:transparent!important;
    overflow:visible!important;
  }
  .ch301-table{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    border:0!important;
    background:transparent!important;
  }
  .ch301-table thead{
    display:none!important;
  }
  .ch301-table tbody,
  .ch301-table tr,
  .ch301-table td{
    display:block!important;
    width:100%!important;
  }
  .ch301-table tbody{
    display:grid!important;
    gap:12px!important;
  }
  .ch301-table tr{
    padding:12px 14px!important;
    border:1px solid var(--nxp-mobile-line)!important;
    border-radius:16px!important;
    background:var(--nxp-mobile-card)!important;
    box-shadow:0 8px 20px rgba(17,24,39,.045)!important;
  }
  .ch301-table tr.ch301-row-highlight{
    border-color:#ffb7bd!important;
    box-shadow:0 0 0 2px rgba(215,25,32,.10),0 8px 20px rgba(17,24,39,.045)!important;
  }
  .ch301-table td{
    min-height:0!important;
    padding:9px 0!important;
    border:0!important;
    border-bottom:1px solid #f0f3f7!important;
    background:transparent!important;
    color:#202832!important;
    font-size:14px!important;
    line-height:1.35!important;
  }
  .ch301-table td:last-child{
    border-bottom:0!important;
    padding-bottom:0!important;
  }
  .ch301-table td:before{
    content:attr(data-label);
    display:block;
    margin-bottom:4px;
    color:#667085;
    font-size:11px;
    font-weight:950;
    letter-spacing:.06em;
    text-transform:uppercase;
  }
  .ch301-table td[data-label="Acciones"]:before{
    margin-bottom:8px;
  }
  .ch301-row-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
  }
  .ch301-row-actions .ch301-btn,
  .ch301-row-actions form,
  .ch301-inline-form .ch301-btn{
    width:100%!important;
  }
  .ch301-inline-form select,
  .ch301-status-form select,
  .ch301-priority-form select{
    width:100%!important;
  }
}

@media(max-width:640px){
  .ch301-main{
    padding-inline:12px!important;
  }
  .ch301-header{
    padding:18px!important;
    border-radius:18px!important;
  }
  .ch301-title-block h1{
    font-size:24px!important;
  }
  .ch301-panel{
    padding:16px!important;
    border-radius:18px!important;
  }
  .ch301-form label,
  .nxp-invoice-form-grid label,
  .nxp-payment-form label,
  .nxp-commission-form label{
    font-size:12px!important;
  }
  .ch301-form input,
  .ch301-form select,
  .ch301-form textarea{
    font-size:16px!important; /* evita zoom en iOS */
  }
  .ch301-export-actions,
  .ch301-export-form{
    width:100%!important;
  }
  .ch301-export-form{
    display:grid!important;
    grid-template-columns:1fr!important;
  }
  .ch301-export-form .ch301-btn{
    width:100%!important;
  }
  .ch301-client-access-box .ch301-btn,
  .ch301-client-search-form .ch301-btn,
  .ch301-filters .ch301-btn{
    width:100%!important;
    justify-content:center!important;
  }
}