/* ==========================================================================
   XANTINA ERP - Tema "negro / verde / crema"
   Hoja de tema global. Se carga DESPUES de todas las demas hojas (AdminLTE,
   plugins, estilos inline de cada pagina, xantina-brand.css y xantina-movil.css)
   y solo toca color, radios, sombras y bordes. No cambia familias ni tamanos
   de letra (salvo las cabeceras de tabla, en mayusculas pequenas).
   Rollback: bash /root/xantina-tema/rollback.sh
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Tokens
   -------------------------------------------------------------------------- */
:root {
  /* Negro y grises calidos */
  --x-negro: #1a1915;
  --x-negro-suave: #2b2924;
  --x-gris: #6b665d;
  --x-gris-claro: #9b958a;

  /* Verde (derivado del logo #143403) */
  --x-verde-900: #143403;
  --x-verde-700: #22501a;
  --x-verde-600: #2f6b2a;
  --x-verde-500: #3f8a37;
  --x-verde-100: #e4eedc;
  --x-verde-50: #f1f6ec;

  /* Crema (del favicon #fff3e7) */
  --x-crema: #f6efe3;
  --x-crema-claro: #fbf8f2;
  --x-crema-oscuro: #ebe1d0;
  --x-crema-borde: #ddd2bf;
  --x-crema-borde-fuerte: #cfc3ab;
  --x-blanco: #ffffff;

  /* Geometria y sombras */
  --x-radio-tarjeta: 10px;
  --x-radio-control: 8px;
  --x-sombra: 0 1px 2px rgba(26, 25, 21, .06), 0 8px 24px rgba(26, 25, 21, .06);
  --x-sombra-fuerte: 0 2px 4px rgba(26, 25, 21, .08), 0 18px 48px rgba(26, 25, 21, .14);
  --x-foco: 0 0 0 .2rem rgba(63, 138, 55, .28);
  --x-crema-sobre-oscuro: rgba(246, 239, 227, .78);
  --x-crema-sobre-oscuro-suave: rgba(246, 239, 227, .55);
}

/* Las variables heredadas (index.php, login.php, xantina-brand.css y el bloque
   :root de modal_costos_unificado.php, que se imprime al final del <body>)
   se redirigen a la paleta. html:root gana a cualquier :root posterior. */
html:root {
  --acct-ink: var(--x-negro);
  --acct-muted: var(--x-gris);
  --acct-surface: var(--x-blanco);
  --acct-bg: var(--x-crema);
  --acct-border: var(--x-crema-borde);
  --acct-border-strong: var(--x-crema-borde-fuerte);
  --acct-sidebar: var(--x-negro);
  --acct-sidebar-deep: #11100f;
  --acct-teal: var(--x-verde-600);
  --acct-teal-dark: var(--x-verde-700);
  --acct-blue: var(--x-verde-700);
  --acct-gold: var(--x-negro);
  --acct-red: var(--x-negro);
  --acct-green: var(--x-verde-600);
  --acct-soft: var(--x-verde-50);
  --acct-soft-blue: var(--x-verde-50);
  --acct-quality: var(--x-verde-700);
  --acct-operations: var(--x-gris);
  --acct-shadow: var(--x-sombra);
  --acct-shadow-strong: var(--x-sombra-fuerte);

  --xantina-green: var(--x-verde-900);
  --xantina-green-2: var(--x-verde-700);
  --xantina-cream: var(--x-crema);
  --xantina-mist: var(--x-crema);
  --xantina-black: var(--x-negro);
  --xantina-ink: var(--x-negro);
  --xantina-muted: var(--x-gris);
  --xantina-line: var(--x-crema-borde);
  --xantina-line-strong: var(--x-crema-borde-fuerte);
  --xantina-earth: var(--x-negro);
  --xantina-danger: var(--x-negro);
  --xantina-surface: var(--x-blanco);
  --xantina-shadow: var(--x-sombra);
  --xantina-shadow-strong: var(--x-sombra-fuerte);

  --gob-navy: var(--x-negro);
  --gob-navy-soft: var(--x-negro-suave);
  --gob-turquesa: var(--x-verde-600);
  --gob-turquesa-dark: var(--x-verde-700);
  --gob-gold: var(--x-crema);
  --gob-gray: var(--x-crema);
  --gob-line: var(--x-crema-borde);
  --gob-text: var(--x-negro);
  --gob-muted: var(--x-gris);
}

/* --------------------------------------------------------------------------
   2. Base
   -------------------------------------------------------------------------- */
body,
body.login-page,
body.hold-transition,
.content-wrapper,
.login-page,
.register-page {
  background: var(--x-crema) !important;
  color: var(--x-negro);
}

::selection {
  background: var(--x-verde-100);
  color: var(--x-verde-900);
}

.content-wrapper,
.modal-body,
.table-responsive,
.dataTables_wrapper,
div.dt-container,
.xfin-movements,
.costs-product-list {
  scrollbar-color: var(--x-crema-borde-fuerte) transparent;
  scrollbar-width: thin;
}

a,
.btn-link,
a.text-reset:hover {
  color: var(--x-verde-600);
  text-decoration: none;
}

a:hover,
.btn-link:hover {
  color: var(--x-verde-700);
  text-decoration: underline;
}

a.btn:hover,
a.nav-link:hover,
a.dropdown-item:hover,
a.page-link:hover,
a.brand-link:hover,
a.list-group-item:hover,
a.inventory-command-action:hover,
a.xfin-kpi-action:hover {
  text-decoration: none;
}

code,
kbd,
pre code {
  color: var(--x-verde-900);
}

mark,
.mark {
  background: var(--x-verde-100);
  color: var(--x-verde-900);
}

hr,
.dropdown-divider {
  border-top-color: var(--x-crema-borde);
}

::placeholder,
.form-control::placeholder,
.form-control-custom::placeholder,
.swal2-input::placeholder {
  color: var(--x-gris-claro) !important;
  opacity: 1;
}

input[type="checkbox"],
input[type="radio"],
input[type="range"],
progress {
  accent-color: var(--x-verde-600);
}

