/*
  Global design tokens for easy theme customization.
  Edit this file to rebrand the app colors in one place.
*/

:root,
[data-bs-theme="light"] {
  /* Brand palette */
  --brand-primary: #2275fc;
  --brand-secondary: #5d7186;
  --brand-success: #5cc184;
  --brand-warning: #f0934e;
  --brand-info: #45c5cd;
  --brand-danger: #e96767;

  /* App surfaces */
  --app-page-bg: #f3f3f3;
  --bs-body-bg: #f3f3f3;
  --bs-body-bg-rgb: 243, 243, 243;
  --app-dropdown-bg: #ffffff;
  --app-dropdown-header-bg: #f8f9fa;
  --app-dropdown-border: #eaedf1;
  --app-sidebar-bg: #152238;
  --app-condensed-scrollbar-thumb: rgba(168, 178, 181, 0.45);
  --app-sidebar-item-color: #c7d7ff;
  --app-sidebar-item-hover-color: #ffffff;
  --app-sidebar-active-bg: rgba(47, 118, 255, 0.18);
  --app-sidebar-active-border: #2f76ff;
  --app-sidebar-active-color: #ffffff;
  --app-sidebar-sub-active-bg: rgba(47, 118, 255, 0.14);
  --app-sidebar-hover-bg: transparent;

  /* Topbar status icon accents (light) */
  --app-status-icon-muted: #6b7280;
  --app-status-bell-active: #f4b400;
  --app-status-box-active: #f97316;
  --app-status-money-active: #16a34a;

  /* Delete modal accents */
  --app-danger-soft: #ff6b6b;
  --app-danger-soft-2: #ff8787;
  --app-danger-soft-hover: #fa5252;

  /* Primary action buttons */
  --app-action-btn-color: var(--brand-primary);
  --app-action-btn-hover-color: #fff;
  --app-action-btn-min-width: 112px;
  --app-action-btn-min-height: 40px;
  --app-action-btn-padding-y: 0.5rem;
  --app-action-btn-padding-x: 1rem;
  --app-action-btn-radius: 6px;
  --app-action-btn-font-weight: 400;
  --app-action-btn-gap: 0.45rem;
}

[data-bs-theme="dark"] {
  /* Keep same brand colors by default in dark mode */
  --brand-primary: #2275fc;
  --brand-secondary: #8391a2;
  --brand-success: #5cc184;
  --brand-warning: #f0934e;
  --brand-info: #45c5cd;
  --brand-danger: #e96767;

  --app-page-bg: #141a21;
  --bs-body-bg: #141a21;
  --bs-body-bg-rgb: 20, 26, 33;
  --app-dropdown-bg: #1c252e;
  --app-dropdown-header-bg: #2f3943;
  --app-dropdown-border: #2f3944;
  --app-sidebar-bg: #152238;
  --app-condensed-scrollbar-thumb: rgba(168, 178, 181, 0.45);
  --app-sidebar-item-color: #c7d7ff;
  --app-sidebar-item-hover-color: #ffffff;
  --app-sidebar-active-bg: rgba(47, 118, 255, 0.18);
  --app-sidebar-active-border: #2f76ff;
  --app-sidebar-active-color: #ffffff;
  --app-sidebar-sub-active-bg: rgba(47, 118, 255, 0.14);
  --app-sidebar-hover-bg: transparent;

  --app-status-icon-muted: #cbd5e1;
  --app-status-bell-active: #facc15;
  --app-status-box-active: #fb923c;
  --app-status-money-active: #4ade80;

  --app-danger-soft: #ff6b6b;
  --app-danger-soft-2: #ff8787;
  --app-danger-soft-hover: #fa5252;

  --app-action-btn-color: #aab8c5;
  --app-action-btn-hover-color: #fff;
}

/* Bootstrap variable remap */
:root {
  --bs-primary: var(--brand-primary);
  --bs-secondary: var(--brand-secondary);
  --bs-success: var(--brand-success);
  --bs-warning: var(--brand-warning);
  --bs-info: var(--brand-info);
  --bs-danger: var(--brand-danger);
  --bs-primary-rgb: 34, 117, 252;
  --bs-secondary-rgb: 93, 113, 134;
  --bs-focus-ring-color: rgba(34, 117, 252, 0.25);
  --bs-primary-bg-subtle: rgba(34, 117, 252, 0.15);
  --bs-primary-border-subtle: rgba(34, 117, 252, 0.35);
  --bs-secondary-bg-subtle: rgba(34, 117, 252, 0.12);
  --bs-secondary-border-subtle: rgba(34, 117, 252, 0.28);
  --brand-primary-hover: #1d66dd;
  --brand-primary-active: #195bc7;
  --bs-pagination-color: var(--brand-primary);
  --bs-pagination-hover-color: var(--brand-primary-hover);
  --bs-pagination-focus-color: var(--brand-primary-hover);
  --bs-pagination-active-bg: var(--brand-primary);
  --bs-pagination-active-border-color: var(--brand-primary);
  --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(34, 117, 252, 0.25);
}

