/* ==========================================================================
   MasterAnteriores.css - Compatibilidad para Vistas y Viejos Sistemas (v5.0)
   Ayuntamiento de Tijuana
   ========================================================================== */

/* 1. Contenedores y Scroll Panels Legacy */
.bc-content .panelScrolable,
.bc-content .tc-scroll-panel {
  max-height: 500px;
  overflow-y: auto;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background-color: #fafafa;
  padding: 24px;
  margin-bottom: 20px;
}

/* 2. Jumbotron y Paneles Legacy */
.bc-content .jumbotron {
  background-color: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 28px 32px;
  margin-bottom: 24px;
}

.bc-content .jumbotron h1 {
  font-size: 26px;
  font-weight: 700;
  margin-bottom: 12px;
}

.bc-content .jumbotron p {
  font-size: 15px;
  line-height: 1.6;
  color: #475569;
}

/* Transformar Bootstrap 3 .panel en Bootstrap 5 Cards */
.bc-content .panel {
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fff;
  margin-bottom: 24px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
  overflow: hidden;
}

.bc-content .panel-heading {
  padding: 14px 20px;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  background-color: #f1f5f9;
  color: #334155;
  border-bottom: 1px solid #e2e8f0;
}

.bc-content .panel-heading small {
  font-size: 12px;
  font-weight: 600;
  opacity: 0.85;
  margin-left: 4px;
}

.bc-content .panel-default>.panel-heading {
  background-color: #f1f5f9;
  color: #334155;
}

.bc-content .panel-warning>.panel-heading {
  background-color: #fffbeb;
  color: #92400e;
  border-bottom-color: #fef3c7;
}

.bc-content .panel-danger>.panel-heading {
  background-color: #fef2f2;
  color: #991b1b;
  border-bottom-color: #fee2e2;
}

.bc-content .panel-success>.panel-heading {
  background-color: #f0fdf4;
  color: #166534;
  border-bottom-color: #dcfce7;
}

.bc-content .panel-body {
  padding: 20px;
}

.bc-content .panel-group {
  margin-bottom: 24px;
}

/* 3. Grid, Filas (Row) y Contenedores ASP.NET */
/* Soporte para asp:UpdatePanel y contenedores intermedios dentro de .row */
.bc-content .row>div[id*="UpdatePanel"],
.bc-content .row>div[id*="updatePanel"],
.bc-content .row>div[id*="UP"],
.bc-content .row>div[id*="up"],
.bc-content .row>div[id*="Panel"],
.bc-content .row>div[id*="panel"],
.bc-content .row>div[id*="ContentPlaceHolder"],
.bc-content .row>form,
.bc-content .row>div:has(> [class*="col-"]) {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin-right: calc(-.5 * var(--bs-gutter-x, 0.75rem));
  margin-left: calc(-.5 * var(--bs-gutter-x, 0.75rem));
}

/* Evitar que flex gap en .row rompa el cálculo de anchos porcentuales de las columnas */
.bc-content .row,
.bc-content .row.form-inline {
  gap: 0;
}

/* 4. Formularios e Inputs Legacy */
.bc-content .form-group {
  margin-bottom: 1rem;
}