/* Foco visible en verde-500 */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
[role="button"]:focus-visible,
[tabindex]:focus-visible,
summary:focus-visible {
  outline: 2px solid var(--x-verde-500) !important;
  outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   3. Utilidades Bootstrap / AdminLTE (texto, fondo, borde)
   -------------------------------------------------------------------------- */
.text-primary,
.text-info,
.text-success,
.text-teal,
.text-olive,
.text-navy,
.text-lightblue,
.text-indigo,
.text-purple,
.text-blue,
.text-cyan,
.text-lime,
.text-green,
.footer-link,
.link-primary {
  color: var(--x-verde-600) !important;
}

.text-danger,
.text-warning,
.text-orange,
.text-maroon,
.text-pink,
.text-fuchsia,
.text-red,
.text-yellow,
.text-dark,
.text-body,
.text-black {
  color: var(--x-negro) !important;
}

.text-secondary,
.text-muted,
.text-gray,
.text-gray-dark {
  color: var(--x-gris) !important;
}

.text-white {
  color: var(--x-blanco) !important;
}

.bg-primary,
.bg-info,
.bg-success,
.bg-teal,
.bg-olive,
.bg-navy,
.bg-lightblue,
.bg-indigo,
.bg-purple,
.bg-blue,
.bg-cyan,
.bg-lime,
.bg-green,
.bg-gradient-primary,
.bg-gradient-info,
.bg-gradient-success {
  background: var(--x-verde-600) !important;
  color: var(--x-blanco) !important;
}

.bg-danger,
.bg-dark,
.bg-maroon,
.bg-red,
.bg-pink,
.bg-fuchsia,
.bg-black,
.bg-gradient-danger,
.bg-gradient-dark {
  background: var(--x-negro) !important;
  color: var(--x-crema) !important;
}

.bg-warning,
.bg-orange,
.bg-yellow,
.bg-gradient-warning {
  background: var(--x-crema-oscuro) !important;
  color: var(--x-negro) !important;
}

.bg-secondary,
.bg-gray,
.bg-gradient-secondary {
  background: var(--x-gris) !important;
  color: var(--x-blanco) !important;
}

.bg-light,
.bg-gray-light {
  background: var(--x-crema-claro) !important;
  color: var(--x-negro);
}

.bg-white {
  background: var(--x-blanco) !important;
}

.border {
  border-color: var(--x-crema-borde) !important;
}

.border-top,
.border-bottom,
.border-left,
.border-right {
  border-color: var(--x-crema-borde) !important;
}

.border-primary,
.border-info,
.border-success {
  border-color: var(--x-verde-600) !important;
}

.border-danger,
.border-dark {
  border-color: var(--x-negro) !important;
}

.border-warning,
.border-secondary {
  border-color: var(--x-crema-borde-fuerte) !important;
}

.border-light {
  border-color: var(--x-crema-oscuro) !important;
}

.rounded {
  border-radius: 8px !important;
}

.rounded-lg {
  border-radius: var(--x-radio-tarjeta) !important;
}

.shadow-sm,
.shadow {
  box-shadow: var(--x-sombra) !important;
}

.shadow-lg,
.elevation-4 {
  box-shadow: var(--x-sombra-fuerte) !important;
}

.elevation-1,
.elevation-2,
.elevation-3 {
  box-shadow: var(--x-sombra) !important;
}

/* --------------------------------------------------------------------------
   4. Botones (8 px, primario verde-600, borrar negro, pendiente crema)
   -------------------------------------------------------------------------- */
.btn,
.btn-submit,
.btn-passkey,
.modal-btn-primary,
.swal2-styled {
  border-radius: var(--x-radio-control) !important;
}

.btn-group > .btn:not(:last-child):not(.dropdown-toggle),
.btn-group > .btn-group:not(:last-child) > .btn,
.input-group > .input-group-prepend > .btn {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.btn-group > .btn:not(:first-child),
.btn-group > .btn-group:not(:first-child) > .btn,
.input-group > .input-group-append > .btn {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

.btn-primary,
.btn-info,
.btn-success,
.modal-btn-primary,
.btn-submit,
.btn-teal,
.btn-olive,
.btn-navy {
  background: var(--x-verde-600) !important;
  border-color: var(--x-verde-600) !important;
  color: var(--x-blanco) !important;
}

.btn-primary:hover,
.btn-info:hover,
.btn-success:hover,
.modal-btn-primary:hover,
.btn-submit:hover,
.btn-primary:focus,
.btn-info:focus,
.btn-success:focus,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-success:not(:disabled):not(.disabled):active,
.btn-info:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-success:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle,
.show > .btn-success.dropdown-toggle {
  background: var(--x-verde-700) !important;
  border-color: var(--x-verde-700) !important;
  color: var(--x-blanco) !important;
}

/* Borrar / peligro: boton negro con texto blanco */
.btn-danger,
.btn-dark,
.btn-maroon {
  background: var(--x-negro) !important;
  border-color: var(--x-negro) !important;
  color: var(--x-blanco) !important;
}

.btn-danger:hover,
.btn-dark:hover,
.btn-danger:focus,
.btn-dark:focus,
.btn-danger:not(:disabled):not(.disabled):active,
.btn-dark:not(:disabled):not(.disabled):active {
  background: var(--x-negro-suave) !important;
  border-color: var(--x-negro-suave) !important;
  color: var(--x-blanco) !important;
}

/* Pendiente / advertencia: negro sobre crema oscuro */
.btn-warning,
.btn-orange {
  background: var(--x-crema-oscuro) !important;
  border-color: var(--x-crema-borde-fuerte) !important;
  color: var(--x-negro) !important;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:not(:disabled):not(.disabled):active {
  background: var(--x-crema-borde) !important;
  border-color: var(--x-crema-borde-fuerte) !important;
  color: var(--x-negro) !important;
}

/* Secundarios y claros: contorno crema, texto negro */
.btn-secondary,
.btn-light,
.btn-default,
.btn-passkey,
.btn-outline-secondary,
.btn-outline-light,
.btn-outline-dark,
.btn-outline-warning,
.btn-tool {
  background: var(--x-blanco) !important;
  border-color: var(--x-crema-borde) !important;
  color: var(--x-negro) !important;
}

.btn-tool {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--x-gris) !important;
}

.btn-secondary:hover,
.btn-light:hover,
.btn-default:hover,
.btn-passkey:hover,
.btn-outline-secondary:hover,
.btn-outline-light:hover,
.btn-outline-dark:hover,
.btn-outline-warning:hover,
.btn-secondary:focus,
.btn-outline-secondary:focus,
.btn-secondary:not(:disabled):not(.disabled):active,
.btn-outline-secondary:not(:disabled):not(.disabled):active,
.btn-outline-dark:not(:disabled):not(.disabled):active,
.btn-tool:hover {
  background: var(--x-crema-oscuro) !important;
  border-color: var(--x-crema-borde-fuerte) !important;
  color: var(--x-negro) !important;
}

.btn-outline-dark:hover,
.btn-outline-dark:not(:disabled):not(.disabled):active {
  background: var(--x-negro) !important;
  border-color: var(--x-negro) !important;
  color: var(--x-blanco) !important;
}

.btn-outline-primary,
.btn-outline-info,
.btn-outline-success {
  background: transparent !important;
  border-color: var(--x-verde-600) !important;
  color: var(--x-verde-600) !important;
}

.btn-outline-primary:hover,
.btn-outline-info:hover,
.btn-outline-success:hover,
.btn-outline-primary:focus,
.btn-outline-success:focus,
.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-info:not(:disabled):not(.disabled):active,
.btn-outline-success:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled).active,
.btn-outline-success:not(:disabled):not(.disabled).active {
  background: var(--x-verde-600) !important;
  border-color: var(--x-verde-600) !important;
  color: var(--x-blanco) !important;
}

/* Borrar en contorno: contorno negro */
.btn-outline-danger {
  background: transparent !important;
  border-color: var(--x-negro) !important;
  color: var(--x-negro) !important;
}

.btn-outline-danger:hover,
.btn-outline-danger:focus,
.btn-outline-danger:not(:disabled):not(.disabled):active {
  background: var(--x-negro) !important;
  border-color: var(--x-negro) !important;
  color: var(--x-blanco) !important;
}

.btn-link,
.btn-link:hover {
  background: transparent !important;
  border-color: transparent !important;
}

.btn.disabled,
.btn:disabled {
  opacity: .55;
}

.btn:focus,
.btn.focus {
  box-shadow: none !important;
}

.btn-agregar-opcion {
  background: var(--x-verde-50) !important;
  border-color: var(--x-crema-borde) !important;
  color: var(--x-verde-600) !important;
}

.btn-agregar-opcion:hover {
  background: var(--x-verde-600) !important;
  border-color: var(--x-verde-600) !important;
  color: var(--x-blanco) !important;
}

/* --------------------------------------------------------------------------
   5. Badges, alertas, callouts, cajas
   -------------------------------------------------------------------------- */
.badge {
  border-radius: 999px;
  font-weight: 800;
  padding: .38rem .62rem;
}

.badge-primary,
.badge-info,
.badge-teal,
.badge-olive,
.badge-navy,
.badge-indigo,
.badge-purple,
.badge-blue {
  background: var(--x-verde-600) !important;
  color: var(--x-blanco) !important;
}

.badge-success {
  background: var(--x-verde-100) !important;
  color: var(--x-verde-900) !important;
}

.badge-warning,
.badge-orange,
.badge-yellow {
  background: var(--x-crema-oscuro) !important;
  color: var(--x-negro) !important;
}

.badge-danger,
.badge-dark,
.badge-maroon,
.badge-pink,
.badge-fuchsia {
  background: var(--x-negro) !important;
  color: var(--x-crema) !important;
}

.badge-secondary {
  background: var(--x-gris) !important;
  color: var(--x-blanco) !important;
}

.badge-light {
  background: var(--x-crema-claro) !important;
  border: 1px solid var(--x-crema-borde);
  color: var(--x-negro-suave) !important;
}

.xfin-badge.ok {
  background: var(--x-verde-100);
  color: var(--x-verde-900);
}

.xfin-badge.warn {
  background: var(--x-crema-oscuro);
  color: var(--x-negro);
}

.xfin-badge.bad {
  background: var(--x-negro);
  color: var(--x-crema);
}

.alert {
  border: 1px solid var(--x-crema-borde);
  border-radius: var(--x-radio-tarjeta);
  color: var(--x-negro);
}

.alert-success,
.alert-info,
.alert-primary {
  background: var(--x-verde-50);
  border-color: var(--x-verde-100);
  border-left: 4px solid var(--x-verde-600);
  color: var(--x-verde-900);
}

.alert-danger {
  background: var(--x-crema-oscuro);
  border-color: var(--x-crema-borde-fuerte);
  border-left: 4px solid var(--x-negro);
  color: var(--x-negro);
}

.alert-warning {
  background: var(--x-crema);
  border-color: var(--x-crema-borde);
  border-left: 4px solid var(--x-gris);
  color: var(--x-negro);
}

.alert-secondary,
.alert-light {
  background: var(--x-crema-claro);
  border-color: var(--x-crema-borde);
  color: var(--x-negro-suave);
}

.alert-dark {
  background: var(--x-negro);
  border-color: var(--x-negro);
  color: var(--x-crema);
}

.alert .alert-link,
.alert h4,
.alert h5,
.alert .icon {
  color: inherit;
}

.alert .close {
  color: inherit;
  text-shadow: none;
}

.callout {
  background: var(--x-crema-claro);
  border: 1px solid var(--x-crema-borde);
  border-left: 5px solid var(--x-crema-borde-fuerte);
  border-radius: var(--x-radio-tarjeta);
  box-shadow: none;
}

.callout.callout-info,
.callout.callout-success,
.callout.callout-primary {
  border-left-color: var(--x-verde-600);
}

.callout.callout-warning {
  border-left-color: var(--x-gris);
}

.callout.callout-danger {
  border-left-color: var(--x-negro);
}

.small-box,
.info-box {
  border-radius: var(--x-radio-tarjeta);
  box-shadow: var(--x-sombra);
}

.small-box > .small-box-footer {
  background: rgba(26, 25, 21, .12);
  color: var(--x-crema);
}

.info-box {
  background: var(--x-blanco);
  border: 1px solid var(--x-crema-borde);
}

.info-box .info-box-icon {
  border-radius: 8px;
}

.info-box .info-box-text,
.info-box .info-box-number {
  color: var(--x-negro);
}

.tooltip-inner {
  background: var(--x-negro);
  color: var(--x-crema);
}

.bs-tooltip-top .arrow::before,
.bs-tooltip-auto[x-placement^="top"] .arrow::before {
  border-top-color: var(--x-negro);
}

.popover {
  border-color: var(--x-crema-borde);
  border-radius: var(--x-radio-tarjeta);
  box-shadow: var(--x-sombra-fuerte);
}

.breadcrumb {
  background: var(--x-crema-oscuro);
}

.breadcrumb-item.active {
  color: var(--x-gris);
}

.list-group-item {
  border-color: var(--x-crema-borde);
  color: var(--x-negro);
}

.list-group-item.active {
  background: var(--x-verde-600);
  border-color: var(--x-verde-600);
  color: var(--x-blanco);
}

.list-group-item-action:hover,
.list-group-item-action:focus {
  background: var(--x-crema);
  color: var(--x-negro);
}

/* --------------------------------------------------------------------------
   6. Tarjetas, modales, menus (10 px, sombra calida, borde crema)
   -------------------------------------------------------------------------- */
.card,
.enterprise-panel,
.costs-panel,
.sale-panel,
.dashboard-card,
.inventory-command-center,
.product-catalog-card,
.finance-panel,
.xfin-panel,
.purchases-panel,
.finance-kpi,
.xfin-kpi,
.purchase-kpi,
.inventory-metric,
.costs-kpi,
.enterprise-strip,
.xantina-app-lockup,
.xfin-advice,
.xfin-empty,
.maintenance-history-toggle,
.maintenance-history-body,
.contable-section-header,
.inventory-side-tabs,
.costs-accordion-card,
.lot-estimate,
.accounting-login-card,
.xfin-collection-client,
.xfin-collection-sale,
.purchase-file,
.purchases-table-wrap,
.omni-form-panel {
  border-color: var(--x-crema-borde) !important;
  border-radius: var(--x-radio-tarjeta) !important;
  box-shadow: var(--x-sombra) !important;
}

.card {
  background: var(--x-blanco);
  border: 1px solid var(--x-crema-borde);
  overflow: hidden;
}

.card-header,
.enterprise-panel-head,
.card-footer {
  background: var(--x-blanco);
  border-color: var(--x-crema-borde) !important;
}

.card-footer {
  background: var(--x-crema-claro);
}

.card-title,
.card-header .h4,
.card-header .h5,
.card-header b {
  color: var(--x-negro);
}

.card-primary.card-outline,
.card-info.card-outline,
.card-success.card-outline,
.card-teal.card-outline,
.card-olive.card-outline {
  border-top: 3px solid var(--x-verde-600);
}

.card-warning.card-outline,
.card-danger.card-outline,
.card-dark.card-outline {
  border-top: 3px solid var(--x-negro);
}

.card-secondary.card-outline,
.card-light.card-outline {
  border-top: 3px solid var(--x-crema-borde-fuerte);
}

.card-outline-tabs,
.card-primary.card-outline-tabs,
.card-outline.card-outline-tabs {
  border-top: 0 !important;
}

.card-primary:not(.card-outline) > .card-header,
.card-info:not(.card-outline) > .card-header,
.card-success:not(.card-outline) > .card-header,
.card-dark:not(.card-outline) > .card-header {
  background: var(--x-verde-900);
  color: var(--x-crema);
}

.card-danger:not(.card-outline) > .card-header,
.card-warning:not(.card-outline) > .card-header {
  background: var(--x-negro);
  color: var(--x-crema);
}

.card-secondary:not(.card-outline) > .card-header {
  background: var(--x-crema-oscuro);
  color: var(--x-negro);
}

.modal-content,
.modal-content-custom,
#modalProductoInventario .modal-content,
#modalLoteCafe .modal-content,
#modalEmpaquetarLote .modal-content {
  border: 1px solid var(--x-crema-borde) !important;
  border-radius: var(--x-radio-tarjeta) !important;
  box-shadow: var(--x-sombra-fuerte) !important;
  overflow: hidden;
}

.modal-header {
  border-bottom: 1px solid var(--x-crema-borde);
}

.modal-header.bg-primary,
.modal-header.bg-success,
.modal-header.bg-info,
.modal-header.bg-dark,
.modal-header.bg-secondary,
.modal-header-custom,
.xfin-modal .modal-header,
#modalLoteCafe .modal-header,
#modalEmpaquetarLote .modal-header {
  background: var(--x-verde-900) !important;
  border-bottom: 0 !important;
  color: var(--x-crema) !important;
}