/* Compatibility overrides for precompiled theme buttons */
.btn-primary {
  --bs-btn-bg: var(--brand-primary) !important;
  --bs-btn-border-color: var(--brand-primary) !important;
  --bs-btn-hover-bg: var(--brand-primary-hover) !important;
  --bs-btn-hover-border-color: var(--brand-primary-hover) !important;
  --bs-btn-active-bg: var(--brand-primary-active) !important;
  --bs-btn-active-border-color: var(--brand-primary-active) !important;
  --bs-btn-disabled-bg: var(--brand-primary) !important;
  --bs-btn-disabled-border-color: var(--brand-primary) !important;
}

.btn-secondary {
  --bs-btn-bg: var(--bs-secondary) !important;
  --bs-btn-border-color: var(--bs-secondary) !important;
  --bs-btn-hover-bg: #4f6275 !important;
  --bs-btn-hover-border-color: #4f6275 !important;
  --bs-btn-active-bg: #455667 !important;
  --bs-btn-active-border-color: #455667 !important;
  --bs-btn-disabled-bg: var(--bs-secondary) !important;
  --bs-btn-disabled-border-color: var(--bs-secondary) !important;
}

.btn-outline-primary {
  --bs-btn-color: var(--brand-primary) !important;
  --bs-btn-border-color: var(--brand-primary) !important;
  --bs-btn-hover-bg: var(--brand-primary) !important;
  --bs-btn-hover-border-color: var(--brand-primary) !important;
  --bs-btn-active-bg: var(--brand-primary-active) !important;
  --bs-btn-active-border-color: var(--brand-primary-active) !important;
  --bs-btn-disabled-color: var(--brand-primary) !important;
  --bs-btn-disabled-border-color: var(--brand-primary) !important;
}

.btn-soft-primary {
  --bs-btn-color: var(--brand-primary) !important;
  --bs-btn-bg: rgba(34, 117, 252, 0.1) !important;
  --bs-btn-border-color: transparent !important;
  --bs-btn-hover-color: #ffffff !important;
  --bs-btn-hover-bg: var(--brand-primary) !important;
  --bs-btn-hover-border-color: var(--brand-primary) !important;
  --bs-btn-active-color: #ffffff !important;
  --bs-btn-active-bg: var(--brand-primary-active) !important;
  --bs-btn-active-border-color: var(--brand-primary-active) !important;
  --bs-btn-disabled-color: #ffffff !important;
  --bs-btn-disabled-bg: var(--brand-primary) !important;
  --bs-btn-disabled-border-color: var(--brand-primary) !important;
}

.btn-soft-secondary {
  --bs-btn-color: var(--brand-secondary) !important;
  --bs-btn-bg: rgba(93, 113, 134, 0.1) !important;
  --bs-btn-border-color: transparent !important;
  --bs-btn-hover-color: #ffffff !important;
  --bs-btn-hover-bg: var(--brand-secondary) !important;
  --bs-btn-hover-border-color: var(--brand-secondary) !important;
  --bs-btn-active-color: #ffffff !important;
  --bs-btn-active-bg: var(--brand-secondary) !important;
  --bs-btn-active-border-color: var(--brand-secondary) !important;
  --bs-btn-disabled-color: #ffffff !important;
  --bs-btn-disabled-bg: var(--brand-secondary) !important;
  --bs-btn-disabled-border-color: var(--brand-secondary) !important;
}

.btn-primary i,
.btn-outline-primary i,
.btn-soft-primary i,
.btn-soft-secondary i,
.btn-soft-danger i,
.btn-soft-info i,
.btn-soft-warning i,
.btn-soft-success i {
  color: inherit !important;
}

.btn-primary svg,
.btn-outline-primary svg,
.btn-soft-primary svg,
.btn-soft-secondary svg,
.btn-soft-danger svg,
.btn-soft-info svg,
.btn-soft-warning svg,
.btn-soft-success svg {
  stroke: currentColor;
  fill: none;
  vertical-align: middle;
}

