/* AquaControl V79.14 - rediseño visual de Producción por planta. */
#productionView {
  --production-navy: #0a315b;
  --production-blue: #0866b5;
  --production-line: #cddded;
  --production-soft: #f4f8fc;
  --production-accent: #eaf5ff;
}

#productionView .production-enterprise-header {
  align-items: flex-start;
  gap: 18px;
}

#productionView .enterprise-eyebrow {
  display: block;
  margin-bottom: 5px;
  color: var(--production-blue);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
}

#productionView .production-enterprise-header h3,
#productionView .production-form-heading h4,
#productionView .production-table-heading h4 {
  margin: 0;
  color: var(--production-navy);
}

#productionView #productionOpeningInfo {
  display: inline-flex;
  margin: 10px 0 0;
  padding: 6px 10px;
  border: 1px solid #b9daf3;
  border-radius: 999px;
  background: #eff8ff;
  color: #245477;
  font-size: 0.78rem;
}

#productionView .production-grid {
  display: grid;
  grid-template-columns: minmax(560px, 1fr) minmax(310px, 370px);
  gap: 14px;
  align-items: stretch;
}

#productionView .enterprise-production-form {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 13px 12px;
  align-content: start;
  margin: 0;
}

#productionView .production-form-heading {
  grid-column: 1 / -1;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--production-line);
}

#productionView .production-form-heading p,
#productionView .production-table-heading p {
  margin: 0;
  color: #64788f;
  font-size: 0.78rem;
}

#productionView .production-field {
  min-width: 0;
  margin: 0;
  font-size: 0.78rem;
  font-weight: 750;
  color: #30475f;
}

#productionView .production-field input,
#productionView .production-field select,
#productionView .production-field textarea {
  width: 100%;
  margin-top: 6px;
  min-height: 42px;
}

#productionView .production-field textarea {
  min-height: 70px;
  resize: vertical;
}

#productionView .production-field-branch { grid-column: 1 / span 4; }
#productionView .production-field-shift { grid-column: 5 / span 3; }
#productionView .production-field-operator { grid-column: 8 / span 5; }
#productionView .production-field-initial { grid-column: 1 / span 3; }
#productionView .production-field-final { grid-column: 4 / span 3; }
#productionView .production-field-notes { grid-column: 7 / span 6; }

#productionView .production-field-initial,
#productionView .production-field-final {
  padding: 10px;
  border: 1px solid #b8d7f0;
  border-radius: 10px;
  background: var(--production-accent);
}

#productionView .production-inventory-check {
  grid-column: 1 / span 8;
  min-width: 0;
  margin: 0;
  padding: 9px 11px;
  border: 1px solid var(--production-line);
  border-radius: 9px;
  background: var(--production-soft);
  font-size: 0.76rem;
}

#productionView .production-submit {
  grid-column: 9 / span 4;
  width: 100%;
  min-height: 42px;
  align-self: stretch;
}

#productionView .enterprise-production-preview {
  min-width: 0;
  margin: 0;
  padding: 16px;
  border-top: 4px solid var(--production-blue);
  background: linear-gradient(180deg, #ffffff 0%, #f6faff 100%);
}

#productionView .enterprise-production-preview h4 {
  margin: 0 0 12px;
  color: var(--production-navy);
}

#productionView .enterprise-production-preview .formula-box {
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid #b8d7f0;
  border-radius: 9px;
  background: var(--production-accent);
  color: #29516f;
  font-size: 0.8rem;
}

#productionView .enterprise-production-preview .summary-line {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid #dbe6f0;
}

#productionView .enterprise-production-preview .summary-line span {
  color: #657a8f;
}

#productionView .enterprise-production-preview .total-highlight {
  margin-top: 12px;
  padding: 11px 12px;
  border-radius: 9px;
  background: var(--production-navy);
  color: #fff;
}

#productionView .enterprise-production-preview .hint {
  margin-bottom: 0;
  font-size: 0.75rem;
  line-height: 1.45;
}

#productionView .production-tools {
  display: grid;
  grid-template-columns: minmax(220px, 320px) 1fr;
  gap: 14px;
  align-items: center;
  margin-top: 14px;
}

#productionView .production-tools > select {
  width: 100%;
  min-height: 42px;
}

#productionView .production-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

#productionView .production-stats > div {
  min-width: 0;
  padding: 9px 12px;
  border: 1px solid var(--production-line);
  border-radius: 9px;
  background: #fff;
}

#productionView .production-stats span,
#productionView .production-stats strong {
  display: block;
}

#productionView .production-stats span {
  color: #657a8f;
  font-size: 0.72rem;
}

#productionView .production-stats strong {
  margin-top: 3px;
  color: var(--production-navy);
  font-size: 1rem;
}

#productionView .enterprise-production-table-panel {
  margin-top: 14px;
  padding: 0;
  overflow: hidden;
}

#productionView .production-table-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px 12px;
  border-bottom: 1px solid var(--production-line);
}

#productionView .enterprise-production-table-wrap {
  max-height: 44dvh;
  overflow: auto;
  scrollbar-gutter: stable;
}

#productionView .enterprise-production-table-wrap table {
  min-width: 900px;
  margin: 0;
}

#productionView .enterprise-production-table-wrap thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #edf5fb;
  box-shadow: 0 1px 0 #ccdae7;
}

#productionView .enterprise-production-table-wrap::-webkit-scrollbar {
  width: 11px;
  height: 11px;
}

#productionView .enterprise-production-table-wrap::-webkit-scrollbar-thumb {
  border: 3px solid transparent;
  border-radius: 999px;
  background: #8da8bf;
  background-clip: padding-box;
}

@media (max-width: 1120px) {
  #productionView .production-grid {
    grid-template-columns: 1fr;
  }

  #productionView .enterprise-production-preview {
    min-height: auto;
  }
}

@media (max-width: 760px) {
  #productionView .production-enterprise-header,
  #productionView .production-form-heading,
  #productionView .production-table-heading {
    align-items: stretch;
    flex-direction: column;
  }

  #productionView .enterprise-production-form {
    grid-template-columns: 1fr;
  }

  #productionView .production-field,
  #productionView .production-inventory-check,
  #productionView .production-submit {
    grid-column: 1 / -1;
  }

  #productionView .production-tools,
  #productionView .production-stats {
    grid-template-columns: 1fr;
  }

  #productionView .production-tools > select {
    max-width: none;
  }
}