.modal-header.bg-danger,
.modal-header.bg-warning {
  background: var(--x-negro) !important;
  border-bottom: 0 !important;
  color: var(--x-crema) !important;
}

.modal-header.bg-primary .close,
.modal-header.bg-success .close,
.modal-header.bg-info .close,
.modal-header.bg-dark .close,
.modal-header.bg-danger .close,
.modal-header.bg-warning .close,
.modal-header-custom .close,
.xfin-modal .modal-header .close {
  color: var(--x-crema) !important;
  opacity: .85;
  text-shadow: none;
}

.modal-header.bg-primary .modal-title,
.modal-header.bg-success .modal-title,
.modal-header.bg-info .modal-title,
.modal-header.bg-dark .modal-title,
.xfin-modal-eyebrow {
  color: var(--x-crema) !important;
}

.xfin-modal-eyebrow {
  color: var(--x-crema-sobre-oscuro) !important;
}

.modal-body,
.modal-body.bg-light,
#modalProductoInventario .modal-body,
#modalLoteCafe .modal-body,
#modalEmpaquetarLote .modal-body,
.xfin-collection-modal .modal-body {
  background: var(--x-crema-claro) !important;
}

.modal-footer {
  background: var(--x-blanco);
  border-top: 1px solid var(--x-crema-borde) !important;
}

.close {
  color: var(--x-negro);
  text-shadow: none;
}

.dropdown-menu {
  border: 1px solid var(--x-crema-borde) !important;
  border-radius: var(--x-radio-tarjeta) !important;
  box-shadow: var(--x-sombra-fuerte) !important;
}

.dropdown-item {
  color: var(--x-negro);
}

.dropdown-item:hover,
.dropdown-item:focus {
  background: var(--x-crema-oscuro) !important;
  color: var(--x-verde-900) !important;
}

.dropdown-item.active,
.dropdown-item:active {
  background: var(--x-verde-600) !important;
  color: var(--x-blanco) !important;
}

.dropdown-item.text-danger:hover,
.dropdown-item.text-danger:focus {
  color: var(--x-negro) !important;
}

.account-menu-header {
  background: var(--x-crema-claro) !important;
  border: 1px solid var(--x-crema-borde) !important;
  border-radius: 8px;
}

.account-user-trigger:hover,
.account-user-trigger[aria-expanded="true"] {
  background: var(--x-crema);
  border-color: var(--x-crema-borde);
}

.account-user-mini,
.account-avatar {
  background: var(--x-verde-900) !important;
  color: var(--x-crema) !important;
}

/* --------------------------------------------------------------------------
   7. Formularios y controles
   -------------------------------------------------------------------------- */
.form-control,
.custom-select,
.custom-file-label,
.form-control-custom,
.input-group-text,
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select,
div.dt-container .dt-search input,
div.dt-container .dt-length select,
div.dt-container .dt-input,
.xfin-sim-grid input,
.xfin-form-grid input,
.xfin-form-grid select,
.xfin-textarea-label textarea,
.swal2-input,
.swal2-textarea,
.swal2-select,
#modalProductoInventario .form-control,
#modalLoteCafe .form-control,
#modalEmpaquetarLote .form-control {
  background-color: var(--x-blanco);
  border-color: var(--x-crema-borde);
  border-radius: var(--x-radio-control);
  color: var(--x-negro);
}

.input-group-text {
  background: var(--x-crema);
  color: var(--x-gris);
}

.form-control:focus,
.custom-select:focus,
.custom-file-input:focus ~ .custom-file-label,
.form-control-custom:focus,
.dataTables_wrapper .dataTables_filter input:focus,
.dataTables_wrapper .dataTables_length select:focus,
div.dt-container .dt-search input:focus,
div.dt-container .dt-length select:focus,
div.dt-container .dt-input:focus,
.xfin-sim-grid input:focus,
.xfin-form-grid input:focus,
.xfin-form-grid select:focus,
.xfin-textarea-label textarea:focus,
.swal2-input:focus,
.swal2-textarea:focus,
.swal2-select:focus,
#modalProductoInventario .form-control:focus,
#modalLoteCafe .form-control:focus,
#modalEmpaquetarLote .form-control:focus,
.select2-container--bootstrap4.select2-container--focus .select2-selection,
.select2-container--bootstrap4.select2-container--open .select2-selection,
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--single {
  background-color: var(--x-blanco);
  border-color: var(--x-verde-500) !important;
  box-shadow: var(--x-foco) !important;
  color: var(--x-negro);
  outline: 0;
}

.form-control:disabled,
.form-control[readonly],
.custom-select:disabled {
  background-color: var(--x-crema);
  color: var(--x-negro-suave);
}

#producto_costo[readonly] {
  background: var(--x-verde-50);
  color: var(--x-verde-600);
}

.form-control.is-invalid,
.was-validated .form-control:invalid,
.custom-select.is-invalid {
  background-image: none;
  border-color: var(--x-negro);
}

.form-control.is-valid,
.was-validated .form-control:valid,
.custom-select.is-valid {
  background-image: none;
  border-color: var(--x-verde-600);
}