[data-bs-theme="dark"] .btn-outline-primary {
  --bs-btn-color: #aab8c5 !important;
  --bs-btn-hover-color: #fff !important;
  --bs-btn-active-color: #fff !important;
  --bs-btn-disabled-color: #aab8c5 !important;
}

[data-bs-theme="dark"] .btn-soft-primary {
  --bs-btn-color: #71a7ff !important;
  --bs-btn-bg: rgba(47, 118, 255, 0.18) !important;
  --bs-btn-hover-color: #ffffff !important;
  --bs-btn-hover-bg: var(--brand-primary) !important;
  --bs-btn-hover-border-color: var(--brand-primary) !important;
}

/* Standard primary action button. Use this on main CTAs across the app. */
.app-action-btn,
.dashboard-action-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: var(--app-action-btn-gap) !important;
  min-width: var(--app-action-btn-min-width);
  min-height: var(--app-action-btn-min-height);
  padding: var(--app-action-btn-padding-y) var(--app-action-btn-padding-x) !important;
  border-radius: var(--app-action-btn-radius) !important;
  font-weight: var(--app-action-btn-font-weight) !important;
  line-height: 1.2 !important;
  white-space: nowrap;
}

.app-action-btn.btn-outline-primary,
.dashboard-action-btn.btn-outline-primary {
  color: var(--app-action-btn-color) !important;
}

.app-action-btn.btn-outline-primary i,
.dashboard-action-btn.btn-outline-primary i {
  color: var(--app-action-btn-color) !important;
}

.app-action-btn.btn-outline-primary:hover,
.app-action-btn.btn-outline-primary:active,
.app-action-btn.btn-outline-primary.active,
.dashboard-action-btn.btn-outline-primary:hover,
.dashboard-action-btn.btn-outline-primary:active,
.dashboard-action-btn.btn-outline-primary.active {
  color: var(--app-action-btn-hover-color) !important;
}

.app-action-btn.btn-outline-primary:hover i,
.app-action-btn.btn-outline-primary:active i,
.app-action-btn.btn-outline-primary.active i,
.dashboard-action-btn.btn-outline-primary:hover i,
.dashboard-action-btn.btn-outline-primary:active i,
.dashboard-action-btn.btn-outline-primary.active i {
  color: var(--app-action-btn-hover-color) !important;
}

.app-action-btn.btn-outline-primary:focus:not(:hover):not(:active),
.dashboard-action-btn.btn-outline-primary:focus:not(:hover):not(:active) {
  color: var(--app-action-btn-color) !important;
}

.app-action-btn.btn-outline-primary:focus:not(:hover):not(:active) i,
.dashboard-action-btn.btn-outline-primary:focus:not(:hover):not(:active) i {
  color: var(--app-action-btn-color) !important;
}

.btn-outline-secondary {
  --bs-btn-color: var(--brand-primary) !important;
  --bs-btn-border-color: var(--brand-primary) !important;
  --bs-btn-hover-bg: var(--brand-primary) !important;
  --bs-btn-hover-border-color: var(--brand-primary) !important;
  --bs-btn-active-bg: var(--brand-primary-active) !important;
  --bs-btn-active-border-color: var(--brand-primary-active) !important;
  --bs-btn-disabled-color: var(--brand-primary) !important;
  --bs-btn-disabled-border-color: var(--brand-primary) !important;
}

.btn-soft-primary {
  color: var(--brand-primary) !important;
  background-color: rgba(34, 117, 252, 0.14) !important;
  border-color: rgba(34, 117, 252, 0.2) !important;
}

.btn-soft-primary:hover,
.btn-soft-primary:focus,
.btn-soft-primary:active {
  color: #fff !important;
  background-color: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
}

/* ==========================================================================
   ESTÁNDAR GUÍA DE REMISIÓN 2.0: BOTONES DE ACCIÓN EN TABLAS (36x36px)
   Bordes redondeados (8px) con borde del propio color al 30% (sin borde blanco)
   ========================================================================== */
