/* ==========================================================================
   ESHARD PERU - ESTILOS COMPARTIDOS DE PÁGINAS INTERNAS
   Se carga DESPUÉS de megastore_enterprise.css. Unifica checkout, producto,
   confirmación, cotización, libro de reclamaciones, T&C y Arma Tu PC bajo
   la misma paleta clara Enterprise B2B (Manual de Marca ESHARD).
   ========================================================================== */

/* Alias de tokens heredados (antes dark/morado) -> paleta Enterprise */
:root {
  --bg-base:        var(--body-bg);
  --bg-surface:     var(--surface-muted);
  --bg-card:        var(--surface-white);
  --bg-hover:       var(--surface-muted);
  --border-light:   #cbd5e1;
  --accent:         var(--accent-blue);
  --accent-cyan:    var(--accent-blue);
  --success:        var(--green-stock);
  --warning:        var(--amber-stock);
  --danger:         var(--red-stock);
  --text-primary:   var(--text-dark);
  --text-secondary: var(--text-body);
  --text-muted:     var(--text-gray);
  --radius:         var(--radius-md);
  --radius-xl:      16px;
  --gradient-primary: linear-gradient(135deg, var(--brand-navy), var(--primary));
}

img { max-width: 100%; }

/* --- Formularios --- */
.form-group { margin-bottom: 16px; }
.form-label { display: block; font-size: 12.5px; font-weight: 700; color: var(--text-dark); margin-bottom: 6px; }
.form-label .req { color: var(--red-stock); }
.form-input, .form-select, .form-textarea {
  width: 100%; padding: 11px 14px;
  background: var(--surface-white); border: 1px solid var(--surface-border);
  border-radius: var(--radius-md); color: var(--text-dark); font-size: 14px;
  transition: border-color .2s, box-shadow .2s;
}
.form-input:focus, .form-select:focus, .form-textarea:focus {
  outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-glow);
}
.form-input.error { border-color: var(--red-stock); }
.form-error { font-size: 12px; color: var(--red-stock); margin-top: 4px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 600px) { .form-row { grid-template-columns: 1fr; } }

/* --- Botones genéricos --- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: none; border-radius: var(--radius-md); padding: 12px 22px; font-size: 14px; font-weight: 700; cursor: pointer; transition: .2s; }
.btn-primary { background: var(--primary); color: #fff; }
.btn-primary:hover { background: var(--primary-hover); box-shadow: var(--shadow-card-hover); }
.btn-primary:disabled { background: var(--surface-border); color: var(--text-light); cursor: not-allowed; box-shadow: none; }
.btn-outline { background: transparent; color: var(--text-dark); border: 1px solid var(--surface-border); }
.btn-outline:hover { border-color: var(--primary); color: var(--primary); }

/* --- Tarjetas de contenido de páginas internas --- */
.page-card {
  background: var(--surface-white); border: 1px solid var(--surface-border);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-card); padding: 24px;
}

/* --- Avisos informativos reutilizables --- */
.notice { border-radius: var(--radius-md); padding: 12px 14px; font-size: 13px; line-height: 1.5; border: 1px solid; }
.notice-info    { background: #eff6ff; border-color: #bfdbfe; color: #1e3a8a; }
.notice-warning { background: var(--amber-stock-bg); border-color: rgba(217,119,6,.35); color: #92400e; }
.notice-success { background: var(--green-stock-bg); border-color: rgba(5,150,105,.3); color: #065f46; }
.notice-neutral { background: var(--surface-muted); border-color: var(--surface-border); color: var(--text-body); }