.invalid-feedback,
.invalid-tooltip {
  color: var(--x-negro);
}

.valid-feedback {
  color: var(--x-verde-600);
}

label,
.col-form-label {
  color: var(--x-negro);
}

/* Casillas, radios, interruptores, iCheck */
.custom-control-input:checked ~ .custom-control-label::before,
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before,
.custom-radio .custom-control-input:checked ~ .custom-control-label::before,
.custom-switch .custom-control-input:checked ~ .custom-control-label::before,
.custom-control-input:not(:disabled):active ~ .custom-control-label::before {
  background-color: var(--x-verde-600) !important;
  border-color: var(--x-verde-600) !important;
}

.custom-control-input:focus ~ .custom-control-label::before {
  box-shadow: var(--x-foco) !important;
}

.custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
  border-color: var(--x-verde-500) !important;
}

.custom-control-label::before {
  background-color: var(--x-blanco);
  border-color: var(--x-crema-borde-fuerte);
}

.custom-switch .custom-control-label::after {
  background-color: var(--x-crema-borde-fuerte);
}

.custom-switch .custom-control-input:checked ~ .custom-control-label::after {
  background-color: var(--x-blanco);
}

.form-check-input {
  accent-color: var(--x-verde-600);
}

.icheck-primary > input:first-child:checked + label::before,
.icheck-primary > input:first-child:checked + input[type="hidden"] + label::before,
.icheck-success > input:first-child:checked + label::before,
.icheck-success > input:first-child:checked + input[type="hidden"] + label::before {
  background-color: var(--x-verde-600) !important;
  border-color: var(--x-verde-600) !important;
}

.icheck-primary > input:first-child:not(:checked):not(:disabled):hover + label::before,
.icheck-primary > input:first-child:not(:checked):not(:disabled):hover + input[type="hidden"] + label::before,
.icheck-primary > input:first-child:not(:checked):not(:disabled):focus + label::before,
.icheck-primary > input:first-child:not(:checked):not(:disabled):focus + input[type="hidden"] + label::before {
  border-color: var(--x-verde-500) !important;
}

[class*="icheck-"] > input:first-child + label::before,
[class*="icheck-"] > input:first-child + input[type="hidden"] + label::before {
  border-color: var(--x-crema-borde-fuerte);
  border-radius: 4px;
}

.icheck-primary label {
  color: var(--x-negro-suave);
}

.custom-range::-webkit-slider-thumb,
.custom-range::-moz-range-thumb {
  background-color: var(--x-verde-600);
}

.custom-range::-webkit-slider-runnable-track,
.custom-range::-moz-range-track {
  background-color: var(--x-crema-oscuro);
}

.progress {
  background-color: var(--x-crema-oscuro);
  border-radius: 999px;
}

.progress-bar {
  background-color: var(--x-verde-600);
}

.progress-bar.bg-warning,
.progress-bar.bg-danger {
  background: var(--x-negro) !important;
}

.progress-bar.bg-info {
  background: var(--x-verde-700) !important;
}

/* Select2 (tema por defecto y tema Bootstrap 4) */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple,
.select2-container--bootstrap4 .select2-selection {
  background: var(--x-blanco);
  border: 1px solid var(--x-crema-borde) !important;
  border-radius: var(--x-radio-control) !important;
  min-height: 38px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered {
  color: var(--x-negro);
}

.select2-container--default .select2-selection--single .select2-selection__placeholder,
.select2-container--bootstrap4 .select2-selection--single .select2-selection__placeholder {
  color: var(--x-gris-claro);
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: var(--x-gris) transparent transparent transparent;
}

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--x-gris) transparent;
}

.select2-dropdown,
.select2-container--bootstrap4 .select2-dropdown {
  border-color: var(--x-crema-borde) !important;
  border-radius: var(--x-radio-tarjeta) !important;
  box-shadow: var(--x-sombra-fuerte);
  overflow: hidden;
}

.select2-container--default .select2-search--dropdown .select2-search__field,
.select2-container--bootstrap4 .select2-search--dropdown .select2-search__field {
  border: 1px solid var(--x-crema-borde);
  border-radius: 6px;
  color: var(--x-negro);
}

.select2-container--default .select2-search--dropdown .select2-search__field:focus,
.select2-container--bootstrap4 .select2-search--dropdown .select2-search__field:focus {
  border-color: var(--x-verde-500);
  box-shadow: var(--x-foco);
  outline: 0;
}

.select2-results__option {
  color: var(--x-negro);
}

.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable,
.select2-container--bootstrap4 .select2-results__option--highlighted,
.select2-container--bootstrap4 .select2-results__option--highlighted.select2-results__option[aria-selected="true"] {
  background: var(--x-verde-600) !important;
  color: var(--x-blanco) !important;
}

.select2-container--default .select2-results__option[aria-selected="true"],
.select2-container--default .select2-results__option--selected,
.select2-container--bootstrap4 .select2-results__option[aria-selected="true"] {
  background: var(--x-crema-oscuro);
  color: var(--x-negro);
}