.table-action-btn,
.btn-table-action,
.dashboard-action-view,
.certificate-actions .btn,
.worker-actions .btn-sm,
.guias-list-table .col-acciones .btn-sm,
#guias-v2-list .table td .btn-sm,
.table td .table-action-btn,
.table td .btn-soft-info.btn-sm,
.table td .btn-soft-warning.btn-sm,
.table td .btn-soft-danger.btn-sm,
.table td .btn-soft-primary.btn-sm,
.table td .btn-soft-success.btn-sm,
.table td .btn-soft-secondary.btn-sm,
.table td.text-end .btn-sm:not(.dropdown-toggle),
.table td:last-child .btn-sm:not(.dropdown-toggle),
table td .table-action-btn,
table td .btn-soft-info.btn-sm,
table td .btn-soft-warning.btn-sm,
table td .btn-soft-danger.btn-sm,
table td .btn-soft-primary.btn-sm,
table td .btn-soft-success.btn-sm,
table td .btn-soft-secondary.btn-sm,
table td.text-end .btn-sm:not(.dropdown-toggle),
table td:last-child .btn-sm:not(.dropdown-toggle),
.dataTable td.text-end .btn-sm:not(.dropdown-toggle),
.dataTable td:last-child .btn-sm:not(.dropdown-toggle) {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  max-width: 36px !important;
  max-height: 36px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 8px !important;
  flex-shrink: 0 !important;
  border-width: 1px !important;
  border-style: solid !important;
  outline: none !important;
  box-shadow: none !important;
  --bs-btn-focus-box-shadow: none !important;
  transition: all 0.2s ease !important;
}

.table-action-btn:hover,
.table-action-btn:focus,
.table-action-btn:active,
.btn-table-action:hover,
.btn-table-action:focus,
.btn-table-action:active,
.dashboard-action-view:hover,
.dashboard-action-view:focus,
.dashboard-action-view:active,
.certificate-actions .btn:hover,
.certificate-actions .btn:focus,
.certificate-actions .btn:active,
.worker-actions .btn-sm:hover,
.worker-actions .btn-sm:focus,
.worker-actions .btn-sm:active,
.guias-list-table .col-acciones .btn-sm:hover,
.guias-list-table .col-acciones .btn-sm:focus,
.guias-list-table .col-acciones .btn-sm:active,
#guias-v2-list .table td .btn-sm:hover,
#guias-v2-list .table td .btn-sm:focus,
#guias-v2-list .table td .btn-sm:active,
.table td .table-action-btn:hover,
.table td .table-action-btn:focus,
.table td .table-action-btn:active,
.table td .btn-soft-info.btn-sm:hover,
.table td .btn-soft-info.btn-sm:focus,
.table td .btn-soft-info.btn-sm:active,
.table td .btn-soft-warning.btn-sm:hover,
.table td .btn-soft-warning.btn-sm:focus,
.table td .btn-soft-warning.btn-sm:active,
.table td .btn-soft-danger.btn-sm:hover,
.table td .btn-soft-danger.btn-sm:focus,
.table td .btn-soft-danger.btn-sm:active,
.table td .btn-soft-primary.btn-sm:hover,
.table td .btn-soft-primary.btn-sm:focus,
.table td .btn-soft-primary.btn-sm:active,
.table td .btn-soft-success.btn-sm:hover,
.table td .btn-soft-success.btn-sm:focus,
.table td .btn-soft-success.btn-sm:active,
.table td .btn-soft-secondary.btn-sm:hover,
.table td .btn-soft-secondary.btn-sm:focus,
.table td .btn-soft-secondary.btn-sm:active,
.table td.text-end .btn-sm:not(.dropdown-toggle):hover,
.table td.text-end .btn-sm:not(.dropdown-toggle):focus,
.table td.text-end .btn-sm:not(.dropdown-toggle):active,
.table td:last-child .btn-sm:not(.dropdown-toggle):hover,
.table td:last-child .btn-sm:not(.dropdown-toggle):focus,
.table td:last-child .btn-sm:not(.dropdown-toggle):active,
table td .table-action-btn:hover,
table td .table-action-btn:focus,
table td .table-action-btn:active,
table td .btn-soft-info.btn-sm:hover,
table td .btn-soft-info.btn-sm:focus,
table td .btn-soft-info.btn-sm:active,
table td .btn-soft-warning.btn-sm:hover,
table td .btn-soft-warning.btn-sm:focus,
table td .btn-soft-warning.btn-sm:active,
table td .btn-soft-danger.btn-sm:hover,
table td .btn-soft-danger.btn-sm:focus,
table td .btn-soft-danger.btn-sm:active,
table td .btn-soft-primary.btn-sm:hover,
table td .btn-soft-primary.btn-sm:focus,
table td .btn-soft-primary.btn-sm:active,
table td .btn-soft-success.btn-sm:hover,
table td .btn-soft-success.btn-sm:focus,
table td .btn-soft-success.btn-sm:active,
table td .btn-soft-secondary.btn-sm:hover,
table td .btn-soft-secondary.btn-sm:focus,
table td .btn-soft-secondary.btn-sm:active,
table td.text-end .btn-sm:not(.dropdown-toggle):hover,
table td.text-end .btn-sm:not(.dropdown-toggle):focus,
table td.text-end .btn-sm:not(.dropdown-toggle):active,
table td:last-child .btn-sm:not(.dropdown-toggle):hover,
table td:last-child .btn-sm:not(.dropdown-toggle):focus,
table td:last-child .btn-sm:not(.dropdown-toggle):active,
.dataTable td.text-end .btn-sm:not(.dropdown-toggle):hover,
.dataTable td.text-end .btn-sm:not(.dropdown-toggle):focus,
.dataTable td.text-end .btn-sm:not(.dropdown-toggle):active,
.dataTable td:last-child .btn-sm:not(.dropdown-toggle):hover,
.dataTable td:last-child .btn-sm:not(.dropdown-toggle):focus,
.dataTable td:last-child .btn-sm:not(.dropdown-toggle):active {
  transform: translateY(-1px) !important;
  outline: none !important;
  box-shadow: none !important;
  --bs-btn-focus-box-shadow: none !important;
}