.bc-content .form-group:has(> [class*="col-"]),
.bc-content div.form-group:has(> .form-group) {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.bc-content .form-inline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.bc-content div:not(.row).form-inline,
.bc-content .form-inline:not(.row) {
  gap: 8px;
}

.bc-content [class*="col-"].form-inline {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.bc-content .form-inline label {
  margin-bottom: 0;
  margin-right: 6px;
  white-space: nowrap;
}

.panelRestaurar .btn-ginda {
  float: right;
  margin-right: 0;
}

.panelRestaurar .form-group {
  margin-bottom: 12px;
}

/* Space between the two buttons (right aligned) */
.panelRestaurar .text-right .btn-dorado {
  margin-left: 12px;
}

.panelRestaurar .btn-dorado {
  float: right;
  margin-right: 8px;
  /* space between Dorado and Ginda */
}

.bc-content .form-inline .form-control {
  display: inline-block;
  width: auto;
  max-width: 100%;
}

.bc-content .form-control,
.bc-content select.form-control,
.bc-content textarea.form-control,
.bc-content input[type="text"],
.bc-content input[type="number"],
.bc-content input[type="password"],
.bc-content input[type="email"],
.bc-content input[type="date"],
.bc-content select {
  border-radius: 6px;
  border: 1px solid #cbd5e1;
  padding: 8px 12px;
  font-size: 14px;
  background-color: #fff;
  color: #1e293b;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.bc-content .form-control:focus,
.bc-content input[type="text"]:focus,
.bc-content input[type="number"]:focus,
.bc-content input[type="password"]:focus,
.bc-content input[type="email"]:focus,
.bc-content input[type="date"]:focus,
.bc-content select:focus {
  border-color: #80052f;
  box-shadow: 0 0 0 3px rgba(128, 5, 47, 0.12);
  outline: 0;
}

.bc-content label {
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 4px;
  display: inline-block;
}

.bc-content span.alert-danger,
.bc-content .text-danger {
  color: #dc2626 !important;
  font-weight: 700;
}

/* Encabezados de Sección en Formularios Legacy */
.bc-content h3 {
  font-size: 18px;
  font-weight: 700;
  color: #1e293b;
  margin-top: 16px;
  margin-bottom: 12px;
  padding-bottom: 6px;
  border-bottom: 2px solid #e2e8f0;
  width: 100%;
}

.bc-content h4 {
  font-size: 16px;
  font-weight: 700;
  color: #334155;
  margin-top: 12px;
  margin-bottom: 8px;
  width: 100%;
}

.bc-content h5 {
  font-size: 14px;
  font-weight: 500;
  color: #64748b;
  margin-top: 6px;
  margin-bottom: 10px;
  width: 100%;
}

/* Tablas de RadioButtonList y CheckBoxList ASP.NET */
.bc-content table:not(.table) {
  border: none;
  background: transparent;
  margin-bottom: 10px;
}

.bc-content table:not(.table) td {
  padding: 4px 16px 4px 0;
  border: none;
  vertical-align: middle;
}

.bc-content table:not(.table) input[type="radio"],
.bc-content table:not(.table) input[type="checkbox"] {
  margin-right: 6px;
  vertical-align: middle;
  cursor: pointer;
}

.bc-content table:not(.table) label {
  margin-bottom: 0;
  font-weight: 500;
  cursor: pointer;
  vertical-align: middle;
}

/* Compatibilidad de Columnas y Offsets Bootstrap 3 */
@media (min-width: 992px) {
  .bc-content .col-lg-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .bc-content .col-lg-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .bc-content .col-lg-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .bc-content .col-lg-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .bc-content .col-lg-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .bc-content .col-lg-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .bc-content .col-lg-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .bc-content .col-lg-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .bc-content .col-lg-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .bc-content .col-lg-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .bc-content .col-lg-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .bc-content .col-lg-12 {
    flex: 0 0 auto;
    width: 100%;
  }

  .bc-content .col-lg-offset-0 {
    margin-left: 0;
  }

  .bc-content .col-lg-offset-1 {
    margin-left: 8.33333333%;
  }

  .bc-content .col-lg-offset-2 {
    margin-left: 16.66666667%;
  }

  .bc-content .col-lg-offset-3 {
    margin-left: 25%;
  }

  .bc-content .col-lg-offset-4 {
    margin-left: 33.33333333%;
  }

  .bc-content .col-lg-offset-5 {
    margin-left: 41.66666667%;
  }

  .bc-content .col-lg-offset-6 {
    margin-left: 50%;
  }

  .bc-content .col-lg-offset-7 {
    margin-left: 58.33333333%;
  }

  .bc-content .col-lg-offset-8 {
    margin-left: 66.66666667%;
  }

  .bc-content .col-lg-offset-9 {
    margin-left: 75%;
  }

  .bc-content .col-lg-offset-10 {
    margin-left: 83.33333333%;
  }

  .bc-content .col-lg-offset-11 {
    margin-left: 91.66666667%;
  }
}

@media (min-width: 768px) {
  .bc-content .col-md-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .bc-content .col-md-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .bc-content .col-md-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .bc-content .col-md-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .bc-content .col-md-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .bc-content .col-md-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .bc-content .col-md-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .bc-content .col-md-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .bc-content .col-md-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .bc-content .col-md-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .bc-content .col-md-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .bc-content .col-md-12 {
    flex: 0 0 auto;
    width: 100%;
  }

  .bc-content .col-md-offset-0 {
    margin-left: 0;
  }

  .bc-content .col-md-offset-1 {
    margin-left: 8.33333333%;
  }

  .bc-content .col-md-offset-2 {
    margin-left: 16.66666667%;
  }

  .bc-content .col-md-offset-3 {
    margin-left: 25%;
  }

  .bc-content .col-md-offset-4 {
    margin-left: 33.33333333%;
  }

  .bc-content .col-md-offset-5 {
    margin-left: 41.66666667%;
  }

  .bc-content .col-md-offset-6 {
    margin-left: 50%;
  }

  .bc-content .col-md-offset-7 {
    margin-left: 58.33333333%;
  }

  .bc-content .col-md-offset-8 {
    margin-left: 66.66666667%;
  }

  .bc-content .col-md-offset-9 {
    margin-left: 75%;
  }

  .bc-content .col-md-offset-10 {
    margin-left: 83.33333333%;
  }

  .bc-content .col-md-offset-11 {
    margin-left: 91.66666667%;
  }
}

/* 5. Tablas y GridViews Legacy */
.bc-content .table {
  width: 100%;
  margin-bottom: 1rem;
  vertical-align: middle;
  border-color: #e2e8f0;
}

.bc-content .table th,
.bc-content .table .gvHead th,
.bc-content .table .table-light th {
  background-color: #f8fafc;
  color: #334155;
  font-weight: 700;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 12px 14px;
  border-bottom: 2px solid #cbd5e1;
}

.bc-content .table td {
  padding: 12px 14px;
  font-size: 14px;
  color: #334155;
}

.bc-content .table tr.danger,
.bc-content .table th.danger,
.bc-content .table td.danger,
.bc-content .table tr.danger th {
  background-color: #fef2f2 !important;
  color: #991b1b !important;
}

.bc-content .table tr.warning,
.bc-content .table th.warning,
.bc-content .table td.warning,
.bc-content .table tr.warning th {
  background-color: #fffbeb !important;
  color: #92400e !important;
}

.bc-content .table tr.success,
.bc-content .table th.success,
.bc-content .table td.success,
.bc-content .table tr.success th {
  background-color: #f0fdf4 !important;
  color: #166534 !important;
}

.bc-content .table tr.info,
.bc-content .table th.info,
.bc-content .table td.info,
.bc-content .table tr.info th {
  background-color: #f0f9ff !important;
  color: #075985 !important;
}

/* Paginación de GridView */
.bc-content .pagination-ys,
.bc-content .pagination-ys-w,
.bc-content .pagination-ys-s,
.bc-content .pagination-ys-d {
  padding-left: 0;
  margin: 16px 0 0;
  display: flex;
  justify-content: flex-end;
}

.bc-content .pagination-ys table,
.bc-content .pagination-ys-w table,
.bc-content .pagination-ys-s table,
.bc-content .pagination-ys-d table {
  border-collapse: separate;
  border-spacing: 4px;
}

.bc-content .pagination-ys td a,
.bc-content .pagination-ys td span,
.bc-content .pagination-ys-w td a,
.bc-content .pagination-ys-w td span,
.bc-content .pagination-ys-s td a,
.bc-content .pagination-ys-s td span,
.bc-content .pagination-ys-d td a,
.bc-content .pagination-ys-d td span {
  padding: 6px 12px;
  border-radius: 4px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid #cbd5e1;
  color: #475569;
  background-color: #fff;
}

.bc-content .pagination-ys td span,
.bc-content .pagination-ys-w td span,
.bc-content .pagination-ys-s td span,
.bc-content .pagination-ys-d td span {
  background-color: #80052f;
  color: #fff;
  border-color: #80052f;
}

.bc-content .pagination-ys td a:hover,
.bc-content .pagination-ys-w td a:hover,
.bc-content .pagination-ys-s td a:hover,
.bc-content .pagination-ys-d td a:hover {
  background-color: #f1f5f9;
  color: #0f172a;
}

/* 6. Alertas Legacy */
.bc-content .alert {
  border-radius: 8px;
  padding: 16px 20px;
  margin-bottom: 20px;
  font-size: 14px;
  line-height: 1.5;
}

.bc-content .bg-red,
.bc-content .callout.callout-danger,
.bc-content .alert-danger,
.bc-content .alert-error,
.bc-content .label-danger,
.bc-content .modal-danger .modal-body,
.bc-content span.alert-danger {
  background-color: #ffe7e4 !important;
  color: #991b1b !important;
  border-color: #fca5a5 !important;
}

.bc-content span.alert-danger {
  padding: 2px 6px;
  border-radius: 4px;
  display: inline-block;
  font-weight: 700;
}

.bc-content .alert-warning {
  background-color: #fffbeb;
  border: 1px solid #fef3c7;
  color: #92400e;
}

.bc-content .alert-info {
  background-color: #f0f9ff;
  border: 1px solid #e0f2fe;
  color: #075985;
}

.bc-content .alert-success {
  background-color: #f0fdf4;
  border: 1px solid #dcfce7;
  color: #166534;
}

/* 7. Headers y Títulos en bc-content */
.bc-content h2 {
  font-size: 24px;
  font-weight: 700;
  color: #1e293b;
  margin-top: 8px;
  margin-bottom: 16px;
}

.bc-content h3 {
  font-size: 20px;
  font-weight: 700;
  color: #1e293b;
  margin-top: 6px;
  margin-bottom: 14px;
}

.bc-content hr {
  border: 0;
  border-top: 1px solid #e2e8f0;
  margin: 16px 0 24px;
}

/* 8. Badges y Labels Legacy (Bootstrap 3 .label .label-danger, etc.) */
.bc-content .label {
  display: inline-block;
  padding: 6px 12px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: 4px;
  margin-bottom: 14px;
}

.bc-content .label-danger {
  background-color: #dc2626 !important;
  color: #fff !important;
}

.bc-content .label-warning {
  background-color: #d97706 !important;
  color: #fff !important;
}

.bc-content .label-success {
  background-color: #16a34a !important;
  color: #fff !important;
}

.bc-content .label-info {
  background-color: #0284c7 !important;
  color: #fff !important;
}

.bc-content .label-default,
.bc-content .label-primary {
  background-color: #80052f !important;
  color: #fff !important;
}

/* 9. Listas Generales en bc-content */
.bc-content ul {
  padding-left: 24px;
  margin-top: 8px;
  margin-bottom: 24px;
}

.bc-content ul li {
  font-size: 14px;
  line-height: 1.6;
  color: #334155;
  margin-bottom: 8px;
}

.bc-content ul li strong {
  color: #80052f;
}

/* 10. Botones Extra Pequeños Legacy (.btn-xs, .btn-sm) y Colores de Acción */
.bc-content .btn-xs {
  padding: 4px 10px;
  font-size: 12px;
  border-radius: 4px;
  font-weight: 600;
  line-height: 1.4;
}

.bc-content .btn-warning {
  background-color: #d97706 !important;
  border-color: #d97706 !important;
  color: #fff !important;
}

.bc-content .btn-warning:hover {
  background-color: #b45309 !important;
  border-color: #b45309 !important;
  color: #fff !important;
}

.bc-content .btn-success {
  background-color: #16a34a !important;
  border-color: #16a34a !important;
  color: #fff !important;
}

.bc-content .btn-success:hover {
  background-color: #15803d !important;
  border-color: #15803d !important;
  color: #fff !important;
}

/* Custom pink button (ginda) */
.bc-content .btn-ginda {
  background-color: #e91e63 !important;
  border-color: #e91e63 !important;
  color: #fff !important;
}

.bc-content .btn-ginda:hover {
  background-color: #c2185b !important;
  border-color: #c2185b !important;
  color: #fff !important;
}

:root {
  --tj-gold: rgb(187, 148, 93);
}

/* Custom gold button (dorado) */
.bc-content .btn-dorado {
  background-color: #d4af37 !important;
  border-color: #d4af37 !important;
  color: #fff !important;
}

.bc-content .btn-dorado:hover {
  /* existing scoped style */
}

/* Global pink button (ginda) */
.btn-ginda {
  background-color: #e91e63 !important;
  border-color: #e91e63 !important;
  color: #fff !important;
}

.btn-ginda:hover {
  background-color: #c2185b !important;
  border-color: #c2185b !important;
  color: #fff !important;
}

/* Global gold button (dorado) */
.btn-dorado {
  background-color: var(--tj-gold) !important;
  border-color: var(--tj-gold) !important;
  color: #fff !important;
}

.btn-dorado:hover {
  background-color: #c09a2a !important;
  border-color: #c09a2a !important;
  color: #fff !important;
}


.bc-content .btn-secondary {
  background-color: #64748b !important;
  border-color: #64748b !important;
  color: #fff !important;
}

.bc-content .btn-secondary:hover {
  background-color: #475569 !important;
  border-color: #475569 !important;
  color: #fff !important;
}

.bc-content .btn-danger {
  background-color: #dc2626 !important;
  border-color: #dc2626 !important;
  color: #fff !important;
}

.bc-content .btn-danger:hover {
  background-color: #b91c1c !important;
  border-color: #b91c1c !important;
  color: #fff !important;
}

/* 11. Wizard Paso a Paso Legacy (.stepwizard, .bs-wizard, .btn-circle) */
.bc-content .stepwizard {
  display: table !important;
  width: 100% !important;
  position: relative !important;
  margin-top: 16px;
  margin-bottom: 30px;
}

.bc-content .stepwizard-row {
  display: table-row;
}

.bc-content .stepwizard-row:before {
  top: 15px;
  bottom: 0;
  position: absolute;
  content: " ";
  width: 100%;
  height: 2px;
  background-color: #cbd5e1;
  z-index: 0;
}

.bc-content .stepwizard-step {
  display: table-cell;
  text-align: center;
  position: relative;
  z-index: 1;
}

.bc-content .stepwizard-step p {
  margin-top: 10px;
  font-size: 13px;
  font-weight: 600;
  color: #475569;
}

.bc-content .btn-circle {
  width: 32px;
  height: 32px;
  text-align: center;
  padding: 6px 0;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.428571429;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  position: relative;
  z-index: 2;
  border: 2px solid #cbd5e1;
  background-color: #ffffff;
  color: #64748b;
  transition: all 0.2s ease-in-out;
}

.bc-content .btn-circle.btn-primary,
.bc-content .stepwizard-step .btn-primary,
.bc-content .stepwizard-step a.btn-primary,
.bc-content .stepwizard-step button.btn-primary {
  background-color: #80052f !important;
  border-color: #80052f !important;
  color: #ffffff !important;
  box-shadow: 0 0 0 4px rgba(128, 5, 47, 0.15);
}

.bc-content .btn-circle.btn-default,
.bc-content .stepwizard-step .btn-default,
.bc-content .stepwizard-step a.btn-default,
.bc-content .stepwizard-step button.btn-default {
  background-color: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #64748b !important;
}

.bc-content .stepwizard-step button[disabled],
.bc-content .stepwizard-step a[disabled],
.bc-content .stepwizard-step .btn[disabled] {
  opacity: 1 !important;
  filter: alpha(opacity=100) !important;
  cursor: not-allowed;
}

.bc-content .stepwizard-step a,
.bc-content .stepwizard-step button {
  text-decoration: none !important;
}

/* Form Wizard & BS-Wizard Variations */
.bc-content .wizard,
.bc-content .bs-wizard {
  margin-top: 20px;
  margin-bottom: 30px;
}

.bc-content .bs-wizard>.bs-wizard-step {
  padding: 0;
  position: relative;
}

.bc-content .bs-wizard>.bs-wizard-step .bs-wizard-stepnum {
  color: #475569;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 6px;
}

.bc-content .bs-wizard>.bs-wizard-step .bs-wizard-info {
  color: #64748b;
  font-size: 12px;
}

.bc-content .bs-wizard>.bs-wizard-step>.bs-wizard-dot {
  position: absolute;
  width: 30px;
  height: 30px;
  display: block;
  background: #80052f;
  top: 45px;
  left: 50%;
  margin-top: -15px;
  margin-left: -15px;
  border-radius: 50%;
}

.bc-content .bs-wizard>.bs-wizard-step>.progress {
  position: relative;
  border-radius: 0px;
  height: 8px;
  box-shadow: none;
  margin: 20px 0;
}

.bc-content .bs-wizard>.bs-wizard-step>.progress>.progress-bar {
  width: 0px;
  box-shadow: none;
  background: #80052f;
}

.bc-content .bs-wizard>.bs-wizard-step.active>.progress>.progress-bar {
  width: 50%;
}

.bc-content .bs-wizard>.bs-wizard-step.complete>.progress>.progress-bar {
  width: 100%;
}

.bc-content .bs-wizard>.bs-wizard-step.disabled>.bs-wizard-dot {
  background-color: #cbd5e1;
}

.bc-content .bs-wizard>.bs-wizard-step.disabled>.bs-wizard-dot:after {
  opacity: 0;
}

.bc-content .bs-wizard>.bs-wizard-step:first-child>.progress {
  left: 50%;
  width: 50%;
}

.bc-content .bs-wizard>.bs-wizard-step:last-child>.progress {
  width: 50%;
}

/* 12. Tabbed Step Wizard Legacy (Giro.aspx, nav-pills, nav-tabs, nav-justified, wizard) */
.bc-content .wizard,
.bc-content .wizard-inner,
.bc-content .step-wizard,
.bc-content #exTab1,
.bc-content #exTab2,
.bc-content #exTab3,
.bc-content .setup-panel {
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  padding: 12px 16px;
  margin-bottom: 24px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.bc-content .nav-pills,
.bc-content .nav-tabs,
.bc-content .nav-wizard,
.bc-content .wizard-steps,
.bc-content .setup-panel {
  display: flex !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  border-bottom: 0 !important;
}

.bc-content .nav-pills>li,
.bc-content .nav-tabs>li,
.bc-content .nav-wizard>li,
.bc-content .wizard-steps>li,
.bc-content .setup-panel>div,
.bc-content .setup-panel>li {
  flex: 1 1 0% !important;
  text-align: center !important;
  float: none !important;
}

.bc-content .nav-pills>li>a,
.bc-content .nav-tabs>li>a,
.bc-content .nav-wizard>li>a,
.bc-content .wizard-steps>li>a,
.bc-content .setup-panel a,
.bc-content .setup-panel button {
  display: block !important;
  padding: 10px 14px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  color: #80052f !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  background-color: transparent !important;
  border: 0 !important;
  transition: all 0.15s ease-in-out !important;
}

/* Active Step */
.bc-content .nav-pills>li.active>a,
.bc-content .nav-pills>li.active>a:hover,
.bc-content .nav-pills>li.active>a:focus,
.bc-content .nav-tabs>li.active>a,
.bc-content .nav-tabs>li.active>a:hover,
.bc-content .nav-tabs>li.active>a:focus,
.bc-content .nav-wizard>li.active>a,
.bc-content .wizard-steps>li.active>a,
.bc-content .setup-panel .active a,
.bc-content .setup-panel a.btn-primary,
.bc-content .setup-panel button.btn-primary {
  background-color: #792828 !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  border-radius: 6px !important;
}

.bc-content .nav-pills>li.active>a *,
.bc-content .nav-tabs>li.active>a *,
.bc-content .setup-panel .active a * {
  color: #ffffff !important;
}

/* Inactive Steps */
.bc-content .nav-pills>li:not(.active)>a,
.bc-content .nav-tabs>li:not(.active)>a,
.bc-content .nav-wizard>li:not(.active)>a,
.bc-content .setup-panel a:not(.btn-primary) {
  color: #80052f !important;
  background-color: transparent !important;
}

.bc-content .nav-pills>li:not(.active)>a:hover,
.bc-content .nav-tabs>li:not(.active)>a:hover {
  background-color: #f8fafc !important;
  color: #80052f !important;
}

/* 13. Nav Pills Nav Justified Thumbnail Wizard (.nav-pills.nav-justified.thumbnail) */
.bc-content ul.nav.nav-pills.nav-justified.thumbnail,
.bc-content .nav-pills.nav-justified.thumbnail,
.bc-content ul.thumbnail.nav-pills,
.bc-content .thumbnail:has(> li) {
  background-color: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px !important;
  padding: 8px !important;
  margin-bottom: 24px !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  list-style: none !important;
}

.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li,
.bc-content .nav-pills.nav-justified.thumbnail>li,
.bc-content ul.thumbnail.nav-pills>li {
  flex: 1 1 0% !important;
  float: none !important;
  text-align: center !important;
  margin: 0 4px !important;
}

.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li>a,
.bc-content .nav-pills.nav-justified.thumbnail>li>a,
.bc-content ul.thumbnail.nav-pills>li>a {
  display: block !important;
  padding: 10px 14px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  background-color: transparent !important;
  border: 0 !important;
  transition: all 0.15s ease-in-out !important;
}

/* All Step Headings (Paso 1, Paso 2, Paso 3, Paso 4) */
.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li>a h4,
.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li>a .list-group-item-heading,
.bc-content .nav-pills.nav-justified.thumbnail>li>a h4,
.bc-content .nav-pills.nav-justified.thumbnail>li>a .list-group-item-heading {
  font-size: 18px !important;
  font-weight: 700 !important;
  margin-top: 2px !important;
  margin-bottom: 4px !important;
  line-height: 1.2 !important;
}

/* All Step Subtitles (Solicitante, Requisitos, Giro, Confirmación) */
.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li>a p,
.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li>a .list-group-item-text,
.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li>a strong,
.bc-content .nav-pills.nav-justified.thumbnail>li>a p,
.bc-content .nav-pills.nav-justified.thumbnail>li>a .list-group-item-text,
.bc-content .nav-pills.nav-justified.thumbnail>li>a strong {
  font-size: 14px !important;
  font-weight: 700 !important;
  margin-bottom: 0 !important;
  line-height: 1.3 !important;
}

/* Active Step Colors */
.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li.active>a,
.bc-content .nav-pills.nav-justified.thumbnail>li.active>a,
.bc-content ul.thumbnail.nav-pills>li.active>a {
  background-color: #80052f !important;
  color: #ffffff !important;
}

.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li.active>a h4,
.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li.active>a .list-group-item-heading,
.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li.active>a p,
.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li.active>a .list-group-item-text,
.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li.active>a strong {
  color: #ffffff !important;
}

/* Inactive Step Colors */
.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li:not(.active)>a h4,
.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li:not(.active)>a .list-group-item-heading,
.bc-content .nav-pills.nav-justified.thumbnail>li:not(.active)>a h4,
.bc-content .nav-pills.nav-justified.thumbnail>li:not(.active)>a .list-group-item-heading {
  color: #334155 !important;
}

.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li:not(.active)>a p,
.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li:not(.active)>a .list-group-item-text,
.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li:not(.active)>a strong,
.bc-content .nav-pills.nav-justified.thumbnail>li:not(.active)>a p,
.bc-content .nav-pills.nav-justified.thumbnail>li:not(.active)>a .list-group-item-text,
.bc-content .nav-pills.nav-justified.thumbnail>li:not(.active)>a strong {
  color: #80052f !important;
}

/* Hover on Inactive Steps */
.bc-content ul.nav.nav-pills.nav-justified.thumbnail>li:not(.active)>a:hover,
.bc-content .nav-pills.nav-justified.thumbnail>li:not(.active)>a:hover {
  background-color: #f8fafc !important;
}

/* 14. Modales Legacy y AjaxControlToolkit (.modalPopup, .modalHeader, .modalBackground) */
.modalBackground {
  background-color: #000000 !important;
  opacity: 0.65 !important;
  z-index: 10001 !important;
}

.modalPopup,
div.modalPopup {
  width: 600px !important;
  max-width: calc(100vw - 32px) !important;
  border: 0 !important;
  border-radius: 12px !important;
  background-color: #ffffff !important;
  box-shadow: 0 12px 35px rgba(0, 0, 0, 0.25) !important;
  overflow: hidden !important;
  padding: 0 !important;
}

.modalPopup.modal-sm {
  width: 600px !important;
  max-width: calc(100vw - 32px) !important;
}

.modalPopup .modalHeader,
.modalPopup .modal-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 16px 24px !important;
  background-color: #80052f !important;
  color: #ffffff !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.modalPopup .modalHeader .label,
.modalPopup .modalHeader .label-danger {
  margin-bottom: 0 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  background-color: transparent !important;
  color: #ffffff !important;
  padding: 0 !important;
}

.modalPopup .modalHeader .close,
.modalPopup button.close {
  background: transparent !important;
  border: 0 !important;
  color: #ffffff !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  opacity: 0.85 !important;
  cursor: pointer !important;
  padding: 0 !important;
  margin: 0 !important;
}

.modalPopup .modalHeader .close:hover {
  opacity: 1 !important;
}

.modalPopup .modal-body {
  padding: 24px !important;
  color: #334155 !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
}

.modalPopup .modal-body p {
  margin-bottom: 12px !important;
  color: #334155 !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
}

.modalPopup .modal-body p:last-child {
  margin-bottom: 0 !important;
}

.modalPopup .modal-footer {
  padding: 16px 24px 24px !important;
  border-top: 0 !important;
  display: flex !important;
  justify-content: flex-end !important;
  background-color: #ffffff !important;
}

.modalPopup .modal-footer .btn,
.modalPopup .modal-footer .btn-primary,
.modalPopup #btnCloseCredencial,
.modalPopup button[data-dismiss="modal"] {
  min-width: 130px !important;
  height: 44px !important;
  padding: 0 24px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background-color: #80052f !important;
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 3px 10px rgba(128, 5, 47, 0.25) !important;
  transition: background-color 0.18s ease, transform 0.18s ease !important;
}

.modalPopup .modal-footer .btn:hover,
.modalPopup .modal-footer .btn-primary:hover,
.modalPopup #btnCloseCredencial:hover,
.modalPopup button[data-dismiss="modal"]:hover {
  background-color: #9a2b44 !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

/* ==========================================================================
   Paginación Global ASP.NET GridView Horizontal
   ========================================================================== */
.pagination-ys,
.pagination-ys-w,
.pagination-ys-s,
.pagination-ys-d,
.GridPager,
.GridPagerWarning,
.GridPagerSuccess,
tr[class*="pagination-ys"] {
  padding: 12px 0;
  margin: 10px 0;
  border: none !important;
}

.pagination-ys table,
.pagination-ys-w table,
.pagination-ys-s table,
.pagination-ys-d table,
.GridPager table,
.GridPagerWarning table,
.GridPagerSuccess table,
tr[class*="pagination-ys"] table {
  display: inline-table !important;
  margin: 0 0 0 auto !important;
  border-collapse: separate !important;
  border-spacing: 3px 0 !important;
  width: auto !important;
}

.pagination-ys table>tbody,
.pagination-ys-w table>tbody,
.pagination-ys-s table>tbody,
.pagination-ys-d table>tbody,
tr[class*="pagination-ys"] table>tbody {
  display: table-row-group !important;
}

.pagination-ys table>tbody>tr,
.pagination-ys-w table>tbody>tr,
.pagination-ys-s table>tbody>tr,
.pagination-ys-d table>tbody>tr,
tr[class*="pagination-ys"] table>tbody>tr {
  display: table-row !important;
}

.pagination-ys table>tbody>tr>td,
.pagination-ys-w table>tbody>tr>td,
.pagination-ys-s table>tbody>tr>td,
.pagination-ys-d table>tbody>tr>td,
tr[class*="pagination-ys"] table>tbody>tr>td {
  display: table-cell !important;
  padding: 0 2px !important;
  vertical-align: middle !important;
  border: none !important;
  background: transparent !important;
  float: none !important;
}

.pagination-ys table>tbody>tr>td>a,
.pagination-ys table>tbody>tr>td>span,
.pagination-ys-w table>tbody>tr>td>a,
.pagination-ys-w table>tbody>tr>td>span,
.pagination-ys-s table>tbody>tr>td>a,
.pagination-ys-s table>tbody>tr>td>span,
.pagination-ys-d table>tbody>tr>td>a,
.pagination-ys-d table>tbody>tr>td>span,
tr[class*="pagination-ys"] table>tbody>tr>td>a,
tr[class*="pagination-ys"] table>tbody>tr>td>span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 32px !important;
  height: 32px !important;
  padding: 4px 10px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  border-radius: 4px !important;
  border: 1px solid #dee2e6 !important;
  background-color: #ffffff !important;
  color: #495057 !important;
  float: none !important;
  box-sizing: border-box !important;
  transition: all 0.15s ease-in-out !important;
}

/* Default / Primary */
.pagination-ys table>tbody>tr>td>a,
tr.pagination-ys table>tbody>tr>td>a {
  color: #992449 !important;
}

.pagination-ys table>tbody>tr>td>a:hover,
tr.pagination-ys table>tbody>tr>td>a:hover {
  background-color: #f8f9fa !important;
  border-color: #992449 !important;
}

.pagination-ys table>tbody>tr>td>span,
tr.pagination-ys table>tbody>tr>td>span {
  background-color: #992449 !important;
  color: #ffffff !important;
  border-color: #992449 !important;
  cursor: default !important;
}

/* Warning */
.pagination-ys-w table>tbody>tr>td>a,
tr.pagination-ys-w table>tbody>tr>td>a {
  color: #8a6d3b !important;
}

.pagination-ys-w table>tbody>tr>td>a:hover,
tr.pagination-ys-w table>tbody>tr>td>a:hover {
  background-color: #fcf8e3 !important;
  border-color: #f0ad4e !important;
}

.pagination-ys-w table>tbody>tr>td>span,
tr.pagination-ys-w table>tbody>tr>td>span {
  background-color: #f0ad4e !important;
  color: #ffffff !important;
  border-color: #f0ad4e !important;
  cursor: default !important;
}

/* Success */
.pagination-ys-s table>tbody>tr>td>a,
tr.pagination-ys-s table>tbody>tr>td>a {
  color: #3c763d !important;
}

.pagination-ys-s table>tbody>tr>td>a:hover,
tr.pagination-ys-s table>tbody>tr>td>a:hover {
  background-color: #dff0d8 !important;
  border-color: #5cb85c !important;
}

.pagination-ys-s table>tbody>tr>td>span,
tr.pagination-ys-s table>tbody>tr>td>span {
  background-color: #5cb85c !important;
  color: #ffffff !important;
  border-color: #5cb85c !important;
  cursor: default !important;
}

/* Danger / Canceladas */
.pagination-ys-d table>tbody>tr>td>a,
tr.pagination-ys-d table>tbody>tr>td>a {
  color: #a94442 !important;
}

.pagination-ys-d table>tbody>tr>td>a:hover,
tr.pagination-ys-d table>tbody>tr>td>a:hover {
  background-color: #f2dede !important;
  border-color: #d9534f !important;
}

.pagination-ys-d table>tbody>tr>td>span,
tr.pagination-ys-d table>tbody>tr>td>span {
  background-color: #d9534f !important;
  color: #ffffff !important;
  border-color: #d9534f !important;
  cursor: default !important;
}