/* Esquinas uniformes en toda la aplicación (y en el login): botones, campos de texto, selects, áreas de texto, insignias de estado,
   tarjetas y menús.
   paper-dashboard.css mezcla bordes de 3 px (.btn), 4 px (.form-control) y píldoras de 30 px (.btn-round, 800 px en el login);
   aquí todos usan el mismo radio. Cambiar --ui-radius cambia todos a la vez (0 = esquinas rectas). */
:root {
  --ui-radius: 3px;
  /* Texto sobre fondo blanco: el tema usaba #9a9a9a (contraste 2.8:1); estos pasan de 4.5:1 */
  --ui-text: #33302d;
  --ui-text-soft: #4d4944;
  --ui-link: #0f7c80;
  --ui-link-hover: #0a5c5f;
  --ui-danger-text: #c4451c;
}

.btn,
.btn.btn-round,
.btn-round,
.btn-block,
.btn-group > .btn,
.input-group-append > .btn,
.input-group-prepend > .btn {
  border-radius: var(--ui-radius) !important;
}

.form-control,
select.form-control,
textarea.form-control,
.custom-select,
.input-group-text,
.input-group > .form-control,
.input-group > .custom-select {
  border-radius: var(--ui-radius) !important;
}

/* Menús desplegables (menú del usuario) con las mismas esquinas */
.dropdown-menu {
  border-radius: var(--ui-radius) !important;
}

/* Insignias de estado (Activo, Anulada, Devolución…), tarjetas, avisos y ventanas con las mismas esquinas */
.badge,
.badge-pill,
.card,
.alert,
.modal-content,
.list-group-item,
.report-kpi,
.product-search-results {
  border-radius: var(--ui-radius) !important;
}

/* ---------- Menú del usuario (arriba a la derecha): perfil y opciones ---------- */
.user-menu {
  min-width: 260px;
  padding: 0;
  overflow: hidden;
}

.user-menu-profile {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 14px 16px 12px;
  border-bottom: 1px solid #eceae5;
}

.user-menu .user-menu-name {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: #403d39;
  line-height: 1.3;
}

.user-menu .user-menu-email {
  margin: 2px 0 8px;
  font-size: 12px;
  color: var(--ui-text-soft);
  word-break: break-all;
}

.user-menu-tag {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 8px;
  font-size: 11px;
  font-weight: 600;
  color: #2a9aa0;
  background: #e6f7f8;
  border-radius: var(--ui-radius);
}

.user-menu-tag .nc-icon {
  font-size: 12px;
  font-weight: 600;
}

.user-menu-options {
  padding: 6px 0;
}

.user-menu-options form {
  margin: 0;
}

.user-menu-option {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 9px 16px;
  border: 0;
  background: transparent;
  text-align: left;
  font-size: 13px;
  line-height: 1.4;
  color: #66615b;
  cursor: pointer;
  text-decoration: none;
  transition: none;
}

.user-menu-option .nc-icon {
  font-size: 16px;
  color: var(--ui-text-soft);
}

.user-menu-option:hover,
.user-menu-option:focus {
  background: #f4f3ef;
  color: #51cbce;
  text-decoration: none;
  outline: none;
}

.user-menu-option:hover .nc-icon,
.user-menu-option:focus .nc-icon {
  color: #51cbce;
}

/* El tema pinta los enlaces de la barra con ".navbar.navbar-transparent a" (más específico): sin esto "Cambiar contraseña"
   solo cambiaba de color en el ícono. "Cerrar sesión" es un botón y no tenía el problema. */