/* Bordes al 30% en reposo, e intensificación al 100% en hover/focus (del propio color, NUNCA blanco) */
.btn-soft-danger,
.btn-soft-danger.btn-sm,
.table-action-btn.btn-soft-danger,
.table td .btn-soft-danger,
table td .btn-soft-danger {
  border: 1px solid color-mix(in srgb, var(--bs-danger, #e96767) 30%, transparent) !important;
  border-color: color-mix(in srgb, var(--bs-danger, #e96767) 30%, transparent) !important;
  --bs-btn-border-color: color-mix(in srgb, var(--bs-danger, #e96767) 30%, transparent) !important;
}
.btn-soft-danger:hover,
.btn-soft-danger:focus,
.btn-soft-danger:active,
.table-action-btn.btn-soft-danger:hover,
.table-action-btn.btn-soft-danger:focus,
.table-action-btn.btn-soft-danger:active,
.table td .btn-soft-danger:hover,
.table td .btn-soft-danger:focus,
.table td .btn-soft-danger:active,
table td .btn-soft-danger:hover,
table td .btn-soft-danger:focus,
table td .btn-soft-danger:active {
  border-color: var(--bs-danger, #e96767) !important;
  --bs-btn-border-color: var(--bs-danger, #e96767) !important;
}

.btn-soft-info,
.btn-soft-info.btn-sm,
.table-action-btn.btn-soft-info,
.table td .btn-soft-info,
table td .btn-soft-info {
  border: 1px solid color-mix(in srgb, var(--bs-info, #0891b2) 30%, transparent) !important;
  border-color: color-mix(in srgb, var(--bs-info, #0891b2) 30%, transparent) !important;
  --bs-btn-border-color: color-mix(in srgb, var(--bs-info, #0891b2) 30%, transparent) !important;
}
.btn-soft-info:hover,
.btn-soft-info:focus,
.btn-soft-info:active,
.table-action-btn.btn-soft-info:hover,
.table-action-btn.btn-soft-info:focus,
.table-action-btn.btn-soft-info:active,
.table td .btn-soft-info:hover,
.table td .btn-soft-info:focus,
.table td .btn-soft-info:active,
table td .btn-soft-info:hover,
table td .btn-soft-info:focus,
table td .btn-soft-info:active {
  border-color: var(--bs-info, #0891b2) !important;
  --bs-btn-border-color: var(--bs-info, #0891b2) !important;
}

.btn-soft-primary,
.btn-soft-primary.btn-sm,
.table-action-btn.btn-soft-primary,
.table td .btn-soft-primary,
table td .btn-soft-primary {
  border: 1px solid color-mix(in srgb, var(--bs-primary, #2f76ff) 30%, transparent) !important;
  border-color: color-mix(in srgb, var(--bs-primary, #2f76ff) 30%, transparent) !important;
  --bs-btn-border-color: color-mix(in srgb, var(--bs-primary, #2f76ff) 30%, transparent) !important;
}
.btn-soft-primary:hover,
.btn-soft-primary:focus,
.btn-soft-primary:active,
.table-action-btn.btn-soft-primary:hover,
.table-action-btn.btn-soft-primary:focus,
.table-action-btn.btn-soft-primary:active,
.table td .btn-soft-primary:hover,
.table td .btn-soft-primary:focus,
.table td .btn-soft-primary:active,
table td .btn-soft-primary:hover,
table td .btn-soft-primary:focus,
table td .btn-soft-primary:active {
  border-color: var(--bs-primary, #2f76ff) !important;
  --bs-btn-border-color: var(--bs-primary, #2f76ff) !important;
}

.btn-soft-warning,
.btn-soft-warning.btn-sm,
.table-action-btn.btn-soft-warning,
.table td .btn-soft-warning,
table td .btn-soft-warning {
  border: 1px solid color-mix(in srgb, var(--bs-warning, #f8ac59) 30%, transparent) !important;
  border-color: color-mix(in srgb, var(--bs-warning, #f8ac59) 30%, transparent) !important;
  --bs-btn-border-color: color-mix(in srgb, var(--bs-warning, #f8ac59) 30%, transparent) !important;
}
.btn-soft-warning:hover,
.btn-soft-warning:focus,
.btn-soft-warning:active,
.table-action-btn.btn-soft-warning:hover,
.table-action-btn.btn-soft-warning:focus,
.table-action-btn.btn-soft-warning:active,
.table td .btn-soft-warning:hover,
.table td .btn-soft-warning:focus,
.table td .btn-soft-warning:active,
table td .btn-soft-warning:hover,
table td .btn-soft-warning:focus,
table td .btn-soft-warning:active {
  border-color: var(--bs-warning, #f8ac59) !important;
  --bs-btn-border-color: var(--bs-warning, #f8ac59) !important;
}

.btn-soft-success,
.btn-soft-success.btn-sm,
.table-action-btn.btn-soft-success,
.table td .btn-soft-success,
table td .btn-soft-success {
  border: 1px solid color-mix(in srgb, var(--bs-success, #22c55e) 30%, transparent) !important;
  border-color: color-mix(in srgb, var(--bs-success, #22c55e) 30%, transparent) !important;
  --bs-btn-border-color: color-mix(in srgb, var(--bs-success, #22c55e) 30%, transparent) !important;
}
.btn-soft-success:hover,
.btn-soft-success:focus,
.btn-soft-success:active,
.table-action-btn.btn-soft-success:hover,
.table-action-btn.btn-soft-success:focus,
.table-action-btn.btn-soft-success:active,
.table td .btn-soft-success:hover,
.table td .btn-soft-success:focus,
.table td .btn-soft-success:active,
table td .btn-soft-success:hover,
table td .btn-soft-success:focus,
table td .btn-soft-success:active {
  border-color: var(--bs-success, #22c55e) !important;
  --bs-btn-border-color: var(--bs-success, #22c55e) !important;
}

.btn-soft-secondary,
.btn-soft-secondary.btn-sm,
.table-action-btn.btn-soft-secondary,
.table td .btn-soft-secondary,
table td .btn-soft-secondary {
  border: 1px solid color-mix(in srgb, var(--bs-secondary, #6c757d) 30%, transparent) !important;
  border-color: color-mix(in srgb, var(--bs-secondary, #6c757d) 30%, transparent) !important;
  --bs-btn-border-color: color-mix(in srgb, var(--bs-secondary, #6c757d) 30%, transparent) !important;
}
.btn-soft-secondary:hover,
.btn-soft-secondary:focus,
.btn-soft-secondary:active,
.table-action-btn.btn-soft-secondary:hover,
.table-action-btn.btn-soft-secondary:focus,
.table-action-btn.btn-soft-secondary:active,
.table td .btn-soft-secondary:hover,
.table td .btn-soft-secondary:focus,
.table td .btn-soft-secondary:active,
table td .btn-soft-secondary:hover,
table td .btn-soft-secondary:focus,
table td .btn-soft-secondary:active {
  border-color: var(--bs-secondary, #6c757d) !important;
  --bs-btn-border-color: var(--bs-secondary, #6c757d) !important;
}

/* Reglas explícitas para modo oscuro (data-bs-theme="dark") */
[data-bs-theme="dark"] .table-action-btn,
[data-bs-theme="dark"] .btn-table-action,
[data-bs-theme="dark"] .table td .btn-sm {
  outline: none !important;
  box-shadow: none !important;
  --bs-btn-focus-box-shadow: none !important;
}
[data-bs-theme="dark"] .btn-soft-danger,
[data-bs-theme="dark"] .table td .btn-soft-danger {
  border-color: color-mix(in srgb, var(--bs-danger, #e96767) 30%, transparent) !important;
}
[data-bs-theme="dark"] .btn-soft-danger:hover,
[data-bs-theme="dark"] .btn-soft-danger:focus,
[data-bs-theme="dark"] .btn-soft-danger:active,
[data-bs-theme="dark"] .table td .btn-soft-danger:hover,
[data-bs-theme="dark"] .table td .btn-soft-danger:focus,
[data-bs-theme="dark"] .table td .btn-soft-danger:active {
  border-color: var(--bs-danger, #e96767) !important;
}
[data-bs-theme="dark"] .btn-soft-info,
[data-bs-theme="dark"] .table td .btn-soft-info {
  border-color: color-mix(in srgb, var(--bs-info, #0891b2) 30%, transparent) !important;
}
[data-bs-theme="dark"] .btn-soft-info:hover,
[data-bs-theme="dark"] .btn-soft-info:focus,
[data-bs-theme="dark"] .btn-soft-info:active,
[data-bs-theme="dark"] .table td .btn-soft-info:hover,
[data-bs-theme="dark"] .table td .btn-soft-info:focus,
[data-bs-theme="dark"] .table td .btn-soft-info:active {
  border-color: var(--bs-info, #0891b2) !important;
}
[data-bs-theme="dark"] .btn-soft-warning,
[data-bs-theme="dark"] .table td .btn-soft-warning {
  border-color: color-mix(in srgb, var(--bs-warning, #f8ac59) 30%, transparent) !important;
}
[data-bs-theme="dark"] .btn-soft-warning:hover,
[data-bs-theme="dark"] .btn-soft-warning:focus,
[data-bs-theme="dark"] .btn-soft-warning:active,
[data-bs-theme="dark"] .table td .btn-soft-warning:hover,
[data-bs-theme="dark"] .table td .btn-soft-warning:focus,
[data-bs-theme="dark"] .table td .btn-soft-warning:active {
  border-color: var(--bs-warning, #f8ac59) !important;
}
[data-bs-theme="dark"] .btn-soft-primary,
[data-bs-theme="dark"] .table td .btn-soft-primary {
  border-color: color-mix(in srgb, var(--bs-primary, #2f76ff) 30%, transparent) !important;
}
[data-bs-theme="dark"] .btn-soft-primary:hover,
[data-bs-theme="dark"] .btn-soft-primary:focus,
[data-bs-theme="dark"] .btn-soft-primary:active,
[data-bs-theme="dark"] .table td .btn-soft-primary:hover,
[data-bs-theme="dark"] .table td .btn-soft-primary:focus,
[data-bs-theme="dark"] .table td .btn-soft-primary:active {
  border-color: var(--bs-primary, #2f76ff) !important;
}
[data-bs-theme="dark"] .btn-soft-success,
[data-bs-theme="dark"] .table td .btn-soft-success {
  border-color: color-mix(in srgb, var(--bs-success, #22c55e) 30%, transparent) !important;
}
[data-bs-theme="dark"] .btn-soft-success:hover,
[data-bs-theme="dark"] .btn-soft-success:focus,
[data-bs-theme="dark"] .btn-soft-success:active,
[data-bs-theme="dark"] .table td .btn-soft-success:hover,
[data-bs-theme="dark"] .table td .btn-soft-success:focus,
[data-bs-theme="dark"] .table td .btn-soft-success:active {
  border-color: var(--bs-success, #22c55e) !important;
}
[data-bs-theme="dark"] .btn-soft-secondary,
[data-bs-theme="dark"] .table td .btn-soft-secondary {
  border-color: color-mix(in srgb, var(--bs-secondary, #6c757d) 30%, transparent) !important;
}
[data-bs-theme="dark"] .btn-soft-secondary:hover,
[data-bs-theme="dark"] .btn-soft-secondary:focus,
[data-bs-theme="dark"] .btn-soft-secondary:active,
[data-bs-theme="dark"] .table td .btn-soft-secondary:hover,
[data-bs-theme="dark"] .table td .btn-soft-secondary:focus,
[data-bs-theme="dark"] .table td .btn-soft-secondary:active {
  border-color: var(--bs-secondary, #6c757d) !important;
}

/* Íconos SVG dentro de los botones de acción */
.table-action-btn svg,
.btn-table-action svg,
.dashboard-action-view svg,
.certificate-actions .btn svg,
.worker-actions .btn-sm svg,
.guias-list-table .col-acciones .btn-sm svg,
#guias-v2-list .table td .btn-sm svg,
.table td .table-action-btn svg,
.table td .btn-soft-info.btn-sm svg,
.table td .btn-soft-warning.btn-sm svg,
.table td .btn-soft-danger.btn-sm svg,
.table td .btn-soft-primary.btn-sm svg,
.table td .btn-soft-success.btn-sm svg,
.table td .btn-soft-secondary.btn-sm svg,
.table td.text-end .btn-sm svg,
.table td:last-child .btn-sm svg,
table td .table-action-btn svg,
table td .btn-soft-info.btn-sm svg,
table td .btn-soft-warning.btn-sm svg,
table td .btn-soft-danger.btn-sm svg,
table td .btn-soft-primary.btn-sm svg,
table td .btn-soft-success.btn-sm svg,
table td .btn-soft-secondary.btn-sm svg,
table td.text-end .btn-sm svg,
table td:last-child .btn-sm svg,
.dataTable td.text-end .btn-sm svg,
.dataTable td:last-child .btn-sm svg {
  width: 17px !important;
  height: 17px !important;
  stroke-width: 2 !important;
  display: inline-block !important;
  vertical-align: middle !important;
}

/* Common helpers frequently hardcoded in legacy templates */
.text-primary {
  color: var(--brand-primary) !important;
}

.text-secondary {
  color: var(--bs-secondary-color) !important;
}

.bg-primary {
  background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity, 1)) !important;
}

.bg-secondary-subtle {
  background-color: rgba(34, 117, 252, 0.12) !important;
}

.badge.bg-secondary-subtle.text-secondary {
  color: var(--brand-primary) !important;
}

.form-check-input:checked {
  background-color: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
}

.form-check-input:focus {
  border-color: var(--bs-border-color) !important;
  box-shadow: none !important;
}

/* Global focus cleanup: remove Bootstrap blue rings while keeping active/hover states. */
.btn:focus,
.btn:focus-visible,
.btn-check:focus + .btn,
.btn-check:checked + .btn:focus,
.btn-check:active + .btn:focus,
.btn.active:focus,
.btn.show:focus,
.btn:active:focus,
.show > .btn.dropdown-toggle:focus,
.dropdown-toggle:focus,
.dropdown-item:focus,
.form-control:focus,
.form-select:focus,
.form-check-input:focus,
.page-link:focus,
.paginate_button:focus,
[role="button"]:focus,
[tabindex]:focus {
  box-shadow: none !important;
  outline: 0 !important;
}

.form-control:focus,
.form-select:focus {
  border-color: var(--bs-border-color) !important;
}

.dropdown-item:focus {
  background-color: var(--bs-tertiary-bg) !important;
  color: var(--bs-body-color) !important;
}

/* Pills/tabs */
.nav-pills .nav-link {
  color: var(--bs-secondary-color);
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background-color: var(--brand-primary) !important;
  color: #fff !important;
}

/* Pagination compatibility (Bootstrap + DataTables) */
.pagination .page-item.active .page-link,
.pagination .page-link.active {
  background-color: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
  color: #fff !important;
}

.pagination .page-link {
  color: var(--brand-primary) !important;
}

.pagination .page-link:focus {
  box-shadow: none !important;
  outline: 0 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  background: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
  color: #fff !important;
}
/* Botón estándar para limpiar campos de búsqueda. */
.global-search-clear-host {
  position: relative;
}

.global-search-clear-input {
  padding-right: 2.6rem !important;
}

/* Oculta el botón nativo de Chrome/Safari; usamos uno uniforme en toda la app. */
.global-search-clear-input::-webkit-search-cancel-button,
.global-search-clear-input::-webkit-search-decoration {
  -webkit-appearance: none;
  appearance: none;
  display: none;
}

.global-search-clear-button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: .375rem;
  color: var(--bs-secondary-color, #6c757d);
  cursor: pointer;
  display: flex;
  font-size: 18px;
  height: 32px;
  justify-content: center;
  padding: 0;
  position: absolute;
  right: .35rem;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  z-index: 4;
}

.global-search-clear-button:hover,
.global-search-clear-button:focus-visible {
  color: var(--bs-body-color, #212529);
}

.global-search-clear-host.has-search-value > .search-widget-icon {
  display: none;
}

.global-search-clear-host > .search-widget-icon {
  color: var(--bs-secondary-color, #6c757d);
  font-size: 18px;
  opacity: .6;
  pointer-events: none;
  position: absolute;
  right: .75rem;
  top: 50%;
  transform: translateY(-50%);
}