/* Machos, casquillos, cavidades y placas fijas (modules/machos_placas.js). Todo cuelga de #machos-placas-page. */
#machos-placas-page .mp-resumen { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
#machos-placas-page .mp-dato { background: #fff; border: 1px solid #e3e8ef; border-radius: 12px; padding: 8px 14px; min-width: 110px; display: flex; flex-direction: column; }
#machos-placas-page .mp-dato strong { font-size: 1.35rem; line-height: 1.1; }
#machos-placas-page .mp-dato span { font-size: .78rem; color: #64748b; }
#machos-placas-page .mp-dato-alerta { background: #fff8e1; border-color: #f5d776; }

#machos-placas-page .mp-panel { background: #fff; border: 1px solid #e3e8ef; border-radius: 14px; padding: 16px; }
#machos-placas-page .mp-scroll { overflow: auto; max-height: 68vh; }
#machos-placas-page .mp-scroll thead th { position: sticky; top: 0; background: #f8fafc; z-index: 3; white-space: nowrap; }
#machos-placas-page .mp-inactivo { opacity: .55; }

/* cuadrícula macho x casquillo */
#machos-placas-page .mp-grid { border-collapse: separate; border-spacing: 0; width: auto; }
#machos-placas-page .mp-grid th, #machos-placas-page .mp-grid td { text-align: center; padding: 2px 5px; font-size: .78rem; }
#machos-placas-page .mp-grid .mp-vertical { height: 64px; vertical-align: bottom; }
#machos-placas-page .mp-grid .mp-vertical span { display: inline-block; writing-mode: vertical-rl; transform: rotate(180deg); }
#machos-placas-page .mp-grid .mp-fija { position: sticky; left: 0; background: #f8fafc; z-index: 2; text-align: left; min-width: 64px; }
#machos-placas-page .mp-grid thead .mp-fija { z-index: 4; }
#machos-placas-page .mp-grid tbody tr:hover td, #machos-placas-page .mp-grid tbody tr:hover th { background: #eef6ff; }
#machos-placas-page .mp-celda-dudosa { background: #fff3c4; }
#machos-placas-page .mp-grid input[type="checkbox"] { width: 15px; height: 15px; cursor: pointer; }
#machos-placas-page .mp-celda-sugerida { background: #dbeafe; }
#machos-placas-page .mp-uso { font-size: .68rem; color: #64748b; line-height: 1; }

/* armado */
#machos-placas-page .mp-cavidad { border: 1px solid #e3e8ef; border-radius: 12px; padding: 12px; margin-bottom: 12px; }
#machos-placas-page .mp-machos { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px; }
#machos-placas-page .mp-macho { border: 1px solid #e3e8ef; border-radius: 10px; padding: 8px 10px; background: #fbfcfe; }
#machos-placas-page .mp-chip { display: inline-block; background: #eef2ff; color: #3730a3; border-radius: 999px; padding: 1px 9px; margin: 2px 4px 2px 0; font-size: .78rem; }
#machos-placas-page .mp-chip-casq { background: #ecfdf5; color: #065f46; }
#machos-placas-page .mp-chip-off { opacity: .5; text-decoration: line-through; }

/* tablas editables: que ningún campo se aplaste hasta quedar ilegible; el contenedor .mp-scroll hace el scroll horizontal */
#machos-placas-page .mp-scroll td input.form-control { min-width: 70px; }
#machos-placas-page .mp-scroll td input[data-campo="notas"] { min-width: 200px; }
#machos-placas-page .mp-scroll td input[data-campo="portamoldes"] { min-width: 96px; }
#machos-placas-page .mp-scroll td input[data-campo="familia"], #machos-placas-page .mp-scroll td input[data-campo="ubicacion"] { min-width: 96px; }
#machos-placas-page .mp-scroll td select.form-select { min-width: 128px; }
#machos-placas-page .mp-scroll td select[data-campo="estado_revision"] { min-width: 130px; }
#machos-placas-page .mp-scroll td, #machos-placas-page .mp-scroll th { vertical-align: middle; }

@media (max-width: 768px) {
    #machos-placas-page .mp-panel { padding: 10px; }
    #machos-placas-page .mp-scroll { max-height: 60vh; }
}