.navbar .dropdown-menu.user-menu a.user-menu-option { color: #66615b; }
.navbar .dropdown-menu.user-menu a.user-menu-option:hover,
.navbar .dropdown-menu.user-menu a.user-menu-option:focus { color: #51cbce; }

/* Empresa de la sesión, arriba del usuario */
.user-menu-company {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  background: #f7f6f3;
  border-bottom: 1px solid #eceae5;
}
.user-menu-company .nc-icon { font-size: 18px; color: #2a9aa0; }
.user-menu .user-menu-label { display: block; font-size: 10.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ui-text-soft); }
.user-menu .user-menu-company-name { margin: 0; font-size: 14px; font-weight: 700; color: #403d39; line-height: 1.3; }

/* ---------- Gráfica de ventas del inicio (Views/Home/_SalesChart.cshtml) ---------- */
.sales-chart {
  display: block;
  width: 100%;
  height: auto;
}

.sales-chart-grid {
  stroke: #ececec;
  stroke-width: 1;
}

.sales-chart-axis {
  fill: var(--ui-text-soft);
  font-size: 11px;
}

.sales-chart-bar {
  fill: #51cbce;
}

.sales-chart-hit {
  fill: transparent;
}

.sales-chart g:hover .sales-chart-hit {
  fill: rgba(81, 203, 206, 0.08);
}

.sales-chart g:hover .sales-chart-bar {
  fill: #35b3b7;
}

.chart-periods a {
  margin-left: 14px;
  font-size: 0.85em;
  color: var(--ui-text-soft);
}

.chart-periods a:hover,
.chart-periods a.active {
  color: var(--ui-link);
  text-decoration: none;
}

.chart-periods a.active {
  font-weight: 600;
}

/* Cuadro de confirmación antes de guardar (confirmarEnvio en site.js) */
.confirm-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 2000; display: flex; align-items: center; justify-content: center; padding: 16px; }
.confirm-overlay.d-none { display: none !important; }
.confirm-box { background: #fff; width: 100%; max-width: 460px; padding: 24px; border-radius: var(--ui-radius, 3px); box-shadow: 0 8px 30px rgba(0,0,0,.3); }

/* ---- Contraste del texto (tema Paper Dashboard) ---- */
.main-panel, .card, .card-body, .table td, .table th, .table, dd, dt { color: var(--ui-text); }
.main-panel p, .main-panel li, .main-panel strong, .main-panel td { color: var(--ui-text); }
label, .form-label, .col-form-label, .custom-control-label, .card-category, .text-muted, .form-text, small,
.main-panel .small.text-muted, .user-menu-email, .card-stats .card-category { color: var(--ui-text-soft) !important; }
.form-control { color: var(--ui-text); }
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control { color: #4a4640; }
.form-control::placeholder, ::placeholder { color: #6f6a63; opacity: 1; }
.form-control::-webkit-input-placeholder { color: #6f6a63; opacity: 1; }
.sidebar .nav li:not(.active) > a, .sidebar .nav li:not(.active) > a p { color: var(--ui-text); }
/* Enlaces y avisos en texto (no botones ni insignias) */
.main-panel a:not(.btn):not(.nav-link):not(.dropdown-item):not(.user-menu-option) { color: var(--ui-link); }
.main-panel a:not(.btn):not(.nav-link):not(.dropdown-item):not(.user-menu-option):hover { color: var(--ui-link-hover); }
.main-panel .text-danger:not(.btn):not(.badge) { color: var(--ui-danger-text) !important; }
.btn-outline-primary:not(:hover):not(:focus):not(:active):not(.active), .btn-link.btn-primary { color: var(--ui-link); }
.btn-link.text-danger { color: var(--ui-danger-text) !important; }
.user-menu-tag { color: var(--ui-link); }

/* Botón para ocultar/mostrar el menú lateral (solo escritorio; en celular el menú se abre con la hamburguesa). Sin animación. */
.sidebar-toggle-desktop { display: none; }
@media (min-width: 992px) {
  .sidebar-toggle-desktop {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 6px; margin: 0; border: 0; background: transparent; color: #334155; cursor: pointer;
    border-radius: var(--ui-radius);
  }
  .sidebar-toggle-desktop:hover, .sidebar-toggle-desktop:focus { background: rgba(51, 65, 85, .1); outline: none; }
  html.sidebar-hidden .sidebar { display: none; }
  .main-panel { transition: none; }
  html.sidebar-hidden .main-panel { width: 100%; }
}