.select2-container .select2-selection--multiple .select2-selection__choice,
.select2-container--default .select2-selection--multiple .select2-selection__choice,
.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice {
  background: var(--x-verde-100) !important;
  border: 1px solid var(--x-verde-100) !important;
  border-radius: 999px !important;
  color: var(--x-verde-900) !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove,
.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice__remove {
  color: var(--x-verde-900) !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover,
.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice__remove:hover {
  color: var(--x-negro) !important;
}

.select2-container--default .select2-results__group,
.select2-container--bootstrap4 .select2-results__group {
  color: var(--x-gris);
}

.select2-container--default .select2-selection--single .select2-selection__clear,
.select2-container--bootstrap4 .select2-selection__clear {
  color: var(--x-gris);
}

/* --------------------------------------------------------------------------
   8. Tablas y DataTables
   -------------------------------------------------------------------------- */
.table {
  color: var(--x-negro);
}

.table th,
.table td,
.table thead th,
.table-bordered,
.table-bordered th,
.table-bordered td,
table.dataTable.table-bordered,
table.dataTable.table-bordered th,
table.dataTable.table-bordered td {
  border-color: var(--x-crema-borde) !important;
}

/* Cabeceras: mayusculas pequenas con espaciado, fondo crema */
.table thead th,
.table > thead > tr > th,
table.dataTable thead > tr > th,
table.dataTable thead > tr > td,
.table .thead-light th,
.dashboard-detail-table th,
.purchase-lines-table th,
#tbl_compras_costos th,
.xfin-table thead th {
  background: var(--x-crema) !important;
  border-bottom: 1px solid var(--x-crema-borde) !important;
  border-top: 0 !important;
  color: var(--x-negro-suave) !important;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  vertical-align: middle;
}

.table .thead-dark th,
.table-dark,
.table-dark th,
.table-dark td {
  background: var(--x-negro) !important;
  border-color: var(--x-negro-suave) !important;
  color: var(--x-crema) !important;
}

.table-striped tbody tr:nth-of-type(odd),
.table-striped > tbody > tr:nth-of-type(odd),
table.dataTable.table-striped > tbody > tr.odd > * {
  background-color: var(--x-crema-claro) !important;
  box-shadow: none;
}

.table-hover tbody tr:hover,
.table-hover > tbody > tr:hover,
table.dataTable.table-hover > tbody > tr:hover > * {
  background-color: var(--x-crema) !important;
  box-shadow: none;
  color: var(--x-negro);
}

.table-primary,
.table-primary > th,
.table-primary > td,
.table-info,
.table-info > th,
.table-info > td,
.table-success,
.table-success > th,
.table-success > td {
  background-color: var(--x-verde-100) !important;
  color: var(--x-verde-900);
}

.table-warning,
.table-warning > th,
.table-warning > td,
.table-danger,
.table-danger > th,
.table-danger > td {
  background-color: var(--x-crema-oscuro) !important;
  color: var(--x-negro);
}

.table-secondary,
.table-secondary > th,
.table-secondary > td,
.table-light,
.table-light > th,
.table-light > td,
.table-active,
.table-active > th,
.table-active > td {
  background-color: var(--x-crema) !important;
}

table.dataTable tbody > tr.selected > *,
table.dataTable tbody > tr > .selected {
  box-shadow: inset 0 0 0 9999px var(--x-verde-600) !important;
  color: var(--x-blanco) !important;
}

table.dataTable > tbody > tr {
  background: var(--x-blanco);
}

/* Controles de DataTables (v1 y v2) */
.dataTables_wrapper .dataTables_info,
div.dt-container .dt-info,
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
div.dt-container .dt-length,
div.dt-container .dt-search {
  color: var(--x-gris);
}

.dataTables_wrapper .dataTables_paginate .paginate_button,
div.dt-container .dt-paging .dt-paging-button {
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: var(--x-radio-control) !important;
  color: var(--x-negro-suave) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover,
div.dt-container .dt-paging .dt-paging-button:hover {
  background: var(--x-crema-oscuro) !important;
  border-color: var(--x-crema-borde) !important;
  color: var(--x-verde-900) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
div.dt-container .dt-paging .dt-paging-button.current,
div.dt-container .dt-paging .dt-paging-button.current:hover {
  background: var(--x-verde-600) !important;
  border-color: var(--x-verde-600) !important;
  color: var(--x-blanco) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
div.dt-container .dt-paging .dt-paging-button.disabled,
div.dt-container .dt-paging .dt-paging-button.disabled:hover {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--x-gris-claro) !important;
}

table.dataTable thead > tr > th.dt-orderable-asc:hover,
table.dataTable thead > tr > th.dt-orderable-desc:hover,
table.dataTable thead > tr > td.dt-orderable-asc:hover,
table.dataTable thead > tr > td.dt-orderable-desc:hover {
  outline: 2px solid var(--x-crema-borde);
}

table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order:before,
table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order:after,
table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_desc:after {
  color: var(--x-verde-600);
  opacity: 1;
}

table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control:before,
table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control:before,
table.dataTable > tbody > tr > td.dt-control:before {
  border-left-color: var(--x-verde-600);
  color: var(--x-verde-600);
}

table.dataTable.dtr-inline.collapsed > tbody > tr.dtr-expanded > td.dtr-control:before,
table.dataTable.dtr-inline.collapsed > tbody > tr.dtr-expanded > th.dtr-control:before {
  border-top-color: var(--x-negro);
}

.page-link {
  border-color: var(--x-crema-borde);
  color: var(--x-negro-suave);
}

.page-link:hover {
  background: var(--x-crema-oscuro);
  border-color: var(--x-crema-borde);
  color: var(--x-verde-900);
}

.page-link:focus {
  box-shadow: var(--x-foco);
}

.page-item.active .page-link {
  background: var(--x-verde-600);
  border-color: var(--x-verde-600);
  color: var(--x-blanco);
}

.page-item.disabled .page-link {
  color: var(--x-gris-claro);
  border-color: var(--x-crema-borde);
}

/* --------------------------------------------------------------------------
   9. Pestanas, pildoras, acordeones
   -------------------------------------------------------------------------- */
.nav-tabs {
  border-bottom-color: var(--x-crema-borde);
}

.nav-tabs .nav-link {
  color: var(--x-negro-suave);
}

.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus {
  border-color: var(--x-crema-oscuro) var(--x-crema-oscuro) var(--x-crema-borde);
  color: var(--x-verde-700);
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
  background: var(--x-blanco);
  border-color: var(--x-crema-borde) var(--x-crema-borde) var(--x-blanco);
  color: var(--x-verde-900);
}

.card-outline-tabs > .card-header a.active,
.card-primary.card-outline-tabs > .card-header a.active,
.card-success.card-outline-tabs > .card-header a.active,
.card-info.card-outline-tabs > .card-header a.active {
  border-top: 3px solid var(--x-verde-600) !important;
}

.card-outline-tabs > .card-header a:hover,
.card-primary.card-outline-tabs > .card-header a:hover {
  border-top: 3px solid var(--x-crema-borde) !important;
}

.card-outline-tabs > .card-header a.active:hover {
  border-top-color: var(--x-verde-600) !important;
}

.nav-pills .nav-link {
  color: var(--x-negro-suave);
}

.nav-pills .nav-link:not(.active):hover {
  color: var(--x-verde-600);
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background: var(--x-verde-600);
  color: var(--x-blanco);
}

.inventory-tabs .nav-link {
  color: var(--x-negro-suave);
}

.inventory-tabs .nav-link.active {
  background: var(--x-verde-50);
  border-color: var(--x-verde-100);
  border-left-color: var(--x-verde-600);
  color: var(--x-verde-900);
}

.costs-accordion-toggle:hover,
.costs-accordion-toggle[aria-expanded="true"] {
  background: var(--x-crema-claro);
}

/* --------------------------------------------------------------------------
   10. Estructura: barra lateral negra, cabecera, pie
   -------------------------------------------------------------------------- */
.main-sidebar,
.main-sidebar::before,
.sidebar-dark-primary,
.layout-fixed .main-sidebar {
  background: var(--x-negro) !important;
  box-shadow: none !important;
}

.main-sidebar .brand-link,
.brand-link {
  background: #11100f !important;
  border-bottom: 1px solid rgba(246, 239, 227, .1) !important;
}

.brand-link .brand-text,
.brand-link .brand-logo-mark {
  color: var(--x-crema) !important;
}

.brand-logo-mark,
.xantina-brand-mark {
  background: rgba(246, 239, 227, .08) !important;
  border-color: rgba(246, 239, 227, .18) !important;
}

.main-sidebar .user-panel,
.sidebar .user-panel {
  border-bottom-color: rgba(246, 239, 227, .12) !important;
}

.main-sidebar .user-panel .image .img-circle,
.sidebar .user-panel .image .img-circle {
  background: var(--x-crema) !important;
  color: var(--x-verde-900) !important;
}

.main-sidebar .user-panel .info .text-white,
.main-sidebar .user-panel .info a {
  color: var(--x-crema) !important;
}

.main-sidebar .user-panel .info .text-white-50 {
  color: rgba(246, 239, 227, .62) !important;
}

.main-sidebar .nav-sidebar .nav-header,
.nav-sidebar .nav-header {
  color: rgba(246, 239, 227, .5) !important;
}

.main-sidebar .nav-sidebar .nav-link,
.main-sidebar .nav-sidebar > .nav-item > .nav-link,
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link {
  background: transparent;
  border-radius: 8px;
  box-shadow: none !important;
  color: var(--x-crema-sobre-oscuro) !important;
}

.main-sidebar .nav-sidebar .nav-link .nav-icon,
.main-sidebar .nav-sidebar .nav-link p {
  color: inherit !important;
}

.main-sidebar .nav-sidebar .nav-link:not(.active):hover,
.main-sidebar .nav-sidebar .nav-link:not(.active):focus,
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link:not(.active):hover,
.sidebar-dark-primary .nav-sidebar > .nav-item:hover > .nav-link:not(.active) {
  background: rgba(246, 239, 227, .08) !important;
  color: var(--x-crema) !important;
}

/* Item activo: verde-600 con borde izquierdo */
.main-sidebar .nav-sidebar .nav-link.active,
.main-sidebar .nav-sidebar > .nav-item > .nav-link.active,
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active,
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active:hover {
  background: var(--x-verde-600) !important;
  box-shadow: inset 4px 0 0 var(--x-verde-100) !important;
  color: var(--x-crema) !important;
}

.main-sidebar .nav-sidebar .nav-link.active .nav-icon,
.main-sidebar .nav-sidebar .nav-link.active p,
.nav-sidebar .nav-link.active .nav-icon {
  color: var(--x-crema) !important;
}

.os-theme-light > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle {
  background: rgba(246, 239, 227, .28);
}

html.xantina-movil body.sidebar-open #sidebar-overlay,
body.sidebar-open::before {
  background: rgba(26, 25, 21, .5);
}

.main-header,
.main-header.navbar-white,
.main-header.navbar-light {
  background: var(--x-crema-claro) !important;
  border-bottom: 1px solid var(--x-crema-borde) !important;
  box-shadow: none !important;
}

.main-header .nav-link,
.main-header .navbar-nav .nav-link,
.navbar-light .navbar-nav .nav-link {
  color: var(--x-negro-suave) !important;
}

.main-header .nav-link:hover,
.main-header .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:hover {
  color: var(--x-verde-600) !important;
}

.main-footer {
  background: var(--x-crema-claro);
  border-top: 1px solid var(--x-crema-borde);
  color: var(--x-gris);
}

.main-footer strong,
.main-footer b {
  color: var(--x-negro-suave);
}

/* Lockup del cascaron (ERP Empresarial): blanco con titular en verde-900 */
.xantina-app-lockup {
  background: var(--x-blanco);
  border: 1px solid var(--x-crema-borde);
  border-left: 5px solid var(--x-verde-900) !important;
}

.xantina-app-mark {
  background: var(--x-verde-50);
  border-color: var(--x-verde-100);
  color: var(--x-verde-900);
}

.page-title {
  color: var(--x-verde-900);
}

.page-subtitle {
  color: var(--x-gris);
}

.enterprise-signal {
  border: 1px solid var(--x-crema-borde);
  border-left-width: 4px;
}

.enterprise-signal i {
  background: var(--x-verde-50);
  color: var(--x-verde-600);
}

.enterprise-signal.signal-costs i {
  background: var(--x-crema-oscuro);
  color: var(--x-negro);
}

.enterprise-signal.signal-quality i {
  background: var(--x-verde-50);
  color: var(--x-verde-700);
}

.enterprise-signal.signal-ops i {
  background: var(--x-crema-oscuro);
  color: var(--x-gris);
}

/* --------------------------------------------------------------------------
   11. Heroes / encabezados de modulo: verde-900 con texto crema
   -------------------------------------------------------------------------- */
.dashboard-hero,
.inventory-hero,
.production-hero,
.sale-hero,
.costs-hero,
.purchases-hero,
.finance-head,
.xfin-head,
.dashboard-hero.bg-white,
.inventory-hero.bg-white,
.production-hero.bg-white,
.sale-hero.bg-white,
.costs-hero.bg-white {
  background: linear-gradient(135deg, var(--x-verde-900) 0%, var(--x-verde-700) 100%) !important;
  border: 0 !important;
  border-radius: var(--x-radio-tarjeta) !important;
  box-shadow: var(--x-sombra) !important;
  color: var(--x-crema) !important;
  overflow: hidden;
  position: relative;
}

.dashboard-hero::after {
  background: rgba(246, 239, 227, .07);
}

.dashboard-hero > *,
.inventory-hero > *,
.production-hero > *,
.sale-hero > *,
.costs-hero > *,
.purchases-hero > *,
.finance-head > *,
.xfin-head > * {
  position: relative;
  z-index: 1;
}

.dashboard-hero h1, .dashboard-hero h2, .dashboard-hero h3, .dashboard-hero h4, .dashboard-hero h5, .dashboard-hero h6,
.inventory-hero h1, .inventory-hero h2, .inventory-hero h3, .inventory-hero h4, .inventory-hero h5, .inventory-hero h6,
.production-hero h1, .production-hero h2, .production-hero h3, .production-hero h4, .production-hero h5, .production-hero h6,
.sale-hero h1, .sale-hero h2, .sale-hero h3, .sale-hero h4, .sale-hero h5, .sale-hero h6,
.costs-hero h1, .costs-hero h2, .costs-hero h3, .costs-hero h4, .costs-hero h5, .costs-hero h6,
.purchases-hero h1, .purchases-hero h2, .purchases-hero h3, .purchases-hero h4, .purchases-hero h5, .purchases-hero h6,
.finance-head h1, .finance-head h2, .finance-head h3, .finance-head h4, .finance-head h5, .finance-head h6,
.xfin-head h1, .xfin-head h2, .xfin-head h3, .xfin-head h4, .xfin-head h5, .xfin-head h6,
.dashboard-hero .text-dark, .inventory-hero .text-dark, .production-hero .text-dark, .sale-hero .text-dark, .costs-hero .text-dark,
.dashboard-hero strong, .inventory-hero strong, .production-hero strong, .sale-hero strong, .costs-hero strong,
.purchases-hero strong, .finance-head strong, .xfin-head strong,
.dashboard-hero .text-primary, .dashboard-hero .text-info, .dashboard-hero .text-success, .dashboard-hero .text-warning, .dashboard-hero .text-danger,
.inventory-hero .text-primary, .inventory-hero .text-info, .inventory-hero .text-success, .inventory-hero .text-warning,
.production-hero .text-primary, .production-hero .text-info, .production-hero .text-success, .production-hero .text-warning,
.sale-hero .text-primary, .sale-hero .text-info, .sale-hero .text-success, .sale-hero .text-warning,
.costs-hero .text-primary, .costs-hero .text-info, .costs-hero .text-success, .costs-hero .text-warning,
.purchases-hero .text-primary, .purchases-hero .text-info, .purchases-hero .text-success, .purchases-hero .text-warning,
.finance-head .text-primary, .finance-head .text-info, .finance-head .text-success, .finance-head .text-warning,
.xfin-head .text-primary, .xfin-head .text-info, .xfin-head .text-success, .xfin-head .text-warning {
  color: var(--x-crema) !important;
}

.dashboard-hero p, .inventory-hero p, .production-hero p, .sale-hero p, .costs-hero p, .purchases-hero p, .finance-head p, .xfin-head p,
.dashboard-hero .text-muted, .inventory-hero .text-muted, .production-hero .text-muted, .sale-hero .text-muted, .costs-hero .text-muted,
.purchases-hero .text-muted, .finance-head .text-muted, .xfin-head .text-muted,
.dashboard-hero small, .inventory-hero small, .production-hero small, .sale-hero small, .costs-hero small, .purchases-hero small,
.finance-head small, .xfin-head small,
.xfin-brand span,
.xfin-brand p {
  color: var(--x-crema-sobre-oscuro) !important;
}

.xfin-head-icon {
  background: rgba(246, 239, 227, .12) !important;
  border-color: rgba(246, 239, 227, .22) !important;
  color: var(--x-crema) !important;
}

/* Botones dentro de un hero */
.dashboard-hero .btn-outline-primary, .dashboard-hero .btn-outline-info, .dashboard-hero .btn-outline-success,
.dashboard-hero .btn-outline-secondary, .dashboard-hero .btn-outline-dark, .dashboard-hero .btn-outline-light, .dashboard-hero .btn-outline-warning,
.inventory-hero .btn-outline-primary, .inventory-hero .btn-outline-info, .inventory-hero .btn-outline-success,
.inventory-hero .btn-outline-secondary, .inventory-hero .btn-outline-dark, .inventory-hero .btn-outline-light, .inventory-hero .btn-outline-warning,
.production-hero .btn-outline-primary, .production-hero .btn-outline-info, .production-hero .btn-outline-success,
.production-hero .btn-outline-secondary, .production-hero .btn-outline-dark, .production-hero .btn-outline-light, .production-hero .btn-outline-warning,
.sale-hero .btn-outline-primary, .sale-hero .btn-outline-info, .sale-hero .btn-outline-success,
.sale-hero .btn-outline-secondary, .sale-hero .btn-outline-dark, .sale-hero .btn-outline-light, .sale-hero .btn-outline-warning,
.costs-hero .btn-outline-primary, .costs-hero .btn-outline-info, .costs-hero .btn-outline-success,
.costs-hero .btn-outline-secondary, .costs-hero .btn-outline-dark, .costs-hero .btn-outline-light, .costs-hero .btn-outline-warning,
.purchases-hero .btn-outline-primary, .purchases-hero .btn-outline-info, .purchases-hero .btn-outline-success,
.purchases-hero .btn-outline-secondary, .purchases-hero .btn-outline-dark, .purchases-hero .btn-outline-light,
.finance-head .btn-outline-primary, .finance-head .btn-outline-info, .finance-head .btn-outline-success,
.finance-head .btn-outline-secondary, .finance-head .btn-outline-dark, .finance-head .btn-outline-light,
.xfin-head .btn-outline-primary, .xfin-head .btn-outline-info, .xfin-head .btn-outline-success,
.xfin-head .btn-outline-secondary, .xfin-head .btn-outline-dark, .xfin-head .btn-outline-light {
  background: transparent !important;
  border-color: rgba(246, 239, 227, .55) !important;
  color: var(--x-crema) !important;
}

.dashboard-hero .btn-outline-primary:hover, .dashboard-hero .btn-outline-info:hover, .dashboard-hero .btn-outline-success:hover,
.dashboard-hero .btn-outline-secondary:hover, .dashboard-hero .btn-outline-dark:hover, .dashboard-hero .btn-outline-light:hover, .dashboard-hero .btn-outline-warning:hover,
.inventory-hero .btn-outline-primary:hover, .inventory-hero .btn-outline-info:hover, .inventory-hero .btn-outline-success:hover,
.inventory-hero .btn-outline-secondary:hover, .inventory-hero .btn-outline-dark:hover, .inventory-hero .btn-outline-light:hover, .inventory-hero .btn-outline-warning:hover,
.production-hero .btn-outline-primary:hover, .production-hero .btn-outline-info:hover, .production-hero .btn-outline-success:hover,
.production-hero .btn-outline-secondary:hover, .production-hero .btn-outline-dark:hover, .production-hero .btn-outline-light:hover, .production-hero .btn-outline-warning:hover,
.sale-hero .btn-outline-primary:hover, .sale-hero .btn-outline-info:hover, .sale-hero .btn-outline-success:hover,
.sale-hero .btn-outline-secondary:hover, .sale-hero .btn-outline-dark:hover, .sale-hero .btn-outline-light:hover, .sale-hero .btn-outline-warning:hover,
.costs-hero .btn-outline-primary:hover, .costs-hero .btn-outline-info:hover, .costs-hero .btn-outline-success:hover,
.costs-hero .btn-outline-secondary:hover, .costs-hero .btn-outline-dark:hover, .costs-hero .btn-outline-light:hover, .costs-hero .btn-outline-warning:hover,
.purchases-hero .btn-outline-primary:hover, .purchases-hero .btn-outline-info:hover, .purchases-hero .btn-outline-success:hover,
.purchases-hero .btn-outline-secondary:hover, .purchases-hero .btn-outline-dark:hover, .purchases-hero .btn-outline-light:hover,
.finance-head .btn-outline-primary:hover, .finance-head .btn-outline-info:hover, .finance-head .btn-outline-success:hover,
.finance-head .btn-outline-secondary:hover, .finance-head .btn-outline-dark:hover, .finance-head .btn-outline-light:hover,
.xfin-head .btn-outline-primary:hover, .xfin-head .btn-outline-info:hover, .xfin-head .btn-outline-success:hover,
.xfin-head .btn-outline-secondary:hover, .xfin-head .btn-outline-dark:hover, .xfin-head .btn-outline-light:hover {
  background: var(--x-crema) !important;
  border-color: var(--x-crema) !important;
  color: var(--x-verde-900) !important;
}

.dashboard-hero .btn-primary, .dashboard-hero .btn-success, .dashboard-hero .btn-info, .dashboard-hero .btn-dark, .dashboard-hero .btn-warning,
.inventory-hero .btn-primary, .inventory-hero .btn-success, .inventory-hero .btn-info, .inventory-hero .btn-dark, .inventory-hero .btn-warning,
.production-hero .btn-primary, .production-hero .btn-success, .production-hero .btn-info, .production-hero .btn-dark, .production-hero .btn-warning,
.sale-hero .btn-primary, .sale-hero .btn-success, .sale-hero .btn-info, .sale-hero .btn-dark, .sale-hero .btn-warning,
.costs-hero .btn-primary, .costs-hero .btn-success, .costs-hero .btn-info, .costs-hero .btn-dark, .costs-hero .btn-warning,
.purchases-hero .btn-primary, .purchases-hero .btn-success, .purchases-hero .btn-info, .purchases-hero .btn-dark, .purchases-hero .btn-warning,
.finance-head .btn-primary, .finance-head .btn-success, .finance-head .btn-info, .finance-head .btn-dark, .finance-head .btn-warning,
.xfin-head .btn-primary, .xfin-head .btn-success, .xfin-head .btn-info, .xfin-head .btn-dark, .xfin-head .btn-warning,
.dashboard-hero .btn-light, .inventory-hero .btn-light, .production-hero .btn-light, .sale-hero .btn-light, .costs-hero .btn-light,
.purchases-hero .btn-light, .finance-head .btn-light, .xfin-head .btn-light {
  background: var(--x-crema) !important;
  border-color: var(--x-crema) !important;
  color: var(--x-verde-900) !important;
}

.dashboard-hero .btn-primary:hover, .dashboard-hero .btn-success:hover, .dashboard-hero .btn-info:hover, .dashboard-hero .btn-dark:hover, .dashboard-hero .btn-light:hover, .dashboard-hero .btn-warning:hover,
.inventory-hero .btn-primary:hover, .inventory-hero .btn-success:hover, .inventory-hero .btn-info:hover, .inventory-hero .btn-dark:hover, .inventory-hero .btn-light:hover, .inventory-hero .btn-warning:hover,
.production-hero .btn-primary:hover, .production-hero .btn-success:hover, .production-hero .btn-info:hover, .production-hero .btn-dark:hover, .production-hero .btn-light:hover, .production-hero .btn-warning:hover,
.sale-hero .btn-primary:hover, .sale-hero .btn-success:hover, .sale-hero .btn-info:hover, .sale-hero .btn-dark:hover, .sale-hero .btn-light:hover, .sale-hero .btn-warning:hover,
.costs-hero .btn-primary:hover, .costs-hero .btn-success:hover, .costs-hero .btn-info:hover, .costs-hero .btn-dark:hover, .costs-hero .btn-light:hover, .costs-hero .btn-warning:hover,
.purchases-hero .btn-primary:hover, .purchases-hero .btn-success:hover, .purchases-hero .btn-info:hover, .purchases-hero .btn-dark:hover, .purchases-hero .btn-light:hover,
.finance-head .btn-primary:hover, .finance-head .btn-success:hover, .finance-head .btn-info:hover, .finance-head .btn-dark:hover, .finance-head .btn-light:hover,
.xfin-head .btn-primary:hover, .xfin-head .btn-success:hover, .xfin-head .btn-info:hover, .xfin-head .btn-dark:hover, .xfin-head .btn-light:hover {
  background: var(--x-blanco) !important;
  border-color: var(--x-blanco) !important;
  color: var(--x-verde-900) !important;
}

/* Titulares de seccion dentro de los modulos: verde-900 */
.inventory-page-heading h5,
.inventory-eyebrow,
.contable-section-header h6,
.maintenance-toolbar h6,
.enterprise-panel-head h6,
.costs-panel h6,
.sale-panel h6,
.dashboard-card h6,
.finance-panel h6,
.xfin-panel h6,
.option-editor-panel h6 {
  color: var(--x-verde-900);
}

.inventory-eyebrow,
.inventory-command-copy span {
  color: var(--x-verde-600);
}

/* --------------------------------------------------------------------------
   12. SweetAlert2
   -------------------------------------------------------------------------- */
.swal2-popup {
  background: var(--x-blanco);
  border: 1px solid var(--x-crema-borde) !important;
  border-radius: var(--x-radio-tarjeta) !important;
  box-shadow: var(--x-sombra-fuerte) !important;
  color: var(--x-negro);
}

.swal2-title {
  color: var(--x-negro);
}

.swal2-html-container,
.swal2-content {
  color: var(--x-negro-suave);
}

.swal2-styled.swal2-confirm {
  background-color: var(--x-verde-600) !important;
  color: var(--x-blanco) !important;
}

.swal2-styled.swal2-confirm:hover {
  background-color: var(--x-verde-700) !important;
}

.swal2-styled.swal2-cancel {
  background-color: var(--x-blanco) !important;
  border: 1px solid var(--x-crema-borde) !important;
  color: var(--x-negro) !important;
}

.swal2-styled.swal2-cancel:hover {
  background-color: var(--x-crema-oscuro) !important;
}

.swal2-styled.swal2-deny {
  background-color: var(--x-negro) !important;
  color: var(--x-blanco) !important;
}

.swal2-styled.swal2-deny:hover {
  background-color: var(--x-negro-suave) !important;
}

.swal2-styled:focus,
.swal2-styled.swal2-confirm:focus,
.swal2-styled.swal2-cancel:focus,
.swal2-styled.swal2-deny:focus {
  box-shadow: var(--x-foco) !important;
}

.swal2-icon.swal2-success {
  border-color: var(--x-verde-500);
  color: var(--x-verde-600);
}

.swal2-icon.swal2-success [class^="swal2-success-line"] {
  background-color: var(--x-verde-600);
}

.swal2-icon.swal2-success .swal2-success-ring {
  border-color: rgba(63, 138, 55, .3);
}

.swal2-icon.swal2-error {
  border-color: var(--x-negro);
  color: var(--x-negro);
}

.swal2-icon.swal2-error [class^="swal2-x-mark-line"] {
  background-color: var(--x-negro);
}

.swal2-icon.swal2-warning {
  border-color: var(--x-crema-borde-fuerte);
  color: var(--x-negro);
}

.swal2-icon.swal2-info,
.swal2-icon.swal2-question {
  border-color: var(--x-verde-100);
  color: var(--x-verde-600);
}

.swal2-validation-message {
  background: var(--x-crema);
  color: var(--x-negro);
}

.swal2-validation-message::before {
  background-color: var(--x-negro);
}

.swal2-footer {
  border-top-color: var(--x-crema-borde);
  color: var(--x-gris);
}

.swal2-timer-progress-bar {
  background: rgba(47, 107, 42, .35);
}

.swal2-loader {
  border-color: var(--x-verde-600) transparent var(--x-verde-600) transparent;
}

/* --------------------------------------------------------------------------
   13. Paginas publicas (login, 2FA, seguridad)
   -------------------------------------------------------------------------- */
.bg-curve {
  background:
    radial-gradient(circle at 25% 18%, rgba(246, 239, 227, .14), transparent 30%),
    linear-gradient(160deg, var(--x-verde-900) 0%, var(--x-verde-700) 100%) !important;
}

.branding-content,
.branding-text h1,
.branding-text p,
.branding-title-gold,
.branding-badge {
  color: var(--x-crema) !important;
}

.branding-badge {
  background: rgba(246, 239, 227, .1) !important;
  border-color: rgba(246, 239, 227, .22) !important;
  border-radius: var(--x-radio-control) !important;
}

.accounting-login-card {
  border-top: 4px solid var(--x-verde-600) !important;
}

.accounting-login-title {
  color: var(--x-negro) !important;
}

.accounting-login-title span,
.accounting-login-subtitle {
  color: var(--x-gris) !important;
}

.form-control-custom {
  border: 1px solid var(--x-crema-borde);
  color: var(--x-negro);
}

.icon-left,
.icon-right {
  color: var(--x-gris);
}

.icon-right:hover,
.form-control-custom:focus ~ .icon-left {
  color: var(--x-verde-600);
}

.btn-submit {
  box-shadow: 0 10px 24px rgba(47, 107, 42, .22) !important;
}

.btn-passkey i {
  color: var(--x-verde-600) !important;
}

.passkey-separador {
  color: var(--x-gris);
}

.passkey-separador::before,
.passkey-separador::after {
  background: var(--x-crema-borde);
}

.passkey-mensaje {
  background: var(--x-crema-oscuro);
  border: 1px solid var(--x-crema-borde-fuerte);
  border-radius: var(--x-radio-control);
  color: var(--x-negro);
}

.login-box .card,
.register-box .card {
  border-radius: var(--x-radio-tarjeta) !important;
}

.login-box-msg,
.login-card-body,
.login-logo a {
  color: var(--x-negro);
}

pre.bg-light,
pre {
  background: var(--x-crema-claro) !important;
  border: 1px solid var(--x-crema-borde);
  border-radius: var(--x-radio-control);
  color: var(--x-negro);
}

details > summary {
  color: var(--x-verde-600);
}

/* --------------------------------------------------------------------------
   14. Ajustes finos de modulos (colores que no pasan por variables)
   -------------------------------------------------------------------------- */
.table thead th,
.dashboard-detail-table th {
  white-space: nowrap;
}

.dashboard-bar-track,
.xfin-progress,
.xfin-trend-bar {
  background: var(--x-crema-oscuro);
}

.dashboard-bar-fill,
.xfin-progress span,
.xfin-trend-bar .bar-income {
  background: var(--x-verde-600);
}

.xfin-trend-bar .bar-expense {
  background: var(--x-gris);
}

.xfin-breakdown .is-total {
  background: var(--x-verde-900);
  border-color: var(--x-verde-900);
}

.xfin-pill {
  background: var(--x-verde-50);
  border-color: var(--x-verde-100);
  color: var(--x-verde-900);
}

.xfin-kpi-action:hover,
.xfin-kpi-action:focus-visible {
  border-color: var(--x-verde-500) !important;
}

.xfin-collection-row:focus-visible {
  outline-color: var(--x-verde-500);
}

.costs-chip {
  background: var(--x-verde-100);
  border-color: var(--x-verde-100);
  color: var(--x-verde-900);
}

.chart-legend span,
.dashboard-bar-label,
.product-catalog-meta,
.audit-change {
  color: var(--x-negro-suave);
}

.lot-estimate-card.is-danger,
.lot-estimate-footer.is-danger {
  background: var(--x-crema-oscuro);
  border-color: var(--x-crema-borde-fuerte);
}

.lot-estimate-card.is-danger .lot-estimate-value,
.lot-estimate-footer.is-danger span,
.lot-estimate-footer.is-danger strong {
  color: var(--x-negro);
}

.lot-estimate-card.is-gold {
  background: var(--x-crema);
  border-color: var(--x-crema-borde-fuerte);
}

.lot-estimate-card.is-gold .lot-estimate-value {
  color: var(--x-negro);
}

.lot-estimate-card.is-success,
.lot-estimate-card.is-primary {
  background: var(--x-verde-50);
  border-color: var(--x-verde-100);
}

.purchase-general-cost.is-active {
  background: var(--x-verde-50);
  border-color: var(--x-verde-500);
}

.purchase-general-cost.is-active strong {
  color: var(--x-verde-900);
}

.purchase-sale-stock.is-active,
.omni-sale-stock-panel.is-active {
  background: var(--x-verde-50);
  border-color: var(--x-verde-600);
}

.purchase-sale-stock.is-active strong {
  color: var(--x-verde-900);
}

.purchase-file-preview i {
  color: var(--x-negro);
}

.option-editor-panel .option-editor-feedback {
  color: var(--x-negro);
}

.spinner-border.text-primary,
.spinner-grow.text-primary {
  color: var(--x-verde-600) !important;
}

.img-circle.elevation-1 {
  box-shadow: none !important;
}

/* Vista previa y estados vacios */
.dashboard-empty,
.costs-empty,
.product-catalog-empty {
  background: var(--x-crema-claro);
  border-color: var(--x-crema-borde-fuerte);
  color: var(--x-gris);
}

/* Capa movil: solo coherencia de color bajo html.xantina-movil */
html.xantina-movil table:not(.xm-scroll) > tbody > tr {
  border-color: var(--x-crema-borde);
  box-shadow: var(--x-sombra);
}

html.xantina-movil table:not(.xm-scroll) > tbody > tr > td[data-label]::before,
html.xantina-movil table:not(.xm-scroll) > tbody > tr > th[data-label]::before {
  color: var(--x-gris);
}

/* --------------------------------------------------------------------------
   15. Encabezados de modulo sin clase propia (Costos & Insumos, Configuracion):
       primer bloque blanco de la vista -> mismo hero verde-900 que los demas.
   -------------------------------------------------------------------------- */
.container-fluid.fade-in > div.bg-white.shadow-sm.rounded.p-4.mb-4:first-child {
  background: linear-gradient(135deg, var(--x-verde-900) 0%, var(--x-verde-700) 100%) !important;
  border: 0 !important;
  border-radius: var(--x-radio-tarjeta) !important;
  box-shadow: var(--x-sombra) !important;
  color: var(--x-crema) !important;
}

.container-fluid.fade-in > div.bg-white.shadow-sm.rounded.p-4.mb-4:first-child :is(h1, h2, h3, h4, h5, h6, strong, .text-dark, .text-primary, .text-info, .text-success, .text-warning, .text-danger, .text-secondary) {
  color: var(--x-crema) !important;
}

.container-fluid.fade-in > div.bg-white.shadow-sm.rounded.p-4.mb-4:first-child :is(p, small, .text-muted) {
  color: var(--x-crema-sobre-oscuro) !important;
}

.container-fluid.fade-in > div.bg-white.shadow-sm.rounded.p-4.mb-4:first-child :is(.btn-outline-primary, .btn-outline-info, .btn-outline-success, .btn-outline-secondary, .btn-outline-dark, .btn-outline-light, .btn-outline-warning) {
  background: transparent !important;
  border-color: rgba(246, 239, 227, .55) !important;
  color: var(--x-crema) !important;
}

.container-fluid.fade-in > div.bg-white.shadow-sm.rounded.p-4.mb-4:first-child :is(.btn-outline-primary, .btn-outline-info, .btn-outline-success, .btn-outline-secondary, .btn-outline-dark, .btn-outline-light, .btn-outline-warning):hover {
  background: var(--x-crema) !important;
  border-color: var(--x-crema) !important;
  color: var(--x-verde-900) !important;
}

.container-fluid.fade-in > div.bg-white.shadow-sm.rounded.p-4.mb-4:first-child :is(.btn-primary, .btn-success, .btn-info, .btn-dark, .btn-warning, .btn-light) {
  background: var(--x-crema) !important;
  border-color: var(--x-crema) !important;
  box-shadow: none !important;
  color: var(--x-verde-900) !important;
}

.container-fluid.fade-in > div.bg-white.shadow-sm.rounded.p-4.mb-4:first-child :is(.btn-primary, .btn-success, .btn-info, .btn-dark, .btn-warning, .btn-light):hover {
  background: var(--x-blanco) !important;
  border-color: var(--x-blanco) !important;
  color: var(--x-verde-900) !important;
}

/* --------------------------------------------------------------------------
   16. Barra superior y fondos blancos/claros de AdminLTE: el vendor deja el color
       de texto en 1f2d3d (azul oscuro de la plantilla) aunque el fondo ya sea
       crema (.navbar-white lo hereda como color; .bg-white y .bg-light lo fijan con
       !important). Se hereda negro-suave en la barra y negro en esas superficies.
   -------------------------------------------------------------------------- */
.main-header,
.main-header.navbar-white,
.main-header.navbar-light,
.navbar-white,
.navbar-light {
  color: var(--x-negro-suave);
}

.bg-white,
.bg-white > a,
.bg-light,
.bg-light > a,
.bg-gray-light,
.bg-gray-light > a {
  color: var(--x-negro) !important;
}

/* Enlaces (pestañas) dentro de cabeceras de tarjeta de color: mismo color de texto que la cabecera.
   AdminLTE los deja en 1f2d3d también en estado .active. */
.card-primary:not(.card-outline) > .card-header a,
.card-info:not(.card-outline) > .card-header a,
.card-success:not(.card-outline) > .card-header a,
.card-dark:not(.card-outline) > .card-header a,
.card-danger:not(.card-outline) > .card-header a,
.card-warning:not(.card-outline) > .card-header a {
  color: var(--x-crema) !important;
}

.card-secondary:not(.card-outline) > .card-header a {
  color: var(--x-negro) !important;
}

/* Separador <hr> dentro de alertas: AdminLTE le pone un tono pastel de cada color. */
.alert-primary hr,
.alert-secondary hr,
.alert-success hr,
.alert-info hr,
.alert-warning hr,
.alert-danger hr,
.alert-light hr,
.alert-dark hr {
  border-top-color: var(--x-crema-borde-fuerte) !important;
}

/* Barra superior oscura de AdminLTE (no se usa hoy; queda dentro de la paleta por si se activa). */
.navbar-dark {
  background: var(--x-negro) !important;
  border-color: var(--x-negro) !important;
  color: var(--x-crema);
}

/* select2: la opción ya elegida al pasar el ratón conserva el mismo estilo que elegida. */
.select2-container--default .select2-results__option[aria-selected="true"]:hover {
  background: var(--x-crema-oscuro);
  color: var(--x-negro);
}

/* Enlaces y botones con utilidades text-*/bg-* en :hover/:focus: AdminLTE los oscurece con su
   propio color (tonos azul, teal y ámbar de la plantilla) con !important y mayor
   especificidad que las utilidades del tema; misma especificidad aquí para que gane la paleta. */
a.text-primary:hover, a.text-primary:focus,
a.text-info:hover, a.text-info:focus,
a.text-success:hover, a.text-success:focus,
a.text-teal:hover, a.text-teal:focus,
a.text-olive:hover, a.text-olive:focus {
  color: var(--x-verde-900) !important;
}

a.text-warning:hover, a.text-warning:focus,
a.text-danger:hover, a.text-danger:focus,
a.text-dark:hover, a.text-dark:focus,
a.text-secondary:hover, a.text-secondary:focus,
a.text-muted:hover, a.text-muted:focus {
  color: var(--x-negro) !important;
}

a.bg-primary:hover, a.bg-primary:focus, button.bg-primary:hover, button.bg-primary:focus,
a.bg-info:hover, a.bg-info:focus, button.bg-info:hover, button.bg-info:focus,
a.bg-success:hover, a.bg-success:focus, button.bg-success:hover, button.bg-success:focus {
  background-color: var(--x-verde-700) !important;
}

a.bg-warning:hover, a.bg-warning:focus, button.bg-warning:hover, button.bg-warning:focus {
  background-color: var(--x-crema-borde-fuerte) !important;
}

a.bg-danger:hover, a.bg-danger:focus, button.bg-danger:hover, button.bg-danger:focus,
a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
  background-color: var(--x-negro) !important;
}

a.bg-secondary:hover, a.bg-secondary:focus, button.bg-secondary:hover, button.bg-secondary:focus {
  background-color: var(--x-gris) !important;
}
