/**
 * Estilos para botones de zona con estadísticas
 */

/* Botones de zona con dos líneas */
.zone-btn {
  padding: 8px 12px !important;
  text-align: left !important;
  line-height: 1.3;
  min-height: 52px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}

.zone-btn strong {
  display: block;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 4px;
  color: #e2e8f0;
}

.zone-btn small {
  display: block;
  font-size: 10px;
  opacity: 0.85;
  line-height: 1.4;
  color: #cbd5e1;
}

/* Responsive: tablets */
@media (max-width: 1024px) and (min-width: 768px) {
  .zone-btn {
    min-height: 48px;
    padding: 6px 10px !important;
  }
  
  .zone-btn strong {
    font-size: 12px;
    margin-bottom: 3px;
  }
  
  .zone-btn small {
    font-size: 9px;
  }
}

/* Responsive: móvil */
@media (max-width: 768px) {
  .zone-btn {
    min-height: 44px;
    padding: 6px 8px !important;
  }
  
  .zone-btn strong {
    font-size: 11px;
    margin-bottom: 2px;
  }
  
  .zone-btn small {
    font-size: 8px;
    line-height: 1.3;
  }
}

/* Sidebar colapsado */
.ocsevis-sidebar.collapsed .zone-btn {
  padding: 8px 4px !important;
  align-items: center;
  text-align: center !important;
}

.ocsevis-sidebar.collapsed .zone-btn strong {
  font-size: 11px;
}

.ocsevis-sidebar.collapsed .zone-btn small {
  font-size: 8px;
}
