/* /Presentation/Components/Layout/Shared/Footer.razor.rz.scp.css */
/* Estilos aislados para Footer */

/* Card compacta del footer */
.footer-card[b-i2hsb830ay] {
  padding: 6px 8px;
}

/* Ítems dentro de la card compacta */
.footer-items[b-i2hsb830ay] {
  gap: 8px;
}

/* Alert del footer en modo mensaje simple */
.footer-alert[b-i2hsb830ay] {
  margin: 0px 20px !important;
}

/* Contenedor de copyright */
.copyright-container[b-i2hsb830ay] {
  margin-top: 3rem;
  text-align: center;
}
/* /Presentation/Components/Pages/Agenda/Wizard/AppointmentSuccess.razor.rz.scp.css */
/* Estilos aislados para el componente AppointmentSuccess */

.success-container[b-yqptkyetu2] {
  margin: 0 auto;
}

.success-container-div[b-yqptkyetu2] {
  width: 100%;
  padding: 0 20px;
  box-sizing: border-box;
}

/* ============================================
   Hero card de exito (estilo cards Home)
   ============================================ */
.success-hero[b-yqptkyetu2] {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  gap: 1rem;
  background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 50%, #60a5fa 100%);
  border-radius: 12px;
  padding: 1.25rem 1.5rem;
  margin-bottom: 1rem;
  box-shadow: 0 4px 16px rgba(59, 130, 246, 0.3);
  color: #fff;
  min-height: 80px;
}

.hero-content[b-yqptkyetu2] {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 1rem;
  width: 100%;
}

/* Burbujas decorativas (estilo cards del Home) */
.hero-bubble[b-yqptkyetu2] {
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  z-index: 0;
}

.hero-bubble-1[b-yqptkyetu2] {
  top: -30px;
  right: -20px;
  width: 110px;
  height: 110px;
}

.hero-bubble-2[b-yqptkyetu2] {
  bottom: -40px;
  left: -25px;
  width: 130px;
  height: 130px;
}

.hero-bubble-3[b-yqptkyetu2] {
  top: 20px;
  right: 60px;
  width: 50px;
  height: 50px;
}

.success-hero-icon[b-yqptkyetu2] {
  flex-shrink: 0;
  font-size: 2.2rem;
  line-height: 1;
  opacity: 0.9;
}

.success-hero-body[b-yqptkyetu2] {
  flex: 1;
  min-width: 0;
}

.success-hero-title[b-yqptkyetu2] {
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0;
  line-height: 1.3;
  color: #fff;
}

.success-hero-id[b-yqptkyetu2] {
  font-size: 0.85rem;
  margin: 0.25rem 0 0;
  opacity: 0.9;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  color: #fff;
}

.success-hero-wa[b-yqptkyetu2] {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  background: rgba(255, 255, 255, 0.2);
  padding: 0.15rem 0.6rem;
  border-radius: 999px;
  font-size: 0.8rem;
}

.success-hero-wa i[b-yqptkyetu2] {
  font-size: 0.85rem;
}

/* Responsive */
@media (max-width: 576px) {
  .success-hero[b-yqptkyetu2] {
    padding: 1rem 1.25rem;
    gap: 0.75rem;
    min-height: 70px;
  }

  .hero-content[b-yqptkyetu2] {
    gap: 0.75rem;
  }

  .hero-bubble-1[b-yqptkyetu2] {
    width: 80px;
    height: 80px;
    top: -20px;
    right: -15px;
  }

  .hero-bubble-2[b-yqptkyetu2] {
    width: 100px;
    height: 100px;
    bottom: -30px;
    left: -20px;
  }

  .hero-bubble-3[b-yqptkyetu2] {
    width: 40px;
    height: 40px;
    top: 15px;
    right: 40px;
  }

  .success-hero-icon[b-yqptkyetu2] {
    font-size: 1.8rem;
  }

  .success-hero-title[b-yqptkyetu2] {
    font-size: 1rem;
  }

  .success-hero-id[b-yqptkyetu2] {
    font-size: 0.8rem;
  }
}
/* /Presentation/Components/Pages/Agenda/Wizard/CancelAppointmentComponent.razor.rz.scp.css */
/* Card principal */
.cancel-success-card[b-1cf1mgy8wo] {
    background: #fff;
    border: 1px solid #e9eef3;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

/* Encabezado de la card */
.cancel-success-header[b-1cf1mgy8wo] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 1rem 0.625rem;
    font-size: 0.9rem;
    font-weight: 700;
    color: #15803d;
    background: #f0fdf4;
    border-bottom: 1px solid #e9eef3;
    letter-spacing: 0.01em;
}

.cancel-success-header-icon[b-1cf1mgy8wo] {
    font-size: 1.05rem;
    color: #16a34a;
    flex-shrink: 0;
}

/* Cuerpo de la card */
.cancel-success-body[b-1cf1mgy8wo] {
    padding: 0.25rem 1rem 0.5rem;
}

/* Filas de datos (label + value en una sola columna) */
.cancel-success-row[b-1cf1mgy8wo] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 0.75rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f3f4f6;
}

.cancel-success-row:last-child[b-1cf1mgy8wo] {
    border-bottom: none;
}

.cancel-success-label[b-1cf1mgy8wo] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #6b7280;
    flex-shrink: 0;
    min-width: 7.5rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.cancel-success-value[b-1cf1mgy8wo] {
    font-size: 0.85rem;
    color: #1f2937;
    text-align: right;
    word-break: break-word;
}

/* Nota al pie de la card */
.cancel-success-note[b-1cf1mgy8wo] {
    display: flex;
    align-items: flex-start;
    gap: 0.4rem;
    padding: 0.625rem 1rem 0.875rem;
    font-size: 0.78rem;
    color: #6b7280;
    background: #f9fafb;
    border-top: 1px solid #e9eef3;
    line-height: 1.4;
}
/* /Presentation/Components/Pages/Agenda/Wizard/NewDoctorComponent.razor.rz.scp.css */
.disabled-input-container[b-dkackjmcfm] {
    pointer-events: none;
    opacity: 0.4;
}
.overlay-spinner[b-dkackjmcfm] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    border-radius: 8px;
}
/* Asegurar que el contenedor padre tenga posición relativa para que el overlay funcione */
#ordenMedicaPanelDoctor .medical-order-label + label.file-upload-button + div[b-dkackjmcfm] {
    position: relative;
}

/* Estilos para la cámara en vivo */
.camera-overlay[b-dkackjmcfm] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: 9999; /* Por encima de todo */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
#cameraFeed[b-dkackjmcfm] {
    width: 100%;
    height: 100%;
    object-fit: contain; /* Ajustar para ver todo el cuadro */
    background: #000;
}
.camera-controls[b-dkackjmcfm] {
    position: absolute;
    bottom: 30px;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    padding: 20px;
    background: rgba(0,0,0,0.3);
}
.btn-capture[b-dkackjmcfm] {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background-color: white;
    border: 4px solid #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.1s;
}
.btn-capture:active[b-dkackjmcfm] {
    transform: scale(0.95);
    background-color: #eee;
}
.btn-capture i[b-dkackjmcfm] {
    font-size: 24px;
    color: #333;
}

/* Estilos para Dropdown de Doctores con Badges */
.doctor-dropdown-container[b-dkackjmcfm] {
    position: relative;
    width: 100%;
}
.doctor-dropdown-trigger[b-dkackjmcfm] {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #fff;
    border: 1px solid #ced4da;
    border-radius: 0.375rem;
    padding: 0.375rem 0.75rem;
    min-height: 38px;
}
.doctor-dropdown-menu[b-dkackjmcfm] {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    max-height: 250px;
    overflow-y: auto;
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    z-index: 1050;
    margin-top: 2px;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}
.doctor-dropdown-item[b-dkackjmcfm] {
    padding: 8px 12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #f0f0f0;
    transition: background-color 0.2s;
}
.doctor-dropdown-item:hover[b-dkackjmcfm] {
    background-color: #f8f9fa;
}
.doctor-dropdown-item.selected[b-dkackjmcfm] {
    background-color: #e9ecef;
    font-weight: 600;
    color: #0d6efd;
}
.day-badge[b-dkackjmcfm] {
    font-size: 0.8rem;
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #d1fae5 !important;
    color: #064e3b;
    font-weight: bold;
}
.dropdown-backdrop[b-dkackjmcfm] {
    position: fixed;
    top: 0; 
    left: 0; 
    width: 100vw; 
    height: 100vh; 
    z-index: 1040;
    cursor: default;
}
/* /Presentation/Components/Pages/Agenda/Wizard/NewTimeComponent.razor.rz.scp.css */
/* Pantalla de carga inicial */
.loading-container[b-fs43z4p8f8] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 300px;
  padding: 2rem;
  text-align: center;
}

.loading-spinner[b-fs43z4p8f8] {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
}

.loading-text[b-fs43z4p8f8] {
  font-size: 1rem;
  color: #6b7280;
  font-weight: 500;
}

/* Puntos animados */
.loading-dots[b-fs43z4p8f8] {
  display: flex;
  gap: 6px;
  margin-top: 4px;
}

.loading-dot[b-fs43z4p8f8] {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #3b82f6;
  animation: loading-bounce-b-fs43z4p8f8 1.4s ease-in-out infinite both;
}

.loading-dot:nth-child(1)[b-fs43z4p8f8] {
  animation-delay: -0.32s;
}

.loading-dot:nth-child(2)[b-fs43z4p8f8] {
  animation-delay: -0.16s;
}

.loading-dot:nth-child(3)[b-fs43z4p8f8] {
  animation-delay: 0s;
}

@keyframes loading-bounce-b-fs43z4p8f8 {
  0%, 80%, 100% {
    transform: scale(0.6);
    opacity: 0.4;
  }
  40% {
    transform: scale(1);
    opacity: 1;
  }
}

/* Responsive */
@media (max-width: 576px) {
  .loading-container[b-fs43z4p8f8] {
    min-height: 250px;
    padding: 1.5rem;
  }

  .loading-text[b-fs43z4p8f8] {
    font-size: 0.9rem;
  }
}
/* /Presentation/Components/Pages/Agenda/Wizard/SummaryComponent.razor.rz.scp.css */
/* Contenedor principal */
.summary-appointment-sidebar[b-j77ffo9254] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0.25rem 0;
}

/* La primera card tiene margen superior adicional */
.summary-appointment-sidebar > .summary-card:first-of-type[b-j77ffo9254] {
    margin-top: 20px;
}

/* ============================================
   Cards del sistema
   ============================================ */
.summary-card[b-j77ffo9254] {
    background: #fff;
    border: 1px solid #e9eef3;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.summary-card-header[b-j77ffo9254] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 1rem 0.5rem;
    font-size: 0.85rem;
    font-weight: 700;
    color: #1f2937;
    letter-spacing: 0.01em;
}

.summary-card-icon[b-j77ffo9254] {
    font-size: 0.95rem;
    color: #0d6efd;
    width: 1.25rem;
    text-align: center;
    flex-shrink: 0;
}

.summary-card-body[b-j77ffo9254] {
    padding: 0.25rem 1rem 0.875rem;
}

/* ============================================
   Cards de alerta (WhatsApp, recepción)
   ============================================ */
.summary-card-alert[b-j77ffo9254] {
    background: #f0f7ff;
    border-color: #b8d4fe;
}

.summary-card-success[b-j77ffo9254] {
    background: #f0fdf4;
    border-color: #bbf7d0;
}

.summary-card-warning[b-j77ffo9254] {
    background: #fffbf0;
    border-color: #fde68a;
}

.summary-card-info[b-j77ffo9254] {
    background: #f0f7ff;
    border-color: #b8d4fe;
}

.summary-alert-text[b-j77ffo9254] {
    margin: 0;
    font-size: 0.85rem;
    color: #374151;
    display: flex;
    align-items: center;
}

/* ============================================
   Filas de datos (label + value)
   ============================================ */
.summary-row[b-j77ffo9254] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 0.4rem 0;
    border-bottom: 1px solid #f3f4f6;
    gap: 0.75rem;
}

.summary-row:last-child[b-j77ffo9254] {
    border-bottom: none;
}

.summary-row-label[b-j77ffo9254] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #6b7280;
    flex-shrink: 0;
    min-width: 6.5rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.summary-row-value[b-j77ffo9254] {
    font-size: 0.85rem;
    color: #1f2937;
    text-align: right;
    word-break: break-word;
}

/* Capitalize para valores en la card de resumen de cita */
.summary-row-value-cap[b-j77ffo9254] {
    text-transform: capitalize;
}

/* ============================================
   Procedimientos
   ============================================ */
.summary-procedures-list[b-j77ffo9254] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.summary-proc-row[b-j77ffo9254] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.5rem;
    background: #f9fafb;
    border-radius: 8px;
    font-size: 0.8rem;
}

.summary-proc-code[b-j77ffo9254] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.75rem;
    font-weight: 600;
    color: #0d6efd;
    background: #eef2ff;
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    flex-shrink: 0;
}

.summary-proc-desc[b-j77ffo9254] {
    flex: 1;
    color: #374151;
}

.summary-proc-qty[b-j77ffo9254] {
    font-weight: 700;
    color: #6b7280;
    font-size: 0.75rem;
    background: #e5e7eb;
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    flex-shrink: 0;
}

.summary-proc-recomendacion[b-j77ffo9254] {
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    margin: 0.1rem 0 0.4rem 0;
    padding: 0.45rem 0.55rem;
    background: #fffbeb;
    border-left: 3px solid #f59e0b;
    border-radius: 6px;
    font-size: 0.78rem;
    line-height: 1.45;
    color: #92400e;
}

/* ============================================
   Adjuntos (Documentos)
   ============================================ */
.summary-attach-row[b-j77ffo9254] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.5rem;
    background: #f9fafb;
    border-radius: 8px;
    margin-bottom: 0.35rem;
    font-size: 0.8rem;
}

.summary-attach-row:last-child[b-j77ffo9254] {
    margin-bottom: 0;
}

.summary-attach-thumb[b-j77ffo9254] {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 0.8rem;
    flex-shrink: 0;
}

.summary-attach-thumb-img[b-j77ffo9254] {
    width: 28px;
    height: 28px;
    object-fit: cover;
    border-radius: 6px;
    border: 1px solid #e5e7eb;
}

.summary-attach-name[b-j77ffo9254] {
    flex: 1;
    color: #374151;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.summary-attach-size[b-j77ffo9254] {
    font-size: 0.7rem;
    color: #9ca3af;
    flex-shrink: 0;
}

/* Thumb colors (heredados) */
.summary-attach-thumb-default[b-j77ffo9254] {
    background-color: #6c757d;
}
.summary-attach-thumb-image[b-j77ffo9254] {
    background-color: #198754;
}
.summary-attach-thumb-pdf[b-j77ffo9254] {
    background-color: #dc3545;
}
.summary-attach-thumb-word[b-j77ffo9254] {
    background-color: #0d6efd;
}
.summary-attach-thumb-excel[b-j77ffo9254] {
    background-color: #20c997;
}

/* ============================================
   Botón finalizar
   ============================================ */
.summary-clear-button-container[b-j77ffo9254] {
    margin-top: 0.25rem;
}

.summary-finish-btn[b-j77ffo9254] {
    width: 100%;
    padding: 0.7rem 1rem;
    font-size: 0.95rem;
    font-weight: 600;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(13, 110, 253, 0.2);
}

/* ============================================
   Responsive
   ============================================ */
@media (max-width: 576px) {
    .summary-card-header[b-j77ffo9254] {
        padding: 0.75rem 0.875rem 0.4rem;
        font-size: 0.8rem;
    }

    .summary-card-body[b-j77ffo9254] {
        padding: 0.2rem 0.875rem 0.75rem;
    }

    .summary-row[b-j77ffo9254] {
        padding: 0.35rem 0;
    }

    .summary-row-label[b-j77ffo9254] {
        font-size: 0.7rem;
        min-width: 5rem;
    }

    .summary-row-value[b-j77ffo9254] {
        font-size: 0.8rem;
    }

    .summary-finish-btn[b-j77ffo9254] {
        font-size: 0.9rem;
        padding: 0.65rem 1rem;
    }
}

@media (min-width: 768px) {
    .summary-appointment-sidebar[b-j77ffo9254] {
        gap: 1rem;
    }
}
/* /Presentation/Components/Pages/Analytics/AppointmentsStats.razor.rz.scp.css */
/* ── Contenedor principal ── */
.editor-container[b-vxux4sj3uo] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

/* ── Header con breadcrumb ── */
.editor-header[b-vxux4sj3uo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-vxux4sj3uo] {
    font-size: 13px;
}

.editor-header-right[b-vxux4sj3uo] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* ── Title bar ── */
.editor-title-bar[b-vxux4sj3uo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-vxux4sj3uo],
.editor-title-bar .fw-semibold[b-vxux4sj3uo],
.editor-title-bar small[b-vxux4sj3uo] {
    color: #1a1d23 !important;
}

/* ── Contenido (fondo gris, scroll) ── */
.editor-tab-content[b-vxux4sj3uo] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 20px 24px 24px;
}

/* ── Estilos específicos del monitor ── */

.stats-card-body[b-vxux4sj3uo] {
    height: 420px;
}

@media (min-width: 992px) {
    .stats-card-body[b-vxux4sj3uo] {
        height: 70vh;
    }
}

#statsChart[b-vxux4sj3uo] {
    width: 100%;
    height: 100%;
}

.spin-animation[b-vxux4sj3uo] {
    animation: spin-b-vxux4sj3uo 1s linear infinite;
}

@keyframes spin-b-vxux4sj3uo {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.gradient-primary[b-vxux4sj3uo] {
    background: linear-gradient(135deg, #0d6efd 0%, #0a58ca 100%);
}

/* ── Card "Total Citas": burbujas decorativas (estilo cards del Home) ── */
.total-citas-card[b-vxux4sj3uo] {
    position: relative;
    overflow: hidden;
}

.total-citas-card .card-body[b-vxux4sj3uo] {
    position: relative;
    z-index: 1;
}

.total-citas-bubble[b-vxux4sj3uo] {
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    z-index: 0;
}

.total-citas-bubble-1[b-vxux4sj3uo] {
    top: -30px;
    right: -20px;
    width: 110px;
    height: 110px;
}

.total-citas-bubble-2[b-vxux4sj3uo] {
    bottom: -40px;
    left: -25px;
    width: 130px;
    height: 130px;
}

.total-citas-bubble-3[b-vxux4sj3uo] {
    top: 20px;
    right: 70px;
    width: 50px;
    height: 50px;
    background: rgba(255, 255, 255, 0.15);
}

/* ── Centrado óptico de iconos en botones circulares de la toolbar ── */
.toolbar-circle-btn .bi[b-vxux4sj3uo] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    line-height: 1;
    padding-left: 5px;
    transform: translateX(3px);
}

/* ── Centrado óptico de iconos en los círculos de la card "Citas Asignadas" ── */
.assigned-icon-circle[b-vxux4sj3uo] {
    line-height: 1;
}

.assigned-icon-circle .bi[b-vxux4sj3uo] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    line-height: 1;
    padding-left: 5px;
    transform: translateX(3px);
}

/* Custom Scrollbar for inner lists */
[b-vxux4sj3uo]::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

[b-vxux4sj3uo]::-webkit-scrollbar-track {
    background: #f1f1f1;
}

[b-vxux4sj3uo]::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 3px;
}

[b-vxux4sj3uo]::-webkit-scrollbar-thumb:hover {
    background: #bbb;
}

/* ── Tamaño de texto estándar tablas (0.8rem) ── */
.editor-tab-content .table[b-vxux4sj3uo] {
    font-size: 0.8rem;
}

/* ── Responsive ── */
@media (max-width: 767.98px) {
    .editor-tab-content[b-vxux4sj3uo] {
        padding: 12px 16px 16px;
    }
}
/* /Presentation/Components/Pages/Analytics/BlockedIpsDashboard.razor.rz.scp.css */
/* ── Contenedor principal ── */
.editor-container[b-3gryv3xah9] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

/* ── Header con breadcrumb ── */
.editor-header[b-3gryv3xah9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-3gryv3xah9] {
    font-size: 13px;
}

.editor-header-right[b-3gryv3xah9] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* ── Title bar ── */
.editor-title-bar[b-3gryv3xah9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-3gryv3xah9],
.editor-title-bar .fw-semibold[b-3gryv3xah9],
.editor-title-bar small[b-3gryv3xah9] {
    color: #1a1d23 !important;
}

/* ── Contenido (fondo gris, scroll) ── */
.editor-tab-content[b-3gryv3xah9] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 20px 24px 24px;
}

/* ── Sobreescritura de padding global en botones de toolbar ── */
.btn-primary.btn-sm[b-3gryv3xah9],
.btn-outline-primary.btn-sm[b-3gryv3xah9] {
    padding: .25rem .5rem;
    border: 1px solid transparent;
    font-weight: 400;
}

.btn-outline-primary.btn-sm[b-3gryv3xah9] {
    border-color: #0d6efd;
}

/* ── Tamaño de texto estándar tablas (0.8rem) ── */
.editor-tab-content .table[b-3gryv3xah9] {
    font-size: 0.8rem;
}

/* ── Responsive ── */
@media (max-width: 767.98px) {
    .editor-tab-content[b-3gryv3xah9] {
        padding: 12px 16px 16px;
    }
}
/* /Presentation/Components/Pages/Analytics/TrustedIpsDashboard.razor.rz.scp.css */
.editor-container[b-73gfonb2wq] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

.editor-header[b-73gfonb2wq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-73gfonb2wq] {
    font-size: 13px;
}

.editor-header-right[b-73gfonb2wq] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.editor-title-bar[b-73gfonb2wq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-73gfonb2wq],
.editor-title-bar .fw-semibold[b-73gfonb2wq],
.editor-title-bar small[b-73gfonb2wq] {
    color: #1a1d23 !important;
}

.editor-tab-content[b-73gfonb2wq] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 20px 24px 24px;
}

/* ── Sobreescritura de padding global en botones de toolbar ── */
.btn-primary.btn-sm[b-73gfonb2wq],
.btn-outline-primary.btn-sm[b-73gfonb2wq] {
    padding: .25rem .5rem;
    border: 1px solid transparent;
    font-weight: 400;
}

.btn-outline-primary.btn-sm[b-73gfonb2wq] {
    border-color: #0d6efd;
}

/* ── Tamaño de texto estándar tablas (0.8rem) ── */
.editor-tab-content .table[b-73gfonb2wq] {
    font-size: 0.8rem;
}

@media (max-width: 767.98px) {
    .editor-tab-content[b-73gfonb2wq] {
        padding: 12px 16px 16px;
    }
}
/* /Presentation/Components/Pages/Cms/Admin.razor.rz.scp.css */
.cms-admin-root[b-61c633p5sy] {
    min-height: 100vh;
    padding: 2rem 2rem 3rem 2rem;
    background: radial-gradient(circle at top, rgba(56, 189, 248, 0.16), transparent 55%), #020617;
    color: #e5e7eb;
}

.cms-admin-header h1[b-61c633p5sy] {
    font-size: 2rem;
    margin-bottom: 0.25rem;
}

.cms-admin-header p[b-61c633p5sy] {
    margin: 0;
    color: #9ca3af;
}

.cms-admin-body[b-61c633p5sy] {
    display: grid;
    grid-template-columns: 320px minmax(0, 1fr);
    gap: 1.75rem;
    margin-top: 1.75rem;
}

.cms-admin-left[b-61c633p5sy],
.cms-admin-right[b-61c633p5sy] {
    background: rgba(15, 23, 42, 0.95);
    border-radius: 1.25rem;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.9);
    padding: 1.5rem 1.5rem 1.25rem 1.5rem;
    position: relative;
    overflow: hidden;
}

.cms-admin-left[b-61c633p5sy]::before,
.cms-admin-right[b-61c633p5sy]::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.18;
    background-image:
        radial-gradient(circle at top left, rgba(59, 130, 246, 0.55) 0, transparent 55%),
        radial-gradient(circle at bottom right, rgba(236, 72, 153, 0.45) 0, transparent 50%);
    pointer-events: none;
}

.cms-admin-left > *[b-61c633p5sy],
.cms-admin-right > *[b-61c633p5sy] {
    position: relative;
    z-index: 1;
}

.cms-admin-panel-header[b-61c633p5sy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.cms-admin-tabs[b-61c633p5sy] {
    align-items: stretch;
}

.cms-admin-tabs .btn-group .btn[b-61c633p5sy] {
    min-width: 140px;
}

.cms-admin-panel-header h2[b-61c633p5sy],
.cms-admin-panel-header h3[b-61c633p5sy] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
}

.cms-admin-sections-list[b-61c633p5sy] {
    max-height: calc(100vh - 230px);
    overflow-y: auto;
    padding-right: 0.25rem;
}

.cms-admin-sections-list[b-61c633p5sy]::-webkit-scrollbar {
    width: 6px;
}

.cms-admin-sections-list[b-61c633p5sy]::-webkit-scrollbar-thumb {
    background: rgba(148, 163, 184, 0.6);
    border-radius: 999px;
}

.cms-section-row[b-61c633p5sy] {
    width: 100%;
    border: none;
    background: transparent;
    padding: 0.65rem 0.6rem;
    border-radius: 0.75rem;
    display: block;
    text-align: left;
    color: inherit;
    transition:
        background 160ms ease-out,
        transform 120ms ease-out;
}

.cms-section-row:hover[b-61c633p5sy] {
    background: rgba(30, 64, 175, 0.5);
    transform: translateX(2px);
}

.cms-section-row.active[b-61c633p5sy] {
    background: rgba(59, 130, 246, 0.95);
    box-shadow: 0 10px 25px rgba(37, 99, 235, 0.75);
}

.cms-section-row-main[b-61c633p5sy] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.cms-section-row-title[b-61c633p5sy] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-weight: 500;
}

.cms-section-row-key[b-61c633p5sy] {
    font-size: 0.8rem;
    color: #9ca3af;
}

.cms-admin-loading[b-61c633p5sy],
.cms-admin-empty[b-61c633p5sy],
.cms-admin-placeholder[b-61c633p5sy] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 180px;
    text-align: center;
    color: #9ca3af;
}

.cms-admin-section-detail[b-61c633p5sy] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.cms-admin-section-form[b-61c633p5sy],
.cms-admin-component-form[b-61c633p5sy] {
    background: rgba(15, 23, 42, 0.85);
    border-radius: 1rem;
    padding: 1.25rem 1.1rem;
    border: 1px solid rgba(51, 65, 85, 0.9);
}

.cms-admin-components-list[b-61c633p5sy] {
    max-height: 280px;
    overflow-y: auto;
    padding-right: 0.25rem;
}

.cms-admin-components-list[b-61c633p5sy]::-webkit-scrollbar {
    width: 6px;
}

.cms-admin-components-list[b-61c633p5sy]::-webkit-scrollbar-thumb {
    background: rgba(148, 163, 184, 0.6);
    border-radius: 999px;
}

.cms-component-row[b-61c633p5sy] {
    border-radius: 0.85rem;
    padding: 0.6rem 0.6rem;
    margin-bottom: 0.35rem;
    background: rgba(15, 23, 42, 0.95);
    border: 1px solid rgba(55, 65, 81, 0.9);
    cursor: pointer;
    transition:
        background 150ms ease-out,
        border-color 150ms ease-out,
        transform 120ms ease-out;
}

.cms-component-row:hover[b-61c633p5sy] {
    background: rgba(30, 64, 175, 0.4);
    transform: translateY(-1px);
}

.cms-component-row.selected[b-61c633p5sy] {
    border-color: rgba(59, 130, 246, 0.9);
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.75);
}

.cms-component-main[b-61c633p5sy] {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
}

.cms-component-text[b-61c633p5sy] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.cms-component-title[b-61c633p5sy] {
    font-size: 0.95rem;
    font-weight: 500;
}

.cms-component-text small[b-61c633p5sy] {
    font-size: 0.8rem;
    color: #9ca3af;
}

@media (max-width: 1024px) {
    .cms-admin-body[b-61c633p5sy] {
        grid-template-columns: minmax(0, 1fr);
    }

    .cms-admin-root[b-61c633p5sy] {
        padding-inline: 1.25rem;
    }
}
/* /Presentation/Components/Pages/Cms/CaquetaExperience.razor.rz.scp.css */
.cms-section[b-thinutpaad] {
    max-width: 1120px;
    margin: 0 auto 2rem 0;
    padding: 2.75rem 2.25rem;
    border-radius: 1.5rem;
    background: linear-gradient(160deg, rgba(15, 23, 42, 0.46), rgba(15, 23, 42, 0.28));
    box-shadow:
        0 18px 45px rgba(2, 6, 23, 0.45),
        0 0 0 1px rgba(255, 255, 255, 0.16),
        inset 0 0 0 1px rgba(2, 6, 23, 0.25);
    position: relative;
    overflow: hidden;
    backdrop-filter: blur(10px);
    grid-column: 2;
    justify-self: start;
}

.cms-section[b-thinutpaad]::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.18;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image:
        linear-gradient(130deg, rgba(15, 23, 42, 0.58), rgba(15, 23, 42, 0.36)),
        radial-gradient(circle at top left, rgba(59, 130, 246, 0.32) 0, transparent 60%),
        radial-gradient(circle at bottom right, rgba(236, 72, 153, 0.22) 0, transparent 48%);
    pointer-events: none;
    transform: scale(1.02);
    transition:
        opacity 420ms ease-out,
        transform 420ms ease-out,
        filter 420ms ease-out;
}

.cms-section[b-thinutpaad]::after {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.18), transparent 70%);
    opacity: 0.22;
    filter: blur(10px);
    transform: translate3d(-30%, -40%, 0);
    animation: cms-section-orbit-b-thinutpaad 18s ease-in-out infinite alternate;
    mix-blend-mode: screen;
    pointer-events: none;
}

.cms-section:hover[b-thinutpaad]::before {
    opacity: 0.28;
    transform: scale(1.05);
    filter: saturate(1.05);
}

.cms-section:hover[b-thinutpaad]::after {
    opacity: 0.5;
}

.cms-section--caqueta[b-thinutpaad]::before {
    background-image:
        linear-gradient(130deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.86)),
        radial-gradient(circle at top left, rgba(59, 130, 246, 0.4) 0, transparent 60%),
        radial-gradient(circle at bottom right, rgba(14, 165, 233, 0.32) 0, transparent 48%);
}

@keyframes cms-section-orbit-b-thinutpaad {
    0% {
        transform: translate3d(-30%, -40%, 0) scale(1);
    }
    50% {
        transform: translate3d(10%, -20%, 0) scale(1.1);
    }
    100% {
        transform: translate3d(30%, 10%, 0) scale(1.05);
    }
}

.cms-section-header[b-thinutpaad] {
    position: relative;
    z-index: 1;
    margin-bottom: 1.75rem;
}

.cms-section-header h2[b-thinutpaad] {
    font-size: 1.7rem;
    font-weight: 700;
    margin-bottom: 0.35rem;
}

.cms-section-header p[b-thinutpaad] {
    margin: 0;
    color: #9ca3af;
    max-width: 640px;
}

.caqueta-experience-layout[b-thinutpaad] {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(260px, 1.05fr) minmax(320px, 1.35fr);
    gap: 2.25rem;
    align-items: flex-start;
}

.caqueta-map-panel[b-thinutpaad] {
    padding: 1.5rem 1.3rem;
    border-radius: 1.25rem;
    background: radial-gradient(circle at top left, rgba(59, 130, 246, 0.45), rgba(15, 23, 42, 0.95));
    border: 1px solid rgba(59, 130, 246, 0.65);
    box-shadow:
        0 20px 50px rgba(15, 23, 42, 0.95),
        0 0 0 1px rgba(15, 23, 42, 0.65) inset;
}

.caqueta-map-title[b-thinutpaad] {
    margin: 0 0 0.35rem 0;
    font-size: 1.05rem;
    font-weight: 600;
}

.caqueta-map-text[b-thinutpaad] {
    margin: 0 0 0.9rem 0;
    font-size: 0.9rem;
    color: #e5e7eb;
}

.caqueta-municipalities[b-thinutpaad] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem 1.25rem;
    font-size: 0.9rem;
}

.caqueta-municipalities li[b-thinutpaad]::before {
    content: "●";
    margin-right: 0.4rem;
    color: #38bdf8;
}

.caqueta-details-panel[b-thinutpaad] {
    padding: 1.2rem 0.4rem 0.4rem 0.4rem;
}

.caqueta-details-title[b-thinutpaad] {
    margin: 0 0 0.75rem 0;
    font-size: 1.05rem;
    font-weight: 600;
}

.caqueta-details-list[b-thinutpaad] {
    margin: 0;
    padding-left: 1.25rem;
    display: grid;
    gap: 0.65rem;
    font-size: 0.9rem;
    color: #e5e7eb;
}

.caqueta-details-list li[b-thinutpaad]::marker {
    color: #38bdf8;
    font-weight: 600;
}

.cms-section-cta-button[b-thinutpaad] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.85rem 2.8rem;
    border-radius: 999px;
    border: none;
    background: linear-gradient(90deg, #38bdf8, #6366f1);
    color: #f9fafb;
    font-weight: 600;
    font-size: 0.98rem;
    text-decoration: none;
    box-shadow: 0 18px 40px rgba(37, 99, 235, 0.65);
    cursor: pointer;
    transition:
        transform 180ms ease-out,
        box-shadow 180ms ease-out,
        filter 180ms ease-out;
}

.cms-section-cta-button:hover[b-thinutpaad] {
    transform: translateY(-2px);
    box-shadow: 0 24px 60px rgba(37, 99, 235, 0.9);
    filter: brightness(1.05);
}

.cms-section-cta-button:active[b-thinutpaad] {
    transform: translateY(0);
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.85);
}

@media (max-width: 768px) {
    .cms-section[b-thinutpaad] {
        max-width: none;
        margin: 1.5rem 0 2.5rem 0;
        padding: 2rem 1.4rem;
        border-radius: 1.25rem;
        grid-column: 1;
    }

    .cms-section-header h2[b-thinutpaad] {
        font-size: 1.5rem;
    }

    .cms-section-header p[b-thinutpaad] {
        max-width: none;
        font-size: 0.94rem;
    }

    .caqueta-experience-layout[b-thinutpaad] {
        grid-template-columns: minmax(0, 1fr);
        gap: 1.6rem;
    }

    .caqueta-map-panel[b-thinutpaad] {
        padding: 1.3rem 1.1rem;
    }

    .caqueta-map-title[b-thinutpaad],
    .caqueta-details-title[b-thinutpaad] {
        font-size: 1rem;
    }

    .caqueta-map-text[b-thinutpaad],
    .caqueta-municipalities[b-thinutpaad],
    .caqueta-details-list[b-thinutpaad] {
        font-size: 0.86rem;
    }

    .cms-section-cta-button[b-thinutpaad] {
        width: 100%;
        padding: 0.75rem 1.4rem;
        font-size: 0.95rem;
    }
}

.caqueta-map-button[b-thinutpaad] {
    position: relative;
    overflow: hidden;
}

.caqueta-map-button[b-thinutpaad]::before,
.caqueta-map-button[b-thinutpaad]::after {
    content: "";
    position: absolute;
    inset: -40%;
    opacity: 0;
    transform: translate3d(0, 14%, 0);
    filter: blur(1px);
    pointer-events: none;
    mix-blend-mode: screen;
}

.caqueta-map-button[b-thinutpaad]::before {
    background-image:
        repeating-linear-gradient(
            90deg,
            rgba(56, 189, 248, 0.26) 0,
            rgba(56, 189, 248, 0.26) 4px,
            transparent 4px,
            transparent 8px
        ),
        repeating-linear-gradient(
            0deg,
            rgba(59, 130, 246, 0.24) 0,
            rgba(59, 130, 246, 0.24) 4px,
            transparent 4px,
            transparent 8px
        );
    background-size: 120% 120%;
}

.caqueta-map-button[b-thinutpaad]::after {
    inset: -12%;
    background-image:
        linear-gradient(90deg, rgba(59, 130, 246, 0.34) 10%, transparent 40%, rgba(37, 99, 235, 0.36) 70%, transparent 100%),
        repeating-linear-gradient(
            135deg,
            rgba(56, 189, 248, 0.3) 0,
            rgba(56, 189, 248, 0.3) 2px,
            transparent 2px,
            transparent 6px
        );
    background-size: 180% 180%;
    transform: translate3d(-80%, 0, 0);
}

.caqueta-map-button:hover[b-thinutpaad]::before {
    opacity: 1;
    animation: caqueta-map-grid-b-thinutpaad 900ms ease-out forwards 80ms;
}

.caqueta-map-button:hover[b-thinutpaad]::after {
    opacity: 1;
    animation: caqueta-map-sweep-b-thinutpaad 1100ms ease-out forwards 140ms;
}

@keyframes caqueta-map-grid-b-thinutpaad {
    0% {
        opacity: 0;
        transform: translate3d(0, 22%, 0) scale(0.96);
        filter: blur(3px);
    }
    40% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1.02);
        filter: blur(0);
    }
    100% {
        opacity: 0.42;
        transform: translate3d(0, -10%, 0) scale(1.1);
        filter: blur(3px);
    }
}

@keyframes caqueta-map-sweep-b-thinutpaad {
    0% {
        opacity: 0;
        transform: translate3d(-90%, 0, 0);
    }
    40% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: translate3d(110%, 0, 0);
    }
}

@media (max-width: 1280px) {
    .caqueta-experience-layout[b-thinutpaad] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Presentation/Components/Pages/Cms/Landing.razor.rz.scp.css */
.cms-landing-container[b-fsayxhfecd] {
    min-height: 100vh;
    padding: 7.2rem 1rem 3.2rem 1rem;
    background: radial-gradient(circle at top, rgba(76, 175, 235, 0.16), transparent 55%), #050816;
    color: #f9fafb;
    --left-offset: 0.2vw;
    --right-rail: clamp(260px, 22vw, 360px);
    display: grid;
    grid-template-columns: var(--left-offset) minmax(860px, 1fr) var(--right-rail);
    column-gap: 2rem;
}

.cms-landing-title[b-fsayxhfecd] {
    grid-column: 2;
    justify-self: start;
    max-width: 80%;
    margin: 0.4rem auto 2.8rem 0;
    padding: 28rem 0 1.2rem;
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    align-items: flex-start;
    font-family: 'Raleway', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: #e5f3ff;
    position: relative;
    z-index: 2;
}

.cms-landing-slider[b-fsayxhfecd] {
    position: absolute;
    top: -1%;
    left: 0;
    right: 0;
    margin-left: 2%;
    width: 100%;
    min-height: 470px;
    border-radius: 1rem;
    overflow: hidden;
    /* background: radial-gradient(circle at top left, rgba(229, 230, 233, 0.85), rgba(207, 211, 219, 0.92));
    box-shadow:
        0 22px 52px rgba(33, 53, 100, 0.8),
        0 0 32px rgba(6, 11, 20, 0.75); 
        */
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 1.2rem 1.1rem;
    transform: translateY(10px);
    pointer-events: none;
}

.cms-landing-slider--one[b-fsayxhfecd] {
    /*background: radial-gradient(circle at top left, rgba(19, 30, 54, 0.94), rgba(22, 35, 63, 0.98));*/
    animation: cmsLandingSlideOne-b-fsayxhfecd 40s ease-in-out infinite;
    pointer-events: auto;
}

.cms-landing-slider--two[b-fsayxhfecd],
.cms-landing-slider--three[b-fsayxhfecd],
.cms-landing-slider--four[b-fsayxhfecd] {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.cms-landing-slider--two[b-fsayxhfecd] {
    background-image: url("/images/slider-two.png");
    animation: cmsLandingSlideTwo-b-fsayxhfecd 40s ease-in-out infinite;
}

.cms-landing-slider--three[b-fsayxhfecd] {
    background-image: url("/images/slider-three.png");
    animation: cmsLandingSlideThree-b-fsayxhfecd 40s ease-in-out infinite;
}

.cms-landing-slider--four[b-fsayxhfecd] {
    background-image: url("/images/slider-four.png");
    animation: cmsLandingSlideFour-b-fsayxhfecd 40s ease-in-out infinite;
}

.cms-landing-slider--two[b-fsayxhfecd]::before,
.cms-landing-slider--three[b-fsayxhfecd]::before,
.cms-landing-slider--four[b-fsayxhfecd]::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 10% 10%, rgba(15, 23, 42, 0.25), transparent 35%),
        linear-gradient(120deg, rgba(218, 219, 221, 0.75), rgba(190, 192, 196, 0.18), rgba(210, 212, 219, 0.85));
    mix-blend-mode: normal;
}

.cms-landing-slider--two[b-fsayxhfecd]::after,
.cms-landing-slider--three[b-fsayxhfecd]::after,
.cms-landing-slider--four[b-fsayxhfecd]::after {
    content: "";
    position: absolute;
    inset: -1.1rem;
    border-radius: inherit;
    background:
        radial-gradient(circle at 0% 0%, rgba(212, 213, 214, 0.9), transparent 55%),
        radial-gradient(circle at 100% 0%, rgba(228, 229, 233, 0.85), transparent 55%),
        radial-gradient(circle at 50% 100%, rgba(233, 235, 240, 0.9), transparent 60%);
    opacity: 0.85;
    filter: blur(14px);
    mix-blend-mode: normal;
    pointer-events: none;
}

.cms-landing-title-main[b-fsayxhfecd] {
    font-size: clamp(2.6rem, 2.6vw + 2.2rem, 2.8rem);
    line-height: 1.08;
    font-weight: 500;
    letter-spacing: 0.018em;
    text-shadow:
        0 3px 12px rgba(0, 0, 0, 0.7),
        0 0 24px rgba(59, 130, 246, 0.4);
    opacity: 0;
    transform: translateY(10px);
    animation: cmsHeroFadeUp-b-fsayxhfecd 620ms ease-out forwards;
}

.cms-landing-title h2[b-fsayxhfecd] {
  margin-left: 5% !important;
  font-size: 3.1rem;
  font-weight: 200;
  animation: lights-b-fsayxhfecd 6s 750ms linear infinite;
}

.cms-landing-title-highlight[b-fsayxhfecd] {
    margin: 0;
    max-width: 52rem;
    font-size: 0.98rem;
    letter-spacing: 0.01em;
    color: #dbeafe;
    opacity: 0.96;
    opacity: 0;
    transform: translateY(10px);
    animation: cmsHeroFadeUp-b-fsayxhfecd 620ms ease-out forwards;
    animation-delay: 0.14s;
    top: 2%;
    left: 2%;
}

.cms-landing-highlight-row[b-fsayxhfecd] {
    margin-top: 1.6rem;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.cms-landing-hero-slider[b-fsayxhfecd] {
    margin-top: 0.9rem;
    width: 100%;
    overflow: hidden;
    position: relative;
}

@keyframes cmsLandingSlideOne-b-fsayxhfecd {
    0% {
        opacity: 0;
        transform: translateY(10px);
    }
    5% {
        opacity: 1;
        transform: translateY(0);
    }
    45% {
        opacity: 1;
        transform: translateY(0);
    }
    50% {
        opacity: 0;
        transform: translateY(-8px);
    }
    100% {
        opacity: 0;
        transform: translateY(-8px);
    }
}

@keyframes cmsLandingSlideTwo-b-fsayxhfecd {
    0%,
    44% {
        opacity: 0;
        transform: translateY(-8px);
    }
    50% {
        opacity: 1;
        transform: translateY(0);
    }
    62% {
        opacity: 1;
        transform: translateY(0);
    }
    68% {
        opacity: 0;
        transform: translateY(-8px);
    }
    100% {
        opacity: 0;
        transform: translateY(-8px);
    }
}

@keyframes cmsLandingSlideThree-b-fsayxhfecd {
    0%,
    61% {
        opacity: 0;
        transform: translateY(-8px);
    }
    68% {
        opacity: 1;
        transform: translateY(0);
    }
    80% {
        opacity: 1;
        transform: translateY(0);
    }
    86% {
        opacity: 0;
        transform: translateY(-8px);
    }
    100% {
        opacity: 0;
        transform: translateY(-8px);
    }
}

@keyframes cmsLandingSlideFour-b-fsayxhfecd {
    0%,
    79% {
        opacity: 0;
        transform: translateY(-8px);
    }
    86% {
        opacity: 1;
        transform: translateY(0);
    }
    96% {
        opacity: 1;
        transform: translateY(0);
    }
    100% {
        opacity: 0;
        transform: translateY(-8px);
    }
}

.cms-landing-hero-track[b-fsayxhfecd] {
    display: flex;
    flex-wrap: nowrap;
    transition: transform 520ms cubic-bezier(0.33, 1, 0.68, 1);
    will-change: transform;
}

.cms-hero-slide[b-fsayxhfecd] {
    min-width: 100%;
    padding-right: 0.5rem;
    opacity: 0.4;
    transform: translateY(6px);
    transition:
        opacity 380ms ease-out,
        transform 380ms ease-out;
    display: flex;
    flex-direction: column;
}

.cms-hero-slide-header[b-fsayxhfecd] {
    margin-bottom: 0.4rem;
}

.cms-hero-slide-pill[b-fsayxhfecd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.18rem 0.75rem;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.92);
    box-shadow: 0 0 0 1px rgba(56, 189, 248, 0.7);
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #e0f2fe;
}

.cms-hero-slide-body[b-fsayxhfecd] {
    margin: 0.5rem 0 0;
    font-size: 0.92rem;
    line-height: 1.6;
    color: #dbeafe;
    opacity: 0.96;
}

.cms-hero-slide.is-active[b-fsayxhfecd] {
    opacity: 1;
    transform: translateY(0);
}

.cms-hero-slide.is-active .cms-hero-slide-body[b-fsayxhfecd] {
    animation: heroTextFade-b-fsayxhfecd 540ms ease-out;
}

.cms-hero-slide-dots[b-fsayxhfecd] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

@media (min-width: 1024px) {
    .cms-hero-slide-dots[b-fsayxhfecd] {
        justify-content: center;
        align-items: center;
        width: 100%;
    }

    .cms-hero-slide-body[b-fsayxhfecd] {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        max-height: 3.2em;
    }

    .cms-hero-read-more[b-fsayxhfecd] {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        cursor: pointer;
    }

    .cms-component-description[b-fsayxhfecd] {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        max-height: 3.2em;
    }

    .cms-component-read-more[b-fsayxhfecd] {
        display: inline-flex;
        align-items: center;
        cursor: pointer;
    }

    .cms-hero-popover[b-fsayxhfecd] {
        display: block;
    }
}

.cms-hero-read-more[b-fsayxhfecd] {
    display: none;
    align-self: flex-end;
    margin-top: 0.55rem;
    padding: 0.45rem 1.3rem;
    border-radius: 999px;
    border: none;
    background: radial-gradient(circle at 20% 0, #22c55e, #16a34a);
    color: #ecfdf5;
    font-weight: 600;
    font-size: 0.8rem;
    letter-spacing: 0.06em;
    text-decoration: none;
    box-shadow:
        0 12px 26px rgba(22, 163, 74, 0.55),
        0 0 0 1px rgba(15, 23, 42, 0.9);
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition:
        transform 160ms ease-out,
        box-shadow 160ms ease-out,
        filter 160ms ease-out;
}

.cms-hero-read-more[b-fsayxhfecd]::before,
.cms-hero-read-more[b-fsayxhfecd]::after {
    content: "";
    position: absolute;
    inset: -40%;
    opacity: 0;
    transform: translate3d(0, 10%, 0);
    filter: blur(1px);
    pointer-events: none;
    mix-blend-mode: screen;
}

.cms-hero-read-more[b-fsayxhfecd]::after {
    inset: -10%;
    background-image:
        linear-gradient(90deg, rgba(22, 163, 74, 0.28) 10%, transparent 40%, rgba(22, 163, 74, 0.32) 70%, transparent 100%),
        repeating-linear-gradient(
            135deg,
            rgba(22, 163, 74, 0.26) 0,
            rgba(22, 163, 74, 0.26) 2px,
            transparent 2px,
            transparent 6px
        );
    background-size: 180% 180%;
    transform: translate3d(-80%, 0, 0);
}

.cms-hero-read-more[b-fsayxhfecd]::before {
    background-image:
        repeating-linear-gradient(
            90deg,
            rgba(34, 197, 94, 0.22) 0,
            rgba(34, 197, 94, 0.22) 4px,
            transparent 4px,
            transparent 8px
        ),
        repeating-linear-gradient(
            0deg,
            rgba(16, 185, 129, 0.2) 0,
            rgba(16, 185, 129, 0.2) 4px,
            transparent 4px,
            transparent 8px
        );
    background-size: 120% 120%;
}

.cms-hero-read-more:hover[b-fsayxhfecd]::before {
    opacity: 1;
    animation: suros-header-cta-grid 900ms ease-out forwards 80ms;
}

.cms-hero-read-more:hover[b-fsayxhfecd]::after {
    opacity: 1;
    animation: suros-header-cta-sweep 1100ms ease-out forwards 140ms;
}

.cms-hero-read-more:hover[b-fsayxhfecd] {
    transform: translateY(-1px);
    box-shadow:
        0 16px 34px rgba(22, 163, 74, 0.8),
        0 0 0 1px rgba(34, 197, 94, 0.9);
    filter: brightness(1.05);
}

.cms-hero-popover[b-fsayxhfecd] {
    position: absolute;
    right: 0.5rem;
    top: 100%;
    margin-top: 0.75rem;
    max-width: 420px;
    z-index: 25;
    display: none;
}

.cms-hero-popover-inner[b-fsayxhfecd] {
    padding: 0.85rem 1rem 1rem 1rem;
    border-radius: 0.9rem;
    background:
        radial-gradient(circle at 0 0, rgba(56, 189, 248, 0.45), transparent 55%),
        radial-gradient(circle at 100% 100%, rgba(59, 130, 246, 0.4), transparent 55%),
        rgba(15, 23, 42, 0.98);
    box-shadow:
        0 24px 60px rgba(15, 23, 42, 0.9),
        0 0 0 1px rgba(30, 64, 175, 0.8);
    color: #e5f3ff;
    font-size: 0.86rem;
    line-height: 1.55;
}

.cms-hero-popover-title[b-fsayxhfecd] {
    margin: 0 0 0.4rem 0;
    font-size: 0.9rem;
    font-weight: 600;
}

.cms-hero-popover-text[b-fsayxhfecd] {
    margin: 0;
}

.cms-component-read-more[b-fsayxhfecd] {
    display: none;
    margin-top: 0.45rem;
    border: 1px solid rgba(148, 163, 184, 0.8);
    background: rgba(15, 23, 42, 0.9);
    color: #e5e7eb;
    padding: 0.24rem 0.7rem;
    border-radius: 999px;
    font-size: 0.76rem;
    letter-spacing: 0.06em;
}

.cms-hero-dot[b-fsayxhfecd] {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    border: none;
    background: rgba(148, 163, 184, 0.5);
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.8);
    cursor: pointer;
    transition:
        transform 160ms ease-out,
        background-color 160ms ease-out,
        box-shadow 160ms ease-out;
}

.cms-hero-dot.is-active[b-fsayxhfecd] {
    transform: scale(1.4);
    background: #0ea5e9;
    box-shadow:
        0 0 0 1px rgba(191, 219, 254, 0.9),
        0 0 18px rgba(56, 189, 248, 0.85);
}

@keyframes heroTextFade-b-fsayxhfecd {
    0% {
        opacity: 0;
        transform: translateY(8px);
        filter: blur(3px);
    }
    60% {
        opacity: 1;
        transform: translateY(-1px);
        filter: blur(0);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.cms-landing-title-subtitle[b-fsayxhfecd] {
    max-width: 48rem;
    font-size: 0.86rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #9ca3af;
    opacity: 0;
    transform: translateY(10px);
    animation: cmsHeroFadeUp-b-fsayxhfecd 620ms ease-out forwards;
    animation-delay: 0.26s;
}

.cms-landing-title-cta[b-fsayxhfecd] {
    margin-top: 0;
    display: flex;
    align-items: center;
}

.cms-landing-cta-whatsapp[b-fsayxhfecd] {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.55rem 1.5rem;
    border-radius: 999px;
    border: 0;
    background: linear-gradient(90deg, #38bdf8, #0ea5e9);
    color: #020617;
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none;
    box-shadow:
        0 18px 40px rgba(8, 47, 73, 0.9),
        0 0 0 1px rgba(224, 242, 254, 0.9);
    position: relative;
    overflow: hidden;
    transition:
        box-shadow 160ms ease-out,
        transform 160ms ease-out,
        filter 160ms ease-out,
        background-position 160ms ease-out;
    background-size: 160% 100%;
    background-position: 0 0;
    opacity: 0;
    transform: translateY(10px);
    animation: cmsHeroFadeUp-b-fsayxhfecd 620ms ease-out forwards;
    animation-delay: 0.38s;
}

.cms-landing-cta-whatsapp[b-fsayxhfecd]::before,
.cms-landing-cta-whatsapp[b-fsayxhfecd]::after {
    content: "";
    position: absolute;
    inset: -40%;
    opacity: 0;
    transform: translate3d(0, 12%, 0);
    filter: blur(1px);
    pointer-events: none;
    mix-blend-mode: screen;
}

.cms-landing-cta-whatsapp[b-fsayxhfecd]::before {
    background-image:
        repeating-linear-gradient(
            90deg,
            rgba(56, 189, 248, 0.24) 0,
            rgba(56, 189, 248, 0.24) 4px,
            transparent 4px,
            transparent 8px
        ),
        repeating-linear-gradient(
            0deg,
            rgba(56, 189, 248, 0.22) 0,
            rgba(56, 189, 248, 0.22) 4px,
            transparent 4px,
            transparent 8px
        );
    background-size: 120% 120%;
}

.cms-landing-cta-whatsapp[b-fsayxhfecd]::after {
    inset: -12%;
    background-image:
        linear-gradient(90deg, rgba(56, 189, 248, 0.3) 10%, transparent 40%, rgba(56, 189, 248, 0.32) 70%, transparent 100%),
        repeating-linear-gradient(
            135deg,
            rgba(56, 189, 248, 0.28) 0,
            rgba(56, 189, 248, 0.28) 2px,
            transparent 2px,
            transparent 6px
        );
    background-size: 180% 180%;
    transform: translate3d(-80%, 0, 0);
}

.cms-landing-cta-whatsapp:hover[b-fsayxhfecd] {
    transform: translateY(-2px);
    box-shadow:
        0 24px 50px rgba(8, 47, 73, 0.95),
        0 0 0 1px rgba(191, 219, 254, 1);
    filter: brightness(1.05);
    background-position: 100% 0;
}

.cms-landing-cta-whatsapp:hover[b-fsayxhfecd]::before {
    opacity: 1;
    animation: cms-hero-cta-grid-b-fsayxhfecd 900ms ease-out forwards 80ms;
}

.cms-landing-cta-whatsapp:hover[b-fsayxhfecd]::after {
    opacity: 1;
    animation: cms-hero-cta-sweep-b-fsayxhfecd 1100ms ease-out forwards 140ms;
}

.cms-landing-cta-wa-icon[b-fsayxhfecd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.92);
    color: #22c55e;
    box-shadow: 0 0 0 1px rgba(56, 189, 248, 0.65);
}

.cms-landing-cta-label[b-fsayxhfecd] {
    white-space: nowrap;
}

@keyframes cmsHeroFadeUp-b-fsayxhfecd {
    0% {
        opacity: 0;
        transform: translateY(12px) scale(0.97);
        filter: blur(2px);
    }
    60% {
        opacity: 1;
        transform: translateY(-1px) scale(1.01);
        filter: blur(0);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes cms-hero-cta-grid-b-fsayxhfecd {
    0% {
        opacity: 0;
        transform: translate3d(0, 20%, 0) scale(0.96);
        filter: blur(3px);
    }
    40% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1.02);
        filter: blur(0);
    }
    100% {
        opacity: 0.4;
        transform: translate3d(0, -10%, 0) scale(1.1);
        filter: blur(3px);
    }
}

@keyframes cms-hero-cta-sweep-b-fsayxhfecd {
    0% {
        opacity: 0;
        transform: translate3d(-90%, 0, 0);
    }
    40% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: translate3d(110%, 0, 0);
    }
}

.cms-footer-wrapper[b-fsayxhfecd] {
    grid-column: 2;
    justify-self: start;
    max-width: 1120px;
    margin: 0 auto 0 0;
}

.cms-loading[b-fsayxhfecd] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 50vh;
}

.cms-empty-state[b-fsayxhfecd] {
    max-width: 720px;
    margin: 4rem auto 4rem 0;
    text-align: center;
    background: rgba(15, 23, 42, 0.85);
    border-radius: 1rem;
    padding: 2.5rem 2rem;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.7);
}

.cms-empty-state h2[b-fsayxhfecd] {
    font-size: 1.9rem;
    margin-bottom: 0.75rem;
}

.cms-empty-state p[b-fsayxhfecd] {
    margin: 0;
    color: #9ca3af;
}

.cms-section[b-fsayxhfecd] {
    max-width: 1120px;
    margin: 0 auto 2rem 0;
    padding: 2.6rem 2.25rem 2.6rem 1.8rem;
    border-radius: 1.5rem;
    /* Apariencia tipo glass del footer: un poco más de transparencia */
    background: linear-gradient(160deg, rgba(15, 23, 42, 0.4), rgba(15, 23, 42, 0.24));
    box-shadow:
        0 18px 45px rgba(2, 6, 23, 0.45),
        0 0 0 1px rgba(255, 255, 255, 0.16),
        inset 0 0 0 1px rgba(2, 6, 23, 0.25);
    position: relative;
    overflow: hidden;
    backdrop-filter: blur(10px);
    grid-column: 2;
    justify-self: start;
}

.cms-section--clients[b-fsayxhfecd] {
    z-index: 5;
}

/* Suave animación de hover ya existente; no ocultar secciones por defecto */

.cms-section[b-fsayxhfecd]::before {
    content: "";
    position: absolute;
    inset: 0;
    /* Velo más sutil para dejar ver el fondo */
    opacity: 0.14;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image:
        linear-gradient(130deg, rgba(15, 23, 42, 0.58), rgba(15, 23, 42, 0.36)),
        radial-gradient(circle at top left, rgba(59, 130, 246, 0.32) 0, transparent 60%),
        radial-gradient(circle at bottom right, rgba(236, 72, 153, 0.22) 0, transparent 48%);
    pointer-events: none;
    transform: scale(1.02);
    transition:
        opacity 420ms ease-out,
        transform 420ms ease-out,
        filter 420ms ease-out;
}

.cms-landing-container .cms-section:first-of-type[b-fsayxhfecd]::before {
    background-image:
        linear-gradient(135deg, rgba(15, 23, 42, 0.82), rgba(15, 23, 42, 0.56)),
        url("/images/imagenseccion.png");
    background-position: right center;
    background-size: cover;
    opacity: 0.28;
    mix-blend-mode: soft-light;
}

@media (max-width: 1024px) {
    .cms-landing-container[b-fsayxhfecd] {
        grid-template-columns: 1fr;
        column-gap: 0;
    }

    .cms-landing-title[b-fsayxhfecd],
    .cms-section[b-fsayxhfecd],
    .cms-footer-wrapper[b-fsayxhfecd] {
        grid-column: 1;
    }
}

.cms-section[b-fsayxhfecd]::after {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    border-radius: 999px;
    /* Halo tenue para dar vida sin oscurecer */
    background: radial-gradient(circle, rgba(255, 255, 255, 0.18), transparent 70%);
    opacity: 0.22;
    filter: blur(10px);
    transform: translate3d(-30%, -40%, 0);
    animation: cms-section-orbit-b-fsayxhfecd 18s ease-in-out infinite alternate;
    mix-blend-mode: screen;
    pointer-events: none;
}

.cms-section:hover[b-fsayxhfecd]::before {
    opacity: 0.28;
    transform: scale(1.05);
    filter: saturate(1.05);
}

.cms-section:hover[b-fsayxhfecd]::after {
    opacity: 0.5;
}

.cms-section--hospital[b-fsayxhfecd]::before {
    background-image:
        linear-gradient(135deg, rgba(15, 23, 42, 0.9), rgba(15, 23, 42, 0.78)),
        url("/images/logosuros.png");
}

.cms-section--people[b-fsayxhfecd]::before {
    background-image:
        linear-gradient(145deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.8)),
        url("/images/logosuros.png");
    background-position: center right;
}

.cms-section--equipment[b-fsayxhfecd]::before {
    background-image:
        linear-gradient(150deg, rgba(15, 23, 42, 0.96), rgba(15, 23, 42, 0.82)),
        url("/images/logosuros.png");
    background-position: center left;
}

.cms-section--abstract[b-fsayxhfecd]::before {
    background-image:
        linear-gradient(130deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.8)),
        radial-gradient(circle at top left, rgba(59, 130, 246, 0.32) 0, transparent 60%),
        radial-gradient(circle at bottom right, rgba(236, 72, 153, 0.22) 0, transparent 48%);
}

@keyframes cms-section-orbit-b-fsayxhfecd {
    0% {
        transform: translate3d(-30%, -40%, 0) scale(1);
    }
    50% {
        transform: translate3d(10%, -20%, 0) scale(1.1);
    }
    100% {
        transform: translate3d(30%, 10%, 0) scale(1.05);
    }
}

.cms-section-header[b-fsayxhfecd] {
    position: relative;
    z-index: 1;
    margin-bottom: 1.75rem;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: 0.85rem;
    align-items: center;
}

.cms-section-header h2[b-fsayxhfecd] {
    font-size: 1.7rem;
    font-weight: 700;
    margin: 0 0 0.25rem 0;
    grid-column: 2;
}

.cms-section-header p[b-fsayxhfecd] {
    margin: 0;
    color: #9ca3af;
    max-width: 640px;
    grid-column: 2;
}

.cms-section-icon[b-fsayxhfecd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 999px;
    margin: 0;
    grid-row: 1 / span 2;
    background: radial-gradient(circle at 30% 0, #38bdf8, #2563eb);
    color: white;
    box-shadow: 0 15px 35px rgba(59, 130, 246, 0.6);
}

.cms-section-components[b-fsayxhfecd] {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(260px, 1fr));
    gap: 1.4rem;
}

.cms-section-components--contact[b-fsayxhfecd] {
    grid-template-columns: repeat(4, minmax(220px, 1fr));
    align-items: flex-start;
}

.cms-component-card[b-fsayxhfecd] {
    border-radius: 1rem;
    padding: 1.3rem 1.25rem 1.1rem 1.25rem;
    background: radial-gradient(circle at top left, rgba(59, 130, 246, 0.4), rgba(15, 23, 42, 0.88));
    border: 1px solid rgba(51, 65, 85, 0.8);
    box-shadow:
        0 18px 40px rgba(15, 23, 42, 0.9),
        0 0 0 1px rgba(15, 23, 42, 0.35) inset;
    transform: translateY(0);
    text-align: center;
    transition:
        transform 220ms ease-out,
        box-shadow 220ms ease-out,
        border-color 220ms ease-out,
        background 220ms ease-out;
}

.cms-section-components--security .cms-component-card[b-fsayxhfecd] {
    position: relative;
    background:
        radial-gradient(circle at 12% 0, rgba(59, 130, 246, 0.45), rgba(15, 23, 42, 0.98)),
        linear-gradient(135deg, rgba(15, 23, 42, 0.98), rgba(15, 23, 42, 0.94));
    border-color: rgba(59, 130, 246, 0.9);
    overflow: hidden;
    backdrop-filter: blur(4px);
}

.cms-section-components--security .cms-component-card[b-fsayxhfecd]::before {
    content: "";
    position: absolute;
    inset: -12%;
    background:
        radial-gradient(circle at 0 0, rgba(59, 130, 246, 0.7), transparent 60%),
        url("/images/preguntasfrecuentes.png") center/cover no-repeat;
    opacity: 0.16;
    filter: blur(3px);
    mix-blend-mode: soft-light;
    pointer-events: none;
}

.cms-section-components--security .cms-component-card:nth-child(even)[b-fsayxhfecd]::before {
    background:
        radial-gradient(circle at 0 0, rgba(59, 130, 246, 0.7), transparent 60%),
        url("/images/fondologin.jpeg") center/cover no-repeat;
}

.cms-section-functionalities[b-fsayxhfecd] {
    position: relative;
    padding-block: 3rem 3.4rem;
}

.cms-functionalities-inner[b-fsayxhfecd] {
    position: relative;
    width: 100%;
    max-width: none;
    border-radius: 1.75rem;
    padding: 2rem 2.4rem 2.3rem;
    background:
        radial-gradient(circle at 0 0, rgba(59, 130, 246, 0.5), transparent 58%),
        radial-gradient(circle at 100% 0, rgba(56, 189, 248, 0.26), transparent 60%),
        radial-gradient(circle at 50% 100%, rgba(59, 130, 246, 0.24), transparent 60%),
        linear-gradient(160deg, rgba(15, 23, 42, 0.96), rgba(15, 23, 42, 0.98));
    box-shadow:
        0 26px 60px rgba(15, 23, 42, 0.95),
        0 0 0 1px rgba(30, 64, 175, 0.65);
    overflow: hidden;
}

.cms-functionalities-inner[b-fsayxhfecd]::before,
.cms-functionalities-inner[b-fsayxhfecd]::after {
    content: "";
    position: absolute;
    inset: -40%;
    opacity: 0.22;
    background-image:
        radial-gradient(circle at 12% 8%, rgba(191, 219, 254, 0.7), transparent 55%),
        radial-gradient(circle at 88% 18%, rgba(129, 140, 248, 0.45), transparent 55%);
    mix-blend-mode: screen;
    pointer-events: none;
}

.cms-section-about[b-fsayxhfecd] {
    position: relative;
    padding-block: 3rem 3.4rem;
}

.cms-about-inner[b-fsayxhfecd] {
    position: relative;
    width: 100%;
    max-width: none;
    border-radius: 1.75rem;
    padding: 2rem 2.2rem 2.3rem;
    background:
        radial-gradient(circle at 0 0, rgba(99, 102, 241, 0.34), transparent 58%),
        radial-gradient(circle at 100% 0, rgba(14, 165, 233, 0.22), transparent 60%),
        linear-gradient(160deg, rgba(15, 23, 42, 0.96), rgba(15, 23, 42, 0.98));
    box-shadow:
        0 26px 60px rgba(15, 23, 42, 0.95),
        0 0 0 1px rgba(30, 64, 175, 0.65);
    overflow: hidden;
}

.cms-about-inner[b-fsayxhfecd]::before {
    content: "";
    position: absolute;
    inset: -50%;
    opacity: 0.18;
    background-image:
        radial-gradient(circle at 8% 18%, rgba(59, 130, 246, 0.6), transparent 55%),
        radial-gradient(circle at 90% 75%, rgba(52, 211, 153, 0.45), transparent 55%);
    mix-blend-mode: screen;
    pointer-events: none;
}

.cms-about-header[b-fsayxhfecd] {
    position: relative;
    z-index: 1;
    max-width: 640px;
}

.cms-about-header h2[b-fsayxhfecd] {
    font-size: 1.6rem;
    margin: 0 0 0.4rem;
    color: #e5f0ff;
}

.cms-about-header p[b-fsayxhfecd] {
    margin: 0;
    font-size: 0.96rem;
    line-height: 1.7;
    color: #bfdbfe;
    max-width: 560px;
}

.cms-about-grid[b-fsayxhfecd] {
    position: relative;
    margin-top: 1.8rem;
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 1rem;
}

@media (max-width: 1200px) {
    .cms-about-grid[b-fsayxhfecd] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .cms-about-grid[b-fsayxhfecd] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.cms-about-card[b-fsayxhfecd] {
    position: relative;
    border-radius: 1.25rem;
    padding: 1.2rem 1rem 1.1rem;
    background:
        radial-gradient(circle at 18% 0, rgba(37, 99, 235, 0.48), rgba(15, 23, 42, 0.92)),
        linear-gradient(180deg, rgba(2, 6, 23, 0.25), rgba(2, 6, 23, 0.12));
    border: 1px solid rgba(51, 65, 85, 0.85);
    backdrop-filter: blur(5px);
    text-align: center;
    transition:
        transform 220ms ease-out,
        box-shadow 220ms ease-out,
        border-color 220ms ease-out;
}

.cms-about-card:hover[b-fsayxhfecd] {
    transform: translateY(-4px);
    border-color: rgba(59, 130, 246, 0.95);
    box-shadow:
        0 28px 55px rgba(15, 23, 42, 0.95),
        0 0 0 1px rgba(37, 99, 235, 0.6) inset;
}

.cms-about-avatar[b-fsayxhfecd] {
    width: 84px;
    height: 84px;
    border-radius: 999px;
    margin: 0 auto 0.65rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #e5e7eb;
    background: radial-gradient(circle at 30% 0, #38bdf8, #2563eb);
    box-shadow: 0 15px 35px rgba(59, 130, 246, 0.6);
    position: relative;
    overflow: hidden;
    border: 2px solid rgba(148, 163, 184, 0.35);
}

.cms-about-avatar i[b-fsayxhfecd] {
    font-size: 1.8rem;
}

.cms-about-avatar img[b-fsayxhfecd] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: inherit;
    filter: saturate(1.02) contrast(1.03);
}

.cms-about-avatar[b-fsayxhfecd]::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow:
        inset 0 0 0 2px rgba(37, 99, 235, 0.65),
        inset 0 0 0 4px rgba(59, 130, 246, 0.15);
    pointer-events: none;
}
.cms-about-name[b-fsayxhfecd] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #eaf2ff;
}

.cms-about-role[b-fsayxhfecd] {
    display: block;
    margin-top: 0.2rem;
    font-size: 0.82rem;
    color: #cbd5e1;
}

.cms-about-tagline[b-fsayxhfecd] {
    margin: 0.4rem 0 0;
    font-size: 0.82rem;
    color: #bfd5ea;
}
.cms-functionalities-inner[b-fsayxhfecd]::after {
    inset: -60%;
    opacity: 0.14;
    background-image:
        radial-gradient(circle at 10% 90%, rgba(59, 130, 246, 0.6), transparent 55%),
        radial-gradient(circle at 90% 85%, rgba(52, 211, 153, 0.55), transparent 55%);
    filter: blur(1px);
}

.cms-functionalities-header[b-fsayxhfecd] {
    position: relative;
    z-index: 1;
    width: 100%;
}

.cms-functionalities-header h2[b-fsayxhfecd] {
    font-size: 1.6rem;
    margin: 0 0 0.4rem;
    color: #e5f0ff;
}

.cms-functionalities-header p[b-fsayxhfecd] {
    margin: 0;
    font-size: 0.96rem;
    line-height: 1.7;
    color: #bfdbfe;
}

.cms-functionalities-cloud[b-fsayxhfecd] {
    position: relative;
    margin-top: 3rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem 0.8rem;
    justify-content: center;
    align-items: center;
}

.cms-feature-tag[b-fsayxhfecd] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.22rem 0.9rem;
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
    color: #e5f0ff;
    background:
        linear-gradient(135deg, rgba(59, 130, 246, 0.95), rgba(37, 99, 235, 0.85));
    box-shadow:
        0 14px 30px rgba(15, 23, 42, 0.9),
        0 0 0 1px rgba(15, 23, 42, 0.9);
    opacity: 0.96;
    transform-origin: center;
    animation:
        featureFloat-b-fsayxhfecd 10s ease-in-out infinite,
        featurePulse-b-fsayxhfecd 8s linear infinite;
}

.cms-feature-tag:nth-child(odd)[b-fsayxhfecd] {
    animation-direction: alternate;
}

.cms-feature-tag:nth-child(even)[b-fsayxhfecd] {
    animation-direction: alternate-reverse;
}

/* Tooltip rico */
.cms-feature-tag[b-fsayxhfecd]::after {
    content: "ℹ " attr(data-desc);
    position: absolute;
    left: 50%;
    bottom: calc(100% + 8px);
    transform: translateX(-50%) translateY(4px);
    min-width: 260px;
    max-width: 360px;
    padding: 0.6rem 0.85rem;
    border-radius: 14px;
    background:
        radial-gradient(circle at 12% 0, #1e40af 0, transparent 55%),
        #020617;
    color: #eaf2ff;
    box-shadow:
        0 22px 55px rgba(15, 23, 42, 0.9),
        0 0 0 1px rgba(30, 64, 175, 0.8);
    opacity: 0;
    pointer-events: none;
    white-space: normal;
    text-transform: none;
    font-weight: 500;
    font-size: 0.86rem;
    line-height: 1.45;
    transition:
        opacity 160ms ease-out,
        transform 160ms ease-out,
        filter 160ms ease-out;
    z-index: 10;
}

.cms-feature-tag[b-fsayxhfecd]::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: calc(100% + 4px);
    transform: translateX(-50%) rotate(45deg);
    width: 10px;
    height: 10px;
    border-radius: 2px;
    background: radial-gradient(circle at 30% 0, #1e40af, #020617);
    opacity: 0;
    filter: blur(0.2px);
    transition:
        opacity 160ms ease-out,
        transform 160ms ease-out,
        filter 160ms ease-out;
    z-index: 10;
}

.cms-feature-tag:hover[b-fsayxhfecd]::after,
.cms-feature-tag:hover[b-fsayxhfecd]::before {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
    filter: brightness(1.05);
}

@keyframes featureFloat-b-fsayxhfecd {
    0% {
        transform: translate3d(0, 0, 0) scale(1) rotate(0deg);
        opacity: 0.9;
    }
    25% {
        transform: translate3d(6px, -3px, 0) scale(1.03) rotate(1deg);
        opacity: 1;
    }
    50% {
        transform: translate3d(-4px, -5px, 0) scale(1.06) rotate(-1deg);
        opacity: 0.95;
    }
    75% {
        transform: translate3d(3px, 0, 0) scale(1.02) rotate(0.5deg);
        opacity: 1;
    }
    100% {
        transform: translate3d(0, 0, 0) scale(1) rotate(0deg);
        opacity: 0.9;
    }
}

@keyframes featurePulse-b-fsayxhfecd {
    0% { filter: brightness(1) saturate(1); transform: scale(1); }
    20% { filter: brightness(1.08) saturate(1.06); transform: scale(1.04); }
    40% { filter: brightness(1) saturate(1); transform: scale(1); }
    60% { filter: brightness(1.08) saturate(1.06); transform: scale(1.04); }
    80% { filter: brightness(1) saturate(1); transform: scale(1); }
    100% { filter: brightness(1) saturate(1); transform: scale(1); }
}

/* Desfase para crear rotación secuencial de foco */
.cms-feature-tag:nth-child(1)[b-fsayxhfecd]  { animation-delay: 0s,    0s; }
.cms-feature-tag:nth-child(2)[b-fsayxhfecd]  { animation-delay: 0.2s,  0.4s; }
.cms-feature-tag:nth-child(3)[b-fsayxhfecd]  { animation-delay: 0.4s,  0.8s; }
.cms-feature-tag:nth-child(4)[b-fsayxhfecd]  { animation-delay: 0.6s,  1.2s; }
.cms-feature-tag:nth-child(5)[b-fsayxhfecd]  { animation-delay: 0.8s,  1.6s; }
.cms-feature-tag:nth-child(6)[b-fsayxhfecd]  { animation-delay: 1.0s,  2.0s; }
.cms-feature-tag:nth-child(7)[b-fsayxhfecd]  { animation-delay: 1.2s,  2.4s; }
.cms-feature-tag:nth-child(8)[b-fsayxhfecd]  { animation-delay: 1.4s,  2.8s; }
.cms-feature-tag:nth-child(9)[b-fsayxhfecd]  { animation-delay: 1.6s,  3.2s; }
.cms-feature-tag:nth-child(10)[b-fsayxhfecd] { animation-delay: 1.8s,  3.6s; }
.cms-feature-tag:nth-child(11)[b-fsayxhfecd] { animation-delay: 2.0s,  4.0s; }
.cms-feature-tag:nth-child(12)[b-fsayxhfecd] { animation-delay: 2.2s,  4.4s; }
.cms-feature-tag:nth-child(13)[b-fsayxhfecd] { animation-delay: 2.4s,  4.8s; }
.cms-feature-tag:nth-child(14)[b-fsayxhfecd] { animation-delay: 2.6s,  5.2s; }
.cms-feature-tag:nth-child(15)[b-fsayxhfecd] { animation-delay: 2.8s,  5.6s; }
.cms-feature-tag:nth-child(16)[b-fsayxhfecd] { animation-delay: 3.0s,  6.0s; }
.cms-feature-tag:nth-child(17)[b-fsayxhfecd] { animation-delay: 3.2s,  6.4s; }
.cms-feature-tag:nth-child(18)[b-fsayxhfecd] { animation-delay: 3.4s,  6.8s; }
.cms-feature-tag:nth-child(19)[b-fsayxhfecd] { animation-delay: 3.6s,  7.2s; }
.cms-feature-tag:nth-child(20)[b-fsayxhfecd] { animation-delay: 3.8s,  7.6s; }

.cms-component-card:hover[b-fsayxhfecd] {
    transform: translateY(-6px);
    box-shadow:
        0 28px 55px rgba(15, 23, 42, 0.95),
        0 0 0 1px rgba(37, 99, 235, 0.55) inset;
    border-color: rgba(59, 130, 246, 0.95);
    background: radial-gradient(circle at top left, rgba(59, 130, 246, 0.72), rgba(15, 23, 42, 0.95));
}

.cms-component-header[b-fsayxhfecd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    margin-bottom: 0.75rem;
}

.cms-component-header h3[b-fsayxhfecd] {
    font-size: 1.05rem;
    font-weight: 600;
    margin: 0;
    text-align: center;
}

.cms-component-icon[b-fsayxhfecd] {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at 30% 0, rgba(59, 130, 246, 0.95), rgba(15, 23, 42, 0.98));
    box-shadow:
        0 10px 24px rgba(37, 99, 235, 0.8),
        0 0 0 1px rgba(148, 163, 184, 0.4);
    color: #e5e7eb;
}

.cms-component-description[b-fsayxhfecd] {
    margin: 0;
    font-size: 0.9rem;
    color: #e5e7eb;
    text-align: center;
}

.cms-section--caqueta[b-fsayxhfecd]::before {
    background-image:
        linear-gradient(130deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.86)),
        radial-gradient(circle at top left, rgba(59, 130, 246, 0.4) 0, transparent 60%),
        radial-gradient(circle at bottom right, rgba(14, 165, 233, 0.32) 0, transparent 48%);
}

#preguntas-frecuentes.cms-section[b-fsayxhfecd]::before {
    background-image:
        linear-gradient(115deg, rgba(15, 23, 42, 0.9), rgba(203, 206, 212, 0.78)),
        url("/images/preguntasfrecuentes.jpg");
    background-position: right center;
    background-size: cover;
    opacity: 0.46;
    mix-blend-mode: soft-light;
}

.caqueta-experience-layout[b-fsayxhfecd] {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(260px, 1.05fr) minmax(320px, 1.35fr);
    gap: 2.25rem;
    align-items: flex-start;
}

.caqueta-map-panel[b-fsayxhfecd] {
    padding: 1.5rem 1.3rem;
    border-radius: 1.25rem;
    background: radial-gradient(circle at top left, rgba(59, 130, 246, 0.45), rgba(15, 23, 42, 0.95));
    border: 1px solid rgba(59, 130, 246, 0.65);
    box-shadow:
        0 20px 50px rgba(15, 23, 42, 0.95),
        0 0 0 1px rgba(15, 23, 42, 0.65) inset;
}

.caqueta-map-title[b-fsayxhfecd] {
    margin: 0 0 0.35rem 0;
    font-size: 1.05rem;
    font-weight: 600;
}

.caqueta-map-text[b-fsayxhfecd] {
    margin: 0 0 0.9rem 0;
    font-size: 0.9rem;
    color: #e5e7eb;
}

.caqueta-municipalities[b-fsayxhfecd] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem 1.25rem;
    font-size: 0.9rem;
}

.caqueta-municipalities li[b-fsayxhfecd]::before {
    content: "●";
    margin-right: 0.4rem;
    color: #38bdf8;
}

.caqueta-details-panel[b-fsayxhfecd] {
    padding: 1.2rem 0.4rem 0.4rem 0.4rem;
}

.caqueta-details-title[b-fsayxhfecd] {
    margin: 0 0 0.75rem 0;
    font-size: 1.05rem;
    font-weight: 600;
}

.caqueta-details-list[b-fsayxhfecd] {
    margin: 0;
    padding-left: 1.25rem;
    display: grid;
    gap: 0.65rem;
    font-size: 0.9rem;
    color: #e5e7eb;
}

.caqueta-details-list li[b-fsayxhfecd]::marker {
    color: #38bdf8;
    font-weight: 600;
}

.cms-contact-item[b-fsayxhfecd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 1.2rem 0.75rem 0.5rem 0.75rem;
    position: relative;
    transition:
        transform 220ms ease-out,
        box-shadow 220ms ease-out;
}

.cms-contact-icon-wrapper[b-fsayxhfecd] {
    position: relative;
    margin-bottom: 0.8rem;
}

.cms-contact-icon[b-fsayxhfecd] {
    font-size: 2rem;
    color: #38bdf8;
    transition:
        transform 220ms ease-out,
        filter 220ms ease-out,
        text-shadow 220ms ease-out,
        color 220ms ease-out;
    animation: cmsContactIdle-b-fsayxhfecd 9s ease-in-out infinite;
}

.cms-contact-text h3[b-fsayxhfecd] {
    margin: 0 0 0.3rem 0;
    font-size: 1rem;
    font-weight: 600;
    color: #38bdf8;
}

.cms-contact-text p[b-fsayxhfecd] {
    margin: 0;
    font-size: 0.9rem;
    color: #e5e7eb;
}

.cms-contact-icon-wrapper[b-fsayxhfecd]::before {
    content: "";
    position: absolute;
    inset: -0.4rem;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(56, 189, 248, 0.26), transparent 65%);
    opacity: 0;
    transform: scale(0.75);
    filter: blur(6px);
    transition:
        opacity 260ms ease-out,
        transform 260ms ease-out,
        filter 260ms ease-out;
}

.cms-contact-item:hover[b-fsayxhfecd] {
    transform: translateY(-4px);
    box-shadow: 0 22px 55px rgba(15, 23, 42, 0.85);
}

.cms-contact-item:hover .cms-contact-icon-wrapper[b-fsayxhfecd]::before {
    opacity: 1;
    transform: scale(1.12);
    filter: blur(12px);
}

.cms-contact-item:hover .cms-contact-icon[b-fsayxhfecd] {
    color: #7dd3fc;
    filter: drop-shadow(0 0 18px rgba(56, 189, 248, 0.95));
    text-shadow:
        0 0 12px rgba(56, 189, 248, 0.85),
        0 0 24px rgba(56, 189, 248, 0.65);
    animation:
        cmsContactExplode-b-fsayxhfecd 480ms ease-out,
        cmsContactIdle-b-fsayxhfecd 9s ease-in-out infinite 480ms;
}

@keyframes cmsContactIdle-b-fsayxhfecd {
    0%,
    100% {
        transform: translateY(0) scale(1);
        filter: none;
    }
    40% {
        transform: translateY(-2px) scale(1.04);
        filter: drop-shadow(0 0 6px rgba(56, 189, 248, 0.55));
    }
    70% {
        transform: translateY(0) scale(1.02);
        filter: drop-shadow(0 0 3px rgba(56, 189, 248, 0.35));
    }
}

@keyframes cmsContactExplode-b-fsayxhfecd {
    0% {
        transform: translateY(0) scale(1);
        filter: none;
        opacity: 1;
    }
    35% {
        transform: translateY(2px) scale(0.7) rotate(-6deg);
        filter: blur(4px);
        opacity: 0.35;
    }
    70% {
        transform: translateY(-4px) scale(1.3) rotate(1deg);
        filter: drop-shadow(0 0 18px rgba(56, 189, 248, 0.9));
        opacity: 1;
    }
    100% {
        transform: translateY(-2px) scale(1.18);
        filter: drop-shadow(0 0 10px rgba(56, 189, 248, 0.7));
        opacity: 1;
    }
}

.cms-section-cta-wrapper[b-fsayxhfecd] {
    position: relative;
    z-index: 1;
    margin-top: 2.5rem;
    display: flex;
    justify-content: center;
}

.cms-section-cta-button[b-fsayxhfecd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.85rem 2.8rem;
    border-radius: 999px;
    border: none;
    background: linear-gradient(90deg, #38bdf8, #6366f1);
    color: #f9fafb;
    font-weight: 600;
    font-size: 0.98rem;
    text-decoration: none;
    box-shadow: 0 18px 40px rgba(37, 99, 235, 0.65);
    cursor: pointer;
    transition:
        transform 180ms ease-out,
        box-shadow 180ms ease-out,
        filter 180ms ease-out;
}

.cms-section-cta-button:hover[b-fsayxhfecd] {
    transform: translateY(-2px);
    box-shadow: 0 24px 60px rgba(37, 99, 235, 0.9);
    filter: brightness(1.05);
}

.cms-section-cta-button:active[b-fsayxhfecd] {
    transform: translateY(0);
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.85);
}

/* Marca de agua y animaciones para la sección de Módulos */
#Landing_Modules.cms-section[b-fsayxhfecd]::before {
    background-image:
        linear-gradient(135deg, rgba(15, 23, 42, 0.82), rgba(15, 23, 42, 0.56)),
        url("/images/fondologin.jpeg");
    background-position: center;
    background-size: cover;
    opacity: 0.28;
    mix-blend-mode: soft-light;
}

#Landing_Modules .cms-section-components[b-fsayxhfecd] {
    grid-template-columns: repeat(4, minmax(220px, 1fr));
    gap: 1.6rem;
}

@media (max-width: 1024px) {
    #Landing_Modules .cms-section-components[b-fsayxhfecd] {
        grid-template-columns: minmax(0, 1fr);
        gap: 1.2rem;
    }
}

@media (max-width: 768px) {
    #Landing_Modules .cms-section-components[b-fsayxhfecd] {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.8rem;
    }

    #Landing_Modules .cms-component-card[b-fsayxhfecd] {
        margin-inline: auto;
    }
}

#Landing_Modules .cms-component-card[b-fsayxhfecd] {
    position: relative;
    background:
        radial-gradient(circle at top left, rgba(59, 130, 246, 0.36), rgba(15, 23, 42, 0.84)),
        linear-gradient(180deg, rgba(2, 6, 23, 0.25), rgba(2, 6, 23, 0.1));
    border: 1px solid rgba(51, 65, 85, 0.85);
    backdrop-filter: blur(6px);
    overflow: hidden;
    opacity: 0;
    transform: translateY(8px);
    animation: modFadeUp-b-fsayxhfecd 600ms ease-out forwards;
    text-align: left;
}

#Landing_Modules .cms-component-card[b-fsayxhfecd]::before {
    content: "";
    position: absolute;
    inset: -6%;
    /*background: url("/images/imagen-modulos.png") center/contain no-repeat;*/
    opacity: 0.08;
    filter: saturate(0.9) contrast(1.05);
    pointer-events: none;
    mix-blend-mode: soft-light;
}

#Landing_Modules .cms-component-card:hover[b-fsayxhfecd] {
    transform: translateY(-7px) scale(1.01);
    background:
        radial-gradient(circle at 18% 0, rgba(59, 130, 246, 0.48), rgba(15, 23, 42, 0.88)),
        linear-gradient(180deg, rgba(2, 6, 23, 0.35), rgba(2, 6, 23, 0.12));
    border-color: rgba(59, 130, 246, 0.95);
    box-shadow:
        0 28px 55px rgba(15, 23, 42, 0.95),
        0 0 0 1px rgba(37, 99, 235, 0.6) inset;
}

#Landing_Modules .cms-component-header[b-fsayxhfecd] {
    display: grid;
    grid-template-columns: 44px 1fr;
    align-items: center;
    gap: 0.8rem;
    margin-bottom: 0.4rem;
}

#Landing_Modules .cms-component-icon[b-fsayxhfecd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 999px;
    background: radial-gradient(circle at 30% 0, #38bdf8, #2563eb);
    color: white;
    box-shadow: 0 15px 35px rgba(59, 130, 246, 0.6);
}

#Landing_Modules .cms-component-header h3[b-fsayxhfecd] {
    margin: 0;
    font-size: 1.02rem;
    color: #eaf2ff;
}

#Landing_Modules .cms-component-description[b-fsayxhfecd] {
    color: #bfd5ea;
}

#Landing_Modules .cms-component-badge[b-fsayxhfecd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.55rem;
    padding: 0.2rem 0.7rem;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.9);
    box-shadow: 0 0 0 1px rgba(129, 140, 248, 0.6);
    color: #c7d2fe;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

#Landing_Modules .cms-component-card:nth-child(1)[b-fsayxhfecd] { animation-delay: .02s; }
#Landing_Modules .cms-component-card:nth-child(2)[b-fsayxhfecd] { animation-delay: .08s; }
#Landing_Modules .cms-component-card:nth-child(3)[b-fsayxhfecd] { animation-delay: .14s; }
#Landing_Modules .cms-component-card:nth-child(4)[b-fsayxhfecd] { animation-delay: .20s; }
#Landing_Modules .cms-component-card:nth-child(5)[b-fsayxhfecd] { animation-delay: .26s; }
#Landing_Modules .cms-component-card:nth-child(6)[b-fsayxhfecd] { animation-delay: .32s; }
#Landing_Modules .cms-component-card:nth-child(7)[b-fsayxhfecd] { animation-delay: .38s; }
#Landing_Modules .cms-component-card:nth-child(8)[b-fsayxhfecd] { animation-delay: .44s; }

@keyframes modFadeUp-b-fsayxhfecd {
    0% { opacity: 0; transform: translateY(10px) scale(0.98); filter: blur(1px); }
    60% { opacity: 1; transform: translateY(-1px) scale(1.01); filter: blur(0); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}

/* Colocar estados en la columna central */
.cms-loading[b-fsayxhfecd],
.cms-empty-state[b-fsayxhfecd] {
    grid-column: 2;
}

/* Estilos del hero de introducción movidos al componente compartido SurosHeroIntro */

.hero-suros[b-fsayxhfecd] {
    position: fixed;
    inset: 0;
    background: radial-gradient(ellipse at 30% 50%, #001a33 0%, #000714 45%, #000 80%);
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    z-index: 9999;
    opacity: 1;
    transition: opacity 700ms ease;
}

.hero-suros.hidden[b-fsayxhfecd] {
    opacity: 0;
    pointer-events: none;
}

.hero-stage[b-fsayxhfecd] {
    position: relative;
    width: min(1100px, 92vw);
    height: min(500px, 52vh);
}

.signal-svg[b-fsayxhfecd] {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    z-index: 1;
    filter: drop-shadow(0 0 6px #2ea8ff) drop-shadow(0 0 16px rgba(46, 168, 255, .35));
}

.signal-svg svg[b-fsayxhfecd] {
    width: 100%;
    height: 120px;
}

.text-and-check[b-fsayxhfecd] {
    position: absolute;
    left: 45%;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: min(24px, 3vw);
    z-index: 2;
}


@media (max-width: 768px) {
    .cms-hero-slide[b-fsayxhfecd] {
        width: 90%;
        opacity: 0.4;
        transition:
            opacity 380ms ease-out,
            transform 380ms ease-out;
        transform: translateY(6px);
        font-size: 0.9rem;
    }

    .cms-landing-container[b-fsayxhfecd] {
        padding: 5.2rem 2rem 4.2rem 1rem;
        width: 100vw;
        overflow-x: hidden;
        grid-template-columns: 1fr;
    }

    .cms-landing-title[b-fsayxhfecd] {
        grid-column: 1;
        max-width: 90%;
        margin: 0.4rem 0 1.6rem 0;
        padding-inline: 0.35rem;
    }

    .cms-landing-title-main[b-fsayxhfecd] {
        font-size: clamp(1.5rem, 4.8vw + 0.4rem, 1.9rem);
        line-height: 1.18;
        max-width: none;
        width: 100%;
        overflow-wrap: anywhere;
        word-break: normal;
        hyphens: auto;
    }

    .cursor[b-fsayxhfecd]{
        font-size: 0.9em;
        letter-spacing: 0.012em;
        white-space: normal;
        border-right: none;
        overflow: visible;
    }

    .cms-landing-hero-slider[b-fsayxhfecd] {
        padding-inline: 0.75rem;
        width: 90%;
    }

    .cms-hero-slide-body[b-fsayxhfecd] {
        font-size: 0.86rem;
        padding-right: 0.25rem;
    }

    .cms-hero-slide-body[b-fsayxhfecd] {
        display: -webkit-box;
        -webkit-line-clamp: 6;
        -webkit-box-orient: vertical;
        overflow: hidden;
        max-height: 9.8em;
    }

    .cms-hero-read-more[b-fsayxhfecd] {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        cursor: pointer;
    }

    .cms-component-description[b-fsayxhfecd] {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        max-height: 3.2em;
    }

    .cms-component-read-more[b-fsayxhfecd] {
        display: inline-flex;
        align-items: center;
        cursor: pointer;
    }

    .cms-landing-cta-whatsapp[b-fsayxhfecd] {
        width: 100%;
        justify-content: center;
        padding: 0.5rem 1rem;
        font-size: 0.9rem;
    }

    .cms-landing-cta-label[b-fsayxhfecd] {
        white-space: normal;
    }

    .cms-landing-highlight-row[b-fsayxhfecd] {
        flex-direction: column;
        align-items: flex-start;
        margin-top: 1rem;
        width: 90%;
        display: flex;
        align-items: center;
        gap: 1.5rem;
    }

    .cms-section-header[b-fsayxhfecd] {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        margin-bottom: 1.25rem;
    }

    .cms-section-icon[b-fsayxhfecd] {
        grid-row: auto;
        margin: 0 0 0.6rem 0;
    }

    .cms-section[b-fsayxhfecd] {
        grid-column: 1;
        margin: 1rem 0 1rem 0;
        width: 83%;
        padding: 2.1rem 0 2.2rem auto;
        left: 0;
    }

    .cms-section-header h2[b-fsayxhfecd] {
        font-size: 1.4rem;
    }

    .cms-section-header p[b-fsayxhfecd] {
        font-size: 0.94rem;
        max-width: none;
    }

    .cms-component-card[b-fsayxhfecd] {
        padding: 0.85rem 0.85rem 0.9rem 0.85rem;
    }

    .cms-component-header h3[b-fsayxhfecd] {
        font-size: 0.9rem;
    }

    .cms-component-description[b-fsayxhfecd],
    .caqueta-map-text[b-fsayxhfecd],
    .caqueta-municipalities[b-fsayxhfecd] {
        font-size: 0.86rem;
    }

    .suros-footer[b-fsayxhfecd] {
        padding-inline: 1.25rem;
    }

    .suros-footer-top[b-fsayxhfecd] {
        flex-direction: column;
    }

    .suros-footer-columns[b-fsayxhfecd] {
        grid-template-columns: 1fr;
    }

    .suros-footer-bottom[b-fsayxhfecd] {
        flex-direction: column;
        align-items: flex-start;
    }

    .cms-footer-wrapper[b-fsayxhfecd] {
        grid-column: 1;
    }
}

@media (max-width: 1280px) {
    .caqueta-experience-layout[b-fsayxhfecd] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 1024px) {
    .cms-section-components[b-fsayxhfecd] {
        grid-template-columns: minmax(0, 1fr);
    }

    .cms-section-components--contact[b-fsayxhfecd] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 768px) {
    .cms-section-components[b-fsayxhfecd] {
        grid-template-columns: minmax(0, 1fr);
        margin: 0 0.1rem 0 0.1rem;
    }
}

.cms-hero-modal-backdrop[b-fsayxhfecd] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
}

.cms-hero-modal[b-fsayxhfecd] {
    width: min(640px, 92vw);
    max-height: 80vh;
    overflow: auto;
    background: radial-gradient(ellipse at 30% 0, rgba(2,6,23,0.9), rgba(2,6,23,0.96));
    border: 1px solid rgba(56, 189, 248, 0.6);
    border-radius: 14px;
    box-shadow: 0 20px 60px rgba(15,23,42,0.9);
    padding: 1rem 1rem 0.75rem 1rem;
    color: #e5f3ff;
}

.cms-hero-modal-header[b-fsayxhfecd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.6rem;
}

.cms-hero-modal-title[b-fsayxhfecd] {
    margin: 0;
    font-size: 1.1rem;
}

.cms-hero-modal-close[b-fsayxhfecd] {
    background: transparent;
    color: #cbd5e1;
    border: none;
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
}

.cms-hero-modal-body[b-fsayxhfecd] {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #dbeafe;
    margin-bottom: 0.8rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.cms-hero-modal-banner[b-fsayxhfecd] {
    width: 100%;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, 0.45);
    background:
        radial-gradient(circle at 0 0, rgba(15, 23, 42, 0.9), transparent 55%),
        radial-gradient(circle at 100% 100%, rgba(15, 23, 42, 0.9), transparent 55%);
}

.cms-hero-modal-banner-image[b-fsayxhfecd] {
    display: block;
    width: 100%;
    height: 140px;
    object-fit: cover;
}

.cms-hero-modal-text[b-fsayxhfecd] {
    max-height: 40vh;
    overflow-y: auto;
}

.cms-hero-modal-footer[b-fsayxhfecd] {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.4rem;
}

.cms-hero-modal-cta[b-fsayxhfecd] {
    border: 1px solid rgba(56, 189, 248, 0.7);
    background: rgba(15, 23, 42, 0.9);
    color: #dbeafe;
    padding: 0.4rem 0.9rem;
    border-radius: 999px;
    font-size: 0.88rem;
}

.suros-cookie-backdrop[b-fsayxhfecd] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background:
        radial-gradient(circle at top, rgba(15, 23, 42, 0.85), rgba(15, 23, 42, 0.95)),
        rgba(15, 23, 42, 0.92);
    backdrop-filter: blur(10px);
    z-index: 12000;
}

.suros-cookie-panel[b-fsayxhfecd] {
    position: relative;
    width: min(480px, 90vw);
    padding: 1.3rem 1.4rem 1.1rem 1.4rem;
    border-radius: 1.1rem;
    background:
        radial-gradient(circle at 0 0, rgba(59, 130, 246, 0.55), transparent 60%),
        radial-gradient(circle at 100% 100%, rgba(147, 51, 234, 0.4), transparent 55%),
        rgba(15, 23, 42, 0.98);
    border: 1px solid rgba(59, 130, 246, 0.8);
    box-shadow:
        0 28px 80px rgba(15, 23, 42, 0.95),
        0 0 0 1px rgba(15, 23, 42, 0.9) inset;
    color: #e5f3ff;
    overflow: hidden;
    animation: surosCookieEnter-b-fsayxhfecd 520ms cubic-bezier(0.2, 0.9, 0.3, 1.1);
}

.suros-cookie-orbit[b-fsayxhfecd] {
    position: absolute;
    inset: -20%;
    background:
        radial-gradient(circle at 0 0, rgba(59, 130, 246, 0.25), transparent 55%),
        radial-gradient(circle at 100% 100%, rgba(147, 51, 234, 0.25), transparent 55%);
    opacity: 0.6;
    pointer-events: none;
    mix-blend-mode: screen;
    animation: surosCookieOrbit-b-fsayxhfecd 16s linear infinite;
}

.suros-cookie-icon[b-fsayxhfecd] {
    position: relative;
    width: 58px;
    height: 58px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.8rem;
    background: radial-gradient(circle at 30% 0, #38bdf8, #2563eb);
    box-shadow:
        0 18px 40px rgba(37, 99, 235, 0.9),
        0 0 0 1px rgba(191, 219, 254, 0.8);
    color: white;
    font-size: 1.4rem;
    animation: surosCookiePulse-b-fsayxhfecd 2.6s ease-in-out infinite;
}

.suros-cookie-title[b-fsayxhfecd] {
    position: relative;
    margin: 0 0 0.4rem 0;
    font-size: 1.1rem;
    font-weight: 600;
}

.suros-cookie-text[b-fsayxhfecd] {
    position: relative;
    margin: 0 0 0.7rem 0;
    font-size: 0.9rem;
    line-height: 1.6;
    color: #cbd5f5;
}

.suros-cookie-points[b-fsayxhfecd] {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.8rem;
}

.suros-cookie-points span[b-fsayxhfecd] {
    padding: 0.16rem 0.6rem;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, 0.6);
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #e5e7eb;
}

.suros-cookie-actions[b-fsayxhfecd] {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    justify-content: flex-end;
    margin-top: 0.3rem;
}

.suros-cookie-primary[b-fsayxhfecd] {
    position: relative;
    border-radius: 999px;
    padding: 0.45rem 1.1rem;
    border: none;
    background: radial-gradient(circle at 20% 0, #22c55e, #16a34a);
    color: #ecfeff;
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    box-shadow:
        0 14px 30px rgba(22, 163, 74, 0.55),
        0 0 0 1px rgba(15, 23, 42, 0.9);
    cursor: pointer;
    overflow: hidden;
    transition:
        transform 160ms ease-out,
        box-shadow 160ms ease-out,
        filter 160ms ease-out;
}

.suros-cookie-primary:hover[b-fsayxhfecd] {
    transform: translateY(-1px);
    box-shadow:
        0 18px 40px rgba(22, 163, 74, 0.8),
        0 0 0 1px rgba(34, 197, 94, 0.9);
    filter: brightness(1.05);
}

.suros-cookie-secondary[b-fsayxhfecd] {
    position: relative;
    border-radius: 999px;
    padding: 0.42rem 0.9rem;
    border: 1px solid rgba(34, 197, 94, 0.45);
    background: rgba(8, 13, 24, 0.95);
    color: #eafaf1;
    font-size: 0.82rem;
    text-decoration: none;
    cursor: pointer;
    overflow: hidden;
    transition:
        transform 160ms ease-out,
        box-shadow 160ms ease-out,
        filter 160ms ease-out,
        background 160ms ease-out;
}

.suros-cookie-primary:hover[b-fsayxhfecd],
.suros-cookie-secondary:hover[b-fsayxhfecd] {
    transform: translateY(-1px);
    filter: brightness(1.05);
}

.suros-cookie-secondary:hover[b-fsayxhfecd] {
    box-shadow:
        0 10px 26px rgba(22, 163, 74, 0.35),
        0 0 0 1px rgba(34, 197, 94, 0.7);
}

.suros-cookie-primary[b-fsayxhfecd]::before,
.suros-cookie-primary[b-fsayxhfecd]::after,
.suros-cookie-secondary[b-fsayxhfecd]::before,
.suros-cookie-secondary[b-fsayxhfecd]::after {
    content: "";
    position: absolute;
    inset: -40%;
    opacity: 0;
    transform: translate3d(0, 12%, 0);
    filter: blur(1px);
    pointer-events: none;
    mix-blend-mode: screen;
}

.suros-cookie-primary[b-fsayxhfecd]::before,
.suros-cookie-secondary[b-fsayxhfecd]::before {
    background-image:
        repeating-linear-gradient(
            90deg,
            rgba(34, 197, 94, 0.22) 0,
            rgba(34, 197, 94, 0.22) 4px,
            transparent 4px,
            transparent 8px
        ),
        repeating-linear-gradient(
            0deg,
            rgba(16, 185, 129, 0.2) 0,
            rgba(16, 185, 129, 0.2) 4px,
            transparent 4px,
            transparent 8px
        );
    background-size: 120% 120%;
}

.suros-cookie-primary[b-fsayxhfecd]::after,
.suros-cookie-secondary[b-fsayxhfecd]::after {
    inset: -12%;
    background-image:
        linear-gradient(90deg, rgba(22, 163, 74, 0.28) 10%, transparent 40%, rgba(22, 163, 74, 0.32) 70%, transparent 100%),
        repeating-linear-gradient(
            135deg,
            rgba(22, 163, 74, 0.26) 0,
            rgba(22, 163, 74, 0.26) 2px,
            transparent 2px,
            transparent 6px
        );
    background-size: 180% 180%;
    transform: translate3d(-80%, 0, 0);
}

.suros-cookie-primary:hover[b-fsayxhfecd]::before,
.suros-cookie-secondary:hover[b-fsayxhfecd]::before {
    opacity: 1;
    animation: suros-header-cta-grid 900ms ease-out forwards 80ms;
}

.suros-cookie-primary:hover[b-fsayxhfecd]::after,
.suros-cookie-secondary:hover[b-fsayxhfecd]::after {
    opacity: 1;
    animation: suros-header-cta-sweep 1100ms ease-out forwards 140ms;
}

.suros-privacy-backdrop[b-fsayxhfecd] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background:
        radial-gradient(circle at top, rgba(15, 23, 42, 0.85), rgba(15, 23, 42, 0.97)),
        rgba(15, 23, 42, 0.96);
    backdrop-filter: blur(14px);
    z-index: 13000;
}

.suros-privacy-backdrop[b-fsayxhfecd]::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url("/images/fondocuadriculasmini.png") center/cover no-repeat;
    opacity: 0.22;
    mix-blend-mode: soft-light;
    pointer-events: none;
    z-index: -1;
}

.suros-privacy-modal[b-fsayxhfecd] {
    width: min(960px, 96vw);
    height: min(640px, 90vh);
    border-radius: 1.2rem;
    background:
        radial-gradient(circle at 0 0, rgba(59, 130, 246, 0.4), transparent 55%),
        radial-gradient(circle at 100% 100%, rgba(56, 189, 248, 0.45), transparent 55%),
        linear-gradient(145deg, rgba(15, 23, 42, 0.98), rgba(15, 23, 42, 0.92)),
        url("/images/fondologin.jpeg");
    border: 1px solid rgba(59, 130, 246, 0.7);
    box-shadow:
        0 30px 80px rgba(15, 23, 42, 0.92),
        0 0 0 1px rgba(15, 23, 42, 0.95) inset;
    display: flex;
    flex-direction: column;
    color: #e5f3ff;
    overflow: hidden;
    animation: surosPrivacyEnter-b-fsayxhfecd 520ms cubic-bezier(0.2, 0.9, 0.3, 1.1);
}

.suros-privacy-header[b-fsayxhfecd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.8rem 1.1rem 0.6rem 1.2rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.35);
}

.suros-privacy-title[b-fsayxhfecd] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
}

.suros-privacy-close[b-fsayxhfecd] {
    border: none;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, 0.9);
    color: #cbd5f5;
    font-size: 1.2rem;
    cursor: pointer;
}

.suros-privacy-body[b-fsayxhfecd] {
    flex: 1;
    padding: 0.7rem 0.9rem 0.9rem 0.9rem;
    overflow-y: auto;
    overflow-x: hidden;
}

.suros-privacy-frame[b-fsayxhfecd] {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 0.75rem;
    background-color: white;
    box-shadow:
        0 0 0 1px rgba(15, 23, 42, 0.6),
        0 18px 40px rgba(15, 23, 42, 0.8);
}

@keyframes surosPrivacyEnter-b-fsayxhfecd {
    0% {
        opacity: 0;
        transform: translateY(22px) scale(0.96);
        filter: blur(4px);
    }
    60% {
        opacity: 1;
        transform: translateY(-2px) scale(1.02);
        filter: blur(0);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@media (max-width: 768px) {
    .suros-privacy-modal[b-fsayxhfecd] {
        width: 96vw;
        height: min(560px, 92vh);
        border-radius: 1rem;
    }

    .suros-privacy-header[b-fsayxhfecd] {
        padding-inline: 0.9rem;
    }

    .suros-privacy-body[b-fsayxhfecd] {
        padding-inline: 0.6rem;
    }
}

@media (min-width: 1025px) {
    .cms-hero-read-more[b-fsayxhfecd],
    .cms-component-read-more[b-fsayxhfecd] {
        display: inline-flex;
        align-items: center;
        cursor: pointer;
    }
}

@keyframes surosCookieEnter-b-fsayxhfecd {
    0% {
        opacity: 0;
        transform: translateY(18px) scale(0.96);
        filter: blur(3px);
    }
    60% {
        opacity: 1;
        transform: translateY(-2px) scale(1.02);
        filter: blur(0);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes surosCookiePulse-b-fsayxhfecd {
    0%, 100% {
        transform: translateY(0) scale(1);
        box-shadow:
            0 18px 40px rgba(37, 99, 235, 0.9),
            0 0 0 1px rgba(191, 219, 254, 0.8);
    }
    50% {
        transform: translateY(-2px) scale(1.05);
        box-shadow:
            0 24px 60px rgba(37, 99, 235, 1),
            0 0 0 1px rgba(191, 219, 254, 1);
    }
}

@keyframes surosCookieOrbit-b-fsayxhfecd {
    0% {
        transform: translate3d(-6%, -4%, 0) scale(1);
    }
    50% {
        transform: translate3d(6%, 4%, 0) scale(1.03);
    }
    100% {
        transform: translate3d(-6%, -4%, 0) scale(1);
    }
}

/* Cursor */
.cursor[b-fsayxhfecd],
.cursor-ii[b-fsayxhfecd],
.cursor-iii[b-fsayxhfecd]{
    position: relative;
    width: 100%;
    margin: 0;
    border-right: 1px solid rgba(255,255,255,.55);
    font-size: 0.9em;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    font-weight: 500;
    letter-spacing: 0.02em;
    text-shadow:
        0 3px 10px rgba(0, 0, 0, 0.6),
        0 0 16px rgba(59, 130, 246, 0.3);
}

/* Animation */
.typewriter-animation[b-fsayxhfecd] {
    animation:
        typewriter-b-fsayxhfecd 4.5s steps(55, end) 0.5s 1 normal both,
        blinkingCursor-b-fsayxhfecd 650ms steps(40, end) 0.5s 6 normal forwards;
}

@keyframes typewriter-b-fsayxhfecd {
    from { width: 0; }
    to { width: 100%; }
}

@keyframes blinkingCursor-b-fsayxhfecd {
    from { border-right-color: rgba(255,255,255,.55); }
    to { border-right-color: transparent; }
}

/* Animation II */
.typewriter-animation-ii[b-fsayxhfecd] {
    animation:
        typewriter-ii-b-fsayxhfecd 2.6s steps(52, end) 5.3s 1 normal both,
        blinkingCursor-ii-b-fsayxhfecd 650ms steps(35, end) 5.3s 5 normal forwards;
}

@keyframes typewriter-ii-b-fsayxhfecd {
    from { width: 0; }
    to { width: 87%; }
}

@keyframes blinkingCursor-ii-b-fsayxhfecd {
    from { border-right-color: rgba(255,255,255,.55); }
    to { border-right-color: transparent; }
}

/* Animation III */
.typewriter-animation-iii[b-fsayxhfecd] {
    animation:
        typewriter-iii-b-fsayxhfecd 2.2s steps(58, end) 8.2s 1 normal both,
        blinkingCursor-iii-b-fsayxhfecd 650ms steps(30, end) 8.2s 5 normal forwards;
}

@media (max-width: 768px) {
    .typewriter-animation[b-fsayxhfecd],
    .typewriter-animation-ii[b-fsayxhfecd],
    .typewriter-animation-iii[b-fsayxhfecd] {
        animation: none;
    }
}

@keyframes typewriter-iii-b-fsayxhfecd {
    from { width: 0; }
    to { width: 87%; }
}

@keyframes blinkingCursor-iii-b-fsayxhfecd {
    from { border-right-color: rgba(255,255,255,.55); }
    to { border-right-color: transparent; }
}

/* Overrides móviles tardíos para asegurar precedencia en cascada */
@media (max-width: 768px) {
    .cms-landing-title[b-fsayxhfecd] {
        gap: 0.6rem;
    }

    .cms-landing-title-main[b-fsayxhfecd] {
        font-size: clamp(1.35rem, 5.8vw + 0.1rem, 1.6rem);
        line-height: 1.2;
        max-width: 20ch;
        overflow-wrap: anywhere;
        word-break: normal;
        hyphens: auto;
    }

    .cms-landing-title-highlight[b-fsayxhfecd],
    .cms-landing-title-subtitle[b-fsayxhfecd] {
        max-width: none;
        overflow-wrap: anywhere;
        word-break: normal;
    }

    .cursor[b-fsayxhfecd],
    .cursor-ii[b-fsayxhfecd],
    .cursor-iii[b-fsayxhfecd] {
        font-size: 0.88em;
        letter-spacing: 0.01em;
        white-space: normal;
        border-right: none;
        overflow: visible;
    }

    .cms-landing-title h2[b-fsayxhfecd] {
        margin-left: 4% !important;
        font-size: 2rem;
        max-width: 90vh;
        margin-right: 7% !important;
        font-weight: 200;
        animation: lights-b-fsayxhfecd 5s 750ms linear infinite;
    }

}


@keyframes lights-b-fsayxhfecd {
  0% {
    color: hsl(230, 40%, 80%);
    text-shadow:
      0 0 1em hsla(320, 100%, 50%, 0.2),
      0 0 0.125em hsla(320, 100%, 60%, 0.3),
      -1em -0.125em 0.5em hsla(40, 100%, 60%, 0),
      1em 0.125em 0.5em hsla(200, 100%, 60%, 0);
  }
  
  30% { 
    color: hsl(230, 80%, 90%);
    text-shadow:
      0 0 1em hsla(320, 100%, 50%, 0.5),
      0 0 0.125em hsla(320, 100%, 60%, 0.5),
      -0.5em -0.125em 0.25em hsla(40, 100%, 60%, 0.2),
      0.5em 0.125em 0.25em hsla(200, 100%, 60%, 0.4);
  }
  
  40% { 
    color: hsl(230, 100%, 95%);
    text-shadow:
      0 0 1em hsla(320, 100%, 50%, 0.5),
      0 0 0.125em hsla(320, 100%, 90%, 0.5),
      -0.25em -0.125em 0.125em hsla(40, 100%, 60%, 0.2),
      0.25em 0.125em 0.125em hsla(200, 100%, 60%, 0.4);
  }
  
  70% {
    color: hsl(230, 80%, 90%);
    text-shadow:
      0 0 1em hsla(320, 100%, 50%, 0.5),
      0 0 0.125em hsla(320, 100%, 60%, 0.5),
      0.5em -0.125em 0.25em hsla(40, 100%, 60%, 0.2),
      -0.5em 0.125em 0.25em hsla(200, 100%, 60%, 0.4);
  }
  
  100% {
    color: hsl(230, 40%, 80%);
    text-shadow:
      0 0 1em hsla(320, 100%, 50%, 0.2),
      0 0 0.125em hsla(320, 100%, 60%, 0.3),
      1em -0.125em 0.5em hsla(40, 100%, 60%, 0),
      -1em 0.125em 0.5em hsla(200, 100%, 60%, 0);
  }
  
}
/* /Presentation/Components/Pages/Cms/PrivacyPolicy.razor.rz.scp.css */
:root[b-eikgrtzbyp] {
    --suros-privacy-primary-color: #38bdf8;
    --suros-privacy-secondary-color: #e5f2ff;
    --suros-privacy-text-color: #dbeafe;
    --suros-privacy-bg-color: transparent;
    --suros-privacy-card-bg: rgba(15, 23, 42, 0.86);
    --suros-privacy-link-color: #7dd3fc;
}

.suros-privacy-root[b-eikgrtzbyp] {
    font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    line-height: 1.6;
    color: var(--suros-privacy-text-color);
    background-color: var(--suros-privacy-bg-color);
    padding: 20px;
}

.suros-privacy-container[b-eikgrtzbyp] {
    max-width: 900px;
    margin: 40px auto;
    background:
        radial-gradient(circle at 0 0, rgba(56, 189, 248, 0.22), transparent 55%),
        radial-gradient(circle at 100% 100%, rgba(59, 130, 246, 0.24), transparent 55%),
        var(--suros-privacy-card-bg);
    padding: 60px;
    border-radius: 18px;
    box-shadow:
        0 24px 70px rgba(15, 23, 42, 0.95),
        0 0 0 1px rgba(30, 64, 175, 0.9);
}

.suros-privacy-root header[b-eikgrtzbyp] {
    text-align: center;
    margin-bottom: 50px;
    border-bottom: 1px solid #e9edef;
    padding-bottom: 30px;
}

.suros-privacy-root h1[b-eikgrtzbyp] {
    color: var(--suros-privacy-secondary-color);
    font-size: 2.5rem;
    margin-bottom: 10px;
    font-weight: 700;
}

.suros-privacy-root .last-updated[b-eikgrtzbyp] {
    color: #9ca3af;
    font-size: 0.9rem;
}

.suros-privacy-root section[b-eikgrtzbyp] {
    margin-bottom: 40px;
}

.suros-privacy-root h2[b-eikgrtzbyp] {
    color: var(--suros-privacy-secondary-color);
    font-size: 1.5rem;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
}

.suros-privacy-root h2[b-eikgrtzbyp]::before {
    content: '';
    display: block;
    width: 4px;
    height: 24px;
    background-color: var(--suros-privacy-primary-color);
    margin-right: 12px;
    border-radius: 2px;
}

.suros-privacy-root p[b-eikgrtzbyp] {
    margin-bottom: 15px;
    color: var(--suros-privacy-text-color);
}

.suros-privacy-root ul[b-eikgrtzbyp] {
    list-style-position: inside;
    margin-bottom: 15px;
    padding-left: 10px;
}

.suros-privacy-root li[b-eikgrtzbyp] {
    margin-bottom: 8px;
    color: var(--suros-privacy-text-color);
}

.suros-privacy-root a[b-eikgrtzbyp] {
    color: var(--suros-privacy-link-color);
    text-decoration: none;
    font-weight: 500;
}

.suros-privacy-root a:hover[b-eikgrtzbyp] {
    text-decoration: underline;
}

.suros-privacy-root footer[b-eikgrtzbyp] {
    text-align: center;
    margin-top: 60px;
    padding-top: 30px;
    border-top: 1px solid #e9edef;
    color: #8696a0;
    font-size: 0.9rem;
}

@media (max-width: 768px) {
    .suros-privacy-container[b-eikgrtzbyp] {
        padding: 30px;
        margin: 20px auto;
    }

        .suros-privacy-root h1[b-eikgrtzbyp] {
            font-size: 2rem;
        }
}
/* /Presentation/Components/Pages/Cms/SurosLandingFooter.razor.rz.scp.css */
.suros-footer[b-tbze5b9edo] {
    padding: 3rem 1.5rem 2.5rem 1.5rem;
    background: radial-gradient(circle at top, rgba(37, 99, 235, 0.2), transparent 55%), #020617;
    border-top: 1px solid rgba(15, 23, 42, 0.9);
    color: #e5e7eb;
}

.suros-footer-inner[b-tbze5b9edo] {
    max-width: 1120px;
    margin: 0 auto;
}

.suros-footer-top[b-tbze5b9edo] {
    display: flex;
    flex-wrap: wrap;
    gap: 2.5rem;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
}

.suros-footer-brand[b-tbze5b9edo] {
    max-width: 360px;
}

.suros-footer-logo[b-tbze5b9edo] {
    height: 52px;
    margin-bottom: 1rem;
}

.suros-footer-title[b-tbze5b9edo] {
    font-size: 1.45rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.suros-footer-description[b-tbze5b9edo] {
    margin: 0 0 1.25rem 0;
    color: #9ca3af;
    font-size: 0.95rem;
}

.suros-footer-social[b-tbze5b9edo] {
    display: flex;
    gap: 0.75rem;
}

.suros-footer-social-link[b-tbze5b9edo] {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, 0.9);
    color: #e5e7eb;
    border: 1px solid rgba(55, 65, 81, 0.9);
    transition:
        background 180ms ease-out,
        color 180ms ease-out,
        transform 180ms ease-out,
        box-shadow 180ms ease-out;
}

.suros-footer-social-link:hover[b-tbze5b9edo] {
    background: #2563eb;
    color: #f9fafb;
    transform: translateY(-2px);
    box-shadow: 0 18px 35px rgba(37, 99, 235, 0.55);
}

.suros-footer-columns[b-tbze5b9edo] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2rem;
    flex: 1;
}

.suros-footer-column--contact[b-tbze5b9edo] {
    position: relative;
}

.suros-footer-column-title--contact[b-tbze5b9edo] {
    position: relative;
    color: #f9fafb;
    letter-spacing: 0.03em;
    text-shadow:
        0 0 12px rgba(250, 204, 21, 0.3),
        0 0 28px rgba(250, 204, 21, 0.24);
    animation: suros-footer-contact-title-b-tbze5b9edo 3200ms ease-in-out infinite;
}

.suros-footer-column-title--contact[b-tbze5b9edo]::before {
    content: "";
    position: absolute;
    top: -6.3rem;
    left: 30%;
    width: 82px;
    height: 112px;
    transform: translateX(-50%) rotate(-220deg);
    background-image: url("/images/contact-hand.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    filter:
        drop-shadow(0 0 10px rgba(250, 204, 21, 0.7))
        drop-shadow(0 0 28px rgba(56, 189, 248, 0.7));
    opacity: 1;
    z-index: 3;
    pointer-events: none;
    animation: suros-footer-hand-tap-b-tbze5b9edo 3200ms ease-in-out infinite;
}

.suros-footer-column-title--contact[b-tbze5b9edo]::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -0.2rem;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, #facc15, #f97316, #facc15);
    opacity: 0.8;
    box-shadow:
        0 0 10px rgba(250, 204, 21, 0.5),
        0 0 20px rgba(56, 189, 248, 0.5);
}

.suros-footer-contact-arms[b-tbze5b9edo] {
    position: absolute;
    top: -2.4rem;
    left: 50%;
    width: 0;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
    z-index: 2;
}

.suros-footer-contact-arm[b-tbze5b9edo] {
    position: relative;
    display: block;
    width: 82px;
    height: 112px;
    background-image: url("/images/contact-hand.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    filter:
        drop-shadow(0 0 10px rgba(250, 204, 21, 0.55))
        drop-shadow(0 0 24px rgba(15, 23, 42, 0.9));
    opacity: 0.95;
    pointer-events: none;
}

.suros-footer-contact-arm--left[b-tbze5b9edo] {
    transform-origin: 50% 20%;
    transform: translate(-8px, -2px) rotate(220deg);
    animation: suros-footer-arm-tap-b-tbze5b9edo 3200ms ease-in-out infinite;
}

.suros-footer-contact-arm[b-tbze5b9edo],
.suros-footer-column-title--contact[b-tbze5b9edo] {
    will-change: transform, filter;
}

.suros-footer-column-title[b-tbze5b9edo] {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 0.85rem;
}

.suros-footer-list[b-tbze5b9edo] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 0.45rem;
    font-size: 0.93rem;
}

.suros-footer-link[b-tbze5b9edo] {
    color: #cbd5f5;
    text-decoration: none;
    transition: color 160ms ease-out;
}

.suros-footer-link:hover[b-tbze5b9edo] {
    color: #60a5fa;
}

.suros-footer-icon[b-tbze5b9edo] {
    margin-right: 0.5rem;
    color: #60a5fa;
}

.suros-footer-cta[b-tbze5b9edo] {
    margin-top: 1.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.6rem 1.4rem;
    border-radius: 999px;
    border: none;
    background: linear-gradient(135deg, #22c55e, #16a34a);
    color: #f9fafb;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 18px 35px rgba(22, 163, 74, 0.4);
    position: relative;
    overflow: hidden;
    transition:
        transform 160ms ease-out,
        box-shadow 160ms ease-out,
        filter 160ms ease-out;
}

.suros-footer-cta:hover[b-tbze5b9edo] {
    transform: translateY(-2px);
    filter: brightness(1.05);
    box-shadow: 0 22px 45px rgba(22, 163, 74, 0.6);
}

.suros-footer-cta--whatsapp[b-tbze5b9edo] {
    background: linear-gradient(135deg, #25D366, #1ebe57);
    box-shadow: 0 18px 35px rgba(37, 211, 102, 0.35);
}

.suros-footer-cta--whatsapp:hover[b-tbze5b9edo] {
    box-shadow: 0 22px 45px rgba(37, 211, 102, 0.55);
}

.suros-wa-icon[b-tbze5b9edo] {
    width: 18px;
    height: 18px;
    margin-right: 0.5rem;
    border-radius: 999px;
    display: inline-block;
    object-fit: cover;
}

.suros-footer-cta--whatsapp[b-tbze5b9edo]::before,
.suros-footer-cta--whatsapp[b-tbze5b9edo]::after {
    content: "";
    position: absolute;
    inset: -40%;
    opacity: 0;
    transform: translate3d(0, 12%, 0);
    filter: blur(1px);
    pointer-events: none;
    mix-blend-mode: screen;
}

.suros-footer-cta--whatsapp[b-tbze5b9edo]::before {
    background-image:
        repeating-linear-gradient(
            90deg,
            rgba(37, 211, 102, 0.26) 0,
            rgba(37, 211, 102, 0.26) 4px,
            transparent 4px,
            transparent 8px
        ),
        repeating-linear-gradient(
            0deg,
            rgba(34, 197, 94, 0.24) 0,
            rgba(34, 197, 94, 0.24) 4px,
            transparent 4px,
            transparent 8px
        );
    background-size: 120% 120%;
}

.suros-footer-cta--whatsapp[b-tbze5b9edo]::after {
    inset: -12%;
    background-image:
        linear-gradient(90deg, rgba(37, 211, 102, 0.32) 10%, transparent 40%, rgba(37, 211, 102, 0.36) 70%, transparent 100%),
        repeating-linear-gradient(
            135deg,
            rgba(37, 211, 102, 0.3) 0,
            rgba(37, 211, 102, 0.3) 2px,
            transparent 2px,
            transparent 6px
        );
    background-size: 180% 180%;
    transform: translate3d(-80%, 0, 0);
}

.suros-footer-cta--whatsapp:hover[b-tbze5b9edo]::before {
    opacity: 1;
    animation: suros-footer-wa-grid-b-tbze5b9edo 900ms ease-out forwards 80ms;
}

.suros-footer-cta--whatsapp:hover[b-tbze5b9edo]::after {
    opacity: 1;
    animation: suros-footer-wa-sweep-b-tbze5b9edo 1100ms ease-out forwards 140ms;
}

@keyframes suros-footer-wa-grid-b-tbze5b9edo {
    0% {
        opacity: 0;
        transform: translate3d(0, 20%, 0) scale(0.96);
        filter: blur(3px);
    }
    40% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1.02);
        filter: blur(0);
    }
    100% {
        opacity: 0.4;
        transform: translate3d(0, -10%, 0) scale(1.1);
        filter: blur(3px);
    }
}

@keyframes suros-footer-wa-sweep-b-tbze5b9edo {
    0% {
        opacity: 0;
        transform: translate3d(-90%, 0, 0);
    }
    40% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: translate3d(110%, 0, 0);
    }
}

@keyframes suros-footer-arm-tap-b-tbze5b9edo {
    0%,
    100% {
        transform: translate(-8px, -2px) rotate(220deg);
    }
    40% {
        transform: translate(-8px, 2px) rotate(220deg);
    }
    46% {
        transform: translate(-8px, 4px) rotate(220deg);
    }
    52% {
        transform: translate(-8px, 0) rotate(220deg);
    }
}

@keyframes suros-footer-hand-tap-b-tbze5b9edo {
    0%,
    100% {
        transform: translateX(-50%) rotate(220deg);
        filter:
            drop-shadow(0 0 10px rgba(250, 204, 21, 0.7))
            drop-shadow(0 0 28px rgba(56, 189, 248, 0.7));
        opacity: 1;
    }
    40% {
        transform: translateX(-50%) translateY(4px) rotate(220deg);
        filter:
            drop-shadow(0 0 16px rgba(250, 204, 21, 0.9))
            drop-shadow(0 0 36px rgba(56, 189, 248, 0.9));
        opacity: 1;
    }
    46% {
        transform: translateX(-50%) translateY(6px) rotate(220deg);
        filter:
            drop-shadow(0 0 22px rgba(250, 204, 21, 1))
            drop-shadow(0 0 44px rgba(56, 189, 248, 1));
        opacity: 1;
    }
    52% {
        transform: translateX(-50%) translateY(2px) rotate(220deg);
        filter:
            drop-shadow(0 0 14px rgba(250, 204, 21, 0.8))
            drop-shadow(0 0 32px rgba(56, 189, 248, 0.85));
        opacity: 1;
    }
}

@keyframes suros-footer-contact-title-b-tbze5b9edo {
    0%,
    100% {
        text-shadow:
            0 0 12px rgba(250, 204, 21, 0.28),
            0 0 26px rgba(56, 189, 248, 0.32);
        transform: translateY(0);
    }
    45% {
        text-shadow:
            0 0 18px rgba(250, 204, 21, 0.55),
            0 0 36px rgba(56, 189, 248, 0.46);
        transform: translateY(-1px);
    }
}

.suros-footer-badges[b-tbze5b9edo] {
    position: relative;
    overflow: hidden;
    margin-bottom: 1.5rem;
}

.suros-footer-badges-track[b-tbze5b9edo] {
    display: inline-flex;
    gap: 0.75rem;
    white-space: nowrap;
    will-change: transform;
    animation: footerBadgesMarquee-b-tbze5b9edo 26s linear infinite;
}

.suros-footer-badge[b-tbze5b9edo] {
    padding: 0.45rem 0.9rem;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.9);
    border: 1px solid rgba(55, 65, 81, 0.9);
    font-size: 0.8rem;
    color: #cbd5f5;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
}

.suros-footer-badges:hover .suros-footer-badges-track[b-tbze5b9edo] {
    animation-play-state: paused;
}

@keyframes footerBadgesMarquee-b-tbze5b9edo {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

.suros-footer-badge[b-tbze5b9edo]::before,
.suros-footer-badge[b-tbze5b9edo]::after {
    content: "";
    position: absolute;
    inset: -40%;
    opacity: 0;
    transform: translate3d(0, 16%, 0);
    filter: blur(1px);
    pointer-events: none;
    mix-blend-mode: screen;
}

.suros-footer-badge[b-tbze5b9edo]::before {
    background-image:
        repeating-linear-gradient(
            90deg,
            rgba(59, 130, 246, 0.28) 0,
            rgba(59, 130, 246, 0.28) 3px,
            transparent 3px,
            transparent 7px
        ),
        repeating-linear-gradient(
            0deg,
            rgba(37, 99, 235, 0.24) 0,
            rgba(37, 99, 235, 0.24) 3px,
            transparent 3px,
            transparent 7px
        );
    background-size: 120% 120%;
}

.suros-footer-badge[b-tbze5b9edo]::after {
    inset: -12%;
    background-image:
        linear-gradient(90deg, rgba(59, 130, 246, 0.32) 10%, transparent 40%, rgba(37, 99, 235, 0.34) 70%, transparent 100%),
        repeating-linear-gradient(
            135deg,
            rgba(56, 189, 248, 0.3) 0,
            rgba(56, 189, 248, 0.3) 2px,
            transparent 2px,
            transparent 6px
        );
    background-size: 180% 180%;
    transform: translate3d(-80%, 0, 0);
}

.suros-footer-badge:hover[b-tbze5b9edo]::before {
    opacity: 1;
    animation: footer-badge-grid-b-tbze5b9edo 900ms ease-out forwards 80ms;
}

.suros-footer-badge:hover[b-tbze5b9edo]::after {
    opacity: 1;
    animation: footer-badge-sweep-b-tbze5b9edo 1100ms ease-out forwards 140ms;
}

@keyframes footer-badge-grid-b-tbze5b9edo {
    0% {
        opacity: 0;
        transform: translate3d(0, 20%, 0) scale(0.96);
        filter: blur(3px);
    }
    40% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1.02);
        filter: blur(0);
    }
    100% {
        opacity: 0.38;
        transform: translate3d(0, -8%, 0) scale(1.06);
        filter: blur(3px);
    }
}

@keyframes footer-badge-sweep-b-tbze5b9edo {
    0% {
        opacity: 0;
        transform: translate3d(-90%, 0, 0);
    }
    40% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: translate3d(110%, 0, 0);
    }
}

.suros-footer-bottom[b-tbze5b9edo] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: space-between;
    align-items: center;
    padding-top: 1rem;
    border-top: 1px solid rgba(30, 64, 175, 0.5);
    font-size: 0.8rem;
    color: #9ca3af;
}

@media (max-width: 768px) {
    .suros-footer[b-tbze5b9edo] {
        padding-inline: 1.25rem;
        width: 90% !important;
        margin-right: 10%;
    }

    .suros-footer-top[b-tbze5b9edo] {
        flex-direction: column;
    }

    .suros-footer-inner[b-tbze5b9edo] {
        margin: 0 auto;
        margin-right: 10%;
    }

    .suros-footer-columns[b-tbze5b9edo] {
        grid-template-columns: 1fr;
    }

    .suros-footer-bottom[b-tbze5b9edo] {
        flex-direction: column;
        align-items: flex-start;
        width: 90%;
        overflow-wrap: anywhere;
        word-break: normal;
        margin-right: 10%;
    }

    .suros-footer-contact-arms[b-tbze5b9edo] {
        display: none;
    }

    /* Contención estricta del carrusel de etiquetas en móvil */
    .suros-footer-badges[b-tbze5b9edo] {
        width: 100%;
        max-width: 100vw;
        overflow-x: hidden;
        padding-inline: 0.25rem;
    }

    .suros-footer-badges-track[b-tbze5b9edo] {
        animation-duration: 22s;
        gap: 0.5rem;
    }

    .suros-footer-badge[b-tbze5b9edo] {
        font-size: 0.78rem;
        padding: 0.4rem 0.8rem;
        max-width: none;
    }
}
/* /Presentation/Components/Pages/ConfiguracionApp/Components/TabConfigAcademico.razor.rz.scp.css */
.aca-config-container[b-bb54ramhbk] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow-y: auto;
    padding: 4px 2px;
}

.aca-config-header[b-bb54ramhbk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 14px;
    padding: 10px 12px;
    background: #fff;
    border: 1px solid #e2e4e9;
    border-radius: 8px;
}

/* Forzar color oscuro en los títulos del header (evita que estilos heredados los pinten blancos) */
.aca-config-header h6[b-bb54ramhbk],
.aca-config-header .fw-semibold[b-bb54ramhbk] {
    color: #1a1d23 !important;
}

.aca-config-header small[b-bb54ramhbk] {
    color: #6b7280 !important;
}

.aca-config-header i[b-bb54ramhbk] {
    font-size: 1rem;
}

.aca-config-header small[b-bb54ramhbk] {
    font-size: 0.74rem;
}

/* ── Cards con switches ── */

.aca-config-card[b-bb54ramhbk] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 12px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    height: 100%;
    transition: border-color 0.15s, box-shadow 0.15s, background 0.15s;
    min-height: 72px;
}

.aca-config-card:hover[b-bb54ramhbk] {
    border-color: #bfdbfe;
    box-shadow: 0 1px 6px rgba(26, 115, 232, 0.08);
}

.aca-config-card.on[b-bb54ramhbk] {
    border-color: #a7f3d0;
    background: #f0fdf4;
}

.aca-config-card-icon[b-bb54ramhbk] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: #f3f4f6;
    color: #6b7280;
    font-size: 0.9rem;
    flex-shrink: 0;
}

.aca-config-card.on .aca-config-card-icon[b-bb54ramhbk] {
    background: #dcfce7;
    color: #15803d;
}

.aca-config-card-body[b-bb54ramhbk] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.aca-config-card-title[b-bb54ramhbk] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #374151;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.aca-config-card-desc[b-bb54ramhbk] {
    font-size: 0.68rem;
    color: #9ca3af;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.aca-config-switch[b-bb54ramhbk] {
    flex-shrink: 0;
    /* Margen izquierdo para que el texto (título/descripción) no quede
       pegado ni se esconda detrás del switch cuando la descripción es larga */
    margin: 0 0 0 10px !important;
}

.aca-config-switch .form-check-input:checked[b-bb54ramhbk] {
    background-color: #16a34a;
    border-color: #16a34a;
}
/* /Presentation/Components/Pages/ConfiguracionApp/Components/TabConfigRda.razor.rz.scp.css */
.rda-config-container[b-vsljaz9qae] {
    display: flex;
    flex-direction: column;
}

/* ── Sección de configuración (cards con switches) ── */

.rda-config-section[b-vsljaz9qae] {
    flex-shrink: 0;
    background: #fff;
    border: 1px solid #e2e4e9;
    border-radius: 8px;
    margin-bottom: 12px;
    padding: 12px 14px;
    overflow-y: auto;
    transition: padding 0.2s ease;
}

/* Estado colapsado: solo se muestra el header, el split gana todo el alto */
.rda-config-section.collapsed[b-vsljaz9qae] {
    padding: 4px 14px;
    margin-bottom: 8px;
    overflow: hidden;
}

.rda-config-header[b-vsljaz9qae] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e5e7eb;
}

.rda-config-section.collapsed .rda-config-header[b-vsljaz9qae] {
    margin-bottom: 0;
    padding-bottom: 4px;
    border-bottom: none;
}

/* Botón colapsar/expandir la sección de configuración */

.rda-config-toggle[b-vsljaz9qae] {
    background: #f3f4f6;
    border: 1px solid #e2e4e9;
    color: #6b7280;
    width: 28px;
    height: 28px;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 0.72rem;
    flex-shrink: 0;
    transition: all 0.15s ease;
    line-height: 1;
    padding: 0;
}

.rda-config-toggle:hover[b-vsljaz9qae] {
    background: #e8f0fe;
    border-color: #bfdbfe;
    color: #1a73e8;
}

.rda-config-toggle i[b-vsljaz9qae] {
    font-size: 0.72rem;
}

/* Forzar color oscuro en los títulos del header (evita que estilos heredados los pinten blancos) */
.rda-config-header h6[b-vsljaz9qae],
.rda-config-header .fw-semibold[b-vsljaz9qae] {
    color: #1a1d23 !important;
}

.rda-config-header small[b-vsljaz9qae] {
    color: #6b7280 !important;
}

.rda-config-card[b-vsljaz9qae] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    height: 100%;
    transition: border-color 0.15s, box-shadow 0.15s, background 0.15s;
    min-height: 62px;
}

.rda-config-card:hover[b-vsljaz9qae] {
    border-color: #bfdbfe;
    box-shadow: 0 1px 6px rgba(26, 115, 232, 0.08);
}

.rda-config-card.on[b-vsljaz9qae] {
    border-color: #a7f3d0;
    background: #f0fdf4;
}

.rda-config-card-icon[b-vsljaz9qae] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #f3f4f6;
    color: #6b7280;
    font-size: 0.85rem;
    flex-shrink: 0;
}

.rda-config-card.on .rda-config-card-icon[b-vsljaz9qae] {
    background: #dcfce7;
    color: #15803d;
}

.rda-config-card-body[b-vsljaz9qae] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.rda-config-card-title[b-vsljaz9qae] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #374151;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rda-config-card-desc[b-vsljaz9qae] {
    font-size: 0.66rem;
    color: #9ca3af;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.rda-config-switch[b-vsljaz9qae] {
    flex-shrink: 0;
    /* Margen izquierdo para que el texto (título/descripción) no quede
       pegado ni se esconda detrás del switch cuando la descripción es larga */
    margin: 0 0 0 10px !important;
}

.rda-config-switch .form-check-input:checked[b-vsljaz9qae] {
    background-color: #16a34a;
    border-color: #16a34a;
}

/* ── Grupos visuales de configuración ── */

.rda-config-group[b-vsljaz9qae] {
    margin-bottom: 12px;
}

.rda-config-group:last-child[b-vsljaz9qae] {
    margin-bottom: 0;
}

.rda-config-group-header[b-vsljaz9qae] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    margin-bottom: 8px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-left: 4px solid #1a73e8;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 600;
    color: #374151;
}

.rda-config-group-header i[b-vsljaz9qae] {
    color: #1a73e8;
    font-size: 0.85rem;
}

.rda-config-group-header small[b-vsljaz9qae] {
    font-weight: 400;
    font-size: 0.68rem;
    color: #9ca3af;
    margin-left: 4px;
    flex: 1;
}

.rda-config-group-header.antecedentes[b-vsljaz9qae] {
    border-left-color: #16a34a;
}

.rda-config-group-header.antecedentes i[b-vsljaz9qae] {
    color: #16a34a;
}

/* ── Aviso modo no operativo ── */

.rda-config-modeoff[b-vsljaz9qae] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 12px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
    font-size: 0.78rem;
    border-radius: 6px;
    line-height: 1.5;
}

.rda-config-modeoff i[b-vsljaz9qae] {
    color: #dc2626;
    font-size: 0.9rem;
    margin-top: 1px;
    flex-shrink: 0;
}

/* ── Card maestra (CONENVIORDAALMINISTERIO) ── */

.rda-config-card.maestro[b-vsljaz9qae] {
    border-color: #93c5fd;
    background: linear-gradient(180deg, #eff6ff 0%, #ffffff 60%);
    box-shadow: 0 0 0 1px rgba(26, 115, 232, 0.15);
}

.rda-config-card.maestro .rda-config-card-icon[b-vsljaz9qae] {
    background: #dbeafe;
    color: #1a73e8;
}

.rda-config-card.maestro.on .rda-config-card-icon[b-vsljaz9qae] {
    background: #dcfce7;
    color: #15803d;
}

/* ── Card deshabilitada (maestro apagado) ── */

.rda-config-card.disabled-card[b-vsljaz9qae] {
    opacity: 0.5;
    background: #f9fafb;
    filter: grayscale(0.4);
}

.rda-config-card.disabled-card .rda-config-switch[b-vsljaz9qae] {
    cursor: not-allowed;
}

.rda-split-body[b-vsljaz9qae] {
    display: flex;
    background: #f8f9fa;
    border: 1px solid #e2e4e9;
    border-radius: 8px;
}

/* ── Panel izquierdo: Prestadores ── */

.rda-role-panel[b-vsljaz9qae] {
    width: 480px;
    min-width: 440px;
    max-width: 520px;
    border-right: 1px solid #e2e4e9;
    display: flex;
    flex-direction: column;
    background: #fff;
}

.rda-role-header[b-vsljaz9qae] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    font-size: 0.82rem;
    font-weight: 600;
    color: #374151;
    border-bottom: 1px solid #e2e4e9;
    background: #f9fafb;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    flex-shrink: 0;
}

.rda-role-header i[b-vsljaz9qae] {
    color: #1a73e8;
    font-size: 0.82rem;
}

.rda-search-wrapper[b-vsljaz9qae] {
    position: relative;
    display: flex;
    align-items: center;
    padding: 5px 10px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    flex-shrink: 0;
}

.rda-search-icon[b-vsljaz9qae] {
    position: absolute;
    left: 13px;
    font-size: 0.65rem;
    color: #9ca3af;
    pointer-events: none;
}

.rda-search-input[b-vsljaz9qae] {
    width: 100%;
    background: #f3f4f6;
    border: 1px solid transparent;
    color: #374151;
    padding: 4px 22px 4px 22px;
    font-size: 0.73rem;
    border-radius: 4px;
    outline: none;
    transition: border-color 0.15s;
}

.rda-search-input:focus[b-vsljaz9qae] {
    border-color: #1a73e8;
    box-shadow: 0 0 0 2px rgba(26, 115, 232, 0.15);
    background: #fff;
}

.rda-search-input[b-vsljaz9qae]::placeholder {
    color: #9ca3af;
    opacity: 0.6;
    font-size: 0.7rem;
}

.rda-search-clear[b-vsljaz9qae] {
    position: absolute;
    right: 12px;
    background: none;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    padding: 2px 4px;
    font-size: 0.6rem;
    opacity: 0.5;
    transition: opacity 0.15s;
    line-height: 1;
}

.rda-search-clear:hover[b-vsljaz9qae] {
    opacity: 1;
    color: #dc2626;
}

.rda-search-empty[b-vsljaz9qae] {
    text-align: center;
    padding: 16px 10px;
    color: #9ca3af;
    font-size: 0.75rem;
    font-style: italic;
}

.rda-role-list[b-vsljaz9qae] {
    scrollbar-width: thin;
}

.rda-role-list[b-vsljaz9qae]::-webkit-scrollbar {
    width: 4px;
}

.rda-role-list[b-vsljaz9qae]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 2px;
}

.rda-role-item[b-vsljaz9qae] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    font-size: 0.85rem;
    cursor: pointer;
    border-bottom: 1px solid #f3f4f6;
    transition: background 0.12s;
    color: #374151;
}

.rda-role-item:hover[b-vsljaz9qae] {
    background: #f3f4f6;
}

.rda-role-item.active[b-vsljaz9qae] {
    background: #e8f0fe;
    color: #1a73e8;
    font-weight: 500;
}

.rda-role-item i[b-vsljaz9qae] {
    width: 16px;
    text-align: center;
    font-size: 0.82rem;
    color: #9ca3af;
    flex-shrink: 0;
}

.rda-role-item.active i[b-vsljaz9qae] {
    color: #1a73e8;
}

.rda-role-name[b-vsljaz9qae] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rda-role-badge[b-vsljaz9qae] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 6px;
    border-radius: 50%;
    background: #e8f0fe;
    color: #1a73e8;
    font-size: 0.6rem;
    font-weight: 600;
    line-height: 1;
    flex-shrink: 0;
}

.rda-role-item.active .rda-role-badge[b-vsljaz9qae] {
    background: #d2e3fc;
    color: #1557b0;
}

/* ── Badge de credencial configurada ── */

.rda-role-badge-warn[b-vsljaz9qae] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 6px;
    border-radius: 50%;
    background: #dcfce7;
    color: #15803d;
    font-size: 0.6rem;
    font-weight: 600;
    line-height: 1;
    flex-shrink: 0;
}

.rda-role-item.active .rda-role-badge-warn[b-vsljaz9qae] {
    background: #bbf7d0;
    color: #166534;
}

/* ── Badge de estado inactivo ── */

.rda-state-badge[b-vsljaz9qae] {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 10px;
    background: #f3f4f6;
    color: #6b7280;
    font-size: 0.6rem;
    font-weight: 500;
    flex-shrink: 0;
    white-space: nowrap;
}

.rda-role-item.inactive .rda-role-name[b-vsljaz9qae] {
    font-style: italic;
    color: #9ca3af;
}

.rda-role-item.inactive i[b-vsljaz9qae] {
    color: #d1d5db;
}

.rda-role-item.inactive.active[b-vsljaz9qae] {
    background: #e8f0fe;
}

.rda-role-item.inactive.active i[b-vsljaz9qae] {
    color: #1a73e8;
}

/* ── Nota de creación (prestador sin credenciales) ── */

.rda-create-note[b-vsljaz9qae] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 12px;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    color: #1e40af;
    font-size: 0.78rem;
    border-radius: 6px;
    line-height: 1.5;
}

.rda-create-note i[b-vsljaz9qae] {
    color: #2563eb;
    font-size: 0.9rem;
    margin-top: 1px;
    flex-shrink: 0;
}

.rda-role-footer[b-vsljaz9qae] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    font-size: 0.7rem;
    color: #9ca3af;
    border-top: 1px solid #e2e4e9;
    background: #f9fafb;
    flex-shrink: 0;
}

.rda-role-footer i[b-vsljaz9qae] {
    font-size: 0.7rem;
}

/* ── Toggle activar/desactivar prestador ── */

.rda-role-toggle[b-vsljaz9qae] {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.8rem;
    color: #6b7280;
    cursor: pointer;
    opacity: 0.25;
    transition: all 0.15s;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.rda-role-item:hover .rda-role-toggle[b-vsljaz9qae] {
    opacity: 0.6;
}

.rda-role-toggle:hover[b-vsljaz9qae] {
    opacity: 1 !important;
    color: #1a73e8;
}

.rda-role-toggle.toggle-on[b-vsljaz9qae] {
    opacity: 1;
    color: #16a34a;
}

.rda-role-toggle.toggle-off:hover[b-vsljaz9qae] {
    color: #dc2626;
}

/* ── Panel derecho: Formulario de credenciales ── */

.rda-form-panel[b-vsljaz9qae] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: #fff;
}

.rda-form-empty[b-vsljaz9qae] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 32px;
    color: #9ca3af;
    text-align: center;
}

.rda-form-empty i[b-vsljaz9qae] {
    font-size: 2.6rem;
    color: #d1d5db;
}

.rda-form-empty p[b-vsljaz9qae] {
    margin: 0;
    font-size: 0.85rem;
    color: #6b7280;
    max-width: 340px;
    line-height: 1.5;
}

.rda-form-header[b-vsljaz9qae] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    border-bottom: 1px solid #e2e4e9;
    background: #f9fafb;
    flex-shrink: 0;
}

.rda-form-header-icon[b-vsljaz9qae] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: #dbeafe;
    color: #2563eb;
    font-size: 0.95rem;
    flex-shrink: 0;
}

.rda-form-header-title[b-vsljaz9qae] {
    min-width: 0;
}

.rda-form-header-title h6[b-vsljaz9qae] {
    margin: 0;
    font-size: 0.88rem;
    font-weight: 600;
    color: #1f2937;
    line-height: 1.3;
}

/* Nombre del prestador en bloque con ellipsis (el label descriptivo queda arriba) */
.rda-form-header-title h6 .d-block[b-vsljaz9qae] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rda-form-header-title h6 .text-muted[b-vsljaz9qae] {
    display: block;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.rda-form-header-title small[b-vsljaz9qae] {
    font-size: 0.72rem;
    color: #6b7280;
}

.rda-form-header .rda-token-badge[b-vsljaz9qae] {
    margin-left: auto;
}

.rda-token-badge[b-vsljaz9qae] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.68rem;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 12px;
    white-space: nowrap;
    flex-shrink: 0;
}

.rda-token-badge.ok[b-vsljaz9qae] {
    background: #dcfce7;
    color: #15803d;
}

.rda-token-badge.warn[b-vsljaz9qae] {
    background: #fef3c7;
    color: #92400e;
}

.rda-form-body[b-vsljaz9qae] {
    padding: 16px 20px;
    scrollbar-width: thin;
}

.rda-form-body[b-vsljaz9qae]::-webkit-scrollbar {
    width: 5px;
}

.rda-form-body[b-vsljaz9qae]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 3px;
}

.rda-section-title[b-vsljaz9qae] {
    font-size: 0.81rem;
    font-weight: 700;
    color: #374151;
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 5px;
    margin-bottom: 10px;
    letter-spacing: 0.01em;
}

.rda-section-title i[b-vsljaz9qae] {
    font-size: 0.76rem;
    margin-right: 5px;
    color: #1a73e8;
}

.rda-form-label[b-vsljaz9qae] {
    font-size: 0.74rem;
    margin-bottom: 2px;
    color: #4b5563;
    font-weight: 500;
}

.rda-form-label i[b-vsljaz9qae] {
    font-size: 0.68rem;
    margin-right: 3px;
    color: #1a73e8;
}

.rda-form-control-sm[b-vsljaz9qae] {
    height: 30px;
    font-size: 0.84rem;
    padding: 2px 8px;
    line-height: 1.3;
    border-radius: 3px;
}

.rda-input-group .btn[b-vsljaz9qae] {
    height: 30px;
    font-size: 0.75rem;
    border-radius: 3px;
}

.rda-input-group .btn i[b-vsljaz9qae] {
    font-size: 0.7rem;
}

.rda-sensitive-note[b-vsljaz9qae] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 12px;
    background: #fef3c7;
    border: 1px solid #fbbf24;
    color: #92400e;
    font-size: 0.78rem;
    border-radius: 6px;
    line-height: 1.5;
}

.rda-sensitive-note i[b-vsljaz9qae] {
    color: #d97706;
    font-size: 0.85rem;
    margin-top: 1px;
    flex-shrink: 0;
}

.rda-form-actions[b-vsljaz9qae] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    padding-top: 12px;
    margin-top: 4px;
    border-top: 1px solid #e5e7eb;
    flex-shrink: 0;
}

.rda-form-footer[b-vsljaz9qae] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    padding: 8px 16px;
    border-top: 1px solid #e2e4e9;
    background: #f9fafb;
    flex-shrink: 0;
}

.rda-form-footer-info[b-vsljaz9qae] {
    font-size: 0.7rem;
    color: #9ca3af;
    display: flex;
    align-items: center;
    gap: 6px;
}

.rda-form-footer-info i[b-vsljaz9qae] {
    font-size: 0.68rem;
}
/* /Presentation/Components/Pages/ConfiguracionApp/ConfiguracionAppPanel.razor.rz.scp.css */
.editor-container[b-h414rdar00] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

.editor-header[b-h414rdar00] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-h414rdar00] {
    font-size: 13px;
}

.editor-header-right[b-h414rdar00] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.inst-header-actions[b-h414rdar00] {
    position: relative;
    display: inline-flex;
    align-items: center;
}

/* ── Toast de acciones en el header ── */

.inst-toast[b-h414rdar00] {
    position: absolute;
    right: calc(100% + 8px);
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 14px;
    border-radius: 6px;
    font-size: 0.76rem;
    font-weight: 500;
    line-height: 1.4;
    white-space: nowrap;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
    max-width: 520px;
    /* Por encima de modales (2055/2054) para que nunca quede oculto tras ellos */
    z-index: 2060;
}

.inst-toast i[b-h414rdar00] {
    font-size: 0.8rem;
}

.inst-toast-success[b-h414rdar00] {
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    color: #065f46;
}

.inst-toast-success i[b-h414rdar00] {
    color: #059669;
}

.inst-toast-error[b-h414rdar00] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
}

.inst-toast-error i[b-h414rdar00] {
    color: #dc2626;
}

.editor-title-bar[b-h414rdar00] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-h414rdar00],
.editor-title-bar .fw-semibold[b-h414rdar00],
.editor-title-bar small[b-h414rdar00] {
    color: #1a1d23 !important;
}

/* ===== PESTAÑAS — EXACTO EditorPlantillaBase ===== */
.editor-tabs.nav-tabs[b-h414rdar00] {
    border-bottom: none !important;
    display: flex;
    padding: 0 !important;
    margin: 0 !important;
    background: #e8eaed;
    list-style: none;
    gap: 0;
    position: relative;
    height: 44px;
    flex-shrink: 0;
    min-height: 44px;
}

.editor-tabs .nav-item[b-h414rdar00] {
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
    display: flex;
    align-items: stretch;
}

.editor-tabs .nav-item:first-child[b-h414rdar00] {
    margin: 0 !important;
    padding: 0 !important;
}

.editor-tabs .nav-link[b-h414rdar00] {
    display: flex !important;
    align-items: center !important;
    justify-content: center;
    gap: 7px;
    padding: 0 20px !important;
    margin: 0 !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    color: #5f6368 !important;
    border: none !important;
    background: transparent !important;
    transition: all 0.15s ease;
    cursor: pointer;
    white-space: nowrap;
    position: relative;
    height: 44px !important;
    text-decoration: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

.editor-tabs .nav-link:hover[b-h414rdar00] {
    color: #202124 !important;
    background: rgba(0, 0, 0, 0.04) !important;
}

.editor-tabs .nav-link.active[b-h414rdar00] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
    height: 44px !important;
    padding: 0 20px !important;
    margin: 0 !important;
}

.editor-tabs .nav-item:first-child .nav-link.active[b-h414rdar00] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
}

.editor-tabs .nav-link.active[b-h414rdar00]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 12px;
    right: 12px;
    height: 3px;
    background: #1a73e8;
    border-radius: 3px 3px 0 0;
}

.editor-tabs .nav-item:not(:last-child) .nav-link:not(.active)[b-h414rdar00]::after {
    content: '';
    position: absolute;
    right: 0;
    top: 10px;
    bottom: 10px;
    width: 1px;
    background: #dadce0;
}

.editor-tabs .nav-link i[b-h414rdar00] {
    font-size: 14px;
    width: 16px;
    text-align: center;
    color: inherit;
}

/* ===== CONTENIDO — EXACTO EditorPlantillaBase ===== */
.editor-tab-content[b-h414rdar00] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    overflow: hidden;
    position: relative;
}

.editor-tab-content > *[b-h414rdar00] {
    position: absolute;
    inset: 0;
    overflow-y: auto;
    padding: 20px 24px 24px;
}

/* ============================================================
   PAN-119 / sv4-069 — Pestaña Inicio: cards con switches
   Patrón visual: cards de Config Académico (PAN-118)
   ============================================================ */

.ini-config-container[b-h414rdar00] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow-y: auto;
    padding: 4px 2px;
}

.ini-config-header[b-h414rdar00] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 14px;
    padding: 10px 12px;
    background: #fff;
    border: 1px solid #e2e4e9;
    border-radius: 8px;
}

/* Forzar color oscuro en los títulos del header (evita que estilos heredados los pinten blancos) */
.ini-config-header h6[b-h414rdar00],
.ini-config-header .fw-semibold[b-h414rdar00] {
    color: #1a1d23 !important;
}

.ini-config-header small[b-h414rdar00] {
    color: #6b7280 !important;
}

.ini-config-header i[b-h414rdar00] {
    font-size: 1rem;
}

.ini-config-header small[b-h414rdar00] {
    font-size: 0.74rem;
}

/* ── Cards con switches ── */

.ini-config-card[b-h414rdar00] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 12px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    height: 100%;
    transition: border-color 0.15s, box-shadow 0.15s, background 0.15s;
    min-height: 72px;
}

.ini-config-card:hover[b-h414rdar00] {
    border-color: #bfdbfe;
    box-shadow: 0 1px 6px rgba(26, 115, 232, 0.08);
}

.ini-config-card.on[b-h414rdar00] {
    border-color: #a7f3d0;
    background: #f0fdf4;
}

.ini-config-card-icon[b-h414rdar00] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: #f3f4f6;
    color: #6b7280;
    font-size: 0.9rem;
    flex-shrink: 0;
}

.ini-config-card.on .ini-config-card-icon[b-h414rdar00] {
    background: #dcfce7;
    color: #15803d;
}

.ini-config-card-body[b-h414rdar00] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ini-config-card-title[b-h414rdar00] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #374151;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ini-config-card-desc[b-h414rdar00] {
    font-size: 0.68rem;
    color: #9ca3af;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.ini-config-switch[b-h414rdar00] {
    flex-shrink: 0;
    /* Margen izquierdo para que el texto (título/descripción) no quede
       pegado ni se esconda detrás del switch cuando la descripción es larga */
    margin: 0 0 0 10px !important;
}

.ini-config-switch .form-check-input:checked[b-h414rdar00] {
    background-color: #16a34a;
    border-color: #16a34a;
}

/* ============================================================
   PAN-119 / sv4-069 — Pestaña Facturación Electrónica
   Patrón visual: formulario de credenciales RDA (TabConfigRda)
   Inputs compactos (30px), labels con ícono, secciones con título
   ============================================================ */

.fe-section-title[b-h414rdar00] {
    font-size: 0.81rem;
    font-weight: 700;
    color: #374151;
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 5px;
    margin-bottom: 10px;
    letter-spacing: 0.01em;
}

.fe-section-title i[b-h414rdar00] {
    font-size: 0.76rem;
    margin-right: 5px;
    color: #1a73e8;
}

.fe-form-label[b-h414rdar00] {
    font-size: 0.74rem;
    margin-bottom: 2px;
    color: #4b5563;
    font-weight: 500;
}

.fe-form-label i[b-h414rdar00] {
    font-size: 0.68rem;
    margin-right: 3px;
    color: #1a73e8;
}

.fe-form-control-sm[b-h414rdar00] {
    height: 30px;
    font-size: 0.84rem;
    padding: 2px 8px;
    line-height: 1.3;
    border-radius: 3px;
}

.fe-input-group .btn[b-h414rdar00] {
    height: 30px;
    font-size: 0.75rem;
    border-radius: 3px;
}

.fe-input-group .btn i[b-h414rdar00] {
    font-size: 0.7rem;
}

.fe-form-actions[b-h414rdar00] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    padding-top: 12px;
    margin-top: 4px;
    border-top: 1px solid #e5e7eb;
    flex-shrink: 0;
}

.fe-sensitive-note[b-h414rdar00] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 12px;
    background: #fef3c7;
    border: 1px solid #fbbf24;
    color: #92400e;
    font-size: 0.78rem;
    border-radius: 6px;
    line-height: 1.5;
}

.fe-sensitive-note i[b-h414rdar00] {
    color: #d97706;
    font-size: 0.85rem;
    margin-top: 1px;
    flex-shrink: 0;
}
/* /Presentation/Components/Pages/Configuracion/FuncionarioManager.razor.rz.scp.css */
.editor-container[b-ckxnrjea5u] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

.editor-header[b-ckxnrjea5u] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-ckxnrjea5u] {
    font-size: 13px;
}

.editor-header-right[b-ckxnrjea5u] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.editor-title-bar[b-ckxnrjea5u] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-ckxnrjea5u],
.editor-title-bar .fw-semibold[b-ckxnrjea5u],
.editor-title-bar small[b-ckxnrjea5u] {
    color: #1a1d23 !important;
}

/* ── Barra de favoritos (mismo patrón que MenuManager) ── */

.mgr-fav-bar[b-ckxnrjea5u] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 16px;
    background: #fffbeb;
    border-bottom: 1px solid #fde68a;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.mgr-fav-bar-icon[b-ckxnrjea5u] {
    font-size: 0.65rem;
    color: #f59e0b;
    flex-shrink: 0;
}

.mgr-fav-pill[b-ckxnrjea5u] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    background: #fff;
    border: 1px solid #fde68a;
    border-radius: 14px;
    font-size: 0.75rem;
    color: #92400e;
    cursor: pointer;
    transition: all 0.12s;
    white-space: nowrap;
}

.mgr-fav-pill:hover[b-ckxnrjea5u] {
    background: #fef3c7;
    border-color: #f59e0b;
}

.mgr-fav-pill.active[b-ckxnrjea5u] {
    background: #f59e0b;
    border-color: #d97706;
    color: #fff;
}

.mgr-fav-pill i[b-ckxnrjea5u] {
    font-size: 0.6rem;
}

.mgr-fav-pill-remove[b-ckxnrjea5u] {
    background: none;
    border: none;
    padding: 0;
    margin-left: 2px;
    font-size: 0.55rem;
    color: inherit;
    cursor: pointer;
    opacity: 0.5;
    line-height: 1;
}

.mgr-fav-pill-remove:hover[b-ckxnrjea5u] {
    opacity: 1;
}

/* ── Buscadores tipo sidebar (mismo patrón que MenuManager) ── */

.mgr-search-wrapper[b-ckxnrjea5u] {
    position: relative;
    display: flex;
    align-items: center;
    padding: 5px 10px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
}

.mgr-search-icon[b-ckxnrjea5u] {
    position: absolute;
    left: 13px;
    font-size: 0.65rem;
    color: #9ca3af;
    pointer-events: none;
}

.mgr-search-input[b-ckxnrjea5u] {
    width: 100%;
    background: #f3f4f6;
    border: 1px solid transparent;
    color: #374151;
    padding: 4px 22px 4px 22px;
    font-size: 0.73rem;
    border-radius: 4px;
    outline: none;
    transition: border-color 0.15s;
}

.mgr-search-input:focus[b-ckxnrjea5u] {
    border-color: #1a73e8;
    box-shadow: 0 0 0 2px rgba(26,115,232,0.15);
    background: #fff;
}

.mgr-search-input[b-ckxnrjea5u]::placeholder {
    color: #9ca3af;
    opacity: 0.6;
    font-size: 0.7rem;
}

.mgr-search-clear[b-ckxnrjea5u] {
    position: absolute;
    right: 12px;
    background: none;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    padding: 2px 4px;
    font-size: 0.6rem;
    opacity: 0.5;
    transition: opacity 0.15s;
    line-height: 1;
}

.mgr-search-clear:hover[b-ckxnrjea5u] {
    opacity: 1;
    color: #dc2626;
}

.mgr-search-empty[b-ckxnrjea5u] {
    text-align: center;
    padding: 16px 10px;
    color: #9ca3af;
    font-size: 0.75rem;
    font-style: italic;
}

/* ============================================================
   Split horizontal: roles panel (izq) + grid de funcionarios (der)
   ============================================================ */

.func-split-body[b-ckxnrjea5u] {
    display: flex;
    flex: 1;
    min-height: 0;
    background: #f8f9fa;
}

/* ── Panel izquierdo: Grid de Funcionarios ── */

.func-grid-panel[b-ckxnrjea5u] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.func-grid-toolbar[b-ckxnrjea5u] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 14px 7px 14px;
    border-bottom: 1px solid #e2e4e9;
    background: #fff;
    flex-shrink: 0;
}

.func-grid-wrapper[b-ckxnrjea5u] {
    flex: 1;
    overflow-y: auto;
    background: #fff;
    scrollbar-width: thin;
}

.func-grid-wrapper[b-ckxnrjea5u]::-webkit-scrollbar {
    width: 5px;
}

.func-grid-wrapper[b-ckxnrjea5u]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 3px;
}

.func-grid-wrapper[b-ckxnrjea5u]::-webkit-scrollbar-track {
    background: #f3f4f6;
}

/* ── Cabecera de la tabla ── */

.func-grid-header[b-ckxnrjea5u] {
    display: flex;
    align-items: center;
    padding: 8px 14px;
    background: #f9fafb;
    border-bottom: 2px solid #e5e7eb;
    font-size: 0.8rem;
    font-weight: 600;
    color: #6b7280;
    gap: 6px;
    position: sticky;
    top: 0;
    z-index: 1;
}

/* ── Filas de la tabla ── */

.func-grid-row[b-ckxnrjea5u] {
    display: flex;
    align-items: center;
    padding: 7px 14px;
    border-bottom: 1px solid #f3f4f6;
    gap: 6px;
    transition: background 0.12s;
    min-height: 40px;
    font-size: 0.8rem;
}

.func-grid-row:hover[b-ckxnrjea5u] {
    background: #f9fafb;
}

.func-grid-row.inactive[b-ckxnrjea5u] {
    opacity: 0.55;
    background: #f9fafb;
}

.func-grid-row.inactive .func-col-name[b-ckxnrjea5u] {
    font-style: italic;
    color: #9ca3af;
}

/* ── Columnas ── */

.func-col-doc[b-ckxnrjea5u] {
    width: 120px;
    flex-shrink: 0;
    font-size: 0.8rem;
    color: #374151;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.func-col-name[b-ckxnrjea5u] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 4px;
    overflow: hidden;
    color: #374151;
    font-weight: 500;
}

.func-col-cargo[b-ckxnrjea5u] {
    width: 170px;
    flex-shrink: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #6b7280;
    font-size: 0.8rem;
}

.func-col-empresa[b-ckxnrjea5u] {
    width: 150px;
    flex-shrink: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #6b7280;
    font-size: 0.8rem;
}

.func-col-estado[b-ckxnrjea5u] {
    width: 80px;
    flex-shrink: 0;
    text-align: center;
}

.func-col-actions[b-ckxnrjea5u] {
    width: 100px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 2px;
    justify-content: flex-end;
    opacity: 0.2;
    transition: opacity 0.15s;
}

.func-grid-row:hover .func-col-actions[b-ckxnrjea5u] {
    opacity: 1;
}

/* ── Badge de contacto en grid ── */

.func-contact-badge[b-ckxnrjea5u] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #f3f4f6;
    color: #9ca3af;
    font-size: 0.55rem;
    flex-shrink: 0;
    cursor: default;
    transition: all 0.12s;
}

.func-contact-badge:hover[b-ckxnrjea5u] {
    background: #e8f0fe;
    color: #1a73e8;
}

/* ── Footer del grid ── */

.func-grid-footer[b-ckxnrjea5u] {
    display: flex;
    align-items: center;
    padding: 6px 14px;
    border-top: 1px solid #e2e4e9;
    background: #f9fafb;
    flex-shrink: 0;
    gap: 8px;
}

.func-grid-footer-count[b-ckxnrjea5u] {
    font-size: 0.72rem;
    color: #6b7280;
}

.func-grid-footer-count i[b-ckxnrjea5u] {
    font-size: 0.65rem;
    color: #9ca3af;
}

/* ── Panel derecho: Roles ── */

.func-role-panel[b-ckxnrjea5u] {
    width: 340px;
    min-width: 340px;
    max-width: 380px;
    border-right: 1px solid #e2e4e9;
    display: flex;
    flex-direction: column;
    background: #fff;
}

.func-role-header[b-ckxnrjea5u] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    font-size: 0.82rem;
    font-weight: 600;
    color: #374151;
    border-bottom: 1px solid #e2e4e9;
    background: #f9fafb;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.func-role-header i[b-ckxnrjea5u] {
    color: #1a73e8;
    font-size: 0.82rem;
}

.func-role-list[b-ckxnrjea5u] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
    scrollbar-width: thin;
}

.func-role-list[b-ckxnrjea5u]::-webkit-scrollbar {
    width: 4px;
}

.func-role-list[b-ckxnrjea5u]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 2px;
}

.func-role-item[b-ckxnrjea5u] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    font-size: 0.85rem;
    cursor: pointer;
    border-bottom: 1px solid #f3f4f6;
    transition: background 0.12s;
    color: #374151;
}

.func-role-item:hover[b-ckxnrjea5u] {
    background: #f3f4f6;
}

.func-role-item.active[b-ckxnrjea5u] {
    background: #e8f0fe;
    color: #1a73e8;
    font-weight: 500;
}

.func-role-item i[b-ckxnrjea5u] {
    width: 16px;
    text-align: center;
    font-size: 0.82rem;
    color: #9ca3af;
    flex-shrink: 0;
}

.func-role-item.active i[b-ckxnrjea5u] {
    color: #1a73e8;
}

.func-role-name[b-ckxnrjea5u] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.func-role-count-badge[b-ckxnrjea5u] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 50%;
    background: #e8f0fe;
    color: #1a73e8;
    font-size: 0.6rem;
    font-weight: 600;
    line-height: 1;
    flex-shrink: 0;
}

.func-role-item.active .func-role-count-badge[b-ckxnrjea5u] {
    background: #d2e3fc;
    color: #1557b0;
}

/* ── Estrella de favorito ── */

.func-role-star[b-ckxnrjea5u] {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.65rem;
    color: #6b7280;
    cursor: pointer;
    opacity: 0.25;
    transition: all 0.15s;
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.func-role-item:hover .func-role-star[b-ckxnrjea5u] {
    opacity: 0.6;
}

.func-role-star:hover[b-ckxnrjea5u] {
    opacity: 1 !important;
    color: #f59e0b;
}

.func-role-star.active[b-ckxnrjea5u] {
    opacity: 1;
    color: #f59e0b;
}

.func-role-footer[b-ckxnrjea5u] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    font-size: 0.7rem;
    color: #9ca3af;
    border-top: 1px solid #e2e4e9;
    background: #f9fafb;
}

.func-role-footer i[b-ckxnrjea5u] {
    font-size: 0.7rem;
}

/* ── Botones de acción (heredan .btn-action de MenuManager) ── */

.btn-action[b-ckxnrjea5u] {
    background: none;
    border: 1px solid transparent;
    color: #6b7280;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.12s;
    font-size: 0.85rem;
    padding: 0;
    line-height: 1;
}

.btn-action:hover[b-ckxnrjea5u] {
    background: #f3f4f6;
    border-color: #e5e7eb;
    color: #374151;
}

.btn-action.text-danger:hover[b-ckxnrjea5u] {
    background: #fef2f2;
    border-color: #fecaca;
    color: #dc2626;
}

/* ============================================================
   Compact form: controles del formulario de funcionarios
   con el mismo sizing de los botones del footer (30px, 0.78rem)
   ============================================================ */

.func-compact-form .form-control-sm[b-ckxnrjea5u],
.func-compact-form .form-select-sm[b-ckxnrjea5u] {
    height: 28px;
    font-size: 0.84rem;
    padding: 2px 8px;
    line-height: 1.3;
    border-radius: 3px;
}

.func-compact-form .form-label[b-ckxnrjea5u] {
    font-size: 0.74rem;
    margin-bottom: 1px;
    color: #4b5563;
    font-weight: 500;
}

.func-compact-form .section-title[b-ckxnrjea5u] {
    font-size: 0.81rem;
    font-weight: 700;
    color: #374151;
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 3px;
    margin-bottom: 6px;
    letter-spacing: 0.01em;
}

.func-compact-form .section-title i[b-ckxnrjea5u] {
    font-size: 0.76rem;
    margin-right: 4px;
}

.func-compact-form .section-body[b-ckxnrjea5u] {
    margin-bottom: 6px;
}

.func-compact-form .compact-badge[b-ckxnrjea5u] {
    font-size: 0.66rem;
    font-weight: 500;
    padding: 2px 8px;
    line-height: 1.4;
}

.func-compact-form .compact-tag[b-ckxnrjea5u] {
    font-size: 0.68rem;
    padding: 5px 10px;
    border-radius: 4px;
}

.func-compact-form .compact-btn-add[b-ckxnrjea5u] {
    font-size: 0.68rem;
    padding: 1px 6px;
    height: 22px;
    line-height: 1;
}

.func-compact-form .compact-badge-remove[b-ckxnrjea5u] {
    font-size: 0.51rem;
    padding: 0;
    line-height: 1;
    opacity: 0.7;
}
.func-compact-form .compact-badge-remove:hover[b-ckxnrjea5u] {
    opacity: 1;
}

.func-compact-form .compact-search[b-ckxnrjea5u] {
    height: 24px;
    font-size: 0.71rem;
    padding: 1px 6px;
    border-radius: 3px;
}

.func-compact-form .compact-panel[b-ckxnrjea5u] {
    padding: 4px 6px;
    border-radius: 4px;
}

.func-compact-form .form-check-label[b-ckxnrjea5u] {
    font-size: 0.81rem;
}

.func-compact-form .form-check-input[b-ckxnrjea5u] {
    margin-top: 2px;
    width: 0.9rem;
    height: 0.9rem;
}

/* ============================================================
   TABS (mismo estilo que Institucion)
   ============================================================ */

.func-compact-form .editor-tabs.nav-tabs[b-ckxnrjea5u] {
    border-bottom: none !important;
    display: flex;
    padding: 0 !important;
    margin: 0 0 1px 0 !important;
    background: #e8eaed;
    list-style: none;
    gap: 0;
    position: relative;
    height: 38px;
    flex-shrink: 0;
    min-height: 38px;
}

.func-compact-form .editor-tabs .nav-item[b-ckxnrjea5u] {
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
    display: flex;
    align-items: stretch;
}

.func-compact-form .editor-tabs .nav-link[b-ckxnrjea5u] {
    display: flex !important;
    align-items: center !important;
    justify-content: center;
    gap: 6px;
    padding: 0 16px !important;
    margin: 0 !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    color: #5f6368 !important;
    border: none !important;
    background: transparent !important;
    transition: all 0.15s ease;
    cursor: pointer;
    white-space: nowrap;
    position: relative;
    height: 38px !important;
    text-decoration: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

.func-compact-form .editor-tabs .nav-link:hover[b-ckxnrjea5u] {
    color: #202124 !important;
    background: rgba(0, 0, 0, 0.04) !important;
}

.func-compact-form .editor-tabs .nav-link.active[b-ckxnrjea5u] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
    height: 38px !important;
    padding: 0 16px !important;
    margin: 0 !important;
}

.func-compact-form .editor-tabs .nav-link.active[b-ckxnrjea5u]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 12px;
    right: 12px;
    height: 3px;
    background: #1a73e8;
    border-radius: 3px 3px 0 0;
}

.func-compact-form .editor-tabs .nav-item:not(:last-child) .nav-link:not(.active)[b-ckxnrjea5u]::after {
    content: '';
    position: absolute;
    right: 0;
    top: 8px;
    bottom: 8px;
    width: 1px;
    background: #dadce0;
}

.func-compact-form .editor-tabs .nav-link i[b-ckxnrjea5u] {
    font-size: 14px;
    width: 15px;
    text-align: center;
    color: inherit;
}

/* ===== CONTENIDO DE PESTAÑA ===== */

.func-compact-form .func-tab-content[b-ckxnrjea5u] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 420px;
    overflow-y: auto;
    padding: 14px 16px 16px;
}

/* ── Zona de carga de archivos (elegante) ── */

.file-upload-zone[b-ckxnrjea5u] {
    position: relative;
    display: flex;
    justify-content: center;
    margin-top: 8px;
}

.file-upload-btn[b-ckxnrjea5u] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: #fff;
    border: 1px dashed #c4c4c4;
    border-radius: 6px;
    color: #6b7280;
    font-size: 0.72rem;
    cursor: pointer;
    transition: all 0.15s ease;
    z-index: 1;
    pointer-events: none;
}

.file-upload-zone:hover .file-upload-btn[b-ckxnrjea5u] {
    border-color: #1a73e8;
    color: #1a73e8;
    background: #f0f7ff;
}

.file-upload-btn i[b-ckxnrjea5u] {
    font-size: 0.8rem;
    color: #9ca3af;
    transition: color 0.15s;
}

.file-upload-zone:hover .file-upload-btn i[b-ckxnrjea5u] {
    color: #1a73e8;
}

.func-page-tabs.nav-tabs[b-ckxnrjea5u] {
    border-bottom: none !important;
    display: flex;
    padding: 0 !important;
    margin: 0 !important;
    background: #e8eaed;
    list-style: none;
    gap: 0;
    position: relative;
    height: 44px;
    flex-shrink: 0;
    min-height: 44px;
}

.func-page-tabs .nav-item[b-ckxnrjea5u] {
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
    display: flex;
    align-items: stretch;
}

.func-page-tabs .nav-link[b-ckxnrjea5u] {
    display: flex !important;
    align-items: center !important;
    justify-content: center;
    gap: 7px;
    padding: 0 20px !important;
    margin: 0 !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    color: #5f6368 !important;
    border: none !important;
    background: transparent !important;
    transition: all 0.15s ease;
    cursor: pointer;
    white-space: nowrap;
    position: relative;
    height: 44px !important;
    text-decoration: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

.func-page-tabs .nav-link:hover[b-ckxnrjea5u] {
    color: #202124 !important;
    background: rgba(0, 0, 0, 0.04) !important;
}

.func-page-tabs .nav-link.active[b-ckxnrjea5u] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
    height: 44px !important;
    padding: 0 20px !important;
    margin: 0 !important;
}

.func-page-tabs .nav-link.active[b-ckxnrjea5u]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 12px;
    right: 12px;
    height: 3px;
    background: #1a73e8;
    border-radius: 3px 3px 0 0;
}

.func-page-tabs .nav-item:not(:last-child) .nav-link:not(.active)[b-ckxnrjea5u]::after {
    content: '';
    position: absolute;
    right: 0;
    top: 10px;
    bottom: 10px;
    width: 1px;
    background: #dadce0;
}

.func-page-tabs .nav-link i[b-ckxnrjea5u] {
    font-size: 14px;
    width: 16px;
    text-align: center;
    color: inherit;
}

/* ── Contenido del tab Auditoría ── */

.func-audit-body[b-ckxnrjea5u] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 20px 24px 24px;
    background: #f8f9fa;
}

.func-audit-body[b-ckxnrjea5u]  .profile-card {
    width: 100%;
    max-width: 100%;
}

.func-audit-body[b-ckxnrjea5u]  .profile-section-header {
    display: flex;
    align-items: center;
}
/* /Presentation/Components/Pages/Configuracion/Medico/MedicoManager.razor.rz.scp.css */
.editor-container[b-11i9m50ws1] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

.editor-header[b-11i9m50ws1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-11i9m50ws1] {
    font-size: 13px;
}

.editor-header-right[b-11i9m50ws1] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.editor-title-bar[b-11i9m50ws1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-11i9m50ws1],
.editor-title-bar .fw-semibold[b-11i9m50ws1],
.editor-title-bar small[b-11i9m50ws1] {
    color: #1a1d23 !important;
}

/* ── Barra de favoritos (mismo patrón que MenuManager) ── */

.mgr-fav-bar[b-11i9m50ws1] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 16px;
    background: #fffbeb;
    border-bottom: 1px solid #fde68a;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.mgr-fav-bar-icon[b-11i9m50ws1] {
    font-size: 0.65rem;
    color: #f59e0b;
    flex-shrink: 0;
}

.mgr-fav-pill[b-11i9m50ws1] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    background: #fff;
    border: 1px solid #fde68a;
    border-radius: 14px;
    font-size: 0.75rem;
    color: #92400e;
    cursor: pointer;
    transition: all 0.12s;
    white-space: nowrap;
}

.mgr-fav-pill:hover[b-11i9m50ws1] {
    background: #fef3c7;
    border-color: #f59e0b;
}

.mgr-fav-pill.active[b-11i9m50ws1] {
    background: #f59e0b;
    border-color: #d97706;
    color: #fff;
}

.mgr-fav-pill i[b-11i9m50ws1] {
    font-size: 0.6rem;
}

.mgr-fav-pill-remove[b-11i9m50ws1] {
    background: none;
    border: none;
    padding: 0;
    margin-left: 2px;
    font-size: 0.55rem;
    color: inherit;
    cursor: pointer;
    opacity: 0.5;
    line-height: 1;
}

.mgr-fav-pill-remove:hover[b-11i9m50ws1] {
    opacity: 1;
}

/* ── Buscadores tipo sidebar (mismo patrón que MenuManager) ── */

.mgr-search-wrapper[b-11i9m50ws1] {
    position: relative;
    display: flex;
    align-items: center;
    padding: 5px 10px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
}

.mgr-search-icon[b-11i9m50ws1] {
    position: absolute;
    left: 13px;
    font-size: 0.65rem;
    color: #9ca3af;
    pointer-events: none;
}

.mgr-search-input[b-11i9m50ws1] {
    width: 100%;
    background: #f3f4f6;
    border: 1px solid transparent;
    color: #374151;
    padding: 4px 22px 4px 22px;
    font-size: 0.73rem;
    border-radius: 4px;
    outline: none;
    transition: border-color 0.15s;
}

.mgr-search-input:focus[b-11i9m50ws1] {
    border-color: #1a73e8;
    box-shadow: 0 0 0 2px rgba(26,115,232,0.15);
    background: #fff;
}

.mgr-search-input[b-11i9m50ws1]::placeholder {
    color: #9ca3af;
    opacity: 0.6;
    font-size: 0.7rem;
}

.mgr-search-clear[b-11i9m50ws1] {
    position: absolute;
    right: 12px;
    background: none;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    padding: 2px 4px;
    font-size: 0.6rem;
    opacity: 0.5;
    transition: opacity 0.15s;
    line-height: 1;
}

.mgr-search-clear:hover[b-11i9m50ws1] {
    opacity: 1;
    color: #dc2626;
}

.mgr-search-empty[b-11i9m50ws1] {
    text-align: center;
    padding: 16px 10px;
    color: #9ca3af;
    font-size: 0.75rem;
    font-style: italic;
}

/* ============================================================
   Split horizontal: roles panel (izq) + grid de funcionarios (der)
   ============================================================ */

.func-split-body[b-11i9m50ws1] {
    display: flex;
    flex: 1;
    min-height: 0;
    background: #f8f9fa;
}

/* ── Panel izquierdo: Grid de Funcionarios ── */

.func-grid-panel[b-11i9m50ws1] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.func-grid-toolbar[b-11i9m50ws1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 14px 7px 14px;
    border-bottom: 1px solid #e2e4e9;
    background: #fff;
    flex-shrink: 0;
}

.func-grid-wrapper[b-11i9m50ws1] {
    flex: 1;
    overflow-y: auto;
    background: #fff;
    scrollbar-width: thin;
}

.func-grid-wrapper[b-11i9m50ws1]::-webkit-scrollbar {
    width: 5px;
}

.func-grid-wrapper[b-11i9m50ws1]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 3px;
}

.func-grid-wrapper[b-11i9m50ws1]::-webkit-scrollbar-track {
    background: #f3f4f6;
}

/* ── Cabecera de la tabla ── */

.func-grid-header[b-11i9m50ws1] {
    display: flex;
    align-items: center;
    padding: 8px 14px;
    background: #f9fafb;
    border-bottom: 2px solid #e5e7eb;
    font-size: 0.8rem;
    font-weight: 600;
    color: #6b7280;
    gap: 6px;
    position: sticky;
    top: 0;
    z-index: 1;
}

/* ── Filas de la tabla ── */

.func-grid-row[b-11i9m50ws1] {
    display: flex;
    align-items: center;
    padding: 7px 14px;
    border-bottom: 1px solid #f3f4f6;
    gap: 6px;
    transition: background 0.12s;
    min-height: 40px;
    font-size: 0.8rem;
}

.func-grid-row:hover[b-11i9m50ws1] {
    background: #f9fafb;
}

.func-grid-row.inactive[b-11i9m50ws1] {
    opacity: 0.55;
    background: #f9fafb;
}

.func-grid-row.inactive .func-col-name[b-11i9m50ws1],
.func-grid-row.inactive .pac-col-name[b-11i9m50ws1] {
    font-style: italic;
    color: #9ca3af;
}

.func-grid-row.inactive .pac-col-doc[b-11i9m50ws1],
.func-grid-row.inactive .med-col-registro[b-11i9m50ws1],
.func-grid-row.inactive .pac-col-genero[b-11i9m50ws1] {
    color: #9ca3af;
}

/* ── Columnas ── */

.func-col-doc[b-11i9m50ws1] {
    width: 120px;
    flex-shrink: 0;
    font-size: 0.8rem;
    color: #374151;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.func-col-name[b-11i9m50ws1] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 4px;
    overflow: hidden;
    color: #374151;
    font-weight: 500;
}

.func-col-cargo[b-11i9m50ws1] {
    width: 170px;
    flex-shrink: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #6b7280;
    font-size: 0.8rem;
}

.func-col-empresa[b-11i9m50ws1] {
    width: 150px;
    flex-shrink: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #6b7280;
    font-size: 0.8rem;
}

.func-col-estado[b-11i9m50ws1] {
    width: 80px;
    flex-shrink: 0;
    text-align: center;
}

.func-col-actions[b-11i9m50ws1] {
    width: 100px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 2px;
    justify-content: flex-end;
    opacity: 0.2;
    transition: opacity 0.15s;
}

.func-grid-row:hover .func-col-actions[b-11i9m50ws1] {
    opacity: 1;
}

/* ── Badge de contacto en grid ── */

.func-contact-badge[b-11i9m50ws1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #f3f4f6;
    color: #9ca3af;
    font-size: 0.55rem;
    flex-shrink: 0;
    cursor: default;
    transition: all 0.12s;
}

.func-contact-badge:hover[b-11i9m50ws1] {
    background: #e8f0fe;
    color: #1a73e8;
}

/* ── Footer del grid ── */

.func-grid-footer[b-11i9m50ws1] {
    display: flex;
    align-items: center;
    padding: 6px 14px;
    border-top: 1px solid #e2e4e9;
    background: #f9fafb;
    flex-shrink: 0;
    gap: 8px;
}

.func-grid-footer-count[b-11i9m50ws1] {
    font-size: 0.72rem;
    color: #6b7280;
}

.func-grid-footer-count i[b-11i9m50ws1] {
    font-size: 0.65rem;
    color: #9ca3af;
}

/* ── Panel derecho: Roles ── */

.func-role-panel[b-11i9m50ws1] {
    width: 340px;
    min-width: 340px;
    max-width: 380px;
    border-right: 1px solid #e2e4e9;
    display: flex;
    flex-direction: column;
    background: #fff;
}

.func-role-header[b-11i9m50ws1] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    font-size: 0.82rem;
    font-weight: 600;
    color: #374151;
    border-bottom: 1px solid #e2e4e9;
    background: #f9fafb;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.func-role-header i[b-11i9m50ws1] {
    color: #1a73e8;
    font-size: 0.82rem;
}

.func-role-list[b-11i9m50ws1] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
    scrollbar-width: thin;
}

.func-role-list[b-11i9m50ws1]::-webkit-scrollbar {
    width: 4px;
}

.func-role-list[b-11i9m50ws1]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 2px;
}

.func-role-item[b-11i9m50ws1] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    font-size: 0.85rem;
    cursor: pointer;
    border-bottom: 1px solid #f3f4f6;
    transition: background 0.12s;
    color: #374151;
}

.func-role-item:hover[b-11i9m50ws1] {
    background: #f3f4f6;
}

.func-role-item.active[b-11i9m50ws1] {
    background: #e8f0fe;
    color: #1a73e8;
    font-weight: 500;
}

.func-role-item i[b-11i9m50ws1] {
    width: 16px;
    text-align: center;
    font-size: 0.82rem;
    color: #9ca3af;
    flex-shrink: 0;
}

.func-role-item.active i[b-11i9m50ws1] {
    color: #1a73e8;
}

.func-role-name[b-11i9m50ws1] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.func-role-count-badge[b-11i9m50ws1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 50%;
    background: #e8f0fe;
    color: #1a73e8;
    font-size: 0.6rem;
    font-weight: 600;
    line-height: 1;
    flex-shrink: 0;
}

.func-role-item.active .func-role-count-badge[b-11i9m50ws1] {
    background: #d2e3fc;
    color: #1557b0;
}

/* ── Estrella de favorito ── */

.func-role-star[b-11i9m50ws1] {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.65rem;
    color: #6b7280;
    cursor: pointer;
    opacity: 0.25;
    transition: all 0.15s;
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.func-role-item:hover .func-role-star[b-11i9m50ws1] {
    opacity: 0.6;
}

.func-role-star:hover[b-11i9m50ws1] {
    opacity: 1 !important;
    color: #f59e0b;
}

.func-role-star.active[b-11i9m50ws1] {
    opacity: 1;
    color: #f59e0b;
}

.func-role-footer[b-11i9m50ws1] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    font-size: 0.7rem;
    color: #9ca3af;
    border-top: 1px solid #e2e4e9;
    background: #f9fafb;
}

.func-role-footer i[b-11i9m50ws1] {
    font-size: 0.7rem;
}

/* ── Botones de acción (heredan .btn-action de MenuManager) ── */

.btn-action[b-11i9m50ws1] {
    background: none;
    border: 1px solid transparent;
    color: #6b7280;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.12s;
    font-size: 0.85rem;
    padding: 0;
    line-height: 1;
}

.btn-action:hover[b-11i9m50ws1] {
    background: #f3f4f6;
    border-color: #e5e7eb;
    color: #374151;
}

.btn-action.text-danger:hover[b-11i9m50ws1] {
    background: #fef2f2;
    border-color: #fecaca;
    color: #dc2626;
}

/* ============================================================
   Compact form: controles del formulario de funcionarios
   con el mismo sizing de los botones del footer (30px, 0.78rem)
   ============================================================ */

.func-compact-form .form-control-sm[b-11i9m50ws1],
.func-compact-form .form-select-sm[b-11i9m50ws1] {
    height: 28px;
    font-size: 0.84rem;
    padding: 2px 8px;
    line-height: 1.3;
    border-radius: 3px;
}

.func-compact-form .form-label[b-11i9m50ws1] {
    font-size: 0.74rem;
    margin-bottom: 1px;
    color: #4b5563;
    font-weight: 500;
}

.func-compact-form .section-title[b-11i9m50ws1] {
    font-size: 0.81rem;
    font-weight: 700;
    color: #374151;
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 3px;
    margin-bottom: 6px;
    letter-spacing: 0.01em;
}

.func-compact-form .section-title i[b-11i9m50ws1] {
    font-size: 0.76rem;
    margin-right: 4px;
}

.func-compact-form .section-body[b-11i9m50ws1] {
    margin-bottom: 6px;
}

.func-compact-form .compact-badge[b-11i9m50ws1] {
    font-size: 0.66rem;
    font-weight: 500;
    padding: 2px 8px;
    line-height: 1.4;
}

.func-compact-form .compact-tag[b-11i9m50ws1] {
    font-size: 0.68rem;
    padding: 5px 10px;
    border-radius: 4px;
}

.func-compact-form .compact-btn-add[b-11i9m50ws1] {
    font-size: 0.68rem;
    padding: 1px 6px;
    height: 22px;
    line-height: 1;
}

.func-compact-form .compact-badge-remove[b-11i9m50ws1] {
    font-size: 0.51rem;
    padding: 0;
    line-height: 1;
    opacity: 0.7;
}
.func-compact-form .compact-badge-remove:hover[b-11i9m50ws1] {
    opacity: 1;
}

.func-compact-form .compact-search[b-11i9m50ws1] {
    height: 24px;
    font-size: 0.71rem;
    padding: 1px 6px;
    border-radius: 3px;
}

.func-compact-form .compact-panel[b-11i9m50ws1] {
    padding: 4px 6px;
    border-radius: 4px;
}

.func-compact-form .form-check-label[b-11i9m50ws1] {
    font-size: 0.81rem;
}

.func-compact-form .form-check-input[b-11i9m50ws1] {
    margin-top: 2px;
    width: 0.9rem;
    height: 0.9rem;
}

/* ============================================================
   TABS (mismo estilo que Institucion)
   ============================================================ */

.func-compact-form .editor-tabs.nav-tabs[b-11i9m50ws1] {
    border-bottom: none !important;
    display: flex;
    padding: 0 !important;
    margin: 0 0 1px 0 !important;
    background: #e8eaed;
    list-style: none;
    gap: 0;
    position: relative;
    height: 38px;
    flex-shrink: 0;
    min-height: 38px;
}

.func-compact-form .editor-tabs .nav-item[b-11i9m50ws1] {
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
    display: flex;
    align-items: stretch;
}

.func-compact-form .editor-tabs .nav-link[b-11i9m50ws1] {
    display: flex !important;
    align-items: center !important;
    justify-content: center;
    gap: 6px;
    padding: 0 16px !important;
    margin: 0 !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    color: #5f6368 !important;
    border: none !important;
    background: transparent !important;
    transition: all 0.15s ease;
    cursor: pointer;
    white-space: nowrap;
    position: relative;
    height: 38px !important;
    text-decoration: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

.func-compact-form .editor-tabs .nav-link:hover[b-11i9m50ws1] {
    color: #202124 !important;
    background: rgba(0, 0, 0, 0.04) !important;
}

.func-compact-form .editor-tabs .nav-link.active[b-11i9m50ws1] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
    height: 38px !important;
    padding: 0 16px !important;
    margin: 0 !important;
}

.func-compact-form .editor-tabs .nav-link.active[b-11i9m50ws1]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 12px;
    right: 12px;
    height: 3px;
    background: #1a73e8;
    border-radius: 3px 3px 0 0;
}

.func-compact-form .editor-tabs .nav-item:not(:last-child) .nav-link:not(.active)[b-11i9m50ws1]::after {
    content: '';
    position: absolute;
    right: 0;
    top: 8px;
    bottom: 8px;
    width: 1px;
    background: #dadce0;
}

.func-compact-form .editor-tabs .nav-link i[b-11i9m50ws1] {
    font-size: 14px;
    width: 15px;
    text-align: center;
    color: inherit;
}

/* ===== CONTENIDO DE PESTAÑA ===== */

.func-compact-form .func-tab-content[b-11i9m50ws1] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 14px 16px 16px;
}

/* ── Zona de carga de archivos (elegante) ── */

.file-upload-zone[b-11i9m50ws1] {
    position: relative;
    display: flex;
    justify-content: center;
    margin-top: 8px;
}

.file-upload-btn[b-11i9m50ws1] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: #fff;
    border: 1px dashed #c4c4c4;
    border-radius: 6px;
    color: #6b7280;
    font-size: 0.72rem;
    cursor: pointer;
    transition: all 0.15s ease;
    z-index: 1;
    pointer-events: none;
}

.file-upload-zone:hover .file-upload-btn[b-11i9m50ws1] {
    border-color: #1a73e8;
    color: #1a73e8;
    background: #f0f7ff;
}

.file-upload-btn i[b-11i9m50ws1] {
    font-size: 0.8rem;
    color: #9ca3af;
    transition: color 0.15s;
}

.file-upload-zone:hover .file-upload-btn i[b-11i9m50ws1] {
    color: #1a73e8;
}


/* ============================================================
   Estilos específicos de Médicos
   ============================================================ */

/* ── Columnas del grid de médicos ── */

.pac-col-doc[b-11i9m50ws1] {
    width: 130px;
    flex-shrink: 0;
    font-size: 0.8rem;
    color: #374151;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 4px;
}

.pac-col-name[b-11i9m50ws1] {
    flex: 1.5;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 4px;
    overflow: hidden;
    color: #374151;
    font-weight: 500;
}

.pac-col-genero[b-11i9m50ws1] {
    width: 90px;
    flex-shrink: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #374151;
    font-size: 0.8rem;
}

.pac-col-estado[b-11i9m50ws1] {
    width: 80px;
    flex-shrink: 0;
    text-align: center;
}

.pac-col-actions[b-11i9m50ws1] {
    width: 70px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 2px;
    justify-content: flex-end;
    opacity: 0.2;
    transition: opacity 0.15s;
}

.func-grid-row:hover .pac-col-actions[b-11i9m50ws1] {
    opacity: 1;
}

.med-col-registro[b-11i9m50ws1] {
    width: 130px;
    flex-shrink: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #374151;
    font-size: 0.8rem;
}

.med-col-especialidades[b-11i9m50ws1] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 4px;
    overflow: hidden;
}

.med-espe-badge[b-11i9m50ws1] {
    display: inline-block;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.76rem;
    background: #e8f0fe;
    color: #1a73e8;
    padding: 1px 8px;
    border-radius: 3px;
    font-weight: 400;
}

.btn-action.toggle-on[b-11i9m50ws1] {
    color: #059669;
}

.btn-action.toggle-on:hover[b-11i9m50ws1] {
    background: #ecfdf5;
    border-color: #a7f3d0;
    color: #047857;
}

.btn-action.toggle-off[b-11i9m50ws1] {
    color: #9ca3af;
}

.btn-action.toggle-off:hover[b-11i9m50ws1] {
    background: #fef2f2;
    border-color: #fecaca;
    color: #dc2626;
}

.med-especialidad-section[b-11i9m50ws1] {
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 10px;
    background: #f9fafb;
}

.med-especialidad-header[b-11i9m50ws1] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.med-especialidad-tags[b-11i9m50ws1] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    max-height: 120px;
    overflow-y: auto;
}

.med-especialidad-available[b-11i9m50ws1] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    max-height: 100px;
    overflow-y: auto;
}
/* /Presentation/Components/Pages/Configuracion/MenuManager.razor.rz.scp.css */
.editor-container[b-9dlpuxf1ud] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

.editor-header[b-9dlpuxf1ud] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-9dlpuxf1ud] {
    font-size: 13px;
}

.editor-header-right[b-9dlpuxf1ud] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.editor-title-bar[b-9dlpuxf1ud] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-9dlpuxf1ud],
.editor-title-bar .fw-semibold[b-9dlpuxf1ud],
.editor-title-bar small[b-9dlpuxf1ud] {
    color: #1a1d23 !important;
}

/* ============================================================
   Split horizontal: roles (izq) + árbol (der)
   ============================================================ */

.menu-split-body[b-9dlpuxf1ud] {
    display: flex;
    flex: 1;
    min-height: 0;
    background: #f8f9fa;
}

/* ── Panel izquierdo: roles ── */

.menu-role-panel[b-9dlpuxf1ud] {
    width: 410px;
    min-width: 410px;
    max-width: 460px;
    border-right: 1px solid #e2e4e9;
    display: flex;
    flex-direction: column;
    background: #fff;
}

.menu-role-header[b-9dlpuxf1ud] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    font-size: 0.82rem;
    font-weight: 600;
    color: #374151;
    border-bottom: 1px solid #e2e4e9;
    background: #f9fafb;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.menu-role-header i[b-9dlpuxf1ud] {
    color: #1a73e8;
    font-size: 0.82rem;
}

.menu-role-list[b-9dlpuxf1ud] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
    scrollbar-width: thin;
}

.menu-role-list[b-9dlpuxf1ud]::-webkit-scrollbar {
    width: 4px;
}

.menu-role-list[b-9dlpuxf1ud]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 2px;
}

/* Buscadores tipo sidebar (mismo patrón que Menu.razor) */
.mgr-search-wrapper[b-9dlpuxf1ud] {
    position: relative;
    display: flex;
    align-items: center;
    padding: 5px 10px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
}

.mgr-search-icon[b-9dlpuxf1ud] {
    position: absolute;
    left: 13px;
    font-size: 0.65rem;
    color: #9ca3af;
    pointer-events: none;
}

.mgr-search-input[b-9dlpuxf1ud] {
    width: 100%;
    background: #f3f4f6;
    border: 1px solid transparent;
    color: #374151;
    padding: 4px 22px 4px 22px;
    font-size: 0.73rem;
    border-radius: 4px;
    outline: none;
    transition: border-color 0.15s;
}

.mgr-search-input:focus[b-9dlpuxf1ud] {
    border-color: #1a73e8;
    box-shadow: 0 0 0 2px rgba(26,115,232,0.15);
    background: #fff;
}

.mgr-search-input[b-9dlpuxf1ud]::placeholder {
    color: #9ca3af;
    opacity: 0.6;
    font-size: 0.7rem;
}

.mgr-search-clear[b-9dlpuxf1ud] {
    position: absolute;
    right: 12px;
    background: none;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    padding: 2px 4px;
    font-size: 0.6rem;
    opacity: 0.5;
    transition: opacity 0.15s;
    line-height: 1;
}

.mgr-search-clear:hover[b-9dlpuxf1ud] {
    opacity: 1;
    color: #dc2626;
}

.mgr-search-empty[b-9dlpuxf1ud] {
    text-align: center;
    padding: 16px 10px;
    color: #9ca3af;
    font-size: 0.75rem;
    font-style: italic;
}

.menu-role-item[b-9dlpuxf1ud] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    font-size: 0.85rem;
    cursor: pointer;
    border-bottom: 1px solid #f3f4f6;
    transition: background 0.12s;
    color: #374151;
}

.menu-role-item:hover[b-9dlpuxf1ud] {
    background: #f3f4f6;
}

.menu-role-item.active[b-9dlpuxf1ud] {
    background: #e8f0fe;
    color: #1a73e8;
    font-weight: 500;
}

.menu-role-item i[b-9dlpuxf1ud] {
    width: 16px;
    text-align: center;
    font-size: 0.82rem;
    color: #9ca3af;
    flex-shrink: 0;
}

.menu-role-item.active i[b-9dlpuxf1ud] {
    color: #1a73e8;
}

.menu-role-name[b-9dlpuxf1ud] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mgr-role-count-badge[b-9dlpuxf1ud] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 50%;
    background: #e8f0fe;
    color: #1a73e8;
    font-size: 0.6rem;
    font-weight: 600;
    line-height: 1;
    flex-shrink: 0;
}

.menu-role-item.active .mgr-role-count-badge[b-9dlpuxf1ud] {
    background: #d2e3fc;
    color: #1557b0;
}

.mgr-role-star[b-9dlpuxf1ud] {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.65rem;
    color: #6b7280;
    cursor: pointer;
    opacity: 0.25;
    transition: all 0.15s;
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mgr-role-clone[b-9dlpuxf1ud] {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.6rem;
    color: #6b7280;
    cursor: pointer;
    opacity: 0.25;
    transition: all 0.15s;
    flex-shrink: 0;
    width: 16px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 1px;
}

.menu-role-item:hover .mgr-role-clone[b-9dlpuxf1ud],
.menu-role-item:hover .mgr-role-star[b-9dlpuxf1ud] {
    opacity: 0.6;
}

.mgr-role-clone:hover[b-9dlpuxf1ud] {
    opacity: 1 !important;
    color: #2563EB;
}

.mgr-role-toggle[b-9dlpuxf1ud] {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.65rem;
    color: #6b7280;
    cursor: pointer;
    opacity: 0.25;
    transition: all 0.15s;
    flex-shrink: 0;
    width: 16px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.menu-role-item:hover .mgr-role-toggle[b-9dlpuxf1ud] {
    opacity: 0.6;
}

.mgr-role-toggle:hover[b-9dlpuxf1ud] {
    opacity: 1 !important;
    color: #dc2626;
}

.mgr-role-edit[b-9dlpuxf1ud] {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.6rem;
    color: #6b7280;
    cursor: pointer;
    opacity: 0.25;
    transition: all 0.15s;
    flex-shrink: 0;
    width: 16px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.menu-role-item:hover .mgr-role-edit[b-9dlpuxf1ud] {
    opacity: 0.6;
}

.mgr-role-edit:hover[b-9dlpuxf1ud] {
    opacity: 1 !important;
    color: #2563EB;
}

.mgr-role-star:hover[b-9dlpuxf1ud] {
    opacity: 1 !important;
    color: #f59e0b;
}

.mgr-role-star.active[b-9dlpuxf1ud] {
    opacity: 1;
    color: #f59e0b;
}

/* ============================================================
   Searchable Select (para modal de clonar)
   ============================================================ */

.searchable-select[b-9dlpuxf1ud] {
    position: relative;
}

.searchable-select-input[b-9dlpuxf1ud] {
    font-size: 0.82rem;
    padding: 4px 28px 4px 10px;
    height: 34px;
    border-color: #d1d5db;
}

.searchable-select-input:focus[b-9dlpuxf1ud] {
    border-color: #1a73e8;
    box-shadow: 0 0 0 2px rgba(26,115,232,0.15);
}

.searchable-select-clear[b-9dlpuxf1ud] {
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    padding: 2px 4px;
    font-size: 0.6rem;
    line-height: 1;
}

.searchable-select-clear:hover[b-9dlpuxf1ud] {
    color: #dc2626;
}

.searchable-select-dropdown[b-9dlpuxf1ud] {
    position: absolute;
    z-index: 1060;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
    max-height: 180px;
    overflow-y: auto;
    margin-top: 2px;
}

.searchable-select-option[b-9dlpuxf1ud] {
    display: flex;
    align-items: center;
    padding: 6px 10px;
    font-size: 0.78rem;
    color: #374151;
    cursor: pointer;
    transition: background 0.1s;
    border-bottom: 1px solid #f3f4f6;
}

.searchable-select-option:last-child[b-9dlpuxf1ud] {
    border-bottom: none;
}

.searchable-select-option:hover[b-9dlpuxf1ud] {
    background: #f3f4f6;
}

.searchable-select-option.active[b-9dlpuxf1ud] {
    background: #e8f0fe;
    color: #1a73e8;
    font-weight: 500;
}

.searchable-select-empty[b-9dlpuxf1ud] {
    text-align: center;
    padding: 12px 10px;
    color: #9ca3af;
    font-size: 0.75rem;
    font-style: italic;
}

.searchable-select-dropdown[b-9dlpuxf1ud]::-webkit-scrollbar {
    width: 4px;
}
.searchable-select-dropdown[b-9dlpuxf1ud]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 2px;
}

/* ── Barra de favoritos ── */

.mgr-fav-bar[b-9dlpuxf1ud] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 16px;
    background: #fffbeb;
    border-bottom: 1px solid #fde68a;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.mgr-fav-bar-icon[b-9dlpuxf1ud] {
    font-size: 0.65rem;
    color: #f59e0b;
    flex-shrink: 0;
}

.mgr-fav-pill[b-9dlpuxf1ud] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    background: #fff;
    border: 1px solid #fde68a;
    border-radius: 14px;
    font-size: 0.75rem;
    color: #92400e;
    cursor: pointer;
    transition: all 0.12s;
    white-space: nowrap;
}

.mgr-fav-pill:hover[b-9dlpuxf1ud] {
    background: #fef3c7;
    border-color: #f59e0b;
}

.mgr-fav-pill.active[b-9dlpuxf1ud] {
    background: #f59e0b;
    border-color: #d97706;
    color: #fff;
}

.mgr-fav-pill i[b-9dlpuxf1ud] {
    font-size: 0.6rem;
}

.mgr-fav-pill-remove[b-9dlpuxf1ud] {
    background: none;
    border: none;
    padding: 0;
    margin-left: 2px;
    font-size: 0.55rem;
    color: inherit;
    cursor: pointer;
    opacity: 0.5;
    line-height: 1;
}

.mgr-fav-pill-remove:hover[b-9dlpuxf1ud] {
    opacity: 1;
}

.menu-role-footer[b-9dlpuxf1ud] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    font-size: 0.7rem;
    color: #9ca3af;
    border-top: 1px solid #e2e4e9;
    background: #f9fafb;
}

.menu-role-footer i[b-9dlpuxf1ud] {
    font-size: 0.7rem;
}

/* ── Panel derecho: árbol ── */

.menu-tree-panel[b-9dlpuxf1ud] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.menu-tree-toolbar[b-9dlpuxf1ud] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 14px;
    border-bottom: 1px solid #e2e4e9;
    background: #fff;
    flex-shrink: 0;
}

.menu-tree-wrapper[b-9dlpuxf1ud] {
    flex: 1;
    overflow-y: auto;
    background: #fff;
    padding-bottom: 16px;
    scrollbar-width: thin;
}

.menu-tree-wrapper[b-9dlpuxf1ud]::-webkit-scrollbar {
    width: 5px;
}

.menu-tree-wrapper[b-9dlpuxf1ud]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 3px;
}

.menu-tree-wrapper[b-9dlpuxf1ud]::-webkit-scrollbar-track {
    background: #f3f4f6;
}

/* ── Barra inferior del árbol ── */

.menu-tree-footer[b-9dlpuxf1ud] {
    display: flex;
    align-items: center;
    padding: 6px 14px;
    border-top: 1px solid #e2e4e9;
    background: #f9fafb;
    flex-shrink: 0;
    gap: 8px;
}

.menu-tree-footer-count[b-9dlpuxf1ud] {
    font-size: 0.72rem;
    color: #6b7280;
}

.menu-tree-footer-count i[b-9dlpuxf1ud] {
    font-size: 0.65rem;
    color: #9ca3af;
}

/* ── Filas del árbol ── */

.menu-tree-row[b-9dlpuxf1ud] {
    display: flex;
    align-items: center;
    padding: 6px 10px;
    border-bottom: 1px solid #f3f4f6;
    gap: 6px;
    transition: background 0.12s;
    min-height: 38px;
    font-size: 0.8rem;
}

.menu-tree-row:hover[b-9dlpuxf1ud] {
    background: #f9fafb;
}

.menu-tree-wrapper .menu-tree-row:last-child[b-9dlpuxf1ud] {
    border-bottom: none;
}

.menu-tree-row.inactive[b-9dlpuxf1ud] {
    opacity: 0.55;
    background: #f9fafb;
}

.menu-tree-row.inactive .menu-tree-name[b-9dlpuxf1ud] {
    font-style: italic;
    color: #9ca3af;
}

.menu-tree-row.inactive .menu-tree-icon[b-9dlpuxf1ud] {
    color: #d1d5db;
}

.menu-tree-row.inactive .menu-tree-page-info[b-9dlpuxf1ud] {
    opacity: 0.5;
}

.menu-tree-toggle[b-9dlpuxf1ud] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    cursor: pointer;
    color: #9ca3af;
    transition: transform 0.15s;
    flex-shrink: 0;
    font-size: 0.7rem;
}

.menu-tree-toggle.expanded[b-9dlpuxf1ud] {
    transform: rotate(90deg);
}

.menu-tree-icon[b-9dlpuxf1ud] {
    width: 28px;
    text-align: center;
    color: #9ca3af;
    flex-shrink: 0;
    font-size: 1.15rem;
    line-height: 1;
}

.menu-tree-col-name[b-9dlpuxf1ud] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 4px;
    overflow: hidden;
}

.menu-tree-name[b-9dlpuxf1ud] {
    cursor: default;
    font-size: 0.85rem;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #374151;
}

.menu-tree-name:hover[b-9dlpuxf1ud] {
    color: #1a73e8;
}

.menu-tree-col-badges[b-9dlpuxf1ud] {
    display: flex;
    align-items: center;
    gap: 3px;
    width: 130px;
    flex-shrink: 0;
    justify-content: center;
}

.menu-tree-col-actions[b-9dlpuxf1ud] {
    display: flex;
    align-items: center;
    gap: 2px;
    flex-shrink: 0;
    width: 180px;
    justify-content: flex-end;
    opacity: 0.2;
    transition: opacity 0.15s;
}

.menu-tree-row:hover .menu-tree-col-actions[b-9dlpuxf1ud] {
    opacity: 1;
}

.menu-tree-page-info[b-9dlpuxf1ud] {
    font-size: 0.7rem;
    color: #6b7280;
    background: #f3f4f6;
    padding: 1px 6px;
    border-radius: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 240px;
    flex-shrink: 0;
    border: 1px solid #e5e7eb;
    line-height: 1.4;
    margin-left: auto;
}

.menu-tree-page-info:hover[b-9dlpuxf1ud] {
    background: #e5e7eb;
    color: #374151;
}

/* ── Edición inline ── */

.edit-inline-group[b-9dlpuxf1ud] {
    display: flex;
    align-items: center;
    flex: 1;
    gap: 4px;
}

.edit-name-input[b-9dlpuxf1ud] {
    flex: 1;
    min-width: 100px;
    font-size: 0.78rem;
    height: 28px;
}

/* ── Acciones ── */

.btn-action[b-9dlpuxf1ud] {
    background: none;
    border: 1px solid transparent;
    color: #6b7280;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.12s;
    font-size: 0.85rem;
    padding: 0;
    line-height: 1;
}

.btn-action:hover[b-9dlpuxf1ud] {
    background: #f3f4f6;
    border-color: #e5e7eb;
    color: #374151;
}

.btn-action.text-danger:hover[b-9dlpuxf1ud] {
    background: #fef2f2;
    border-color: #fecaca;
    color: #dc2626;
}

/* ============================================================
   Selector de páginas en modal
   ============================================================ */

.page-search-results[b-9dlpuxf1ud] {
    max-height: 160px;
    overflow-y: auto;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #fff;
}

.page-results-list[b-9dlpuxf1ud] {
    display: flex;
    flex-direction: column;
}

.page-result-item[b-9dlpuxf1ud] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    cursor: pointer;
    border-bottom: 1px solid #f3f4f6;
    transition: background 0.1s;
    font-size: 0.78rem;
}

.page-result-item:last-child[b-9dlpuxf1ud] {
    border-bottom: none;
}

.page-result-item:hover[b-9dlpuxf1ud] {
    background: #f3f4f6;
}

.page-result-item.active[b-9dlpuxf1ud] {
    background: #e8f0fe;
}

.page-result-info[b-9dlpuxf1ud] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.page-result-name[b-9dlpuxf1ud] {
    font-weight: 500;
    color: #374151;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.page-result-path[b-9dlpuxf1ud] {
    font-size: 0.65rem;
    color: #9ca3af;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.page-result-id[b-9dlpuxf1ud] {
    font-size: 0.6rem;
    flex-shrink: 0;
}

.page-selected-badge[b-9dlpuxf1ud] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 6px 10px;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 6px;
    font-size: 0.75rem;
    color: #166534;
}

.page-new-fields[b-9dlpuxf1ud] {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 10px;
}

/* ============================================================
   Selector visual de iconos
   ============================================================ */

.icon-picker-trigger[b-9dlpuxf1ud] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 8px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    cursor: pointer;
    background: #fff;
    transition: border-color 0.12s;
    min-height: 30px;
    font-size: 0.78rem;
}

.icon-picker-trigger:hover[b-9dlpuxf1ud] {
    border-color: #1a73e8;
}

.icon-picker-preview[b-9dlpuxf1ud] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    background: #f3f4f6;
    border-radius: 3px;
    font-size: 0.75rem;
    color: #374151;
    flex-shrink: 0;
}

.icon-picker-label[b-9dlpuxf1ud] {
    flex: 1;
    color: #374151;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.72rem;
}

.icon-picker-arrow[b-9dlpuxf1ud] {
    font-size: 0.55rem;
    color: #9ca3af;
    transition: transform 0.15s;
    flex-shrink: 0;
}

.icon-picker-grid[b-9dlpuxf1ud] {
    position: absolute;
    z-index: 1060;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
    padding: 8px;
    max-height: 200px;
    overflow-y: auto;
    width: 232px;
    margin-top: 4px;
}

.icon-picker-item[b-9dlpuxf1ud] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.8rem;
    color: #6b7280;
    transition: all 0.1s;
    border: 1px solid transparent;
}

.icon-picker-item:hover[b-9dlpuxf1ud] {
    background: #e8f0fe;
    color: #1a73e8;
    border-color: #1a73e8;
}

.icon-picker-item.active[b-9dlpuxf1ud] {
    background: #1a73e8;
    color: #fff;
    border-color: #1a73e8;
}

/* Scrollbar del picker */
.icon-picker-grid[b-9dlpuxf1ud]::-webkit-scrollbar {
    width: 4px;
}
.icon-picker-grid[b-9dlpuxf1ud]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 2px;
}
/* /Presentation/Components/Pages/Dashboard/Components/NotificationsPanel.razor.rz.scp.css */
@media (max-width: 1399.98px) {
    .notif-kpi-grid[b-c627tdkkz0] { grid-template-columns: repeat(2, 1fr) !important; }
}

@media (max-width: 575.98px) {
    .notif-kpi-grid[b-c627tdkkz0] { grid-template-columns: 1fr !important; }
}

.notif-card-list[b-c627tdkkz0] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    margin-bottom: 0.25rem;
    height: 250px;
    overflow-y: auto;
    overflow-x: hidden;
}

/* Scrollbar sutil para la lista de notificaciones */
.notif-card-list[b-c627tdkkz0]::-webkit-scrollbar {
    width: 4px;
}
.notif-card-list[b-c627tdkkz0]::-webkit-scrollbar-track {
    background: transparent;
}
.notif-card-list[b-c627tdkkz0]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 4px;
}
.notif-card-list[b-c627tdkkz0]::-webkit-scrollbar-thumb:hover {
    background: #9ca3af;
}

.notif-kpi-item[b-c627tdkkz0] {
    cursor: pointer;
    transition: background 0.12s ease;
    border-radius: 4px;
}

.notif-kpi-item:hover[b-c627tdkkz0] {
    background: #f5f7fa;
}

.notif-kpi-item.notif-read[b-c627tdkkz0] {
    opacity: 0.55;
}

.notif-kpi-item.notif-read:hover[b-c627tdkkz0] {
    opacity: 0.75;
}
/* /Presentation/Components/Pages/Dashboard/Components/NotificationTooltip.razor.rz.scp.css */
.notif-tooltip-overlay[b-l1ryc9uklt] {
    position: fixed;
    inset: 0;
    z-index: 99999;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    animation: nt-fade-in-b-l1ryc9uklt 0.2s ease;
}

.notif-tooltip-dialog[b-l1ryc9uklt] {
    width: 100%;
    max-width: 500px;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 30px 80px rgba(0,0,0,0.35), 0 10px 30px rgba(0,0,0,0.12);
    overflow: hidden;
    animation: nt-scale-in-b-l1ryc9uklt 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

/* ── Header ── */
.nt-header[b-l1ryc9uklt] {
    padding: 1.5rem 1.5rem 1rem;
}

.nt-icon[b-l1ryc9uklt] {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.1rem;
    flex-shrink: 0;
    box-shadow: 0 4px 14px rgba(0,0,0,0.15);
}

.nt-title[b-l1ryc9uklt] {
    font-size: 1rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.35;
}

.nt-close[b-l1ryc9uklt] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: none;
    background: rgba(0,0,0,0.05);
    color: #6b7280;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 0.8rem;
    transition: all 0.15s ease;
    flex-shrink: 0;
}

.nt-close:hover[b-l1ryc9uklt] {
    background: rgba(0,0,0,0.1);
    color: #374151;
}

/* ── Badges ── */
.nt-badge-severity[b-l1ryc9uklt] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.nt-badge-category[b-l1ryc9uklt] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    font-size: 0.65rem;
    font-weight: 500;
    background: #f3f4f6;
    color: #6b7280;
}

.nt-badge-category i[b-l1ryc9uklt] {
    font-size: 0.5rem;
}

/* ── Body ── */
.nt-body[b-l1ryc9uklt] {
    padding: 0.75rem 1.5rem 1rem;
}

.nt-message[b-l1ryc9uklt] {
    font-size: 0.9rem;
    line-height: 1.7;
    color: #1f2937;
    white-space: pre-wrap;
    word-break: break-word;
    margin-bottom: 0.75rem;
}

.nt-divider[b-l1ryc9uklt] {
    height: 1px;
    background: #f3f4f6;
    margin: 0.75rem 0;
}

.nt-meta[b-l1ryc9uklt] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.72rem;
    color: #9ca3af;
}

.nt-meta i[b-l1ryc9uklt] {
    font-size: 0.65rem;
    width: 14px;
    text-align: center;
}

.nt-btn-markread[b-l1ryc9uklt] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 0.75rem;
    padding: 0.35rem 0.9rem;
    border-radius: 8px;
    font-size: 0.75rem;
    font-weight: 500;
    background: transparent;
    border: 1px solid;
    cursor: pointer;
    transition: all 0.15s ease;
}

.nt-btn-markread:hover[b-l1ryc9uklt] {
    background: rgba(0,0,0,0.04);
}

.nt-read-status[b-l1ryc9uklt] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 0.75rem;
    font-size: 0.75rem;
    color: #6b7280;
}

/* ── Footer ── */
.nt-footer[b-l1ryc9uklt] {
    padding: 0.5rem 1.5rem 1.25rem;
    display: flex;
    justify-content: flex-end;
}

.nt-btn-cerrar[b-l1ryc9uklt] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1.5rem;
    border: none;
    border-radius: 10px;
    color: #fff;
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.nt-btn-cerrar:hover[b-l1ryc9uklt] {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.2);
}

.nt-btn-cerrar:active[b-l1ryc9uklt] {
    transform: translateY(0);
}

/* ── Detalle de cita (AdditionalData) ── */
.nt-detail-section[b-l1ryc9uklt] {
    background: #f8fafc;
    border-radius: 12px;
    padding: 0.85rem 1rem;
    margin-bottom: 0.75rem;
    border: 1px solid #e2e8f0;
}

.nt-detail-title[b-l1ryc9uklt] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.65rem;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.nt-detail-title i[b-l1ryc9uklt] {
    font-size: 0.65rem;
    color: #0D8ABC;
}

.nt-detail-grid[b-l1ryc9uklt] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.35rem 0.75rem;
    align-items: baseline;
}

.nt-detail-row[b-l1ryc9uklt] {
    display: contents;
}

.nt-detail-label[b-l1ryc9uklt] {
    font-size: 0.68rem;
    font-weight: 500;
    color: #94a3b8;
    white-space: nowrap;
    min-width: 80px;
}

.nt-detail-value[b-l1ryc9uklt] {
    font-size: 0.78rem;
    font-weight: 500;
    color: #1e293b;
    word-break: break-word;
}

.nt-detail-highlight .nt-detail-label[b-l1ryc9uklt] {
    color: #0D8ABC;
    font-weight: 600;
}

.nt-detail-highlight .nt-detail-value[b-l1ryc9uklt] {
    color: #0f172a;
    font-weight: 600;
}

/* ── Animaciones ── */
@keyframes nt-fade-in-b-l1ryc9uklt {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes nt-scale-in-b-l1ryc9uklt {
    from {
        opacity: 0;
        transform: scale(0.88) translateY(20px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}
/* /Presentation/Components/Pages/Dashboard/DashboardHospital.razor.rz.scp.css */

.dashboard-layout[b-hfo9eoqs6y] {
    max-width: 1600px;
    margin: 0 auto;
    padding: 1.5rem 2rem;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* ── KPI Grid (columnas dinámicas: se divide el ancho según la cantidad de indicadores activos) ── */
.kpi-grid[b-hfo9eoqs6y] {
    display: grid;
    grid-template-columns: repeat(var(--kpi-cols, 8), minmax(0, 1fr));
    gap: 0.85rem;
}

/* En pantallas < 1400px: máximo 4 columnas; < 992px: máximo 2 columnas; < 576px: 1 columna.
   min() mantiene la división por cantidad sin exceder el límite del breakpoint. */
@media (max-width: 1399.98px) { .kpi-grid[b-hfo9eoqs6y] { grid-template-columns: repeat(min(var(--kpi-cols, 8), 4), minmax(0, 1fr)); } }
@media (max-width: 991.98px)  { .kpi-grid[b-hfo9eoqs6y] { grid-template-columns: repeat(min(var(--kpi-cols, 8), 2), minmax(0, 1fr)); } }
@media (max-width: 575.98px)  { .kpi-grid[b-hfo9eoqs6y] { grid-template-columns: repeat(1, minmax(0, 1fr)); } }

/* ── Skeleton loading ── */
.kpi-card-skeleton[b-hfo9eoqs6y] {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 10px;
    padding: 0.9rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.kpi-card-skeleton > div[b-hfo9eoqs6y] {
    background: #f1f3f5;
    border-radius: 4px;
    animation: dash-skel-b-hfo9eoqs6y 1.5s ease-in-out infinite;
}

.skeleton-icon[b-hfo9eoqs6y] { width: 28px; height: 28px; border-radius: 8px; }
.skeleton-text[b-hfo9eoqs6y] { width: 55%; height: 10px; }
.skeleton-value[b-hfo9eoqs6y] { width: 35%; height: 26px; }
.skeleton-bar[b-hfo9eoqs6y] { width: 100%; height: 6px; margin-top: auto; border-radius: 4px; }

@keyframes dash-skel-b-hfo9eoqs6y {
    0%, 100% { opacity: 0.5; }
    50% { opacity: 1; }
}

/* ── Pulse Bar (100% custom) ── */
.pulse-bar[b-hfo9eoqs6y] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1.25rem;
    border-radius: 12px;
    background: linear-gradient(135deg, #f0f9ff, #e0f2fe);
    border: 1px solid #bae6fd;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.pulse-bar.pulse-warning[b-hfo9eoqs6y] {
    background: linear-gradient(135deg, #fffbeb, #fef3c7);
    border-color: #fde68a;
}

.pulse-bar.pulse-critical[b-hfo9eoqs6y] {
    background: linear-gradient(135deg, #fef2f2, #fecaca);
    border-color: #fca5a5;
}

.pulse-dot[b-hfo9eoqs6y] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.pulse-dot.pulse-normal[b-hfo9eoqs6y] { background: #10B981; box-shadow: 0 0 8px rgba(16,185,129,0.5); }
.pulse-dot.pulse-warning[b-hfo9eoqs6y] { background: #F59E0B; box-shadow: 0 0 8px rgba(245,158,11,0.5); }
.pulse-dot.pulse-critical[b-hfo9eoqs6y] { background: #EF4444; box-shadow: 0 0 8px rgba(239,68,68,0.5); }

/* ── KPI Card hover ── */
.kpi-card[b-hfo9eoqs6y] {
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.kpi-card:hover[b-hfo9eoqs6y] {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.08);
}

/* ── Live Feed max-height ── */
.feed-list[b-hfo9eoqs6y] {
    max-height: 340px;
    overflow-y: auto;
}

.notifications-list[b-hfo9eoqs6y] {
    max-height: 300px;
    overflow-y: auto;
}

.live-feed-item:hover[b-hfo9eoqs6y] {
    background: #f8f9fa;
    border-radius: 6px;
}

/* ── Priority list spacing ── */
.priority-list[b-hfo9eoqs6y] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* ── Logo del header del Dashboard ── */
.dashboard-header-logo[b-hfo9eoqs6y] {
    height: 55px !important;
    max-width: 100px !important;
    border: 2px solid #EAEAEA;
}

/* ── Status dot para badges de integraciones ── */
.status-dot[b-hfo9eoqs6y] {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin-right: 0.3rem;
    vertical-align: middle;
    animation: dot-pulse-b-hfo9eoqs6y 2s ease-in-out infinite;
}

@keyframes dot-pulse-b-hfo9eoqs6y {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes dash-pulse-dot-b-hfo9eoqs6y {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}

.min-h-chart[b-hfo9eoqs6y] { min-height: 220px; }
/* /Presentation/Components/Pages/Herramientas/BacklogIdeas.razor.rz.scp.css */
/* ============================================================
   LAYOUT — EXACTO InstitucionPanel / Configuracion Mensajeria
   ============================================================ */

.editor-container[b-tt107x1kwu] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

.editor-header[b-tt107x1kwu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-tt107x1kwu] {
    font-size: 13px;
}

.editor-header-right[b-tt107x1kwu] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.editor-title-bar[b-tt107x1kwu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-tt107x1kwu],
.editor-title-bar .fw-semibold[b-tt107x1kwu],
.editor-title-bar small[b-tt107x1kwu] {
    color: #1a1d23 !important;
}

/* ===== PESTANAS — EXACTO InstitucionPanel / Configuracion ===== */

.editor-tabs.nav-tabs[b-tt107x1kwu] {
    border-bottom: none !important;
    display: flex;
    padding: 0 !important;
    margin: 0 !important;
    background: #e8eaed;
    list-style: none;
    gap: 0;
    position: relative;
    height: 44px;
    flex-shrink: 0;
    min-height: 44px;
}

.editor-tabs .nav-item[b-tt107x1kwu] {
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
    display: flex;
    align-items: stretch;
}

.editor-tabs .nav-item:first-child[b-tt107x1kwu] {
    margin: 0 !important;
    padding: 0 !important;
}

.editor-tabs .nav-link[b-tt107x1kwu] {
    display: flex !important;
    align-items: center !important;
    justify-content: center;
    gap: 7px;
    padding: 0 20px !important;
    margin: 0 !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    color: #5f6368 !important;
    border: none !important;
    background: transparent !important;
    transition: all 0.15s ease;
    cursor: pointer;
    white-space: nowrap;
    position: relative;
    height: 44px !important;
    text-decoration: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

.editor-tabs .nav-link:hover[b-tt107x1kwu] {
    color: #202124 !important;
    background: rgba(0, 0, 0, 0.04) !important;
}

.editor-tabs .nav-link.active[b-tt107x1kwu] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
    height: 44px !important;
    padding: 0 20px !important;
    margin: 0 !important;
}

.editor-tabs .nav-item:first-child .nav-link.active[b-tt107x1kwu] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
}

.editor-tabs .nav-link.active[b-tt107x1kwu]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 12px;
    right: 12px;
    height: 3px;
    background: #1a73e8;
    border-radius: 3px 3px 0 0;
}

.editor-tabs .nav-item:not(:last-child) .nav-link:not(.active)[b-tt107x1kwu]::after {
    content: '';
    position: absolute;
    right: 0;
    top: 10px;
    bottom: 10px;
    width: 1px;
    background: #dadce0;
}

.editor-tabs .nav-link i[b-tt107x1kwu] {
    font-size: 14px;
    width: 16px;
    text-align: center;
    color: inherit;
}

/* ===== CONTENIDO — FILTRO FIJO ARRIBA + LISTA SCROLL ===== */

.editor-tab-content[b-tt107x1kwu] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Filtro: barra toolbar compacta, fija arriba */
.editor-tab-content > .backlog-filters[b-tt107x1kwu] {
    flex-shrink: 0;
    padding: 8px 24px 0;
}

/* ===== TOOLBAR COMPACTA — una sola fila ===== */

.backlog-toolbar[b-tt107x1kwu] {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #fff;
    border: 1px solid #e2e4e9;
    border-radius: 6px;
    padding: 5px 10px;
    min-height: 38px;
    flex-wrap: nowrap;
    overflow-x: auto;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}

/* Grupo base: icono + input/select */
.bt-group[b-tt107x1kwu] {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    position: relative;
}

.bt-icon[b-tt107x1kwu] {
    font-size: 0.7rem;
    color: #6b7280;
    width: 14px;
    text-align: center;
    flex-shrink: 0;
}

.bt-group input[type="text"][b-tt107x1kwu],
.bt-group select[b-tt107x1kwu] {
    height: 26px;
    padding: 0 6px;
    font-size: 0.72rem;
    line-height: 1;
    border: 1px solid #d1d5db;
    border-radius: 3px;
    background: #fff;
    color: #1f2937;
    outline: none;
    min-width: 0;
    transition: border-color 0.15s ease;
}

.bt-group input[type="text"]:focus[b-tt107x1kwu],
.bt-group select:focus[b-tt107x1kwu] {
    border-color: #1a73e8;
    box-shadow: 0 0 0 2px rgba(26,115,232,0.12);
}

.bt-group input[type="text"][b-tt107x1kwu] {
    width: 100px;
}

.bt-group select[b-tt107x1kwu] {
    width: 72px;
    cursor: pointer;
    padding-right: 18px;
}

/* Busqueda — mas ancha */
.bt-search[b-tt107x1kwu] {
    flex: 0 0 auto;
    min-width: 80px;
}

.bt-search-inner[b-tt107x1kwu] {
    display: flex;
    align-items: center;
    width: 260px;
    position: relative;
}

.bt-search-inner .bt-icon[b-tt107x1kwu] {
    position: absolute;
    left: 6px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.6rem;
    color: #9ca3af;
    pointer-events: none;
    z-index: 1;
}

.bt-search-inner input[b-tt107x1kwu] {
    width: 100%;
    height: 26px;
    padding: 0 22px 0 22px;
    font-size: 0.72rem;
    line-height: 1;
    border: 1px solid #d1d5db;
    border-radius: 3px;
    background: #fff;
    color: #1f2937;
    outline: none;
    transition: border-color 0.15s ease;
}

.bt-search-inner input:focus[b-tt107x1kwu] {
    border-color: #1a73e8;
    box-shadow: 0 0 0 2px rgba(26,115,232,0.12);
}

.bt-search-inner input[b-tt107x1kwu]::placeholder {
    color: #9ca3af;
    font-size: 0.7rem;
}

.bt-clear[b-tt107x1kwu] {
    position: absolute;
    right: 3px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #9ca3af;
    cursor: pointer;
    font-size: 0.6rem;
    line-height: 1;
}

.bt-clear:hover[b-tt107x1kwu] {
    color: #6b7280;
}

/* Separador vertical */
.bt-sep[b-tt107x1kwu] {
    width: 1px;
    height: 20px;
    background: #e2e4e9;
    flex-shrink: 0;
    margin: 0 2px;
}

/* Rango de fechas */
.bt-date-range[b-tt107x1kwu] {
    gap: 2px;
}

.bt-date-range input[type="date"][b-tt107x1kwu] {
    height: 26px;
    padding: 0 4px;
    font-size: 0.68rem;
    line-height: 1;
    border: 1px solid #d1d5db;
    border-radius: 3px;
    background: #fff;
    color: #1f2937;
    outline: none;
    width: 86px;
    min-width: 0;
    cursor: pointer;
    transition: border-color 0.15s ease;
}

.bt-date-range input[type="date"]:focus[b-tt107x1kwu] {
    border-color: #1a73e8;
    box-shadow: 0 0 0 2px rgba(26,115,232,0.12);
}

.bt-date-sep[b-tt107x1kwu] {
    color: #9ca3af;
    font-size: 0.65rem;
    flex-shrink: 0;
}

/* Periodo rapido — icon buttons */
.bt-period[b-tt107x1kwu] {
    display: flex;
    gap: 2px;
    flex-shrink: 0;
}

.bt-period button[b-tt107x1kwu] {
    width: 26px;
    height: 26px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d1d5db;
    border-radius: 3px;
    background: #fff;
    color: #6b7280;
    cursor: pointer;
    font-size: 0.65rem;
    transition: all 0.15s ease;
}

.bt-period button:hover[b-tt107x1kwu] {
    background: #f3f4f6;
    border-color: #9ca3af;
}

.bt-period button.active[b-tt107x1kwu],
.bt-period button.btn-primary[b-tt107x1kwu] {
    background: #1a73e8;
    border-color: #1a73e8;
    color: #fff;
}

/* Resultados */
.bt-results[b-tt107x1kwu] {
    display: flex;
    align-items: center;
    gap: 3px;
    font-size: 0.72rem;
    color: #374151;
    white-space: nowrap;
    flex-shrink: 0;
}

.bt-results strong[b-tt107x1kwu] {
    font-size: 0.8rem;
    color: #1f2937;
}

.bt-results-label[b-tt107x1kwu] {
    color: #6b7280;
    font-size: 0.68rem;
}

.bt-sort-indicator[b-tt107x1kwu] {
    display: inline-flex;
    align-items: center;
    color: #9ca3af;
    margin-left: 4px;
}

.bt-badge-filtrado[b-tt107x1kwu] {
    background: #fef3c7;
    color: #d97706;
    font-size: 0.6rem;
    font-weight: 500;
    padding: 1px 6px;
    border-radius: 3px;
    margin-left: 2px;
}

/* Boton limpiar todo */
.bt-clear-all[b-tt107x1kwu] {
    width: 26px;
    height: 26px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 3px;
    background: transparent;
    color: #9ca3af;
    cursor: pointer;
    font-size: 0.7rem;
    transition: all 0.15s ease;
    flex-shrink: 0;
}

.bt-clear-all:hover[b-tt107x1kwu] {
    background: #f3f4f6;
    border-color: #d1d5db;
    color: #6b7280;
}

.bt-clear-all.has-filters[b-tt107x1kwu] {
    color: #dc2626;
    border-color: #fecaca;
    background: #fef2f2;
}

.bt-clear-all.has-filters:hover[b-tt107x1kwu] {
    background: #fee2e2;
    color: #b91c1c;
}

/* Responsive: toolbar se hace scroll horizontal */
@media (max-width: 1199.98px) {
    .backlog-toolbar[b-tt107x1kwu] {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        flex-wrap: nowrap;
    }
    .bt-search[b-tt107x1kwu] {
        flex: 0 0 120px;
    }
    .bt-group input[type="text"][b-tt107x1kwu] {
        width: 80px;
    }
    .bt-date-range input[type="date"][b-tt107x1kwu] {
        width: 72px;
    }
}

@media (max-width: 767.98px) {
    .editor-tab-content > .backlog-filters[b-tt107x1kwu] {
        padding: 6px 12px 0;
    }
    .backlog-toolbar[b-tt107x1kwu] {
        padding: 4px 8px;
        gap: 4px;
    }
    .bt-group select[b-tt107x1kwu] {
        width: 60px;
    }
    .bt-date-range input[type="date"][b-tt107x1kwu] {
        width: 64px;
    }
    .bt-search[b-tt107x1kwu] {
        flex: 0 0 100px;
        min-width: 60px;
    }
}

/* Lista de ideas: scroll independiente */
.editor-tab-content > .backlog-list[b-tt107x1kwu] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 12px 24px 24px;
}

/* Mensajes de alerta: fuera del scroll pero visibles */
.editor-tab-content > .backlog-alerts[b-tt107x1kwu] {
    flex-shrink: 0;
    padding: 12px 24px 0;
}

/* ============================================================
   TARJETAS DE IDEAS — estilo propio del modulo
   ============================================================ */

/* Badges de informacion en la tabla — 3px mas de padding */
#backlog-table .badge[b-tt107x1kwu] {
    padding: calc(0.35em + 3px) calc(0.65em + 3px);
    line-height: 1;
}

.idea-card[b-tt107x1kwu] {
    transition: box-shadow 0.2s ease, transform 0.15s ease;
    border-radius: 8px;
    overflow: hidden;
}

.idea-card:hover[b-tt107x1kwu] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
    transform: translateY(-1px);
}

.idea-card .card-header[b-tt107x1kwu] {
    border-bottom: 1px solid #f3f4f6;
}

.idea-card .card-footer[b-tt107x1kwu] {
    border-top: 1px solid #f3f4f6;
}

/* ============================================================
   TIMELINE (historial en modal de detalle)
   ============================================================ */

.timeline[b-tt107x1kwu] {
    position: relative;
    padding-left: 28px;
}

.timeline[b-tt107x1kwu]::before {
    content: '';
    position: absolute;
    left: 8px;
    top: 4px;
    bottom: 4px;
    width: 2px;
    background: #e5e7eb;
}

.timeline-item[b-tt107x1kwu] {
    position: relative;
    padding-bottom: 16px;
}

.timeline-item:last-child[b-tt107x1kwu] {
    padding-bottom: 0;
}

.timeline-marker[b-tt107x1kwu] {
    position: absolute;
    left: -22px;
    top: 4px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid #e5e7eb;
    background: #fff;
    z-index: 1;
}

.timeline-marker.marker-primary[b-tt107x1kwu] { border-color: #2563eb; background: #dbeafe; }
.timeline-marker.marker-secondary[b-tt107x1kwu] { border-color: #6b7280; background: #f3f4f6; }
.timeline-marker.marker-warning[b-tt107x1kwu] { border-color: #d97706; background: #fef3c7; }
.timeline-marker.marker-info[b-tt107x1kwu] { border-color: #2563eb; background: #dbeafe; }
.timeline-marker.marker-success[b-tt107x1kwu] { border-color: #16a34a; background: #dcfce7; }
.timeline-marker.marker-danger[b-tt107x1kwu] { border-color: #dc2626; background: #fee2e2; }

.timeline-content[b-tt107x1kwu] {
    padding-top: 0;
}

.timeline-content p[b-tt107x1kwu] {
    margin-top: 2px;
}

/* ============================================================
   UTILIDADES
   ============================================================ */

label.required[b-tt107x1kwu]::after {
    content: ' *';
    color: #dc2626;
    font-weight: 600;
}

.dropdown-item i[b-tt107x1kwu] {
    width: 16px;
    text-align: center;
}

/* ============================================================
   RESPONSIVE — EXACTO Configuracion
   ============================================================ */

@media (max-width: 767.98px) {
    .editor-tab-content > *[b-tt107x1kwu] {
        padding: 12px 16px 16px;
    }

    .editor-tabs[b-tt107x1kwu] {
        overflow-x: auto;
    }
}
/* /Presentation/Components/Pages/Herramientas/Changelog.razor.rz.scp.css */
/* ============================================================
   CHANGELOG — Panel de cambios del sistema
   Layout exacto InstitucionPanel / BacklogIdeas
   ============================================================ */

/* ===== LAYOUT BASE (mismo patron BacklogIdeas/InstitucionPanel) ===== */

.editor-container[b-jfau5yunsq] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

.editor-header[b-jfau5yunsq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-jfau5yunsq] {
    font-size: 13px;
}

.editor-header-right[b-jfau5yunsq] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.editor-title-bar[b-jfau5yunsq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-jfau5yunsq],
.editor-title-bar .fw-semibold[b-jfau5yunsq],
.editor-title-bar small[b-jfau5yunsq] {
    color: #1a1d23 !important;
}

.editor-tab-content[b-jfau5yunsq] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* ===== TOOLBAR ===== */

.changelog-toolbar[b-jfau5yunsq] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 12px;
    flex-wrap: wrap;
}

.changelog-toolbar-left[b-jfau5yunsq] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.changelog-toolbar-right[b-jfau5yunsq] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.changelog-filter-btn[b-jfau5yunsq] {
    border: 1px solid #d1d5db;
    background: #fff;
    color: #4b5563;
    font-size: 0.75rem;
    padding: 5px 12px;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s ease;
    font-weight: 450;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    white-space: nowrap;
    line-height: 1.2;
    height: 32px;
    box-sizing: border-box;
}

.changelog-filter-btn:hover[b-jfau5yunsq] {
    border-color: #9ca3af;
    background: #f9fafb;
}

.changelog-filter-btn.active[b-jfau5yunsq] {
    background: #1a73e8;
    border-color: #1a73e8;
    color: #fff;
    padding: 5px 12px;
    height: 32px;
    max-height: none !important;
    min-height: 32px !important;
}

.changelog-filter-btn i[b-jfau5yunsq] {
    font-size: 0.7rem;
    line-height: 1;
}

/* ===== TOOLBAR: rango fechas, periodo, resultados ===== */

.cg-date-range[b-jfau5yunsq] {
    display: flex;
    align-items: center;
    gap: 2px;
    flex-shrink: 0;
}

.cg-dr-icon[b-jfau5yunsq] {
    font-size: 0.7rem;
    color: #6b7280;
    margin-right: 2px;
}

.cg-dr-input[b-jfau5yunsq] {
    height: 26px;
    padding: 0 6px;
    font-size: 0.72rem;
    line-height: 1;
    border: 1px solid #d1d5db;
    border-radius: 3px;
    background: #fff;
    color: #1f2937;
    outline: none;
    width: 120px;
    min-width: 0;
    cursor: pointer;
    transition: border-color 0.15s ease;
}

.cg-dr-input:focus[b-jfau5yunsq] {
    border-color: #1a73e8;
    box-shadow: 0 0 0 2px rgba(26,115,232,0.12);
}

.cg-dr-sep[b-jfau5yunsq] {
    color: #9ca3af;
    font-size: 0.65rem;
    flex-shrink: 0;
}

.cg-period[b-jfau5yunsq] {
    display: flex;
    gap: 2px;
    flex-shrink: 0;
}

.cg-period button[b-jfau5yunsq] {
    width: 26px;
    height: 26px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d1d5db;
    border-radius: 3px;
    background: #fff;
    color: #6b7280;
    cursor: pointer;
    font-size: 0.65rem;
    transition: all 0.15s ease;
}

.cg-period button:hover[b-jfau5yunsq] {
    background: #f3f4f6;
    border-color: #9ca3af;
}

.cg-period button.active[b-jfau5yunsq] {
    background: #1a73e8;
    border-color: #1a73e8;
    color: #fff;
}

.cg-sep[b-jfau5yunsq] {
    width: 1px;
    height: 20px;
    background: #e2e4e9;
    flex-shrink: 0;
    margin: 0 4px;
}

.cg-results[b-jfau5yunsq] {
    display: flex;
    align-items: center;
    font-size: 0.72rem;
    color: #374151;
    white-space: nowrap;
    flex-shrink: 0;
    min-width: 28px;
    justify-content: center;
}

.cg-results strong[b-jfau5yunsq] {
    font-size: 0.8rem;
    color: #1f2937;
}

.cg-clear[b-jfau5yunsq] {
    width: 26px;
    height: 26px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 3px;
    background: transparent;
    color: #9ca3af;
    cursor: pointer;
    font-size: 0.7rem;
    transition: all 0.15s ease;
    flex-shrink: 0;
}

.cg-clear:hover[b-jfau5yunsq] {
    background: #f3f4f6;
    border-color: #d1d5db;
    color: #6b7280;
}

.cg-clear.has-filters[b-jfau5yunsq] {
    color: #dc2626;
    border-color: #fecaca;
    background: #fef2f2;
}

.cg-clear.has-filters:hover[b-jfau5yunsq] {
    background: #fee2e2;
    color: #b91c1c;
}

.changelog-search-box[b-jfau5yunsq] {
    position: relative;
    display: flex;
    align-items: center;
}

.changelog-search-box input[b-jfau5yunsq] {
    border: 1px solid #d1d5db;
    border-radius: 6px;
    padding: 5px 12px 5px 30px;
    font-size: 0.75rem;
    width: 220px;
    outline: none;
    transition: border-color 0.15s ease;
    background: #fff;
    color: #1f2937;
}

.changelog-search-box input[b-jfau5yunsq]::placeholder {
    color: #9ca3af;
}

.changelog-search-box input:focus[b-jfau5yunsq] {
    border-color: #1a73e8;
    box-shadow: 0 0 0 2px rgba(26,115,232,0.15);
}

.changelog-search-box i[b-jfau5yunsq] {
    position: absolute;
    left: 10px;
    color: #9ca3af;
    font-size: 0.7rem;
    pointer-events: none;
}

/* ===== CONTENIDO PRINCIPAL (scroll independiente) ===== */

.changelog-content[b-jfau5yunsq] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    background: #f8f9fa;
    padding: 24px 32px;
}

/* ===== LAYOUT: sidebar + timeline ===== */

.changelog-layout[b-jfau5yunsq] {
    display: flex;
    gap: 28px;
    max-width: 1150px;
    margin: 0 auto;
    align-items: flex-start;
}

.changelog-sidebar[b-jfau5yunsq] {
    flex: 0 0 320px;
    position: sticky;
    top: 0;
    z-index: 1;
}

.changelog-main[b-jfau5yunsq] {
    flex: 1;
    min-width: 0;
}

/* ===== SIDEBAR CARD ===== */

.changelog-sidebar-card[b-jfau5yunsq] {
    background: #fff;
    border: 1px solid #e2e4e9;
    border-radius: 10px;
    padding: 20px 18px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

.changelog-sidebar-icon[b-jfau5yunsq] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: linear-gradient(135deg, #7c3aed, #6366f1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.1rem;
    margin-bottom: 14px;
    box-shadow: 0 2px 8px rgba(99,102,241,0.25);
}

.changelog-sidebar-title[b-jfau5yunsq] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 8px;
    letter-spacing: -0.01em;
}

.changelog-sidebar-desc[b-jfau5yunsq] {
    font-size: 0.78rem;
    color: #6b7280;
    line-height: 1.6;
    margin: 0 0 0;
}

.changelog-sidebar-desc strong[b-jfau5yunsq] {
    color: #374151;
}

.changelog-sidebar-divider[b-jfau5yunsq] {
    height: 1px;
    background: #e5e7eb;
    margin: 14px 0;
}

/* ===== SIDEBAR STATS ===== */

.changelog-sidebar-stats[b-jfau5yunsq] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.changelog-sidebar-stats .css-stat[b-jfau5yunsq] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.changelog-sidebar-stats .css-stat-icon[b-jfau5yunsq] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    flex-shrink: 0;
}

.changelog-sidebar-stats .css-stat div[b-jfau5yunsq] {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.changelog-sidebar-stats .css-stat strong[b-jfau5yunsq] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1f2937;
}

.changelog-sidebar-stats .css-stat small[b-jfau5yunsq] {
    font-size: 0.65rem;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

/* ===== SIDEBAR FOOTER ===== */

.changelog-sidebar-footer[b-jfau5yunsq] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 0.68rem;
    color: #9ca3af;
    line-height: 1.5;
}

.changelog-sidebar-footer i[b-jfau5yunsq] {
    margin-top: 2px;
    flex-shrink: 0;
}

/* ===== RESPONSIVE SIDEBAR ===== */

@media (max-width: 991.98px) {
    .changelog-layout[b-jfau5yunsq] {
        flex-direction: column;
        gap: 20px;
    }

    .changelog-sidebar[b-jfau5yunsq] {
        flex: none;
        width: 100%;
        position: static;
    }

    .changelog-sidebar-card[b-jfau5yunsq] {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 12px;
        padding: 14px 18px;
    }

    .changelog-sidebar-icon[b-jfau5yunsq] {
        margin-bottom: 0;
        width: 36px;
        height: 36px;
        font-size: 0.95rem;
    }

    .changelog-sidebar-title[b-jfau5yunsq] {
        margin-bottom: 0;
        font-size: 0.95rem;
    }

    .changelog-sidebar-desc[b-jfau5yunsq] {
        width: 100%;
        font-size: 0.75rem;
    }

    .changelog-sidebar-stats[b-jfau5yunsq] {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 8px 16px;
    }

    .changelog-sidebar-divider[b-jfau5yunsq] {
        display: none;
    }

    .changelog-sidebar-footer[b-jfau5yunsq] {
        width: 100%;
    }
}

/* ===== TIMELINE — linea vertical ===== */

.changelog-timeline[b-jfau5yunsq] {
    position: relative;
    max-width: 900px;
    margin: 0 auto;
    padding-left: 40px;
}

.changelog-timeline[b-jfau5yunsq]::before {
    content: '';
    position: absolute;
    left: 15px;
    top: 8px;
    bottom: 8px;
    width: 2px;
    background: linear-gradient(to bottom, #1a73e8, #6366f1, #1a73e8);
    border-radius: 1px;
}

/* ===== GRUPO POR MES/AÑO ===== */

.changelog-month-group[b-jfau5yunsq] {
    position: relative;
    margin-bottom: 32px;
}

.changelog-month-header[b-jfau5yunsq] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 16px;
    margin-left: -40px;
    padding-top: 4px;
}

.changelog-month-dot[b-jfau5yunsq] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #1a73e8, #6366f1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 0.75rem;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(26,115,232,0.3);
    position: relative;
    z-index: 1;
}

.changelog-month-title[b-jfau5yunsq] {
    font-size: 1rem;
    font-weight: 600;
    color: #1f2937;
    letter-spacing: -0.01em;
    margin: 0;
}

.changelog-month-count[b-jfau5yunsq] {
    background: #e5e7eb;
    color: #4b5563;
    font-size: 0.65rem;
    font-weight: 500;
    padding: 2px 10px;
    border-radius: 10px;
}

/* ===== TARJETA DE CAMBIO ===== */

.changelog-card[b-jfau5yunsq] {
    position: relative;
    margin-bottom: 16px;
    background: #fff;
    border-radius: 10px;
    padding: 16px 20px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
    transition: box-shadow 0.2s ease, transform 0.15s ease;
    border: 1px solid #e5e7eb;
    cursor: default;
}

.changelog-card:hover[b-jfau5yunsq] {
    box-shadow: 0 4px 14px rgba(0,0,0,0.08), 0 2px 4px rgba(0,0,0,0.04);
    transform: translateY(-1px);
    border-color: #d1d5db;
}

.changelog-card[b-jfau5yunsq]::before {
    content: '';
    position: absolute;
    left: -31px;
    top: 47px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
    border: 2.5px solid #1a73e8;
    z-index: 1;
    transition: all 0.2s ease;
}

.changelog-card:hover[b-jfau5yunsq]::before {
    background: #1a73e8;
    border-width: 3px;
    box-shadow: 0 0 0 4px rgba(26,115,232,0.15);
}

.changelog-card-header[b-jfau5yunsq] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 10px;
}

.changelog-card-left[b-jfau5yunsq] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    min-width: 0;
}

.changelog-id-badge[b-jfau5yunsq] {
    font-family: 'SF Mono', 'Cascadia Code', 'Consolas', monospace;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 2px 10px;
    border-radius: 4px;
    background: #eef2ff;
    color: #4f46e5;
    border: 1px solid #c7d2fe;
    white-space: nowrap;
    letter-spacing: -0.01em;
}

.changelog-id-badge.type-sv4[b-jfau5yunsq] { background: #eef2ff; color: #4f46e5; border-color: #c7d2fe; }
.changelog-id-badge.type-sv2[b-jfau5yunsq] { background: #fef3c7; color: #d97706; border-color: #fde68a; }
.changelog-id-badge.type-wsp[b-jfau5yunsq] { background: #d1fae5; color: #059669; border-color: #a7f3d0; }
.changelog-id-badge.type-msg[b-jfau5yunsq] { background: #dbeafe; color: #2563eb; border-color: #bfdbfe; }
.changelog-id-badge.type-edt[b-jfau5yunsq] { background: #f3e8ff; color: #7c3aed; border-color: #e9d5ff; }
.changelog-id-badge.type-rda[b-jfau5yunsq] { background: #fce7f3; color: #db2777; border-color: #fbcfe8; }
.changelog-id-badge.type-ante[b-jfau5yunsq] { background: #d1fae5; color: #059669; border-color: #a7f3d0; }
.changelog-id-badge.type-infra[b-jfau5yunsq] { background: #e5e7eb; color: #4b5563; border-color: #d1d5db; }
.changelog-id-badge.type-home[b-jfau5yunsq] { background: #ffedd5; color: #ea580c; border-color: #fed7aa; }

.changelog-date[b-jfau5yunsq] {
    font-size: 0.7rem;
    color: #6b7280;
    white-space: nowrap;
}

.changelog-proyecto-badge[b-jfau5yunsq] {
    font-size: 0.6rem;
    font-weight: 500;
    padding: 1px 8px;
    border-radius: 3px;
    background: #f3f4f6;
    color: #6b7280;
    border: 1px solid #e5e7eb;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.changelog-card-body[b-jfau5yunsq] {
    font-size: 0.85rem;
    color: #374151;
    line-height: 1.55;
    margin-bottom: 10px;
    word-wrap: break-word;
}

.changelog-card-footer[b-jfau5yunsq] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.changelog-tag[b-jfau5yunsq] {
    font-size: 0.6rem;
    font-weight: 450;
    padding: 1px 8px;
    border-radius: 3px;
    background: #f3f4f6;
    color: #6b7280;
    border: 1px solid #e5e7eb;
}

.changelog-tag.tag-feature[b-jfau5yunsq] { background: #eef2ff; color: #4f46e5; border-color: #c7d2fe; }
.changelog-tag.tag-bugfix[b-jfau5yunsq] { background: #fef2f2; color: #dc2626; border-color: #fecaca; }
.changelog-tag.tag-ui[b-jfau5yunsq] { background: #fdf4ff; color: #a21caf; border-color: #f5d0fe; }
.changelog-tag.tag-ux[b-jfau5yunsq] { background: #f0fdf4; color: #16a34a; border-color: #bbf7d0; }
.changelog-tag.tag-mongodb[b-jfau5yunsq] { background: #f0f9ff; color: #0284c7; border-color: #bae6fd; }
.changelog-tag.tag-bd[b-jfau5yunsq] { background: #f8fafc; color: #475569; border-color: #cbd5e1; }

/* ===== DESARROLLADOR RESPONSABLE (avatar + nombre) ===== */

.changelog-card-developer[b-jfau5yunsq] {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 10px;
    padding-top: 9px;
    border-top: 1px solid #f3f4f6;
    min-width: 0;
}

.changelog-avatar[b-jfau5yunsq] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 0.6rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    flex-shrink: 0;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
    text-transform: uppercase;
}

.changelog-avatar-img[b-jfau5yunsq] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
    border: 1px solid #e5e7eb;
}

.changelog-developer-label[b-jfau5yunsq] {
    font-size: 0.68rem;
    font-weight: 600;
    color: #6b7280;
    white-space: nowrap;
}

.changelog-developer-name[b-jfau5yunsq] {
    font-size: 0.7rem;
    font-weight: 500;
    color: #374151;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.changelog-developer-doc[b-jfau5yunsq] {
    font-size: 0.62rem;
    font-family: 'SF Mono', 'Cascadia Code', 'Consolas', monospace;
    color: #9ca3af;
    white-space: nowrap;
    margin-left: auto;
    padding: 0 6px;
    border: 1px solid #e5e7eb;
    border-radius: 3px;
    background: #f9fafb;
}

/* ===== RESPONSIVE ===== */

/* ── Centinela de scroll infinito (patrón PacienteManager) ── */
.scroll-sentinel[b-jfau5yunsq] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 4px;
    gap: 4px;
    color: #6b7280;
    font-size: 0.75rem;
}

@media (max-width: 767.98px) {
    .changelog-toolbar[b-jfau5yunsq] {
        padding: 6px 12px;
    }

    .changelog-search-box input[b-jfau5yunsq] {
        width: 140px;
    }

    .changelog-content[b-jfau5yunsq] {
        padding: 16px;
    }

    .changelog-timeline[b-jfau5yunsq] {
        padding-left: 32px;
    }

    .changelog-card[b-jfau5yunsq]::before {
        left: -22px;
        top: 45px;
        width: 10px;
        height: 10px;
    }

    .changelog-month-header[b-jfau5yunsq] {
        margin-left: -32px;
    }

    .changelog-month-dot[b-jfau5yunsq] {
        width: 24px;
        height: 24px;
        font-size: 0.6rem;
    }

    .changelog-card[b-jfau5yunsq] {
        padding: 12px 16px;
    }

    .changelog-card-header[b-jfau5yunsq] {
        flex-direction: column;
        gap: 6px;
    }
}
/* /Presentation/Components/Pages/Home.razor.rz.scp.css */
.suros-footer-cta[b-bulv0zksqx] {
    margin-top: 1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.6rem 1.4rem;
    border-radius: 10px;
    letter-spacing: 0.8px;
    border: none;
    background: linear-gradient(135deg, #278b4c, #16a34a);
    color: #f9fafb;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 18px 35px rgba(56, 219, 116, 0.4);
    position: relative;
    overflow: hidden;
    transition:
        transform 160ms ease-out,
        box-shadow 160ms ease-out,
        filter 160ms ease-out;
}

.suros-footer-cta:hover[b-bulv0zksqx] {
    transform: translateY(-2px);
    filter: brightness(1.05);
    box-shadow: 0 22px 45px rgba(22, 163, 74, 0.6);
}

.suros-footer-cta--agendar[b-bulv0zksqx] {
    background: linear-gradient(135deg, #e0e4e1, #dee2e0);
    box-shadow: 0 18px 35px rgba(203, 209, 205, 0.35);
    color: rgb(26, 25, 25);
}

.suros-footer-cta--agendar:hover[b-bulv0zksqx] {
    box-shadow: 0 18px 35px rgba(203, 209, 205, 0.35);
}

.suros-footer-cta--consultar[b-bulv0zksqx] {
    
    background: linear-gradient(135deg, #e0e4e1, #dee2e0);
    box-shadow: 0 18px 35px rgba(203, 209, 205, 0.35);
    color: rgb(26, 25, 25);
}

.suros-footer-cta--consultar:hover[b-bulv0zksqx] {
     box-shadow: 0 18px 35px rgba(203, 209, 205, 0.35);
}

.suros-footer-cta--cancelar[b-bulv0zksqx] {
    
    background: linear-gradient(135deg, #e0e4e1, #dee2e0);
    box-shadow: 0 18px 35px rgba(203, 209, 205, 0.35);
    color: rgb(26, 25, 25);
}

.suros-footer-cta--cancelar:hover[b-bulv0zksqx] {
    box-shadow: 0 18px 35px rgba(203, 209, 205, 0.35);
}
/* /Presentation/Components/Pages/Inicio.razor.rz.scp.css */
.inicio-layout[b-mk3habwms5] {
    display: flex;
    height: 100vh;
    width: 100vw;
    overflow: hidden;
    font-family: 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    background-color: #f8f9fa;
}

/* Sidebar Styles moved to Menu.razor.css */

/* Main Content Styles */
.main-content[b-mk3habwms5] {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-color: #ffffff;
}

/* App Header */
.app-header[b-mk3habwms5] {
    height: 60px;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-bottom: 1px solid #e0e0e0;
    gap: 16px;
}

.header-left[b-mk3habwms5] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.app-title[b-mk3habwms5] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #000;
    margin: 0;
}

.header-center[b-mk3habwms5] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 16px;
    justify-content: center;
}

.header-right[b-mk3habwms5] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.current-date[b-mk3habwms5] {
    font-size: 0.85rem;
    color: #666;
    margin-right: 5px;
}

.connection-icon[b-mk3habwms5] {
    font-size: 1.2rem;
    color: #000;
    cursor: help;
}

.search-box[b-mk3habwms5] {
    display: flex;
    align-items: center;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 4px 8px;
    background-color: #fff;
    position: relative;
}

.search-results-dropdown[b-mk3habwms5] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: 250px; /* Wider than the input */
    background-color: white;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    z-index: 1000;
    max-height: 300px;
    overflow-y: auto;
    margin-top: 4px;
}

.search-result-item[b-mk3habwms5] {
    padding: 8px 12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    transition: background-color 0.2s;
    color: #333;
}

.search-result-item:hover[b-mk3habwms5] {
    background-color: #f0f4f8;
    color: #007bff;
}

.search-icon[b-mk3habwms5] {
    margin-right: 10px;
    color: #666;
    width: 20px;
    text-align: center;
}

.search-label[b-mk3habwms5] {
    font-size: 0.85rem;
    color: #666;
    margin-right: 8px;
}

.search-box input[b-mk3habwms5] {
    border: none;
    outline: none;
    font-size: 0.85rem;
    width: 150px;
}

.btn-notifications[b-mk3habwms5] {
    background-color: #dc3545;
    color: white;
    border: none;
    border-radius: 6px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 1rem;
}

.btn-tour[b-mk3habwms5] {
    background-color: #0d6efd;
    color: white;
    border: none;
    border-radius: 6px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 1rem;
    transition: background-color 0.2s;
}

.btn-tour:hover[b-mk3habwms5] {
    background-color: #0b5ed7;
}

/* Novedades button — color solido visible */
.btn-novedades[b-mk3habwms5] {
    background: #6366f1 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 0.95rem;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(99,102,241,0.35);
    position: relative;
    opacity: 1 !important;
}

.btn-novedades:hover[b-mk3habwms5] {
    background: #4f46e5 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(99,102,241,0.45);
    transform: translateY(-2px);
}

.btn-novedades:active[b-mk3habwms5] {
    transform: translateY(0);
    box-shadow: 0 1px 3px rgba(124,58,237,0.2);
}

.btn-novedades i[b-mk3habwms5] {
    filter: drop-shadow(0 1px 1px rgba(0,0,0,0.15));
}

.user-avatar[b-mk3habwms5] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    overflow: hidden;
    cursor: pointer;
}

.user-avatar img[b-mk3habwms5] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Connection icon (online/offline) */
.connection-icon.online[b-mk3habwms5] {
    color: #28a745;
}
.connection-icon.offline[b-mk3habwms5] {
    color: #dc3545;
}

/* Notification badge */
.btn-notifications[b-mk3habwms5] {
    position: relative;
}
.notification-badge[b-mk3habwms5] {
    position: absolute;
    top: -4px;
    right: -4px;
    background-color: #fff;
    color: #dc3545;
    font-size: 0.50rem;
    font-weight: 700;
    min-width: 16px;
    height: 16px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #dc3545;
    line-height: 1;
}

/* Notifications dropdown — compact redesign */
.notifications-wrapper[b-mk3habwms5] {
    position: relative;
}
.notifications-dropdown[b-mk3habwms5] {
    position: absolute;
    top: 100%;
    right: 0;
    width: 360px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    z-index: 1050;
    margin-top: 8px;
    display: flex;
    flex-direction: column;
    max-height: 420px;
}
.notifications-header[b-mk3habwms5] {
    padding: 10px 16px;
    background: #fff;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
    position: sticky;
    top: 0;
    z-index: 1;
}
.notifications-header strong[b-mk3habwms5] {
    font-size: 0.85rem;
    color: #0f172a;
}
/* Lista scrolleable */
.notifications-list-scroll[b-mk3habwms5] {
    overflow-y: auto;
    flex: 1;
    min-height: 0;
}
/* Scrollbar delgada */
.notifications-list-scroll[b-mk3habwms5]::-webkit-scrollbar {
    width: 4px;
}
.notifications-list-scroll[b-mk3habwms5]::-webkit-scrollbar-track {
    background: transparent;
}
.notifications-list-scroll[b-mk3habwms5]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 4px;
}
.notifications-list-scroll[b-mk3habwms5]::-webkit-scrollbar-thumb:hover {
    background: #9ca3af;
}
/* Item ultra-compacto */
.notification-item[b-mk3habwms5] {
    padding: 5px 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #f3f4f6;
    cursor: pointer;
    transition: background-color 0.1s;
}
.notification-item:hover[b-mk3habwms5] {
    background-color: #f8fafc;
}
.notification-item.unread[b-mk3habwms5] {
    background-color: #f0f7ff;
    border-left: 3px solid #0D8ABC;
    padding-left: 9px;
}
.notification-item i[b-mk3habwms5] {
    font-size: 0.78rem;
    width: 16px;
    text-align: center;
    flex-shrink: 0;
}
.notification-item .notif-title[b-mk3habwms5] {
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.3;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.notification-item .notif-time[b-mk3habwms5] {
    font-size: 0.63rem;
    color: #94a3b8;
    white-space: nowrap;
    flex-shrink: 0;
    margin-left: auto;
    padding-left: 6px;
}

/* Header icon button */
.btn-header-icon[b-mk3habwms5] {
    background: none;
    border: none;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #555;
    cursor: pointer;
    transition: all 0.15s;
}
.btn-header-icon:hover[b-mk3habwms5] {
    background-color: #f0f0f0;
    color: #007bff;
}
.btn-header-icon.active[b-mk3habwms5] {
    color: #ffc107;
}

/* Botón de acceso al sitio web institucional de Suros */
.btn-suros-web[b-mk3habwms5] {
    color: #0d6efd;
    font-size: 1.15rem;
    margin-right: 2px;
}
.btn-suros-web:hover[b-mk3habwms5] {
    color: #0a58ca;
    background-color: #e8f0fe;
}

/* Profile button with avatar */
.btn-perfil[b-mk3habwms5] {
    background: none;
    border: none;
    padding: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #555;
    transition: all 0.15s;
    overflow: hidden;
}
.btn-perfil:hover[b-mk3habwms5] {
    background-color: #f0f0f0;
    color: #007bff;
}
.btn-perfil .user-avatar[b-mk3habwms5] {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

/* Tabs Container */
.tabs-container[b-mk3habwms5] {
    height: 48px;
    background-color: #ffffff;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #e0e0e0;
    padding: 0 5px;
    gap: 5px;
}

.tab-scroll-btn[b-mk3habwms5] {
    background: none;
    border: none;
    color: #6c757d;
    cursor: pointer;
    padding: 0 8px;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    height: 100%;
    transition: color 0.2s;
}

.tab-scroll-btn:hover[b-mk3habwms5] {
    color: #666;
}

.tabs-scroll-area[b-mk3habwms5] {
    flex: 1;
    display: flex;
    align-items: center; 
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    height: 100%;
    gap: 10px;
    padding: 0 10px;
}

.tabs-scroll-area[b-mk3habwms5]::-webkit-scrollbar {
    display: none;
}

.tab-item[b-mk3habwms5] {
    height: 44px !important;
    padding: 4px 15px;
    display: flex;
    align-items: center;
    background-color: transparent;
    border-radius: 4px;
    cursor: pointer;
    font-size: 1rem;
    color: #666;
    min-width: fit-content;
    white-space: nowrap;
    transition: all 0.2s;
    user-select: none;
}

.tab-item:hover[b-mk3habwms5] {
    background-color: #ced4da;
}

.tab-item.active[b-mk3habwms5] {
    min-height: 46px !important;
    padding: 4px 25px !important;
    background-color: #e3f2fd;
    color: #1976d2;
    border-bottom: 2px solid #1976d2;
    font-weight: 500;
}

.tab-close[b-mk3habwms5] {
    margin-left: 8px;
    font-size: 0.8rem;
    opacity: 0.6;
    color: #dc3545;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    margin-top:2px !important;
}

.tab-close:hover[b-mk3habwms5] {
    opacity: 1;
    background-color: #fadbd8;
}

/* Tab Content */
.tab-content-area[b-mk3habwms5] {
    flex:1;
    overflow: auto;
    padding: 20px;
    position: relative;
    background-color: #fff;
    scrollbar-width: none;
}

.tab-pane[b-mk3habwms5] {
    display: none;
    height: 100%;
    width: 100%;
}

.tab-pane.active[b-mk3habwms5] {
    display: block;
    animation: fadeIn-b-mk3habwms5 0.2s ease;
}

@keyframes fadeIn-b-mk3habwms5 {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Access Denied */
.access-denied[b-mk3habwms5] {
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #f8f9fa;
    color: #2d3436;
}

.access-denied a[b-mk3habwms5] {
    color: #3498db;
    text-decoration: none;
    margin-top: 10px;
    font-weight: 600;
}
.modal-title[b-mk3habwms5] {
    font-size: 1.2rem;
    font-weight: 600;
    color: #212529 !important;
}
/* /Presentation/Components/Pages/Institucion/Components/TabFacturacion.razor.rz.scp.css */
/* PAN-116: TabFacturacion — CSS scoped propio */

.tfe-label[b-pth1w3g975] {
    display: block;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: #6b7280;
    margin-bottom: 4px;
}

.tfe-label.required[b-pth1w3g975]::after {
    content: ' *';
    color: #EF4444;
}

.tfe-input[b-pth1w3g975] {
    display: block;
    width: 100%;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    padding: 8px 12px;
    font-size: 0.875rem;
    color: #111827;
    background: #fff;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    box-sizing: border-box;
}

.tfe-input:focus[b-pth1w3g975] {
    border-color: #1a73e8;
    box-shadow: 0 0 0 3px rgba(26, 115, 232, 0.12);
    outline: none;
}

.tfe-input[b-pth1w3g975]::placeholder {
    color: #9ca3af;
    font-size: 0.825rem;
}

/* Sensitivity badge */
.tfe-sensitive[b-pth1w3g975] {
    background: #fef3c7;
    border: 1px solid #fbbf24;
    border-radius: 8px;
    padding: 12px 16px;
    font-size: 0.825rem;
    color: #92400e;
}

.tfe-sensitive i[b-pth1w3g975] {
    color: #d97706;
    font-size: 1rem;
}

.tfe-sensitive strong[b-pth1w3g975] {
    color: #78350f;
}

/* Password group */
.tfe-pw[b-pth1w3g975] {
    display: flex;
    width: 100%;
}

.tfe-pw .tfe-input[b-pth1w3g975] {
    border-right: none;
    border-radius: 6px 0 0 6px;
    flex: 1;
}

.tfe-pw-toggle[b-pth1w3g975] {
    border: 1px solid #d1d5db;
    border-left: none;
    border-radius: 0 6px 6px 0;
    background: #fff;
    color: #6b7280;
    padding: 0 12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    transition: background 0.15s;
}

.tfe-pw-toggle:hover[b-pth1w3g975] {
    background: #f3f4f6;
    color: #374151;
}
/* /Presentation/Components/Pages/Institucion/Components/TabImagenes.razor.rz.scp.css */
/* PAN-116: TabImagenes — CSS scoped propio */

/* Info banner */
.tim-info[b-2fplh9vuy1] {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
    padding: 12px 16px;
    font-size: 0.825rem;
    color: #1e40af;
}

.tim-info i[b-2fplh9vuy1] {
    color: #2563eb;
}

/* Image card */
.tim-card[b-2fplh9vuy1] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    transition: all 0.2s ease;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.tim-card:hover[b-2fplh9vuy1] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    border-color: #d1d5db;
    transform: translateY(-2px);
}

.tim-card-header[b-2fplh9vuy1] {
    padding: 14px 16px 10px;
    border-bottom: 1px solid #f3f4f6;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.tim-card-header h6[b-2fplh9vuy1] {
    font-size: 0.825rem;
    font-weight: 600;
    color: #374151;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

.tim-card-header h6 i[b-2fplh9vuy1] {
    color: #1a73e8;
    font-size: 0.9rem;
    width: 16px;
    text-align: center;
}

.tim-date[b-2fplh9vuy1] {
    font-size: 0.7rem;
    color: #9ca3af;
    white-space: nowrap;
}

/* Preview */
.tim-preview[b-2fplh9vuy1] {
    background: #f9fafb;
    min-height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px;
    border-bottom: 1px solid #f3f4f6;
}

.tim-preview img[b-2fplh9vuy1] {
    max-height: 140px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    border-radius: 6px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
    transition: transform 0.2s ease;
}

.tim-preview img:hover[b-2fplh9vuy1] {
    transform: scale(1.02);
}

/* Placeholder */
.tim-placeholder[b-2fplh9vuy1] {
    background: #f9fafb;
    min-height: 160px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px;
    border-bottom: 1px solid #f3f4f6;
    color: #d1d5db;
}

.tim-placeholder i[b-2fplh9vuy1] {
    font-size: 2.5rem;
    color: #d1d5db;
}

.tim-placeholder span[b-2fplh9vuy1] {
    font-size: 0.75rem;
    color: #9ca3af;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Footer */
.tim-card-footer[b-2fplh9vuy1] {
    padding: 12px 16px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    background: #fff;
    margin-top: auto;
}

.tim-card-footer .btn[b-2fplh9vuy1] {
    font-size: 0.8rem;
    border-radius: 6px;
    padding: 4px 12px;
}

.tim-loading[b-2fplh9vuy1] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px;
    color: #6b7280;
    font-size: 0.825rem;
}
/* /Presentation/Components/Pages/Institucion/Components/TabInfoGeneral.razor.rz.scp.css */
/* PAN-116: TabInfoGeneral — CSS scoped propio */

.tig-label[b-j30iuerrcn] {
    display: block;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: #6b7280;
    margin-bottom: 4px;
}

.tig-label.required[b-j30iuerrcn]::after {
    content: ' *';
    color: #EF4444;
}

.tig-input[b-j30iuerrcn] {
    display: block;
    width: 100%;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    padding: 8px 12px;
    font-size: 0.875rem;
    color: #111827;
    background: #fff;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    box-sizing: border-box;
}

.tig-input:focus[b-j30iuerrcn] {
    border-color: #1a73e8;
    box-shadow: 0 0 0 3px rgba(26, 115, 232, 0.12);
    outline: none;
}

.tig-input[b-j30iuerrcn]::placeholder {
    color: #9ca3af;
    font-size: 0.825rem;
}
/* /Presentation/Components/Pages/Institucion/InstitucionPanel.razor.rz.scp.css */
.editor-container[b-99v5b2eyrc] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

.editor-header[b-99v5b2eyrc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-99v5b2eyrc] {
    font-size: 13px;
}

.editor-header-right[b-99v5b2eyrc] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.inst-header-actions[b-99v5b2eyrc] {
    position: relative;
    display: inline-flex;
    align-items: center;
}

/* ── Toast de acciones (Config RDA) en el header ── */

.inst-toast[b-99v5b2eyrc] {
    position: absolute;
    right: calc(100% + 8px);
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 14px;
    border-radius: 6px;
    font-size: 0.76rem;
    font-weight: 500;
    line-height: 1.4;
    white-space: nowrap;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
    max-width: 520px;
    /* Por encima de modales (2055/2054) para que nunca quede oculto tras ellos */
    z-index: 2060;
}

.inst-toast i[b-99v5b2eyrc] {
    font-size: 0.8rem;
}

.inst-toast-success[b-99v5b2eyrc] {
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    color: #065f46;
}

.inst-toast-success i[b-99v5b2eyrc] {
    color: #059669;
}

.inst-toast-error[b-99v5b2eyrc] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
}

.inst-toast-error i[b-99v5b2eyrc] {
    color: #dc2626;
}

.editor-title-bar[b-99v5b2eyrc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-99v5b2eyrc],
.editor-title-bar .fw-semibold[b-99v5b2eyrc],
.editor-title-bar small[b-99v5b2eyrc] {
    color: #1a1d23 !important;
}

/* ===== PESTAÑAS — EXACTO EditorPlantillaBase ===== */
.editor-tabs.nav-tabs[b-99v5b2eyrc] {
    border-bottom: none !important;
    display: flex;
    padding: 0 !important;
    margin: 0 !important;
    background: #e8eaed;
    list-style: none;
    gap: 0;
    position: relative;
    height: 44px;
    flex-shrink: 0;
    min-height: 44px;
}

.editor-tabs .nav-item[b-99v5b2eyrc] {
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
    display: flex;
    align-items: stretch;
}

.editor-tabs .nav-item:first-child[b-99v5b2eyrc] {
    margin: 0 !important;
    padding: 0 !important;
}

.editor-tabs .nav-link[b-99v5b2eyrc] {
    display: flex !important;
    align-items: center !important;
    justify-content: center;
    gap: 7px;
    padding: 0 20px !important;
    margin: 0 !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    color: #5f6368 !important;
    border: none !important;
    background: transparent !important;
    transition: all 0.15s ease;
    cursor: pointer;
    white-space: nowrap;
    position: relative;
    height: 44px !important;
    text-decoration: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

.editor-tabs .nav-link:hover[b-99v5b2eyrc] {
    color: #202124 !important;
    background: rgba(0, 0, 0, 0.04) !important;
}

.editor-tabs .nav-link.active[b-99v5b2eyrc] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
    height: 44px !important;
    padding: 0 20px !important;
    margin: 0 !important;
}

.editor-tabs .nav-item:first-child .nav-link.active[b-99v5b2eyrc] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
}

.editor-tabs .nav-link.active[b-99v5b2eyrc]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 12px;
    right: 12px;
    height: 3px;
    background: #1a73e8;
    border-radius: 3px 3px 0 0;
}

.editor-tabs .nav-item:not(:last-child) .nav-link:not(.active)[b-99v5b2eyrc]::after {
    content: '';
    position: absolute;
    right: 0;
    top: 10px;
    bottom: 10px;
    width: 1px;
    background: #dadce0;
}

.editor-tabs .nav-link i[b-99v5b2eyrc] {
    font-size: 14px;
    width: 16px;
    text-align: center;
    color: inherit;
}

/* ===== CONTENIDO — EXACTO EditorPlantillaBase ===== */
.editor-tab-content[b-99v5b2eyrc] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    overflow: hidden;
    position: relative;
}

.editor-tab-content > *[b-99v5b2eyrc] {
    position: absolute;
    inset: 0;
    overflow-y: auto;
    padding: 20px 24px 24px;
}

/* Compact image card hover */
.inst-img-card[b-99v5b2eyrc] {
    transition: box-shadow 0.2s ease;
}
.inst-img-card:hover[b-99v5b2eyrc] {
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.inst-split-card[b-99v5b2eyrc] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    overflow: hidden;
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.inst-split-card:hover[b-99v5b2eyrc] {
    box-shadow: 0 4px 16px rgba(0,0,0,0.08);
    border-color: #d1d5db;
}

/* ── Header ── */

.inst-split-header[b-99v5b2eyrc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid #f3f4f6;
    background: #fff;
}

.inst-split-header h6[b-99v5b2eyrc] {
    font-size: 0.825rem;
    font-weight: 600;
    color: #374151;
    margin: 0;
}

.inst-split-header h6 i[b-99v5b2eyrc] {
    color: #1a73e8;
    font-size: 0.9rem;
    width: 18px;
    text-align: center;
}

.inst-date-badge[b-99v5b2eyrc] {
    font-size: 0.65rem;
    color: #9ca3af;
    white-space: nowrap;
    letter-spacing: 0.01em;
}

/* ── Body (two columns) ── */

.inst-split-body[b-99v5b2eyrc] {
    display: flex;
    flex: 1;
    min-height: 0;
}

/* ── Left: Preview zone ── */

.inst-preview-zone[b-99v5b2eyrc] {
    flex: 0 0 55%;
    display: flex;
    flex-direction: column;
    background: #f9fafb;
    border-right: 1px solid #f0f0f0;
}

.inst-preview-img[b-99v5b2eyrc] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    min-height: 130px;
    position: relative;
}

.inst-preview-img img[b-99v5b2eyrc] {
    max-height: 110px;
    max-width: 100%;
    width: auto;
    object-fit: contain;
    border-radius: 6px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    transition: transform 0.2s ease;
}

.inst-preview-img img:hover[b-99v5b2eyrc] {
    transform: scale(1.03);
}

.inst-placeholder[b-99v5b2eyrc] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 16px;
    min-height: 130px;
    color: #d1d5db;
}

.inst-placeholder i[b-99v5b2eyrc] {
    font-size: 2.2rem;
    color: #d1d5db;
}

.inst-placeholder span[b-99v5b2eyrc] {
    font-size: 0.65rem;
    color: #9ca3af;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* ── Metadata overlay (formato, dimensiones, peso) ── */

.inst-img-meta[b-99v5b2eyrc] {
    position: absolute;
    top: 6px;
    left: 6px;
    z-index: 2;
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
}

.inst-meta-badge[b-99v5b2eyrc] {
    background: rgba(0, 0, 0, 0.65);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    color: #fff;
    font-size: 0.6rem;
    font-weight: 500;
    padding: 2px 7px;
    border-radius: 4px;
    letter-spacing: 0.02em;
    white-space: nowrap;
    line-height: 1.4;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

/* ── Actions ── */

.inst-actions[b-99v5b2eyrc] {
    display: flex;
    gap: 6px;
    padding: 10px 12px;
    border-top: 1px solid #f0f0f0;
    background: #fff;
}

.inst-btn[b-99v5b2eyrc] {
    font-size: 0.75rem;
    border-radius: 3px;
    padding: 5px 12px;
    border: 1px solid transparent;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: all 0.15s ease;
    font-weight: 500;
    line-height: 1.4;
}

.inst-btn-primary[b-99v5b2eyrc] {
    background: #fff;
    border-color: #d1d5db;
    color: #374151;
}

.inst-btn-primary:hover:not(.disabled)[b-99v5b2eyrc] {
    background: #f3f4f6;
    border-color: #9ca3af;
}

.inst-btn-danger[b-99v5b2eyrc] {
    background: #fff;
    border-color: #fecaca;
    color: #dc2626;
}

.inst-btn-danger:hover:not(.disabled)[b-99v5b2eyrc] {
    background: #fef2f2;
    border-color: #fca5a5;
}

.inst-btn.disabled[b-99v5b2eyrc] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── Right: Info zone ── */

.inst-info-zone[b-99v5b2eyrc] {
    flex: 0 0 45%;
    display: flex;
    flex-direction: column;
    padding: 12px 14px;
    gap: 8px;
    background: #fafafa;
}

.inst-info-header[b-99v5b2eyrc] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.7rem;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding-bottom: 6px;
    border-bottom: 1px solid #e5e7eb;
}

.inst-info-header i[b-99v5b2eyrc] {
    color: #1a73e8;
    font-size: 0.75rem;
}

.inst-info-item[b-99v5b2eyrc] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.inst-info-label[b-99v5b2eyrc] {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.68rem;
    font-weight: 600;
    color: #374151;
}

.inst-info-label i[b-99v5b2eyrc] {
    width: 14px;
    text-align: center;
    font-size: 0.65rem;
    color: #1a73e8;
}

.inst-info-desc[b-99v5b2eyrc] {
    margin: 0 0 0 19px;
    font-size: 0.72rem;
    color: #6b7280;
    line-height: 1.45;
}

.inst-info-tip[b-99v5b2eyrc] {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-top: auto;
    padding: 6px 8px;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 6px;
    font-size: 0.68rem;
    color: #92400e;
    line-height: 1.4;
}

.inst-info-tip i[b-99v5b2eyrc] {
    color: #f59e0b;
    font-size: 0.7rem;
    margin-top: 1px;
    flex-shrink: 0;
}

/* ============================================================
   Expand button en card header
   ============================================================ */

.inst-expand-btn[b-99v5b2eyrc] {
    background: none;
    border: 1px solid transparent;
    color: #9ca3af;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s ease;
    font-size: 0.75rem;
    padding: 0;
    line-height: 1;
}

.inst-expand-btn:hover[b-99v5b2eyrc] {
    background: #f3f4f6;
    border-color: #e5e7eb;
    color: #374151;
}

/* ============================================================
   Modal de ampliación de imagen (expand)
   ============================================================ */

.inst-expand-modal-img[b-99v5b2eyrc] {
    max-height: 420px;
    max-width: 100%;
    width: auto;
    object-fit: contain;
}

.inst-expand-preview[b-99v5b2eyrc] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    min-height: 400px;
    position: relative;
    padding: 24px;
}

.inst-expand-sidebar[b-99v5b2eyrc] {
    width: 280px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    background: #fafafa;
}

.inst-expand-sidebar-content[b-99v5b2eyrc] {
    flex: 1;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.inst-expand-sidebar-footer[b-99v5b2eyrc] {
    padding: 16px 20px;
    border-top: 1px solid #e5e7eb;
    background: #fff;
    display: flex;
    gap: 8px;
}

.inst-expand-close[b-99v5b2eyrc] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: none;
    background: transparent;
    color: #6b7280;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.15s ease;
    font-size: 1rem;
}

.inst-expand-close:hover[b-99v5b2eyrc] {
    background: #f3f4f6;
    color: #111827;
}

.inst-expand-info-label[b-99v5b2eyrc] {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.68rem;
    font-weight: 600;
    color: #374151;
}

.inst-expand-info-label i[b-99v5b2eyrc] {
    width: 14px;
    text-align: center;
    font-size: 0.65rem;
    color: #1a73e8;
}

.inst-expand-info-desc[b-99v5b2eyrc] {
    margin: 2px 0 0 19px;
    font-size: 0.72rem;
    color: #6b7280;
    line-height: 1.45;
}

.inst-expand-tip[b-99v5b2eyrc] {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    padding: 8px 10px;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 6px;
    font-size: 0.68rem;
    color: #92400e;
    line-height: 1.4;
}

.inst-expand-tip i[b-99v5b2eyrc] {
    color: #f59e0b;
    font-size: 0.7rem;
    margin-top: 1px;
    flex-shrink: 0;
}

/* ============================================================
   PAN-116 / sv4-065 — Pestaña Información General
   Patrón visual: formulario de credenciales RDA (TabConfigRda)
   Inputs compactos (30px), labels con ícono, secciones con título
   ============================================================ */

.inf-section-title[b-99v5b2eyrc] {
    font-size: 0.81rem;
    font-weight: 700;
    color: #374151;
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 5px;
    margin-bottom: 10px;
    letter-spacing: 0.01em;
}

.inf-section-title i[b-99v5b2eyrc] {
    font-size: 0.76rem;
    margin-right: 5px;
    color: #1a73e8;
}

.inf-form-label[b-99v5b2eyrc] {
    font-size: 0.74rem;
    margin-bottom: 2px;
    color: #4b5563;
    font-weight: 500;
}

.inf-form-label i[b-99v5b2eyrc] {
    font-size: 0.68rem;
    margin-right: 3px;
    color: #1a73e8;
}

.inf-form-control-sm[b-99v5b2eyrc] {
    height: 30px;
    font-size: 0.84rem;
    padding: 2px 8px;
    line-height: 1.3;
    border-radius: 3px;
}

.inf-form-actions[b-99v5b2eyrc] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    padding-top: 12px;
    margin-top: 4px;
    border-top: 1px solid #e5e7eb;
    flex-shrink: 0;
}
/* /Presentation/Components/Pages/Login/Login.razor.rz.scp.css */
@font-face {
    font-family: Raleway-Bold;
    src: url('/fonts/raleway/phylactere.ttf');
}

.login-container[b-7kpvvw98of] {
    background: radial-gradient(ellipse at 50% 50%, #001a33 0%, #000714 45%, #000 80%);
    min-height: 100vh;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
    font-family: 'Roboto', 'Segoe UI', sans-serif;
    transition: background 1s ease-in-out;
    
    /* CSS Variables moved from :root for scoped isolation */
    --hex-stroke: rgba(255,255,255,0.8);
    --hex-fill: rgba(255,255,255,0.28);
    --hex-fill-strong: rgba(255,255,255,0.38);
    --icon-primary: #79c8ff;
    --icon-secondary: rgba(121,200,255,0.92);
    --glow: rgba(46,168,255,0.55);
}

.login-container.show-background[b-7kpvvw98of] {
    background: url('/images/fondologin.jpeg') center center / cover no-repeat fixed !important;
}

.header-caption[b-7kpvvw98of] {
    position: fixed;
    top: 10%;
    left: 22%;
    color: #eaf2f9;
    font-size: clamp(20px, 2.2vw + 8px, 32px);
    line-height: 1.25;
    letter-spacing: 0.3px;
    max-width: min(760px, 46vw);
    z-index: 10;
    padding: 12px 20px;
    border-radius: 10px;
    text-shadow: 0 2px 6px rgba(0,0,0,.35);
    background: linear-gradient(90deg, rgba(46,168,255,.5), rgba(0,43,77,.18));
    font-family: 'Raleway', sans-serif;
}

.bg-watermark[b-7kpvvw98of] {
    position: fixed;
    top: 50%;
    left: 48%;
    transform: translate(-50%, -50%);
    z-index: 0;
    opacity: 0.60;
    pointer-events: none;
    width: 60vw;
    max-width: 600px;
}

.bg-watermark-clinica[b-7kpvvw98of] {
    position: fixed;
    top: 81%;
    left: 61%;
    transform: translate(-50%, -50%);
    z-index: 0;
    opacity: 0.40;
    pointer-events: none;
    width: 20vw;
    max-width: 200px;
}

.login-card[b-7kpvvw98of] {
    background: #FAFAFA;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    padding: 30px 40px;
    width: 100%;
    max-width: 420px;
    border: 1px solid rgba(255, 255, 255, 0.06);
    position: fixed;
    left: 6%;
    top: 30%;
    transform: translateY(-50%);
    z-index: 10;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.logo-container[b-7kpvvw98of] {
    text-align: center;
    margin-bottom: 10px;
}

.login-logo[b-7kpvvw98of] {
    max-width: 180px;
    max-height: 120px;
    width: auto;
    height: auto;
    object-fit: contain;
}

/* Company Info */
.company-info[b-7kpvvw98of] {
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e9ecef;
    margin-bottom: 4px;
}
.company-name[b-7kpvvw98of] {
    font-size: 1rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.3;
}
.company-meta[b-7kpvvw98of] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.4;
}
.company-nitemail[b-7kpvvw98of] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-wrap: wrap;
}
.company-location[b-7kpvvw98of] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-wrap: wrap;
    font-size: 0.72rem;
}
.company-location i[b-7kpvvw98of] {
    font-size: 0.68rem;
    color: #94a3b8;
}
.company-sep[b-7kpvvw98of] {
    color: #cbd5e1;
    font-weight: 300;
}

.login-title[b-7kpvvw98of] {
    text-align: center;
    font-size: 1.3rem;
    color: #2d3436;
    font-weight: 700;
    margin: 0;
    display: inline-block;
    position: relative;
    padding-bottom: 8px;
    width: 100%;
}

.login-title[b-7kpvvw98of]:after {
    content: '';
    display: block;
    width: 150px;
    height: 3px;
    background: #3498db;
    margin: 5px auto 0;
    border-radius: 2px;
}

.input-group-text[b-7kpvvw98of] {
    background-color: #f8f9fa;
    border-right: none;
    color: #b2bec3;
    transition: color 0.3s, background-color 0.3s, border-color 0.3s;
}

.input-group:focus-within .input-group-text[b-7kpvvw98of],
.input-group:hover .input-group-text[b-7kpvvw98of] {
    color: #3498db;
    background-color: #fff;
    border-color: #3498db;
}

.form-control[b-7kpvvw98of] {
    border-left: none;
    box-shadow: none;
    background-color: #f8f9fa;
    height: 45px;
    font-size: 15px;
}

.form-control:focus[b-7kpvvw98of] {
    border-color: #3498db;
    box-shadow: 0 0 0 4px rgba(52, 152, 219, 0.1);
    background-color: #fff;
}

.login-btn[b-7kpvvw98of] {
    background-image: linear-gradient(to right, #3498db 0%, #2980b9 51%, #3498db 100%);
    border: none;
    border-radius: 5px;
    text-transform: uppercase;
    transition: 0.5s;
    background-size: 200% auto;
    box-shadow: 0 4px 10px rgba(52, 152, 219, 0.2);
    color: white;
    font-weight: 700;
    font-size: 15px;
    letter-spacing: 1px;
    padding: 10px 0;
}

.login-btn:hover[b-7kpvvw98of] {
    background-position: right center;
}

.forgot-password[b-7kpvvw98of] {
    color: #636e72;
    font-size: 13px;
    text-decoration: none;
    font-weight: 500;
}

.forgot-password:hover[b-7kpvvw98of] {
    color: #3498db;
    text-decoration: underline;
}

/* Hero & Animation Styles */
.hero-suros[b-7kpvvw98of] {
    position: fixed;
    inset: 0;
    background: radial-gradient(ellipse at 30% 50%, #001a33 0%, #000714 45%, #000 80%);
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    z-index: 9999;
    opacity: 1;
    transition: opacity 700ms ease;
}

.hero-suros.hidden[b-7kpvvw98of] {
    opacity: 0;
    pointer-events: none;
}

.hero-stage[b-7kpvvw98of] {
    position: relative;
    width: min(1100px, 92vw);
    height: min(500px, 52vh);
}

.signal-svg[b-7kpvvw98of] {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    z-index: 1;
    filter: drop-shadow(0 0 6px #2ea8ff) drop-shadow(0 0 16px rgba(46, 168, 255, .35));
}

.signal-svg svg[b-7kpvvw98of] {
    width: 100%;
    height: 120px;
}

.text-and-check[b-7kpvvw98of] {
    position: absolute;
    left: 45%;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: min(24px, 3vw);
    z-index: 2;
}

.suros-text[b-7kpvvw98of] {
    color: #fff;
    font-weight: 600;
    letter-spacing: .5px;
    font-size: 13em;
    display: inline-flex;
    align-items: start;
    margin-top: -20px;
    font-family: 'Raleway-Bold' !important;
}

.suros-text .sur[b-7kpvvw98of],
.suros-text .su[b-7kpvvw98of] {
    opacity: 0;
    animation: fadeIn-b-7kpvvw98of 700ms ease forwards;
    animation-delay: 2.7s;
    margin-left: 0px !important;
}

.suros-text .u[b-7kpvvw98of] {
    opacity: 0;
    animation: fadeIn-b-7kpvvw98of 700ms ease forwards;
    animation-delay: 3.1s;
    margin-left: 0px !important;
}

.suros-text .r[b-7kpvvw98of] {
    opacity: 0;
    animation: fadeIn-b-7kpvvw98of 500ms ease forwards;
    animation-delay: 3.3s;
    margin-left: 0px !important;
}

.suros-text .s[b-7kpvvw98of] {
    opacity: 0;
    animation: fadeIn-b-7kpvvw98of 700ms ease forwards;
    animation-delay: 3.5s;
    margin-left: 0px !important;
}

.o-wrap[b-7kpvvw98of] {
    position: relative;
    display: inline-block;
}

.o[b-7kpvvw98of] {
    margin-top: -18px !important;
    display: inline-block;
    font-size: 1.1em;
    transform: translateY(-260%) scale(1.12);
    opacity: 0;
    filter: drop-shadow(0 10px 22px rgba(0, 0, 0, .35));
    text-shadow: 0 4px 14px rgba(0, 0, 0, .25);
    animation: dropImpact-b-7kpvvw98of 1400ms cubic-bezier(.22, .8, .25, 1) 0.6s forwards, shockGlow-b-7kpvvw98of 900ms ease-out 1s both;
    will-change: transform, filter;
}

.tilde[b-7kpvvw98of] {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -0.10em;
    opacity: 0;
    color: #ffffff;
    font-size: 1em;
    animation: accentImpact-b-7kpvvw98of 700ms cubic-bezier(.22, .8, .25, 1) 1.9s forwards;
    color: #ff2e2e;
}

/* Background Hexagons */
.medical-bg[b-7kpvvw98of] {
    position: fixed;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    overflow: hidden;
}

.hex[b-7kpvvw98of] {
    position: absolute;
    width: clamp(88px, 10vw, 180px);
    height: clamp(88px, 10vw, 180px);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0)), var(--hex-fill);
    box-shadow: 0 16px 32px rgba(0, 0, 0, .25), 0 0 28px var(--glow);
    border: 2px solid var(--hex-stroke);
    clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
    backdrop-filter: blur(3px);
    will-change: transform, opacity;
}

.hex.strong[b-7kpvvw98of] {
    background: var(--hex-fill-strong);
}

.hex .icon[b-7kpvvw98of] {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: var(--icon-secondary);
    font-size: clamp(40px, 4.5vw, 65px);
    opacity: 1;
    filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .35));
    text-shadow: 0 4px 14px rgba(0, 0, 0, .25);
    will-change: transform, opacity;
}

.hex.main .icon[b-7kpvvw98of] {
    color: var(--icon-primary);
    opacity: 0.95;
}

.hex.lg[b-7kpvvw98of] {
    width: clamp(120px, 12vw, 220px);
    height: clamp(120px, 12vw, 220px);
}

.hex.sm[b-7kpvvw98of] {
    width: clamp(64px, 7vw, 120px);
    height: clamp(64px, 7vw, 120px);
}

.hex.xs[b-7kpvvw98of] {
    width: clamp(48px, 5.4vw, 96px);
    height: clamp(48px, 5.4vw, 96px);
}

.hex .icon.sm[b-7kpvvw98of] {
    font-size: clamp(24px, 2.8vw, 36px);
}

.hex .icon.xs[b-7kpvvw98of] {
    font-size: clamp(18px, 2.2vw, 28px);
}

/* Positions */
.p1[b-7kpvvw98of] { left: 66%; top: 14%; }
.p2[b-7kpvvw98of] { left: 76%; top: 24%; }
.p3[b-7kpvvw98of] { left: 84%; top: 40%; }
.p4[b-7kpvvw98of] { left: 70%; top: 46%; }
.p5[b-7kpvvw98of] { left: 80%; top: 60%; }
.p6[b-7kpvvw98of] { left: 66%; top: 64%; }
.p7[b-7kpvvw98of] { left: 58%; top: 24%; }
.p8[b-7kpvvw98of] { left: 60%; top: 36%; }
.p9[b-7kpvvw98of] { left: 64%; top: 52%; }
.p10[b-7kpvvw98of] { left: 86%; top: 70%; }
.p11[b-7kpvvw98of] { left: 72%; top: 42%; }
.p12[b-7kpvvw98of] { left: 68%; top: 28%; }

@keyframes dropImpact-b-7kpvvw98of {
    0% { transform: translateY(-260%) scale(1.12); filter: blur(6px) drop-shadow(0 22px 44px rgba(0,0,0,.45)); opacity: 0; }
    20% { transform: translateY(-80%) scale(1.06); filter: blur(2px) drop-shadow(0 18px 36px rgba(0,0,0,.4)); opacity: 1; }
    60% { transform: translateY(10%) scale(0.95); filter: blur(0) drop-shadow(0 30px 45px rgba(0,0,0,.35)); }
    78% { transform: translateY(-6%) scale(1.02); }
    100% { transform: translateY(0) scale(1); filter: blur(0) drop-shadow(0 8px 16px rgba(0,0,0,.28)); opacity: 1; }
}

@keyframes accentImpact-b-7kpvvw98of {
    0% { opacity: 0; transform: translateX(-50%) translateY(-40%) rotate(-25deg) scale(0.85); filter: blur(4px); }
    50% { opacity: 1; transform: translateX(-50%) translateY(-8%) rotate(6deg) scale(1.1); filter: blur(0); }
    100% { opacity: 1; transform: translateX(-50%) translateY(0) rotate(0deg) scale(1); }
}

@keyframes shockGlow-b-7kpvvw98of {
    0% { text-shadow: 0 0 0 rgba(255,255,255,0); }
    35% { text-shadow: 0 10px 28px rgba(0,0,0,.35), 0 0 24px rgba(46,168,255,.5); }
    100% { text-shadow: 0 4px 14px rgba(0,0,0,.25); }
}

@keyframes fadeIn-b-7kpvvw98of {
    from { opacity: 0; filter: blur(2px); }
    to { opacity: 1; filter: blur(0); }
}

@keyframes pulse-b-7kpvvw98of {
    0%, 100% { transform: translate(-50%, -50%) scale(1); filter: drop-shadow(0 4px 10px rgba(0,0,0,.35)); }
    50% { transform: translate(-50%, -50%) scale(1.2); filter: drop-shadow(0 0 15px rgba(121,200,255,0.8)); }
}

@keyframes floatY-b-7kpvvw98of {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@keyframes fadeSoft-b-7kpvvw98of {
    0% { opacity: .65; }
    50% { opacity: .35; }
    100% { opacity: .65; }
}

.hex.float[b-7kpvvw98of] { animation: floatY-b-7kpvvw98of 6s ease-in-out infinite; }
.hex.soft[b-7kpvvw98of] { animation: fadeSoft-b-7kpvvw98of 8s ease-in-out infinite; }
.hex .icon.pulse[b-7kpvvw98of] { animation: pulse-b-7kpvvw98of 2.6s ease-in-out infinite; }

.animate__animated[b-7kpvvw98of] {
    animation-duration: 1s;
    animation-fill-mode: both;
}

.animate__fadeInLeft[b-7kpvvw98of] {
    animation-name: fadeInLeft-b-7kpvvw98of;
}

@keyframes fadeInLeft-b-7kpvvw98of {
    from { opacity: 0; transform: translate3d(-100%, 0, 0); }
    to { opacity: 1; transform: translate3d(0, 0, 0); }
}

/* ── Compact layout for laptop screens ── */
@media (min-width: 1024px) and (max-height: 900px) {
    .login-card[b-7kpvvw98of] {
        padding: 20px 28px;
        gap: 8px;
        top: 28%;
    }

    .logo-container[b-7kpvvw98of] {
        margin-bottom: 4px;
    }

    .login-logo[b-7kpvvw98of] {
        max-height: 80px;
    }

    .company-info[b-7kpvvw98of] {
        padding-bottom: 5px;
        margin-bottom: 2px;
    }

    .login-title[b-7kpvvw98of] {
        padding-bottom: 4px;
        font-size: 1.15rem;
    }

    .login-title[b-7kpvvw98of]:after {
        margin: 3px auto 0;
        width: 120px;
    }

    .login-card .form-group[b-7kpvvw98of] {
        margin-bottom: 0.5rem !important;
    }

    .login-card .mt-3[b-7kpvvw98of] {
        margin-top: 0.5rem !important;
    }
}
/* /Presentation/Components/Pages/Login/LoginCard.razor.rz.scp.css */
.login-card[b-1elxo3xxzu] {
    background: #FAFAFA;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    padding: 30px 40px;
    width: 100%;
    max-width: 420px;
    border: 1px solid rgba(255, 255, 255, 0.06);
    position: fixed;
    left: 6%;
    top: 30%;
    transform: translateY(-50%);
    z-index: 10;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.logo-container[b-1elxo3xxzu] {
    text-align: center;
    margin-bottom: 10px;
}

.login-logo[b-1elxo3xxzu] {
    max-width: 180px;
    max-height: 120px;
    width: auto;
    height: auto;
    object-fit: contain;
}

/* Company Info */
.company-info[b-1elxo3xxzu] {
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e9ecef;
    margin-bottom: 4px;
}
.company-name[b-1elxo3xxzu] {
    font-size: 1rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.3;
}
.company-meta[b-1elxo3xxzu] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.4;
}
.company-nitemail[b-1elxo3xxzu] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-wrap: wrap;
}
.company-location[b-1elxo3xxzu] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-wrap: wrap;
    font-size: 0.72rem;
}
.company-location i[b-1elxo3xxzu] {
    font-size: 0.68rem;
    color: #94a3b8;
}
.company-sep[b-1elxo3xxzu] {
    color: #cbd5e1;
    font-weight: 300;
}

.login-title[b-1elxo3xxzu] {
    text-align: center;
    font-size: 1.3rem;
    color: #2d3436;
    font-weight: 700;
    margin: 0;
    display: inline-block;
    position: relative;
    padding-bottom: 8px;
    width: 100%;
}

.login-title[b-1elxo3xxzu]:after {
    content: '';
    display: block;
    width: 150px;
    height: 3px;
    background: #3498db;
    margin: 5px auto 0;
    border-radius: 2px;
}

.input-group-text[b-1elxo3xxzu] {
    background-color: #f8f9fa;
    border-right: none;
    color: #b2bec3;
    transition: color 0.3s, background-color 0.3s, border-color 0.3s;
}

.input-group:focus-within .input-group-text[b-1elxo3xxzu],
.input-group:hover .input-group-text[b-1elxo3xxzu] {
    color: #3498db;
    background-color: #fff;
    border-color: #3498db;
}

.form-control[b-1elxo3xxzu] {
    border-left: none;
    box-shadow: none;
    background-color: #f8f9fa;
    height: 45px;
    font-size: 15px;
}

.form-control:focus[b-1elxo3xxzu] {
    border-color: #3498db;
    box-shadow: 0 0 0 4px rgba(52, 152, 219, 0.1);
    background-color: #fff;
}

.login-btn[b-1elxo3xxzu] {
    background-image: linear-gradient(to right, #3498db 0%, #2980b9 51%, #3498db 100%);
    border: none;
    border-radius: 5px;
    text-transform: uppercase;
    transition: 0.5s;
    background-size: 200% auto;
    box-shadow: 0 4px 10px rgba(52, 152, 219, 0.2);
    color: white;
    font-weight: 700;
    font-size: 15px;
    letter-spacing: 1px;
    padding: 10px 0;
}

.login-btn:hover[b-1elxo3xxzu] {
    background-position: right center;
}

.forgot-password[b-1elxo3xxzu] {
    color: #636e72;
    font-size: 13px;
    text-decoration: none;
    font-weight: 500;
}

.forgot-password:hover[b-1elxo3xxzu] {
    color: #3498db;
    text-decoration: underline;
}

.animate__animated[b-1elxo3xxzu] {
    animation-duration: 1s;
    animation-fill-mode: both;
}

.animate__fadeInLeft[b-1elxo3xxzu] {
    animation-name: fadeInLeft-b-1elxo3xxzu;
}

@keyframes fadeInLeft-b-1elxo3xxzu {
    from { opacity: 0; transform: translate3d(-100%, 0, 0); }
    to { opacity: 1; transform: translate3d(0, 0, 0); }
}

/* ── Compact layout for laptop screens ── */
@media (min-width: 1024px) and (max-height: 900px) {
    .login-card[b-1elxo3xxzu] {
        padding: 20px 28px;
        gap: 8px;
        top: 28%;
    }

    .logo-container[b-1elxo3xxzu] {
        margin-bottom: 4px;
    }

    .login-logo[b-1elxo3xxzu] {
        max-height: 80px;
    }

    .company-info[b-1elxo3xxzu] {
        padding-bottom: 5px;
        margin-bottom: 2px;
    }

    .login-title[b-1elxo3xxzu] {
        padding-bottom: 4px;
        font-size: 1.15rem;
    }

    .login-title[b-1elxo3xxzu]:after {
        margin: 3px auto 0;
        width: 120px;
    }

    .login-card .form-group[b-1elxo3xxzu] {
        margin-bottom: 0.5rem !important;
    }

    .login-card .mt-3[b-1elxo3xxzu] {
        margin-top: 0.5rem !important;
    }
}
/* /Presentation/Components/Pages/Mensajeria/Campañas.razor.rz.scp.css */
.editor-container[b-gp3co5idz4] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

.editor-header[b-gp3co5idz4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-gp3co5idz4] {
    font-size: 13px;
}

.editor-title-bar[b-gp3co5idz4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-gp3co5idz4],
.editor-title-bar .fw-semibold[b-gp3co5idz4],
.editor-title-bar small[b-gp3co5idz4] {
    color: #1a1d23 !important;
}

.editor-tab-content[b-gp3co5idz4] {
    background: #f8f9fa;
    border-top: none;
    flex:1;
    min-height: 0;
    overflow-y: auto;
    padding: 20px 24px 24px;
}

@media (max-width: 767.98px) {
    .editor-tab-content[b-gp3co5idz4] {
        padding: 12px 16px 16px;
    }
}

/* ── View toggle (cards/tabla) ── */
.view-toggle[b-gp3co5idz4] {
    display: inline-flex;
    gap: 0;
    margin-top: 6px;
}

.view-toggle-btn[b-gp3co5idz4] {
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid #adb5bd;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    background: #fff;
    color: #6c757d;
    transition: all 0.12s;
}

.view-toggle-btn:first-child[b-gp3co5idz4] {
    border-radius: 5px 0 0 5px;
}

.view-toggle-btn:last-child[b-gp3co5idz4] {
    border-radius: 0 5px 5px 0;
    border-left: 0;
}

.view-toggle-btn.active[b-gp3co5idz4] {
    background: #0d6efd;
    color: #fff;
}

/* ── Tamaño de texto tipo MenuManager (0.8rem) ── */
.editor-tab-content .table[b-gp3co5idz4] {
    font-size: 0.8rem;
}

.editor-tab-content .table .small[b-gp3co5idz4] {
    font-size: 0.7rem;
}

/* ── Badges de estado más legibles ── */
.editor-tab-content .table td .badge[b-gp3co5idz4] {
    font-size: 0.75rem;
    font-weight: 500;
}

/* ── Separador vertical en toolbar ── */
.toolbar-separator[b-gp3co5idz4] {
    width: 1px;
    height: 28px;
    background: #dee2e6;
    display: inline-block;
    flex-shrink: 0;
    margin: 0 2px;
}
/* /Presentation/Components/Pages/Mensajeria/Configuracion.razor.rz.scp.css */
.editor-container[b-03u0znokaz] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

.editor-header[b-03u0znokaz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-03u0znokaz] {
    font-size: 13px;
}

.editor-header-right[b-03u0znokaz] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.editor-title-bar[b-03u0znokaz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-03u0znokaz],
.editor-title-bar .fw-semibold[b-03u0znokaz],
.editor-title-bar small[b-03u0znokaz] {
    color: #1a1d23 !important;
}

/* ===== PESTAÑAS — EXACTO InstitucionPanel ===== */
.editor-tabs.nav-tabs[b-03u0znokaz] {
    border-bottom: none !important;
    display: flex;
    padding: 0 !important;
    margin: 0 !important;
    background: #e8eaed;
    list-style: none;
    gap: 0;
    position: relative;
    height: 44px;
    flex-shrink: 0;
    min-height: 44px;
}

.editor-tabs .nav-item[b-03u0znokaz] {
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
    display: flex;
    align-items: stretch;
}

.editor-tabs .nav-item:first-child[b-03u0znokaz] {
    margin: 0 !important;
    padding: 0 !important;
}

.editor-tabs .nav-link[b-03u0znokaz] {
    display: flex !important;
    align-items: center !important;
    justify-content: center;
    gap: 7px;
    padding: 0 20px !important;
    margin: 0 !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    color: #5f6368 !important;
    border: none !important;
    background: transparent !important;
    transition: all 0.15s ease;
    cursor: pointer;
    white-space: nowrap;
    position: relative;
    height: 44px !important;
    text-decoration: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

.editor-tabs .nav-link:hover[b-03u0znokaz] {
    color: #202124 !important;
    background: rgba(0, 0, 0, 0.04) !important;
}

.editor-tabs .nav-link.active[b-03u0znokaz] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
    height: 44px !important;
    padding: 0 20px !important;
    margin: 0 !important;
}

.editor-tabs .nav-item:first-child .nav-link.active[b-03u0znokaz] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
}

.editor-tabs .nav-link.active[b-03u0znokaz]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 12px;
    right: 12px;
    height: 3px;
    background: #1a73e8;
    border-radius: 3px 3px 0 0;
}

.editor-tabs .nav-item:not(:last-child) .nav-link:not(.active)[b-03u0znokaz]::after {
    content: '';
    position: absolute;
    right: 0;
    top: 10px;
    bottom: 10px;
    width: 1px;
    background: #dadce0;
}

.editor-tabs .nav-link i[b-03u0znokaz] {
    font-size: 14px;
    width: 16px;
    text-align: center;
    color: inherit;
}

/* ===== CONTENIDO — EXACTO InstitucionPanel ===== */
.editor-tab-content[b-03u0znokaz] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    overflow: hidden;
    position: relative;
}

.editor-tab-content > *[b-03u0znokaz] {
    position: absolute;
    inset: 0;
    overflow-y: auto;
    padding: 20px 24px 24px;
}

/* ===== SWITCHES COLOR WHATSAPP ===== */
.form-check-input:checked[role="switch"][b-03u0znokaz] {
    background-color: #25D366 !important;
    border-color: #25D366 !important;
}

.form-check-input[role="switch"][b-03u0znokaz] {
    cursor: pointer;
    width: 2.5em;
    height: 1.25em;
}

/* ===== TABLA DE PAQUETES ===== */
.table th[b-03u0znokaz] {
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    color: #5f6368;
}

.table td[b-03u0znokaz] {
    font-size: 0.85rem;
}

/* ===== FILA PLANTILLA WHATSAPP — integrada visualmente con su sección ===== */
/* La fila principal que antecede a una plantilla-row pierde su borde inferior */
.table tbody tr:has(+ tr.plantilla-row) td[b-03u0znokaz] {
    border-bottom: none !important;
}

/* La fila plantilla no tiene borde superior, solo el inferior de cierre */
.plantilla-row td[b-03u0znokaz] {
    border-top: none !important;
    border-bottom: 1px solid #e2e4e9;
    padding-top: 0.1rem !important;
    padding-bottom: 0.6rem !important;
}

/* Hover unificado: al pasar sobre cualquier fila del grupo, se iluminan ambas */
.table-hover tbody tr:hover + tr.plantilla-row td[b-03u0znokaz],
.table-hover tbody tr.plantilla-row:hover td[b-03u0znokaz] {
    background-color: var(--bs-table-hover-bg);
}

/* ===== ANIMACIONES ===== */
.notif-fade-out[b-03u0znokaz] {
    animation: notifFadeOut-b-03u0znokaz 0.3s ease forwards;
}

@keyframes notifFadeOut-b-03u0znokaz {
    from { opacity: 1; transform: translateY(0); }
    to   { opacity: 0; transform: translateY(-8px); }
}

@media (max-width: 767.98px) {
    .editor-tab-content > *[b-03u0znokaz] {
        padding: 12px 16px 16px;
    }

    .editor-tabs[b-03u0znokaz] {
        overflow-x: auto;
    }
}
/* /Presentation/Components/Pages/Mensajeria/Contactos.razor.rz.scp.css */
.editor-container[b-wxuhm12ufy] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

.editor-header[b-wxuhm12ufy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-wxuhm12ufy] {
    font-size: 13px;
}

.editor-title-bar[b-wxuhm12ufy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
    flex-wrap: wrap;
}

.editor-title-bar h4[b-wxuhm12ufy],
.editor-title-bar .fw-semibold[b-wxuhm12ufy],
.editor-title-bar small[b-wxuhm12ufy] {
    color: #1a1d23 !important;
}

.editor-tab-content[b-wxuhm12ufy] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 20px 24px 24px;
}

@media (max-width: 767.98px) {
    .editor-tab-content[b-wxuhm12ufy] {
        padding: 12px 16px 16px;
    }
}

/* ── Tamaño de texto tipo MenuManager (0.8rem) ── */
.editor-tab-content .table[b-wxuhm12ufy] {
    font-size: 0.8rem;
}

.editor-tab-content .table .small[b-wxuhm12ufy] {
    font-size: 0.7rem;
}

/* ── View toggle (cards/tabla) ── */
.view-toggle[b-wxuhm12ufy] {
    display: inline-flex;
    gap: 0;
    margin-top: 6px;
}

.view-toggle-btn[b-wxuhm12ufy] {
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid #adb5bd;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    background: #fff;
    color: #6c757d;
    transition: all 0.12s;
}

.view-toggle-btn:first-child[b-wxuhm12ufy] {
    border-radius: 5px 0 0 5px;
}

.view-toggle-btn:last-child[b-wxuhm12ufy] {
    border-radius: 0 5px 5px 0;
    border-left: 0;
}

.view-toggle-btn.active[b-wxuhm12ufy] {
    background: #0d6efd;
    color: #fff;
}

/* ── Separador vertical en toolbar ── */
.toolbar-separator[b-wxuhm12ufy] {
    width: 1px;
    height: 28px;
    background: #dee2e6;
    display: inline-block;
    flex-shrink: 0;
    margin: 0 2px;
}

/* ── Estilos específicos de contactos ── */
.contact-item:hover[b-wxuhm12ufy] {
    background-color: #f0f7ff !important;
}

.contact-item-selected[b-wxuhm12ufy] {
    background-color: #e3f0fa !important;
    border-left: 3px solid #29b6f6;
}

.contact-info-popover[b-wxuhm12ufy] {
    box-shadow: 0 4px 16px rgba(41,182,246,0.15);
}
/* /Presentation/Components/Pages/Mensajeria/Dashboard.razor.rz.scp.css */
.editor-container[b-nsz7xx1v4e] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

.editor-header[b-nsz7xx1v4e] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-nsz7xx1v4e] {
    font-size: 13px;
}

.editor-header-right[b-nsz7xx1v4e] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.editor-title-bar[b-nsz7xx1v4e] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-nsz7xx1v4e],
.editor-title-bar .fw-semibold[b-nsz7xx1v4e],
.editor-title-bar small[b-nsz7xx1v4e] {
    color: #1a1d23 !important;
}

.editor-tab-content[b-nsz7xx1v4e] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 20px 24px 24px;
}

@media (max-width: 767.98px) {
    .editor-tab-content[b-nsz7xx1v4e] {
        padding: 12px 16px 16px;
    }
}

/* ─── Estilos originales del Dashboard (preservados) ─── */

.btn-quick-filter[b-nsz7xx1v4e] {
    box-sizing: border-box !important;
    border-width: 1px !important;
    box-shadow: none !important;
    min-height: 30px !important;
    max-height: 30px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1 !important;
    overflow: hidden;
    white-space: nowrap;
}

.btn-quick-filter.btn-primary:focus[b-nsz7xx1v4e],
.btn-quick-filter.btn-outline-primary:focus[b-nsz7xx1v4e],
.btn-quick-filter.btn-primary:active[b-nsz7xx1v4e],
.btn-quick-filter.btn-outline-primary:active[b-nsz7xx1v4e] {
    box-shadow: none !important;
    transform: none !important;
}
/* /Presentation/Components/Pages/Mensajeria/Mensajes.razor.rz.scp.css */
.editor-container[b-0ekbhvrky0] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

.editor-header[b-0ekbhvrky0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-0ekbhvrky0] {
    font-size: 13px;
}

.editor-header-right[b-0ekbhvrky0] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.editor-title-bar[b-0ekbhvrky0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-0ekbhvrky0],
.editor-title-bar .fw-semibold[b-0ekbhvrky0],
.editor-title-bar small[b-0ekbhvrky0] {
    color: #1a1d23 !important;
}

.editor-tab-content[b-0ekbhvrky0] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 20px 24px 24px;
}

@media (max-width: 767.98px) {
    .editor-tab-content[b-0ekbhvrky0] {
        padding: 12px 16px 16px;
    }
}

/* ── Tamaño de texto estándar tablas (0.8rem) ── */
.editor-tab-content .table[b-0ekbhvrky0] {
    font-size: 0.8rem;
}

.editor-tab-content .table .small[b-0ekbhvrky0] {
    font-size: 0.7rem;
}

/* ─── Estilos originales del panel de Mensajes (preservados) ─── */

/* Botones de filtro rápido: fuerzan altura fija de 30px sin importar el estado (activo/inactivo).
   Esto evita que el botón "salte" verticalmente al cambiar de btn-outline-primary a btn-primary
   (que en Bootstrap añade border y box-shadow que cambian el tamaño del contenido). */
.btn-quick-filter[b-0ekbhvrky0] {
    box-sizing: border-box !important;
    border-width: 1px !important;
    box-shadow: none !important;
    min-height: 30px !important;
    max-height: 30px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1 !important;
    overflow: hidden;
    white-space: nowrap;
}

/* Asegura que el botón de búsqueda (lupa) tenga exactamente la misma altura que el input */
.btn-quick-filter.btn-primary:focus[b-0ekbhvrky0],
.btn-quick-filter.btn-outline-primary:focus[b-0ekbhvrky0],
.btn-quick-filter.btn-primary:active[b-0ekbhvrky0],
.btn-quick-filter.btn-outline-primary:active[b-0ekbhvrky0] {
    box-shadow: none !important;
    transform: none !important;
}

/* Alinear inputs de fecha a 30px exactos con font-size consistente */
.form-control[b-0ekbhvrky0],
.form-select[b-0ekbhvrky0] {
    box-sizing: border-box;
}

/* Estilo del input-group cuando hay botón de búsqueda (sin usar .input-group de Bootstrap) */
.search-input-wrapper input.form-control[b-0ekbhvrky0] {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: 0;
}

.search-input-wrapper button.btn[b-0ekbhvrky0] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

/* Fix para el icono del calendario nativo de inputs date en webkit (Chrome/Edge) */
input[type="date"][b-0ekbhvrky0]::-webkit-calendar-picker-indicator {
    cursor: pointer;
    opacity: 0.6;
}

input[type="date"][b-0ekbhvrky0]::-webkit-calendar-picker-indicator:hover {
    opacity: 1;
}

/* ===========================
   MODAL DE DETALLE - ESTILOS
   =========================== */

/* Card de información compacta (Contacto, Estado, Campaña, Plantilla) */
.modal-info-card[b-0ekbhvrky0] {
    background-color: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 10px 12px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.modal-info-card:hover[b-0ekbhvrky0] {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
    border-color: #dee2e6;
}

.modal-info-label[b-0ekbhvrky0] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #6c757d;
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    gap: 5px;
}

.modal-info-label i[b-0ekbhvrky0] {
    font-size: 0.7rem;
    color: #0d6efd;
}

.modal-info-value[b-0ekbhvrky0] {
    font-size: 0.9rem;
    color: #212529;
    font-weight: 500;
    margin-bottom: 2px;
    word-break: break-word;
}

.modal-info-sub[b-0ekbhvrky0] {
    font-size: 0.8rem;
    color: #6c757d;
}

/* Línea de tiempo con timeline visual */
.modal-timeline[b-0ekbhvrky0] {
    background-color: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.modal-timeline-header[b-0ekbhvrky0] {
    background-color: #f8f9fa;
    padding: 8px 12px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #6c757d;
    border-bottom: 1px solid #e9ecef;
    display: flex;
    align-items: center;
    gap: 5px;
}

.modal-timeline-header i[b-0ekbhvrky0] {
    color: #0d6efd;
}

.modal-timeline-body[b-0ekbhvrky0] {
    padding: 12px 14px;
}

.timeline-item[b-0ekbhvrky0] {
    display: flex;
    align-items: flex-start;
    position: relative;
    padding-bottom: 12px;
}

.timeline-item:not(:last-child)[b-0ekbhvrky0]::before {
    content: "";
    position: absolute;
    left: 13px;
    top: 28px;
    bottom: 0;
    width: 2px;
    background-color: #e9ecef;
}

.timeline-item:last-child[b-0ekbhvrky0] {
    padding-bottom: 0;
}

.timeline-dot[b-0ekbhvrky0] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 0.75rem;
    flex-shrink: 0;
    box-shadow: 0 0 0 3px #ffffff, 0 0 0 4px #e9ecef;
    position: relative;
    z-index: 1;
}

.timeline-content[b-0ekbhvrky0] {
    margin-left: 12px;
    flex: 1;
    min-width: 0;
}

.timeline-label[b-0ekbhvrky0] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #212529;
    display: flex;
    align-items: center;
}

.timeline-time[b-0ekbhvrky0] {
    font-size: 0.78rem;
    color: #6c757d;
    margin-top: 1px;
}

/* Contenido del mensaje */
.modal-content-box[b-0ekbhvrky0] {
    background-color: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.modal-content-header[b-0ekbhvrky0] {
    background-color: #f8f9fa;
    padding: 8px 12px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #6c757d;
    border-bottom: 1px solid #e9ecef;
    display: flex;
    align-items: center;
    gap: 5px;
}

.modal-content-header i[b-0ekbhvrky0] {
    color: #0d6efd;
}

.modal-content-text[b-0ekbhvrky0] {
    padding: 12px 14px;
    font-size: 0.88rem;
    line-height: 1.5;
    color: #212529;
    white-space: pre-wrap;
    max-height: 160px;
    overflow-y: auto;
    word-break: break-word;
}

/* Scrollbar sutil para el contenido del mensaje */
.modal-content-text[b-0ekbhvrky0]::-webkit-scrollbar {
    width: 6px;
}

.modal-content-text[b-0ekbhvrky0]::-webkit-scrollbar-track {
    background: #f8f9fa;
}

.modal-content-text[b-0ekbhvrky0]::-webkit-scrollbar-thumb {
    background: #ced4da;
    border-radius: 3px;
}

.modal-content-text[b-0ekbhvrky0]::-webkit-scrollbar-thumb:hover {
    background: #adb5bd;
}

/* ===========================
   HIGHLIGHT DE BÚSQUEDA
   =========================== */
mark.search-highlight[b-0ekbhvrky0] {
    background-color: #fff3cd;
    color: #664d03;
    padding: 0 2px;
    border-radius: 2px;
    font-weight: 600;
}

/* Tarjeta clickeable: cursor de mano y foco visible para accesibilidad */
.stat-card-filterable[b-0ekbhvrky0] {
    cursor: pointer;
    user-select: none;
}

.stat-card-filterable:focus-visible[b-0ekbhvrky0] {
    outline: 3px solid rgba(13, 110, 253, 0.6);
    outline-offset: 2px;
}

/* Tarjeta con filtro activo: anillo exterior para indicar selección */
.stat-card-filterable-active[b-0ekbhvrky0] {
    box-shadow: 0 0 0 3px #ffffff, 0 0 0 6px rgba(13, 110, 253, 0.55) !important;
    transform: translateY(-2px);
}

/* Badge "Activo" sobre la tarjeta seleccionada */
.stat-card-badge-active[b-0ekbhvrky0] {
    display: inline-flex;
    align-items: center;
    background-color: rgba(255, 255, 255, 0.95);
    color: #0d6efd;
    font-size: 0.6rem;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 8px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    vertical-align: middle;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

.row-mensaje-dblclick[b-0ekbhvrky0] {
    cursor: pointer;
}

.row-mensaje-dblclick:hover[b-0ekbhvrky0] {
    background-color: #eef4ff;
}

.filter-active-badge[b-0ekbhvrky0] {
    display: inline-flex;
    align-items: center;
    background-color: #0d6efd;
    color: white;
    font-size: 0.65rem;
    font-weight: 600;
    padding: 1px 6px;
    border-radius: 8px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    animation: pulse-active-b-0ekbhvrky0 1.5s ease-in-out infinite;
}

@keyframes pulse-active-b-0ekbhvrky0 {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

/* /Presentation/Components/Pages/Mensajeria/Plantillas.razor.rz.scp.css */
.editor-container[b-u8a9ld9qv7] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

.editor-header[b-u8a9ld9qv7] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-u8a9ld9qv7] {
    font-size: 13px;
}

.editor-header-right[b-u8a9ld9qv7] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.editor-title-bar[b-u8a9ld9qv7] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
    flex-wrap: wrap;
}

.editor-title-bar h4[b-u8a9ld9qv7],
.editor-title-bar .fw-semibold[b-u8a9ld9qv7],
.editor-title-bar small[b-u8a9ld9qv7] {
    color: #1a1d23 !important;
}

.editor-tab-content[b-u8a9ld9qv7] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 20px 24px 24px;
}

@media (max-width: 767.98px) {
    .editor-tab-content[b-u8a9ld9qv7] {
        padding: 12px 16px 16px;
    }
}

/* ── Badges de estado más legibles ── */
.editor-tab-content .table td .badge[b-u8a9ld9qv7] {
    font-size: 0.75rem;
    font-weight: 500;
}

/* ── Tamaño de texto tipo MenuManager (0.8rem) ── */
.editor-tab-content .table[b-u8a9ld9qv7] {
    font-size: 0.8rem;
}

.editor-tab-content .table .small[b-u8a9ld9qv7] {
    font-size: 0.7rem;
}
/* /Presentation/Components/Pages/Menu.razor.rz.scp.css */
.sidebar[b-6xi1ypfhlv] {
    width: 260px;
    background: var(--sidebar-gradient);
    color: var(--sidebar-text);
    display: flex;
    flex-direction: column;
    box-shadow: 2px 0 10px rgba(0,0,0,0.1);
    z-index: 100;
    transition: width 0.3s ease;
    height: 100%;
    overflow-y: auto;
    font-family: 'Roboto', 'Segoe UI', sans-serif;
}

/* Scrollbar styles for webkit */
.sidebar[b-6xi1ypfhlv]::-webkit-scrollbar {
    width: 6px;
}
.sidebar[b-6xi1ypfhlv]::-webkit-scrollbar-track {
    background: rgba(0,0,0,0.1);
}
.sidebar[b-6xi1ypfhlv]::-webkit-scrollbar-thumb {
    background: var(--sidebar-hover);
    border-radius: 3px;
}
.sidebar[b-6xi1ypfhlv]::-webkit-scrollbar-thumb:hover {
    background: var(--sidebar-hover);
}

.sidebar-header[b-6xi1ypfhlv] {
    background-color: var(--sidebar-bg-overlay);
    padding: 10px 15px;
    border-bottom: 1px solid var(--sidebar-border);
}

.nav-system-title[b-6xi1ypfhlv] {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--sidebar-header-color);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: -3px;
}

.soft-project-logo[b-6xi1ypfhlv] {
    display: block;
    max-width: 160px;
    margin: 10px auto;
    height: auto;
    opacity: 0.9;
}

/* User Info Section */
.user-info-panel[b-6xi1ypfhlv] {
    padding: 15px;
    background-color: var(--sidebar-bg-overlay);
    margin-bottom: 10px;
    border-bottom: 1px solid var(--sidebar-border);
}

.info-academic-title[b-6xi1ypfhlv] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--sidebar-sub-header-color);
    margin-bottom: 8px;
    border-bottom: 1px solid var(--sidebar-border);
    padding-bottom: 4px;
}

.user-details-container[b-6xi1ypfhlv] {
    display: flex;
    gap: 10px;
}

.user-data[b-6xi1ypfhlv] {
    flex: 1;
    font-size: 0.75rem;
    line-height: 1.4;
    color: var(--sidebar-user-label);
}

.user-data strong[b-6xi1ypfhlv] {
    color: var(--sidebar-user-value);
    font-weight: 600;
}

/* Toggle expandible de grupos académicos */
.grupos-toggle[b-6xi1ypfhlv] {
    margin-top: 2px;
}

.grupos-toggle-link[b-6xi1ypfhlv] {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    user-select: none;
}

.grupos-toggle-link:hover[b-6xi1ypfhlv] {
    color: var(--sidebar-user-value);
}

.grupos-chevron[b-6xi1ypfhlv] {
    font-size: 0.6rem;
    transition: transform 0.15s ease;
    color: var(--sidebar-sub-header-color);
}

.grupos-chevron.expanded[b-6xi1ypfhlv] {
    transform: rotate(90deg);
}

.grupos-detalle[b-6xi1ypfhlv] {
    margin-top: 4px;
    margin-left: 12px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.grupo-item[b-6xi1ypfhlv] {
    font-size: 0.75rem;
    color: var(--sidebar-user-value);
    padding: 1px 6px;
    background-color: var(--sidebar-bg-overlay);
    border-radius: 3px;
    display: inline-block;
    width: fit-content;
}

.user-photo-container[b-6xi1ypfhlv] {
    margin: 0 auto;
    width: 70px;
    height: 80px;
    border: 2px solid var(--sidebar-border);
    border-radius: 4px;
    overflow: hidden;
    background-color: #fff;
    cursor: pointer;
}

.user-photo[b-6xi1ypfhlv] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Wrapper de la foto de perfil (contenedor + botón cámara + menú desplegable) */
.user-photo-wrapper[b-6xi1ypfhlv] {
    position: relative;
}

/* Botón circular de cámara en el borde inferior de la foto */
.photo-upload-btn[b-6xi1ypfhlv] {
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 2px solid #fff;
    background: #0d6efd;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    box-shadow: 0 2px 6px rgba(0,0,0,0.35);
    transition: background-color 0.15s, transform 0.15s;
    z-index: 2;
}

.photo-upload-btn:hover[b-6xi1ypfhlv] {
    background: #0a58ca;
    transform: translateX(-50%) scale(1.08);
}

/* Capa invisible para detectar clic fuera del menú desplegable */
.profile-menu-backdrop[b-6xi1ypfhlv] {
    position: fixed;
    inset: 0;
    background: transparent;
    z-index: 990;
    cursor: default;
}

/* Menú desplegable de opciones del perfil */
.profile-menu-dropdown[b-6xi1ypfhlv] {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 1000;
    min-width: 210px;
    max-width: 240px;
    background: #ffffff;
    color: #2c3e50;
    border: 1px solid #d0d0d0;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.25);
    padding: 6px 0;
    font-size: 0.8rem;
    text-align: left;
}

/* Variante centrada (cuando la foto se muestra centrada sin info académica) */
.profile-menu-dropdown-center[b-6xi1ypfhlv] {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
}

[data-theme="light"] .profile-menu-dropdown[b-6xi1ypfhlv] {
    background: #ffffff;
    border-color: #d0d0d0;
    color: #2c3e50;
    box-shadow: 0 8px 24px rgba(0,0,0,0.15);
}

.profile-menu-header[b-6xi1ypfhlv] {
    padding: 8px 14px;
    border-bottom: 1px solid #ececec;
    margin-bottom: 4px;
}

.profile-menu-header strong[b-6xi1ypfhlv] {
    display: block;
    font-size: 0.82rem;
    color: #2c3e50;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
}

.profile-menu-header small[b-6xi1ypfhlv] {
    display: block;
    color: #7f8c8d;
    font-size: 0.7rem;
    margin-top: 2px;
}

.profile-menu-item[b-6xi1ypfhlv] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 14px;
    cursor: pointer;
    color: #2c3e50;
    transition: background-color 0.12s;
    user-select: none;
}

.profile-menu-item:hover[b-6xi1ypfhlv] {
    background-color: #f0f4f8;
}

.profile-menu-item i[b-6xi1ypfhlv] {
    width: 16px;
    text-align: center;
    color: #0d6efd;
}

.user-general-info[b-6xi1ypfhlv] {
    padding: 10px 15px;
    font-size: 0.8rem;
    border-bottom: 1px solid var(--sidebar-border);
}

.info-row[b-6xi1ypfhlv] {
    margin-bottom: 6px;
    color: var(--sidebar-user-label);
}

.info-row strong[b-6xi1ypfhlv] {
    color: var(--sidebar-user-value);
    margin-right: 5px;
}

/* Truncar texto de nombre de usuario con tooltip en hover */
.user-name-text[b-6xi1ypfhlv] {
    display: inline-block;
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom;
}

.welcome-badge[b-6xi1ypfhlv] {
    background-color: var(--sidebar-bg-overlay);
    color: var(--sidebar-text);
    text-align: center;
    padding: 6px;
    border-radius: 4px;
    margin: 10px 15px;
    font-size: 0.85rem;
    font-weight: 500;
    border: 1px solid var(--sidebar-border);
}

.sede-selector[b-6xi1ypfhlv] {
    padding: 0 15px 15px;
}

.sede-label[b-6xi1ypfhlv] {
    display: block;
    font-size: 0.75rem;
    color: var(--sidebar-user-label);
    margin-bottom: 4px;
    text-transform: uppercase;
}

.form-select-sm-custom[b-6xi1ypfhlv] {
    width: 100%;
    background-color: var(--sidebar-bg-overlay);
    border: 1px solid var(--sidebar-border);
    color: var(--sidebar-text);
    padding: 4px 8px;
    font-size: 0.8rem;
    border-radius: 4px;
}

.form-select-sm-custom:focus[b-6xi1ypfhlv] {
    outline: none;
    border-color: #3498db;
    box-shadow: 0 0 0 2px rgba(52,152,219,0.3);
}

.logout-container[b-6xi1ypfhlv] {
    padding: 0 15px 15px;
    text-align: right;
}

.btn-logout-custom[b-6xi1ypfhlv] {
    background: linear-gradient(to bottom, #e74c3c, #c0392b);
    border: 1px solid #a93226;
    color: white;
    font-size: 0.8rem;
    padding: 5px 12px;
    border-radius: 4px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    transition: all 0.2s;
}

.btn-logout-custom:hover[b-6xi1ypfhlv] {
    background: linear-gradient(to bottom, #ec7063, #e74c3c);
    transform: translateY(-1px);
}

/* Modules Section */
.modules-header[b-6xi1ypfhlv] {
    background-color: var(--sidebar-bg-overlay);
    padding: 8px 15px;
    color: var(--sidebar-header-color);
    font-weight: 700;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 8px;
    border-top: 1px solid var(--sidebar-border);
    border-bottom: 1px solid var(--sidebar-border);
}

.modules-tree[b-6xi1ypfhlv] {
    padding: 10px 0;
}


.suros-watermark-bottom[b-6xi1ypfhlv] {
    margin-top: auto;
    text-align: center;
    padding: 20px;
    opacity: 0.3;
}

.watermark-img[b-6xi1ypfhlv] {
    width: 80px;
    filter: grayscale(100%);
}

.tab-title[b-6xi1ypfhlv] {
    font-size: 0.9rem;
    font-weight: 500;
    color: #212529;
    height: 36px !important;
}

/* El botón de favoritos (.fav-star-btn) está definido en MenuTreeNode.razor.css */

/* Buscador de módulos */
.module-search-wrapper[b-6xi1ypfhlv] {
    position: relative;
    padding: 6px 12px;
    display: flex;
    align-items: center;
    background-color: var(--sidebar-bg-overlay);
    border-bottom: 1px solid var(--sidebar-border);
}

.module-search-icon[b-6xi1ypfhlv] {
    position: absolute;
    left: 14px;
    font-size: 0.7rem;
    color: var(--sidebar-user-label);
    pointer-events: none;
    opacity: 0.6;
}

.module-search-input[b-6xi1ypfhlv] {
    width: 100%;
    background-color: var(--sidebar-hover);
    border: 1px solid transparent;
    color: var(--sidebar-text);
    padding: 4px 24px 4px 22px;
    font-size: 0.75rem;
    border-radius: 4px;
    outline: none;
    transition: border-color 0.15s;
}

.module-search-input:focus[b-6xi1ypfhlv] {
    border-color: #3498db;
    box-shadow: 0 0 0 2px rgba(52,152,219,0.2);
}

.module-search-input[b-6xi1ypfhlv]::placeholder {
    color: var(--sidebar-user-label);
    opacity: 0.5;
    font-size: 0.7rem;
}

.module-search-clear[b-6xi1ypfhlv] {
    position: absolute;
    right: 14px;
    background: none;
    border: none;
    color: var(--sidebar-user-label);
    cursor: pointer;
    padding: 2px 4px;
    font-size: 0.65rem;
    opacity: 0.6;
    transition: opacity 0.15s;
    line-height: 1;
}

.module-search-clear:hover[b-6xi1ypfhlv] {
    opacity: 1;
    color: #e74c3c;
}

.module-search-empty[b-6xi1ypfhlv] {
    text-align: center;
    padding: 20px 15px;
    color: var(--sidebar-user-label);
    font-size: 0.8rem;
    font-style: italic;
    opacity: 0.6;
}

/* El resaltado de búsqueda (.module-search-highlight) está definido en MenuTreeNode.razor.css */

/* ============================================================
   Panel colapsado (solo iconos)
   ============================================================ */

.sidebar-collapsed[b-6xi1ypfhlv] {
    width: 60px;
    overflow: visible;
    z-index: 200;
}

.sidebar-collapsed .sidebar-header[b-6xi1ypfhlv] {
    padding: 10px 6px;
}

.sidebar-collapsed .nav-system-title span:first-child[b-6xi1ypfhlv] {
    display: none;
}

.sidebar-collapsed .nav-system-title[b-6xi1ypfhlv] {
    justify-content: center;
    gap: 10px;
    margin-bottom: 0;
}

.sidebar-collapsed .nav-system-title .d-flex[b-6xi1ypfhlv] {
    gap: 4px;
}

.sidebar-collapsed .nav-system-title .d-flex i[b-6xi1ypfhlv] {
    font-size: 0.95rem;
}

.sidebar-collapsed .nav-system-title .d-flex .me-3[b-6xi1ypfhlv] {
    margin-right: 0 !important;
}

.sidebar-collapsed .soft-project-logo[b-6xi1ypfhlv] {
    display: none;
}

.sidebar-collapsed .user-info-panel[b-6xi1ypfhlv] {
    display: none;
}

.sidebar-collapsed .user-general-info[b-6xi1ypfhlv] {
    display: none;
}

.sidebar-collapsed .welcome-badge[b-6xi1ypfhlv] {
    display: none;
}

.sidebar-collapsed .sede-selector[b-6xi1ypfhlv] {
    display: none;
}

.sidebar-collapsed .modules-header span[b-6xi1ypfhlv] {
    display: none;
}

.sidebar-collapsed .modules-header[b-6xi1ypfhlv] {
    justify-content: center;
    padding: 8px 0;
}

.sidebar-collapsed .module-search-wrapper[b-6xi1ypfhlv] {
    display: none;
}

.sidebar-collapsed .modules-tree[b-6xi1ypfhlv] {
    padding: 6px 0;
}

/* Las reglas del árbol en panel colapsado (.sidebar-collapsed .tree-*) están en MenuTreeNode.razor.css */

.sidebar-collapsed .suros-watermark-bottom[b-6xi1ypfhlv] {
    display: none;
}

.sidebar-collapsed .logout-container[b-6xi1ypfhlv] {
    padding: 8px 0;
    text-align: center;
}

.sidebar-collapsed .btn-logout-custom .logout-text[b-6xi1ypfhlv] {
    display: none;
}

.sidebar-collapsed .btn-logout-custom[b-6xi1ypfhlv] {
    background: none;
    border: none;
    box-shadow: none;
    font-size: 1.1rem;
    padding: 4px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    justify-content: center;
    color: var(--sidebar-text);
    opacity: 0.7;
    transition: all 0.15s;
}

.sidebar-collapsed .btn-logout-custom:hover[b-6xi1ypfhlv] {
    opacity: 1;
    background: rgba(255,255,255,0.1);
}

/* ============================================================
   Modal de Actualizar Foto de Perfil
   ============================================================ */

.photo-upload-modal[b-6xi1ypfhlv] {
    border: none;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 12px 40px rgba(0,0,0,0.25);
}

.photo-upload-modal .modal-header[b-6xi1ypfhlv] {
    border-bottom: 1px solid #eef0f3;
    padding: 16px 20px;
    background: linear-gradient(180deg, #f8fafc, #ffffff);
}

.photo-upload-modal .modal-title[b-6xi1ypfhlv] {
    font-size: 1rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.photo-upload-modal .modal-body[b-6xi1ypfhlv] {
    padding: 24px 20px;
    background: #f8fafc;
}

.photo-upload-modal .modal-footer[b-6xi1ypfhlv] {
    border-top: 1px solid #eef0f3;
    padding: 12px 20px;
    background: #ffffff;
}

/* Zona de carga elegante */
.upload-zone[b-6xi1ypfhlv] {
    border: 2px dashed #c3cdd8;
    border-radius: 12px;
    background: #ffffff;
    padding: 32px 20px;
    text-align: center;
    transition: border-color 0.2s, background-color 0.2s, transform 0.2s;
    cursor: pointer;
}

.upload-zone:hover[b-6xi1ypfhlv] {
    border-color: #0d6efd;
    background: #f0f6ff;
}

.upload-zone.dragging[b-6xi1ypfhlv] {
    border-color: #0d6efd;
    background: #e8f1ff;
    transform: scale(1.01);
}

.upload-zone-label[b-6xi1ypfhlv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    color: #6c757d;
    cursor: pointer;
    margin: 0;
}

.upload-zone-label i[b-6xi1ypfhlv] {
    font-size: 2.2rem;
    color: #0d6efd;
    margin-bottom: 6px;
}

.upload-zone-label strong[b-6xi1ypfhlv] {
    font-size: 0.9rem;
    color: #343a40;
    font-weight: 600;
}

.upload-zone-label small[b-6xi1ypfhlv] {
    font-size: 0.75rem;
    color: #adb5bd;
}

/* Avatares de vista previa */
.preview-label[b-6xi1ypfhlv] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin-bottom: 8px;
    text-align: center;
}

.avatar-preview[b-6xi1ypfhlv] {
    margin: 0 auto;
    border: 3px solid #ffffff;
    box-shadow: 0 4px 14px rgba(0,0,0,0.18);
    background: #e9ecef;
    overflow: hidden;
    position: relative;
}

.avatar-preview img[b-6xi1ypfhlv] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.avatar-preview-circle[b-6xi1ypfhlv] {
    width: 120px;
    height: 120px;
    border-radius: 50%;
}

.avatar-preview-rect[b-6xi1ypfhlv] {
    width: 96px;
    height: 112px;
    border-radius: 6px;
}

/* Tarjeta de información del archivo */
.file-info-card[b-6xi1ypfhlv] {
    background: #ffffff;
    border: 1px solid #e6e9ee;
    border-radius: 10px;
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.file-info-header[b-6xi1ypfhlv] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.file-icon[b-6xi1ypfhlv] {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: #e8f1ff;
    color: #0d6efd;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.file-info-name[b-6xi1ypfhlv] {
    min-width: 0;
    flex: 1;
}

.file-info-name strong[b-6xi1ypfhlv] {
    display: block;
    font-size: 0.82rem;
    color: #212529;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.file-info-name small[b-6xi1ypfhlv] {
    font-size: 0.7rem;
    color: #8a93a1;
}

.file-info-meta[b-6xi1ypfhlv] {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    font-size: 0.75rem;
    color: #6c757d;
    border-top: 1px dashed #e6e9ee;
    padding-top: 8px;
}

.file-info-meta span[b-6xi1ypfhlv] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.file-info-meta i[b-6xi1ypfhlv] {
    color: #0d6efd;
}

/* Estado de carga y subida */
.upload-progress[b-6xi1ypfhlv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 16px 0;
}

.upload-progress-ring[b-6xi1ypfhlv] {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #e8f1ff;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 8px;
}

.upload-progress-bar[b-6xi1ypfhlv] {
    width: 100%;
    height: 6px;
    border-radius: 3px;
    overflow: hidden;
}
/* /Presentation/Components/Pages/MenuTreeNode.razor.rz.scp.css */
.tree-item[b-z6qzndqg26] {
    cursor: pointer;
    padding: 6px 15px;
    display: flex;
    align-items: center;
    font-size: 0.8rem;
    color: var(--sidebar-text);
    transition: background-color 0.15s;
    user-select: none;
}

.tree-item:hover[b-z6qzndqg26] {
    background-color: var(--sidebar-hover);
    color: var(--sidebar-text);
}

.tree-icon[b-z6qzndqg26] {
    width: 18px;
    text-align: center;
    margin-right: 8px;
    color: #f1c40f; /* Folder color */
}

.tree-toggle[b-z6qzndqg26] {
    width: 14px;
    margin-right: 4px;
    font-size: 0.7rem;
    color: var(--sidebar-user-label);
    transition: transform 0.2s;
}

.tree-toggle.expanded[b-z6qzndqg26] {
    transform: rotate(90deg);
}

.tree-text[b-z6qzndqg26] {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tree-children[b-z6qzndqg26] {
    padding-left: 10px;
    display: none;
    background-color: var(--sidebar-bg-overlay);
}

.tree-children.expanded[b-z6qzndqg26] {
    display: block;
}

.tree-item.leaf .tree-icon[b-z6qzndqg26] {
    color: #2ecc71; /* Item color */
}

/* Items no disponibles (sin PAGI_URL2 - migración pendiente) */
.tree-item.disabled[b-z6qzndqg26] {
    cursor: default;
    opacity: 0.5;
}
.tree-item.disabled:hover[b-z6qzndqg26] {
    background-color: transparent;
}
.tree-item.disabled .tree-text[b-z6qzndqg26] {
    font-style: italic;
}
.tree-item.disabled .tree-icon[b-z6qzndqg26] {
    color: #95a5a6;
}

/* Favoritos: estrella en items del menú */
.fav-star-btn[b-z6qzndqg26] {
    background: none;
    border: none;
    padding: 2px 4px;
    font-size: 0.7rem;
    color: #888;
    cursor: pointer;
    opacity: 0.4;
    transition: all 0.15s ease;
    line-height: 1;
    flex-shrink: 0;
    margin-left: auto;
}
.fav-star-btn:hover[b-z6qzndqg26] {
    opacity: 1;
    color: #f1c40f;
}
.fav-star-btn.active[b-z6qzndqg26] {
    opacity: 1;
    color: #f1c40f;
}

/* Resaltado de coincidencias de búsqueda */
.module-search-highlight[b-z6qzndqg26] {
    background-color: #f1c40f;
    color: #2c3e50;
    padding: 0 1px;
    border-radius: 2px;
    font-weight: 600;
}

/* ============================================================
   Panel colapsado (solo iconos)
   ============================================================ */

.sidebar-collapsed .tree-item[b-z6qzndqg26] {
    padding: 6px 0;
    justify-content: center;
}

.sidebar-collapsed .tree-icon[b-z6qzndqg26] {
    margin-right: 0;
    width: auto;
    font-size: 1.1rem;
}

.sidebar-collapsed .tree-text[b-z6qzndqg26] {
    display: none;
}

.sidebar-collapsed .tree-toggle[b-z6qzndqg26] {
    display: none;
}

.sidebar-collapsed .fav-star-btn[b-z6qzndqg26] {
    display: none;
}

.sidebar-collapsed .tree-item small[b-z6qzndqg26] {
    display: none;
}

.sidebar-collapsed .tree-children[b-z6qzndqg26] {
    position: relative;
    left: 0;
    width: 220px;
    min-width: 220px;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(8px);
    border: 1px solid var(--sidebar-border);
    border-radius: 6px;
    box-shadow: 4px 4px 12px rgba(0,0,0,0.35);
    padding: 6px 0;
    z-index: 210;
    margin: 2px 0;
}

[data-theme="light"] .sidebar-collapsed .tree-children[b-z6qzndqg26] {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    box-shadow: 4px 4px 12px rgba(0,0,0,0.15);
}

.sidebar-collapsed .tree-children .tree-text[b-z6qzndqg26] {
    display: inline;
    white-space: nowrap;
    font-size: 0.78rem;
}

.sidebar-collapsed .tree-children .tree-item[b-z6qzndqg26] {
    justify-content: flex-start;
    padding: 5px 12px;
    gap: 6px;
}

.sidebar-collapsed .tree-children .tree-icon[b-z6qzndqg26] {
    margin-right: 6px;
    width: 18px;
    font-size: 0.8rem;
}

.sidebar-collapsed .tree-children .fav-star-btn[b-z6qzndqg26] {
    display: inline-flex;
    opacity: 0.3;
}

.sidebar-collapsed .tree-children .tree-item small[b-z6qzndqg26] {
    display: inline;
}
/* /Presentation/Components/Pages/Monitoreo/AgendaMonitor.razor.rz.scp.css */
/* ── Contenedor principal (exacto como Configuración Mensajería) ── */
.editor-container[b-i2o6tvkta5] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

.editor-header[b-i2o6tvkta5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-i2o6tvkta5] {
    font-size: 13px;
}

.editor-header-right[b-i2o6tvkta5] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* ── Title bar: filtros al nivel del título (como Plantillas) ── */
.editor-title-bar[b-i2o6tvkta5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 8px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
    flex-wrap: wrap;
}

.editor-title-bar h4[b-i2o6tvkta5],
.editor-title-bar .fw-semibold[b-i2o6tvkta5],
.editor-title-bar small[b-i2o6tvkta5] {
    color: #1a1d23 !important;
}

/* ── Toolbar de filtros (compacto y uniforme, patrón Plantillas) ── */
.agenda-filters[b-i2o6tvkta5] {
    gap: 6px;
}

.agenda-filters .input-group[b-i2o6tvkta5] {
    flex-wrap: nowrap;
    height: 36px;
}

.agenda-filters .input-group .input-group-text[b-i2o6tvkta5] {
    height: 36px;
    border: 1px solid #dee2e6;
    border-right: none;
    background-color: #fff;
    color: #6b7280;
    padding: 0 8px;
    font-size: 0.8rem;
    line-height: 1.4;
    display: flex;
    align-items: center;
}

.agenda-filters .input-group .form-control[b-i2o6tvkta5],
.agenda-filters .input-group select.form-control[b-i2o6tvkta5] {
    height: 36px;
    border: 1px solid #dee2e6;
    border-left: none;
    background-color: #fff;
    padding: 0 8px;
    font-size: 0.8rem;
    line-height: 1.4;
    box-shadow: none;
    color: #1a1d23;
    overflow: visible;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* Inputs de fecha nativos: misma altura y tipografía que selects */
.agenda-filters .input-group input[type="date"].form-control[b-i2o6tvkta5] {
    height: 36px;
    font-size: 0.8rem;
    line-height: 1.4;
    padding: 0 8px;
    min-height: 0;
}

.agenda-filters .input-group .form-control:focus[b-i2o6tvkta5],
.agenda-filters .input-group select.form-control:focus[b-i2o6tvkta5],
.agenda-filters .input-group input[type="date"].form-control:focus[b-i2o6tvkta5] {
    border-color: #86b7fe;
    box-shadow: 0 0 0 0.15rem rgba(13, 110, 253, 0.15);
}

.agenda-filters .input-group:focus-within .input-group-text[b-i2o6tvkta5] {
    border-color: #86b7fe;
}

.agenda-filters .agenda-filters-sep[b-i2o6tvkta5] {
    line-height: 36px;
    font-size: 0.8rem;
    color: #9ca3af;
}

.agenda-filters .agenda-filters-btn[b-i2o6tvkta5] {
    height: 30px;
    font-size: 0.8rem;
    padding: 0 10px;
    white-space: nowrap;
    line-height: 1.4;
    box-shadow: 0 1px 2px rgba(13, 110, 253, 0.2);
    border-radius: 0.25rem;
}

/* ── Contenido (fondo gris, scroll) ── */
.editor-tab-content[b-i2o6tvkta5] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 20px 24px 24px;
}

/* ── Tabla con layout fijo ── */
.agenda-monitor-table[b-i2o6tvkta5] {
    table-layout: fixed;
    width: 100%;
    font-size: 0.8rem;
}

.agenda-monitor-table .am-col-id[b-i2o6tvkta5] { width: 7%; }
.agenda-monitor-table .am-col-fecha[b-i2o6tvkta5] { width: 9%; }
.agenda-monitor-table .am-col-inicio[b-i2o6tvkta5] { width: 4.5%; }
.agenda-monitor-table .am-col-fin[b-i2o6tvkta5] { width: 4.5%; }
.agenda-monitor-table .am-col-desc[b-i2o6tvkta5] { width: 17%; }
.agenda-monitor-table .am-col-tiempo[b-i2o6tvkta5] { width: 5%; }
.agenda-monitor-table .am-col-doctor[b-i2o6tvkta5] { width: 14%; }
.agenda-monitor-table .am-col-especialidad[b-i2o6tvkta5] { width: 11%; }
.agenda-monitor-table .am-col-rangos[b-i2o6tvkta5] { width: 4%; }
.agenda-monitor-table .am-col-num[b-i2o6tvkta5] { width: 4.5%; }
.agenda-monitor-table .am-col-estado[b-i2o6tvkta5] { width: 9%; }
.agenda-monitor-table .am-col-acciones[b-i2o6tvkta5] { width: 10%; min-width: 104px; }

.agenda-monitor-table .cell-truncate[b-i2o6tvkta5] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 1px;
}

.agenda-monitor-table .cell-date[b-i2o6tvkta5] {
    font-weight: 600;
    font-size: 0.78rem;
}

.agenda-monitor-table td .badge[b-i2o6tvkta5] {
    font-size: 0.7rem;
    font-weight: 500;
    padding: 0.3em 0.55em;
}

.agenda-monitor-table .btn-link[b-i2o6tvkta5] {
    width: 30px;
    height: 30px;
    padding: 0 !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.25rem;
    font-size: 0.85rem;
    text-decoration: none;
}

.agenda-monitor-table .btn-link .bi[b-i2o6tvkta5] {
    line-height: 1;
    display: inline-block;
    vertical-align: middle;
}

.agenda-monitor-table .btn-link:hover[b-i2o6tvkta5] {
    background-color: rgba(0, 0, 0, 0.06);
}

.agenda-monitor-table .text-danger[b-i2o6tvkta5],
.agenda-monitor-table .text-success[b-i2o6tvkta5],
.agenda-monitor-table .text-warning[b-i2o6tvkta5] {
    font-weight: 500;
}

/* ── Responsive ── */
@media (max-width: 767.98px) {
    .editor-tab-content[b-i2o6tvkta5] {
        padding: 12px 16px 16px;
    }
}

/* ── Cards de historial de envíos masivos ── */

/* ── Modales con alto fijo 80vh ── */
/* Se conserva modal-dialog-centered de Bootstrap para el centrado vertical;
   aquí solo se fija el alto al 80% del viewport (anulando el min-height de Bootstrap) */
.bulk-wizard-dialog[b-i2o6tvkta5],
.history-dialog[b-i2o6tvkta5] {
    height: 80vh;
    min-height: 80vh;
    max-height: 80vh;
}

.bulk-wizard-content[b-i2o6tvkta5],
.history-content[b-i2o6tvkta5] {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: 100%;
}

.bulk-wizard-body[b-i2o6tvkta5],
.history-body[b-i2o6tvkta5] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
}

/* ── Cards de métricas del asistente con patrón de burbujas ── */
.bulk-metrics-row[b-i2o6tvkta5] {
    margin: 0;
}

.bulk-metrics-row > [class*="col-"][b-i2o6tvkta5] {
    padding-left: 4px;
    padding-right: 4px;
}

.metric-bubble-card[b-i2o6tvkta5] {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 62px;
    padding: 6px 8px;
    border-radius: 0.5rem;
    line-height: 1.2;
    text-align: center;
}

/* Fondo oscuro y borde por variante */
.metric-bubble-card.bubble-primary[b-i2o6tvkta5] {
    background: linear-gradient(135deg, #0a58ca 0%, #0d6efd 100%);
    border: 1px solid #0a58ca;
}

.metric-bubble-card.bubble-success[b-i2o6tvkta5] {
    background: linear-gradient(135deg, #146c43 0%, #198754 100%);
    border: 1px solid #146c43;
}

.metric-bubble-card.bubble-danger[b-i2o6tvkta5] {
    background: linear-gradient(135deg, #b02a37 0%, #dc3545 100%);
    border: 1px solid #b02a37;
}

.metric-bubble-card.bubble-info[b-i2o6tvkta5] {
    background: linear-gradient(135deg, #0e8fa8 0%, #0dcaf0 100%);
    border: 1px solid #0e8fa8;
}

/* Burbujas decorativas de fondo (blancas translúcidas para verse sobre fondo oscuro) */
.metric-bubble-card[b-i2o6tvkta5]::before,
.metric-bubble-card[b-i2o6tvkta5]::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    background: radial-gradient(circle at 35% 35%, rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0.10) 55%, transparent 72%);
}

/* Posición por defecto: burbuja grande arriba-derecha + pequeña abajo-izquierda */
.metric-bubble-card[b-i2o6tvkta5]::before {
    width: 66px;
    height: 66px;
    top: -28px;
    right: -22px;
}

.metric-bubble-card[b-i2o6tvkta5]::after {
    width: 34px;
    height: 34px;
    bottom: -14px;
    left: -10px;
    background: radial-gradient(circle at 60% 60%, rgba(255, 255, 255, 0.22), transparent 65%);
}

/* Cada variante rota el sentido de las burbujas para no verse todas iguales */
.metric-bubble-card.bubble-success[b-i2o6tvkta5]::before {
    top: auto;
    right: auto;
    bottom: -28px;
    left: -22px;
    background: radial-gradient(circle at 35% 35%, rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0.10) 55%, transparent 72%);
}

.metric-bubble-card.bubble-success[b-i2o6tvkta5]::after {
    bottom: auto;
    left: auto;
    top: -14px;
    right: -10px;
    background: radial-gradient(circle at 60% 60%, rgba(255, 255, 255, 0.22), transparent 65%);
}

.metric-bubble-card.bubble-danger[b-i2o6tvkta5]::before {
    top: -28px;
    right: auto;
    left: -22px;
    background: radial-gradient(circle at 35% 35%, rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0.10) 55%, transparent 72%);
}

.metric-bubble-card.bubble-danger[b-i2o6tvkta5]::after {
    bottom: auto;
    left: auto;
    top: auto;
    right: -10px;
    bottom: -14px;
    background: radial-gradient(circle at 60% 60%, rgba(255, 255, 255, 0.22), transparent 65%);
}

.metric-bubble-card.bubble-info[b-i2o6tvkta5]::before {
    top: auto;
    right: auto;
    bottom: -28px;
    right: -22px;
    background: radial-gradient(circle at 35% 35%, rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0.10) 55%, transparent 72%);
}

.metric-bubble-card.bubble-info[b-i2o6tvkta5]::after {
    bottom: auto;
    left: auto;
    top: -14px;
    left: -10px;
    background: radial-gradient(circle at 60% 60%, rgba(255, 255, 255, 0.22), transparent 65%);
}

.metric-bubble-value[b-i2o6tvkta5] {
    font-size: 1.02rem;
    font-weight: 700;
    line-height: 1.1;
    position: relative;
    z-index: 1;
    color: #ffffff;
}

.metric-bubble-label[b-i2o6tvkta5] {
    font-size: 0.62rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    position: relative;
    z-index: 1;
    color: rgba(255, 255, 255, 0.85);
}

/* ── Stepper del asistente (pasos centrados) ── */
.bulk-steps[b-i2o6tvkta5] {
    gap: 14px;
}

/* Badge de fecha del encabezado: centrado vertical con el título y el botón cerrar */
.bulk-date-badge[b-i2o6tvkta5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    font-size: 0.68rem;
    padding: 5px 10px;
    line-height: 1;
    white-space: nowrap;
}

.bulk-step[b-i2o6tvkta5] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    line-height: 1;
}

/* Caja del número del paso: centrado perfecto del dígito */
.bulk-step-badge[b-i2o6tvkta5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    border-radius: 50%;
    background-color: #adb5bd;
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1;
    flex-shrink: 0;
}

.bulk-step-badge.active[b-i2o6tvkta5] {
    background-color: #0d6efd;
}

.bulk-step-label[b-i2o6tvkta5] {
    font-size: 0.75rem;
    color: #6c757d;
    white-space: nowrap;
}

.bulk-step-label.current[b-i2o6tvkta5] {
    font-weight: 600;
    color: #212529;
}

/* Flecha entre pasos: centrada verticalmente con el resto del stepper */
.bulk-step-arrow[b-i2o6tvkta5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    font-size: 0.7rem;
    line-height: 1;
    flex-shrink: 0;
}

.history-campaign-card[b-i2o6tvkta5] {
    border-radius: 0.5rem;
    transition: box-shadow 0.15s ease;
}

.history-campaign-card.border-primary[b-i2o6tvkta5] {
    border-color: #0d6efd !important;
}

.history-campaign-card .min-width-0[b-i2o6tvkta5] {
    min-width: 0;
}

/* Métricas de estado por campaña (se extienden a todo el ancho) */
.history-metrics-row[b-i2o6tvkta5] {
    margin: 0;
}

.history-metrics-row > [class*="col-"][b-i2o6tvkta5] {
    padding-left: 3px;
    padding-right: 3px;
}

.history-metric[b-i2o6tvkta5] {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 52px;
    padding: 4px 8px;
    border-radius: 0.375rem;
    line-height: 1.2;
    text-align: center;
}

.history-metric-value[b-i2o6tvkta5] {
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.1;
}

.history-metric-label[b-i2o6tvkta5] {
    font-size: 0.62rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    opacity: 0.8;
}

/* Selector de campañas (master-detail) */
.history-campaign-pills[b-i2o6tvkta5] {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    padding-bottom: 4px;
    -webkit-overflow-scrolling: touch;
}

.history-campaign-pill[b-i2o6tvkta5] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    padding: 5px 10px;
    font-size: 0.75rem;
    background: #fff;
    color: #212529;
    cursor: pointer;
    transition: all 0.12s;
    flex-shrink: 0;
}

.history-campaign-pill:hover[b-i2o6tvkta5] {
    border-color: #86b7fe;
    background: #f1f7ff;
}

.history-campaign-pill.active[b-i2o6tvkta5] {
    background: #0d6efd;
    border-color: #0d6efd;
    color: #fff;
    box-shadow: 0 1px 3px rgba(13, 110, 253, 0.35);
}

.history-campaign-pill .pill-badge[b-i2o6tvkta5] {
    font-size: 0.6rem;
    font-weight: 600;
    border-radius: 10px;
    padding: 1px 6px;
    background: rgba(0, 0, 0, 0.12);
    color: inherit;
}

/* Chips de filtro por estado */
.history-filter-chips[b-i2o6tvkta5] {
    display: inline-flex;
    gap: 4px;
    flex-wrap: wrap;
}

.history-filter-chip[b-i2o6tvkta5] {
    border: 1px solid #dee2e6;
    background: #fff;
    color: #6c757d;
    border-radius: 10px;
    padding: 2px 8px;
    font-size: 0.68rem;
    cursor: pointer;
    transition: all 0.12s;
}

.history-filter-chip:hover[b-i2o6tvkta5] {
    border-color: #adb5bd;
    color: #212529;
}

.history-filter-chip.active[b-i2o6tvkta5] {
    background: #0d6efd;
    border-color: #0d6efd;
    color: #fff;
}

/* Tabla de mensajes del historial */
.history-messages-table[b-i2o6tvkta5] {
    border: 1px solid #e9ecef;
    border-radius: 0.375rem;
    font-size: 0.8rem;
}

.history-messages-table .table[b-i2o6tvkta5] {
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.history-messages-table thead th[b-i2o6tvkta5] {
    position: sticky;
    top: 0;
    z-index: 1;
    background-color: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    color: #6c757d;
    white-space: nowrap;
}

.history-messages-table tbody td[b-i2o6tvkta5] {
    font-size: 0.78rem;
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
}

.history-messages-table tbody tr[b-i2o6tvkta5] {
    cursor: pointer;
}

.history-messages-table tbody tr:hover[b-i2o6tvkta5] {
    background-color: #f8f9fa;
}

.history-messages-table tbody tr:last-child td[b-i2o6tvkta5] {
    border-bottom: none;
}

/* Scrollbar sutil para la tabla de mensajes */
.history-messages-table[b-i2o6tvkta5]::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.history-messages-table[b-i2o6tvkta5]::-webkit-scrollbar-track {
    background: #f8f9fa;
}

.history-messages-table[b-i2o6tvkta5]::-webkit-scrollbar-thumb {
    background: #ced4da;
    border-radius: 3px;
}

.history-messages-table[b-i2o6tvkta5]::-webkit-scrollbar-thumb:hover {
    background: #adb5bd;
}

/* ===========================
   MODAL DETALLE MENSAJE - ESTILOS
   (patrón replicado de Mensajes.razor.css)
   =========================== */
.history-detail .modal-info-card[b-i2o6tvkta5] {
    background-color: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 10px 12px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.history-detail .modal-info-label[b-i2o6tvkta5] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #6c757d;
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    gap: 5px;
}

.history-detail .modal-info-label i[b-i2o6tvkta5] {
    font-size: 0.7rem;
    color: #0d6efd;
}

.history-detail .modal-info-value[b-i2o6tvkta5] {
    font-size: 0.9rem;
    color: #212529;
    font-weight: 500;
    margin-bottom: 2px;
    word-break: break-word;
}

.history-detail .modal-info-sub[b-i2o6tvkta5] {
    font-size: 0.8rem;
    color: #6c757d;
}

.history-detail .modal-timeline[b-i2o6tvkta5] {
    background-color: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.history-detail .modal-timeline-header[b-i2o6tvkta5] {
    background-color: #f8f9fa;
    padding: 8px 12px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #6c757d;
    border-bottom: 1px solid #e9ecef;
    display: flex;
    align-items: center;
    gap: 5px;
}

.history-detail .modal-timeline-header i[b-i2o6tvkta5] {
    color: #0d6efd;
}

.history-detail .modal-timeline-body[b-i2o6tvkta5] {
    padding: 12px 14px;
}

.history-detail .timeline-item[b-i2o6tvkta5] {
    display: flex;
    align-items: flex-start;
    position: relative;
    padding-bottom: 12px;
}

.history-detail .timeline-item:not(:last-child)[b-i2o6tvkta5]::before {
    content: "";
    position: absolute;
    left: 13px;
    top: 28px;
    bottom: 0;
    width: 2px;
    background-color: #e9ecef;
}

.history-detail .timeline-item:last-child[b-i2o6tvkta5] {
    padding-bottom: 0;
}

.history-detail .timeline-dot[b-i2o6tvkta5] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 0.75rem;
    flex-shrink: 0;
    box-shadow: 0 0 0 3px #ffffff, 0 0 0 4px #e9ecef;
    position: relative;
    z-index: 1;
}

.history-detail .timeline-content[b-i2o6tvkta5] {
    margin-left: 12px;
    flex: 1;
    min-width: 0;
}

.history-detail .timeline-label[b-i2o6tvkta5] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #212529;
    display: flex;
    align-items: center;
}

.history-detail .timeline-time[b-i2o6tvkta5] {
    font-size: 0.78rem;
    color: #6c757d;
    margin-top: 1px;
}

.history-detail .modal-content-box[b-i2o6tvkta5] {
    background-color: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.history-detail .modal-content-header[b-i2o6tvkta5] {
    background-color: #f8f9fa;
    padding: 8px 12px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #6c757d;
    border-bottom: 1px solid #e9ecef;
    display: flex;
    align-items: center;
    gap: 5px;
}

.history-detail .modal-content-header i[b-i2o6tvkta5] {
    color: #0d6efd;
}

.history-detail .modal-content-text[b-i2o6tvkta5] {
    padding: 12px 14px;
    font-size: 0.88rem;
    line-height: 1.5;
    color: #212529;
    white-space: pre-wrap;
    max-height: 160px;
    overflow-y: auto;
    word-break: break-word;
}

.history-detail .modal-content-text[b-i2o6tvkta5]::-webkit-scrollbar {
    width: 6px;
}

.history-detail .modal-content-text[b-i2o6tvkta5]::-webkit-scrollbar-track {
    background: #f8f9fa;
}

.history-detail .modal-content-text[b-i2o6tvkta5]::-webkit-scrollbar-thumb {
    background: #ced4da;
    border-radius: 3px;
}

.history-detail .modal-content-text[b-i2o6tvkta5]::-webkit-scrollbar-thumb:hover {
    background: #adb5bd;
}
/* /Presentation/Components/Pages/Monitoreo/TrazabilidadDashboard.razor.rz.scp.css */
/* ── Contenedor principal ── */
.editor-container[b-2ycp8i0qu4] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

/* ── Header con breadcrumb ── */
.editor-header[b-2ycp8i0qu4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-2ycp8i0qu4] {
    font-size: 13px;
}

.editor-header-right[b-2ycp8i0qu4] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* ── Title bar ── */
.editor-title-bar[b-2ycp8i0qu4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-2ycp8i0qu4],
.editor-title-bar .fw-semibold[b-2ycp8i0qu4],
.editor-title-bar small[b-2ycp8i0qu4] {
    color: #1a1d23 !important;
}

/* ── Contenido (fondo gris, scroll) ── */
.editor-tab-content[b-2ycp8i0qu4] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 20px 24px 24px;
}

/* ═══════════════════════════════════════════════
   Estilos específicos de trazabilidad (preservados)
   ═══════════════════════════════════════════════ */

.message-cell[b-2ycp8i0qu4] {
    position: relative;
    max-width: 500px;
    min-width: 300px;
}

.message-content[b-2ycp8i0qu4] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: help;
}

.message-popover[b-2ycp8i0qu4] {
    display: none;
    position: absolute;
    bottom: 80%;
    left: 0;
    width: max-content;
    max-width: 600px;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 12px;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    z-index: 1050;
    white-space: normal;
    color: #212529;
    font-size: 0.9rem;
}

.message-cell:hover .message-popover[b-2ycp8i0qu4] {
    display: block;
}

.badge-op[b-2ycp8i0qu4] {
    font-weight: 600;
    border: 1px solid rgba(17, 24, 39, 0.12);
    padding: 0.45rem 0.6rem;
    border-radius: 0.5rem;
}

.badge-op-blue[b-2ycp8i0qu4] { background: #dbeafe; color: #1e3a8a; }
.badge-op-green[b-2ycp8i0qu4] { background: #dcfce7; color: #166534; }
.badge-op-red[b-2ycp8i0qu4] { background: #fee2e2; color: #991b1b; }
.badge-op-amber[b-2ycp8i0qu4] { background: #fef3c7; color: #92400e; }
.badge-op-cyan[b-2ycp8i0qu4] { background: #cffafe; color: #155e75; }
.badge-op-purple[b-2ycp8i0qu4] { background: #ede9fe; color: #5b21b6; }
.badge-op-gray[b-2ycp8i0qu4] { background: #f3f4f6; color: #374151; }
.badge-op-pink[b-2ycp8i0qu4] { background: #fce7f3; color: #9d174d; }

.tipo-op-filter-btn[b-2ycp8i0qu4] {
    padding: 0;
    border: 0;
    background: transparent;
    text-align: left;
}

.tipo-op-card[b-2ycp8i0qu4] {
    cursor: pointer;
    border: 1px solid rgba(17, 24, 39, 0.06);
    transition: transform 80ms ease, box-shadow 80ms ease;
}

.tipo-op-card:hover[b-2ycp8i0qu4] {
    transform: translateY(-1px);
    box-shadow: 0 0.4rem 1rem rgba(0,0,0,0.08);
}

.tipo-op-card.selected[b-2ycp8i0qu4] {
    border-color: rgba(16, 185, 129, 0.55);
    box-shadow: 0 0 0 0.15rem rgba(16, 185, 129, 0.18);
}

/* ── Sobreescritura de padding global en botones de toolbar ── */
.btn-primary.btn-sm[b-2ycp8i0qu4],
.btn-outline-primary.btn-sm[b-2ycp8i0qu4] {
    padding: .25rem .5rem;
    border: 1px solid transparent;
    font-weight: 400;
}

.btn-outline-primary.btn-sm[b-2ycp8i0qu4] {
    border-color: #0d6efd;
}

/* ── Tamaño de texto estándar tablas (0.8rem) ── */
.editor-tab-content .table[b-2ycp8i0qu4] {
    font-size: 0.8rem;
}

/* ── Responsive ── */
@media (max-width: 767.98px) {
    .editor-tab-content[b-2ycp8i0qu4] {
        padding: 12px 16px 16px;
    }
}
/* /Presentation/Components/Pages/Paciente/NewPatientComponent.razor.rz.scp.css */
.disabled-input-container[b-3quvkzukyh] {
    pointer-events: none;
    opacity: 0.4;
}

.camera-overlay[b-3quvkzukyh] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

#patientCameraFeed[b-3quvkzukyh] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #000;
}

.camera-controls[b-3quvkzukyh] {
    position: absolute;
    bottom: 30px;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    padding: 20px;
    background: rgba(0, 0, 0, 0.3);
}

.btn-capture[b-3quvkzukyh] {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background-color: white;
    border: 4px solid #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.1s;
}

.btn-capture:active[b-3quvkzukyh] {
    transform: scale(0.95);
    background-color: #eee;
}

.btn-capture i[b-3quvkzukyh] {
    font-size: 24px;
    color: #333;
}

.step-content[b-3quvkzukyh] {
    max-height: 68vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 768px) {
    .step-content[b-3quvkzukyh] {
        max-height: 72vh;
    }
}

@media (max-width: 480px) {
    .step-content[b-3quvkzukyh] {
        max-height: 74vh;
    }
}
/* /Presentation/Components/Pages/Paciente/PacienteManager.razor.rz.scp.css */
.editor-container[b-60kanedag1] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

.editor-header[b-60kanedag1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-60kanedag1] {
    font-size: 13px;
}

.editor-header-right[b-60kanedag1] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.editor-title-bar[b-60kanedag1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-60kanedag1],
.editor-title-bar .fw-semibold[b-60kanedag1],
.editor-title-bar small[b-60kanedag1] {
    color: #1a1d23 !important;
}

/* ── Buscadores tipo sidebar ── */

.mgr-search-wrapper[b-60kanedag1] {
    position: relative;
    display: flex;
    align-items: center;
    padding: 5px 10px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
}

.mgr-search-icon[b-60kanedag1] {
    position: absolute;
    left: 13px;
    font-size: 0.65rem;
    color: #9ca3af;
    pointer-events: none;
}

.mgr-search-input[b-60kanedag1] {
    width: 100%;
    background: #f3f4f6;
    border: 1px solid transparent;
    color: #374151;
    padding: 4px 22px 4px 22px;
    font-size: 0.73rem;
    border-radius: 4px;
    outline: none;
    transition: border-color 0.15s;
}

.mgr-search-input:focus[b-60kanedag1] {
    border-color: #1a73e8;
    box-shadow: 0 0 0 2px rgba(26,115,232,0.15);
    background: #fff;
}

.mgr-search-input[b-60kanedag1]::placeholder {
    color: #9ca3af;
    opacity: 0.6;
    font-size: 0.7rem;
}

.mgr-search-clear[b-60kanedag1] {
    position: absolute;
    right: 12px;
    background: none;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    padding: 2px 4px;
    font-size: 0.6rem;
    opacity: 0.5;
    transition: opacity 0.15s;
    line-height: 1;
}

.mgr-search-clear:hover[b-60kanedag1] {
    opacity: 1;
    color: #dc2626;
}

.mgr-search-empty[b-60kanedag1] {
    text-align: center;
    padding: 16px 10px;
    color: #9ca3af;
    font-size: 0.75rem;
    font-style: italic;
}

/* ============================================================
   Split horizontal: empresas panel (izq) + grid de pacientes (der)
   ============================================================ */

.func-split-body[b-60kanedag1] {
    display: flex;
    flex: 1;
    min-height: 0;
    background: #f8f9fa;
}

/* ── Panel derecho: Grid de Pacientes ── */

.func-grid-panel[b-60kanedag1] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.func-grid-toolbar[b-60kanedag1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 14px 7px 14px;
    border-bottom: 1px solid #e2e4e9;
    background: #fff;
    flex-shrink: 0;
}

.func-grid-wrapper[b-60kanedag1] {
    flex: 1;
    overflow-y: auto;
    background: #fff;
    scrollbar-width: thin;
}

.func-grid-wrapper[b-60kanedag1]::-webkit-scrollbar {
    width: 5px;
}

.func-grid-wrapper[b-60kanedag1]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 3px;
}

.func-grid-wrapper[b-60kanedag1]::-webkit-scrollbar-track {
    background: #f3f4f6;
}

/* ── Cabecera de la tabla ── */

.func-grid-header[b-60kanedag1] {
    display: flex;
    align-items: center;
    padding: 8px 14px;
    background: #f9fafb;
    border-bottom: 2px solid #e5e7eb;
    font-size: 0.8rem;
    font-weight: 600;
    color: #6b7280;
    gap: 6px;
    position: sticky;
    top: 0;
    z-index: 1;
}

/* ── Filas de la tabla ── */

.func-grid-row[b-60kanedag1] {
    display: flex;
    align-items: center;
    padding: 7px 14px;
    border-bottom: 1px solid #f3f4f6;
    gap: 6px;
    transition: background 0.12s;
    min-height: 40px;
    font-size: 0.8rem;
}

.func-grid-row:hover[b-60kanedag1] {
    background: #f9fafb;
}

.func-grid-row.inactive[b-60kanedag1] {
    opacity: 0.55;
    background: #f9fafb;
}

/* ── Columnas de paciente ── */

.pac-col-doc[b-60kanedag1] {
    width: 140px;
    flex-shrink: 0;
    font-size: 0.8rem;
    color: #374151;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 4px;
}

.pac-col-name[b-60kanedag1] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 4px;
    overflow: hidden;
    color: #374151;
    font-weight: 500;
}

.pac-col-eps[b-60kanedag1] {
    width: 200px;
    flex-shrink: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #6b7280;
    font-size: 0.8rem;
}

.pac-col-genero[b-60kanedag1] {
    width: 100px;
    flex-shrink: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #6b7280;
    font-size: 0.8rem;
}

.pac-col-estado[b-60kanedag1] {
    width: 90px;
    flex-shrink: 0;
    text-align: center;
}

.pac-col-actions[b-60kanedag1] {
    width: 70px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 2px;
    justify-content: flex-end;
    opacity: 0.2;
    transition: opacity 0.15s;
}

.func-grid-row:hover .pac-col-actions[b-60kanedag1] {
    opacity: 1;
}

/* ── Badge de contacto en grid ── */

.func-contact-badge[b-60kanedag1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #f3f4f6;
    color: #9ca3af;
    font-size: 0.55rem;
    flex-shrink: 0;
    cursor: default;
    transition: all 0.12s;
}

.func-contact-badge:hover[b-60kanedag1] {
    background: #e8f0fe;
    color: #1a73e8;
}

/* ── Footer del grid ── */

.func-grid-footer[b-60kanedag1] {
    display: flex;
    align-items: center;
    padding: 6px 14px;
    border-top: 1px solid #e2e4e9;
    background: #f9fafb;
    flex-shrink: 0;
    gap: 8px;
}

.func-grid-footer-count[b-60kanedag1] {
    font-size: 0.72rem;
    color: #6b7280;
}

.func-grid-footer-count i[b-60kanedag1] {
    font-size: 0.65rem;
    color: #9ca3af;
}

/* ── Panel izquierdo: Empresas ── */

.func-role-panel[b-60kanedag1] {
    width: 340px;
    min-width: 340px;
    max-width: 380px;
    border-right: 1px solid #e2e4e9;
    display: flex;
    flex-direction: column;
    background: #fff;
}

.func-role-header[b-60kanedag1] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    font-size: 0.82rem;
    font-weight: 600;
    color: #374151;
    border-bottom: 1px solid #e2e4e9;
    background: #f9fafb;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.func-role-header i[b-60kanedag1] {
    color: #1a73e8;
    font-size: 0.82rem;
}

.func-role-list[b-60kanedag1] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
    scrollbar-width: thin;
}

.func-role-list[b-60kanedag1]::-webkit-scrollbar {
    width: 4px;
}

.func-role-list[b-60kanedag1]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 2px;
}

.func-role-item[b-60kanedag1] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    font-size: 0.85rem;
    cursor: pointer;
    border-bottom: 1px solid #f3f4f6;
    transition: background 0.12s;
    color: #374151;
}

.func-role-item:hover[b-60kanedag1] {
    background: #f3f4f6;
}

.func-role-item.active[b-60kanedag1] {
    background: #e8f0fe;
    color: #1a73e8;
    font-weight: 500;
}

.func-role-item i[b-60kanedag1] {
    width: 16px;
    text-align: center;
    font-size: 0.82rem;
    color: #9ca3af;
    flex-shrink: 0;
}

.func-role-item.active i[b-60kanedag1] {
    color: #1a73e8;
}

.func-role-name[b-60kanedag1] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.func-role-count-badge[b-60kanedag1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 50%;
    background: #e8f0fe;
    color: #1a73e8;
    font-size: 0.6rem;
    font-weight: 600;
    line-height: 1;
    flex-shrink: 0;
}

.func-role-item.active .func-role-count-badge[b-60kanedag1] {
    background: #d2e3fc;
    color: #1557b0;
}

.func-role-footer[b-60kanedag1] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    font-size: 0.7rem;
    color: #9ca3af;
    border-top: 1px solid #e2e4e9;
    background: #f9fafb;
}

.func-role-footer i[b-60kanedag1] {
    font-size: 0.7rem;
}

/* ── Estrella de favorito ── */

.func-role-star[b-60kanedag1] {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.65rem;
    color: #6b7280;
    cursor: pointer;
    opacity: 0.25;
    transition: all 0.15s;
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.func-role-item:hover .func-role-star[b-60kanedag1] {
    opacity: 0.6;
}

.func-role-star:hover[b-60kanedag1] {
    opacity: 1 !important;
    color: #f59e0b;
}

.func-role-star.active[b-60kanedag1] {
    opacity: 1;
    color: #f59e0b;
}

/* ── Botones de acción ── */

.btn-action[b-60kanedag1] {
    background: none;
    border: 1px solid transparent;
    color: #6b7280;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.12s;
    font-size: 0.85rem;
    padding: 0;
    line-height: 1;
}

.btn-action:hover[b-60kanedag1] {
    background: #f3f4f6;
    border-color: #e5e7eb;
    color: #374151;
}

.btn-action.text-danger:hover[b-60kanedag1] {
    background: #fef2f2;
    border-color: #fecaca;
    color: #dc2626;
}

/* ============================================================
   Compact form: controles del formulario de pacientes
   ============================================================ */

.func-compact-form .form-control-sm[b-60kanedag1],
.func-compact-form .form-select-sm[b-60kanedag1] {
    height: 28px;
    font-size: 0.84rem;
    padding: 2px 8px;
    line-height: 1.3;
    border-radius: 3px;
}

.func-compact-form .form-label[b-60kanedag1] {
    font-size: 0.74rem;
    margin-bottom: 1px;
    color: #4b5563;
    font-weight: 500;
}

.func-compact-form .section-title[b-60kanedag1] {
    font-size: 0.81rem;
    font-weight: 700;
    color: #374151;
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 3px;
    margin-bottom: 6px;
    letter-spacing: 0.01em;
}

.func-compact-form .section-title i[b-60kanedag1] {
    font-size: 0.76rem;
    margin-right: 4px;
}

.func-compact-form .section-body[b-60kanedag1] {
    margin-bottom: 6px;
}

.func-compact-form .compact-badge[b-60kanedag1] {
    font-size: 0.66rem;
    font-weight: 500;
    padding: 2px 8px;
    line-height: 1.4;
}

.func-compact-form .compact-tag[b-60kanedag1] {
    font-size: 0.68rem;
    padding: 5px 10px;
    border-radius: 4px;
}

.func-compact-form .compact-btn-add[b-60kanedag1] {
    font-size: 0.68rem;
    padding: 1px 6px;
    height: 22px;
    line-height: 1;
}

.func-compact-form .compact-badge-remove[b-60kanedag1] {
    font-size: 0.51rem;
    padding: 0;
    line-height: 1;
    opacity: 0.7;
}

.func-compact-form .compact-badge-remove:hover[b-60kanedag1] {
    opacity: 1;
}

.func-compact-form .compact-search[b-60kanedag1] {
    height: 24px;
    font-size: 0.71rem;
    padding: 1px 6px;
    border-radius: 3px;
}

.func-compact-form .compact-panel[b-60kanedag1] {
    padding: 4px 6px;
    border-radius: 4px;
}

.func-compact-form .form-check-label[b-60kanedag1] {
    font-size: 0.81rem;
}

/* ── Zona de carga de archivos (cards elegantes como en FuncionarioManager) ── */

.file-upload-zone[b-60kanedag1] {
    position: relative;
    display: flex;
    justify-content: center;
    margin-top: 8px;
}

.file-upload-btn[b-60kanedag1] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: #fff;
    border: 1px dashed #c4c4c4;
    border-radius: 6px;
    color: #6b7280;
    font-size: 0.72rem;
    cursor: pointer;
    transition: all 0.15s ease;
    z-index: 1;
    pointer-events: none;
}

.file-upload-zone:hover .file-upload-btn[b-60kanedag1] {
    border-color: #1a73e8;
    color: #1a73e8;
    background: #f0f7ff;
}

.file-upload-btn i[b-60kanedag1] {
    font-size: 0.8rem;
    color: #9ca3af;
    transition: color 0.15s;
}

.file-upload-zone:hover .file-upload-btn i[b-60kanedag1] {
    color: #1a73e8;
}

.delete-btn-overlay[b-60kanedag1] {
    position: absolute;
    top: 4px;
    right: 4px;
    z-index: 3;
    background: rgba(255,255,255,0.9);
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    padding: 2px 6px;
    font-size: 0.65rem;
    color: #dc2626;
    cursor: pointer;
    transition: all 0.12s;
    opacity: 0;
}

.doc-card:hover .delete-btn-overlay[b-60kanedag1] {
    opacity: 1;
}

.delete-btn-overlay:hover[b-60kanedag1] {
    background: #fef2f2;
    border-color: #fca5a5;
}

.func-compact-form .form-check-input[b-60kanedag1] {
    margin-top: 2px;
    width: 0.9rem;
    height: 0.9rem;
}

/* ============================================================
   TABS
   ============================================================ */

.func-compact-form .editor-tabs.nav-tabs[b-60kanedag1] {
    border-bottom: none !important;
    display: flex;
    padding: 0 !important;
    margin: 0 0 1px 0 !important;
    background: #e8eaed;
    list-style: none;
    gap: 0;
    position: relative;
    height: 38px;
    flex-shrink: 0;
    min-height: 38px;
}

.func-compact-form .editor-tabs .nav-item[b-60kanedag1] {
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
    display: flex;
    align-items: stretch;
}

.func-compact-form .editor-tabs .nav-link[b-60kanedag1] {
    display: flex !important;
    align-items: center !important;
    justify-content: center;
    gap: 6px;
    padding: 0 16px !important;
    margin: 0 !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    color: #5f6368 !important;
    border: none !important;
    background: transparent !important;
    transition: all 0.15s ease;
    cursor: pointer;
    white-space: nowrap;
    position: relative;
    height: 38px !important;
    text-decoration: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

.func-compact-form .editor-tabs .nav-link:hover[b-60kanedag1] {
    color: #202124 !important;
    background: rgba(0, 0, 0, 0.04) !important;
}

.func-compact-form .editor-tabs .nav-link.active[b-60kanedag1] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
    height: 38px !important;
    padding: 0 16px !important;
    margin: 0 !important;
}

.func-compact-form .editor-tabs .nav-link.active[b-60kanedag1]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 12px;
    right: 12px;
    height: 3px;
    background: #1a73e8;
    border-radius: 3px 3px 0 0;
}

.func-compact-form .editor-tabs .nav-item:not(:last-child) .nav-link:not(.active)[b-60kanedag1]::after {
    content: '';
    position: absolute;
    right: 0;
    top: 8px;
    bottom: 8px;
    width: 1px;
    background: #dadce0;
}

.func-compact-form .editor-tabs .nav-link i[b-60kanedag1] {
    font-size: 14px;
    width: 15px;
    text-align: center;
    color: inherit;
}

/* ===== CONTENIDO DE PESTAÑA ===== */

.func-compact-form .func-tab-content[b-60kanedag1] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 14px 16px 16px;
}

/* ── Barra de favoritos (empresas) ── */

.mgr-fav-bar[b-60kanedag1] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 16px;
    background: #fffbeb;
    border-bottom: 1px solid #fde68a;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.mgr-fav-bar-icon[b-60kanedag1] {
    font-size: 0.65rem;
    color: #f59e0b;
    flex-shrink: 0;
}

.mgr-fav-pill[b-60kanedag1] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    background: #fff;
    border: 1px solid #fde68a;
    border-radius: 14px;
    font-size: 0.75rem;
    color: #92400e;
    cursor: pointer;
    transition: all 0.12s;
    white-space: nowrap;
}

.mgr-fav-pill:hover[b-60kanedag1] {
    background: #fef3c7;
    border-color: #f59e0b;
}

.mgr-fav-pill.active[b-60kanedag1] {
    background: #f59e0b;
    border-color: #d97706;
    color: #fff;
}

.mgr-fav-pill i[b-60kanedag1] {
    font-size: 0.6rem;
}

.mgr-fav-pill-remove[b-60kanedag1] {
    background: none;
    border: none;
    padding: 0;
    margin-left: 2px;
    font-size: 0.55rem;
    color: inherit;
    cursor: pointer;
    opacity: 0.5;
    line-height: 1;
}

.mgr-fav-pill-remove:hover[b-60kanedag1] {
    opacity: 1;
}

/* ── Centinela de scroll infinito ── */
.scroll-sentinel[b-60kanedag1] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 4px;
    gap: 4px;
    color: #6b7280;
    font-size: 0.75rem;
}
/* /Presentation/Components/Pages/Perfil/Components/ProfileActivityTimeline.razor.rz.scp.css */
/* ProfileActivityTimeline (per-001) — Estilos aislados */
.profile-timeline[b-1mfetmmu83] {
    position: relative;
    padding-left: 1.5rem;
    max-height: 400px;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: var(--bs-border-color, #d1d5db) transparent;
}

.profile-timeline[b-1mfetmmu83]::-webkit-scrollbar {
    width: 5px;
}

.profile-timeline[b-1mfetmmu83]::-webkit-scrollbar-track {
    background: transparent;
}

.profile-timeline[b-1mfetmmu83]::-webkit-scrollbar-thumb {
    background: var(--bs-border-color, #d1d5db);
    border-radius: 10px;
}

.profile-timeline[b-1mfetmmu83]::-webkit-scrollbar-thumb:hover {
    background: var(--bs-secondary-color, #9ca3af);
}

.profile-timeline[b-1mfetmmu83]::before {
    content: '';
    position: absolute;
    left: 6px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--bs-border-color, #e5e7eb);
}

.timeline-item[b-1mfetmmu83] {
    position: relative;
    padding-bottom: 1.25rem;
}

.timeline-item:last-child[b-1mfetmmu83] {
    padding-bottom: 0;
}

.timeline-dot[b-1mfetmmu83] {
    position: absolute;
    left: -1.5rem;
    top: 4px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid #fff;
    z-index: 1;
}

.timeline-dot.dot-success[b-1mfetmmu83] { background: #10B981; }
.timeline-dot.dot-primary[b-1mfetmmu83] { background: #3B82F6; }
.timeline-dot.dot-danger[b-1mfetmmu83]  { background: #EF4444; }
.timeline-dot.dot-info[b-1mfetmmu83]    { background: #06B6D4; }
.timeline-dot.dot-warning[b-1mfetmmu83] { background: #F59E0B; }
.timeline-dot.dot-secondary[b-1mfetmmu83] { background: #6B7280; }

.timeline-content[b-1mfetmmu83] {
    padding-left: 0.5rem;
}

.profile-empty-section[b-1mfetmmu83] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    background: var(--bs-tertiary-bg, #f9fafb);
    border-radius: 8px;
    color: var(--bs-secondary-color, #6b7280);
    font-size: 0.9rem;
}
/* /Presentation/Components/Pages/Perfil/Components/ProfileAuditoria.razor.rz.scp.css */
.profile-card[b-s77n8vhirc] {
    border: 1px solid var(--bs-border-color, #e5e7eb);
    border-radius: 10px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    transition: box-shadow 0.2s ease;
}

.profile-card:hover[b-s77n8vhirc] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.profile-section-header[b-s77n8vhirc] {
    background: transparent;
    font-weight: 600;
    font-size: 0.925rem;
    border-bottom: 1px solid var(--bs-border-color, #e5e7eb);
    padding: 0.75rem 1rem;
}

.profile-empty-section[b-s77n8vhirc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    background: var(--bs-tertiary-bg, #f9fafb);
    border-radius: 8px;
    color: var(--bs-secondary-color, #6b7280);
    font-size: 0.9rem;
}

.table-responsive .table thead th[b-s77n8vhirc] {
    white-space: nowrap;
}

.table-responsive .table tbody td[b-s77n8vhirc] {
    vertical-align: middle;
}
/* /Presentation/Components/Pages/Perfil/Components/ProfileGeneralInfo.razor.rz.scp.css */
/* ProfileGeneralInfo (per-001) — Estilos aislados */
.info-field[b-5mvyul716o] {
    margin-bottom: 0.5rem;
}

.info-field small[b-5mvyul716o] {
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    margin-bottom: 0.15rem;
}

.info-field .info-value[b-5mvyul716o] {
    font-size: 0.925rem;
    color: var(--bs-body-color, #111827);
    word-break: break-word;
}

.profile-empty-section[b-5mvyul716o] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    background: var(--bs-tertiary-bg, #f9fafb);
    border-radius: 8px;
    color: var(--bs-secondary-color, #6b7280);
    font-size: 0.9rem;
}
/* /Presentation/Components/Pages/Perfil/Components/ProfileKPIs.razor.rz.scp.css */
/* ProfileKPIs (per-001) — Estilos aislados para KPI Cards + Skeleton Loader */

/* KPI Cards base */
.kpi-card[b-qwe88nyvn2] {
    background: var(--bs-card-bg, #fff);
    border: 1px solid var(--bs-border-color, #e5e7eb);
    border-radius: 10px;
    padding: 1rem 1rem 1rem 1.25rem;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.kpi-card:hover[b-qwe88nyvn2] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.kpi-header[b-qwe88nyvn2] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}

.kpi-header i[b-qwe88nyvn2] {
    font-size: 1.1rem;
    min-width: 18px;
    text-align: center;
}

.kpi-label[b-qwe88nyvn2] {
    font-size: 0.8rem;
    color: var(--bs-secondary-color, #6b7280);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.kpi-value[b-qwe88nyvn2] {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--bs-body-color, #111827);
    line-height: 1.2;
    padding-left: calc(18px + 0.75rem);
}

.kpi-trend[b-qwe88nyvn2] {
    font-size: 0.75rem;
    font-weight: 600;
    margin-top: 0.25rem;
    padding-left: calc(18px + 0.75rem);
}

.kpi-trend.trend-up[b-qwe88nyvn2] {
    color: #10B981;
}

.kpi-trend.trend-down[b-qwe88nyvn2] {
    color: #EF4444;
}

/* Small unidad */
.kpi-card small[b-qwe88nyvn2] {
    display: block;
    margin-top: 0.15rem;
    padding-left: calc(18px + 0.75rem);
}

/* Skeleton Loader */
.kpi-skeleton[b-qwe88nyvn2] {
    pointer-events: none;
}

.skeleton-icon[b-qwe88nyvn2] {
    width: 20px;
    height: 20px;
    border-radius: 4px;
    background: var(--bs-tertiary-bg, #e5e7eb);
    animation: skeleton-pulse-b-qwe88nyvn2 1.5s ease-in-out infinite;
}

.skeleton-label[b-qwe88nyvn2] {
    width: 60%;
    height: 12px;
    border-radius: 4px;
    background: var(--bs-tertiary-bg, #e5e7eb);
    animation: skeleton-pulse-b-qwe88nyvn2 1.5s ease-in-out infinite;
}

.skeleton-value[b-qwe88nyvn2] {
    width: 40%;
    height: 28px;
    border-radius: 4px;
    background: var(--bs-tertiary-bg, #e5e7eb);
    margin: 0.5rem 0;
    animation: skeleton-pulse-b-qwe88nyvn2 1.5s ease-in-out infinite 0.1s;
}

.skeleton-trend[b-qwe88nyvn2] {
    width: 30%;
    height: 12px;
    border-radius: 4px;
    background: var(--bs-tertiary-bg, #e5e7eb);
    animation: skeleton-pulse-b-qwe88nyvn2 1.5s ease-in-out infinite 0.2s;
}

@keyframes skeleton-pulse-b-qwe88nyvn2 {
    0%, 100% { opacity: 0.6; }
    50% { opacity: 1; }
}

/* KPI Tooltip */
.kpi-card[b-qwe88nyvn2] {
    position: relative;
}

.kpi-tooltip[b-qwe88nyvn2] {
    display: none;
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    background: var(--bs-dark, #1f2937);
    color: #fff;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-size: 0.75rem;
    white-space: nowrap;
    z-index: 100;
    pointer-events: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.kpi-tooltip[b-qwe88nyvn2]::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: var(--bs-dark, #1f2937);
}

.kpi-card:hover .kpi-tooltip[b-qwe88nyvn2] {
    display: block;
}

/* Empty section */
.profile-empty-section[b-qwe88nyvn2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    background: var(--bs-tertiary-bg, #f9fafb);
    border-radius: 8px;
    color: var(--bs-secondary-color, #6b7280);
    font-size: 0.9rem;
}

/* Responsive: móvil */
@media (max-width: 767.98px) {
    .kpi-card[b-qwe88nyvn2] {
        padding: 0.75rem 0.75rem 0.75rem 1rem;
    }

    .kpi-value[b-qwe88nyvn2] {
        font-size: 1.25rem;
        padding-left: calc(18px + 0.5rem);
    }

    .kpi-trend[b-qwe88nyvn2] {
        padding-left: calc(18px + 0.5rem);
    }

    .kpi-card small[b-qwe88nyvn2] {
        padding-left: calc(18px + 0.5rem);
    }
}
/* /Presentation/Components/Pages/Perfil/Components/ProfileProductivity.razor.rz.scp.css */
/* ProfileProductivity (per-001) — Estilos aislados */
.prod-card[b-hi0y861o5r] {
    text-align: center;
    padding: 1rem;
    border-radius: 10px;
    border: 1px solid var(--bs-border-color, #e5e7eb);
    background: var(--bs-card-bg, #fff);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.prod-card:hover[b-hi0y861o5r] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.prod-card-success[b-hi0y861o5r] { border-left: 4px solid #10B981; }
.prod-card-primary[b-hi0y861o5r] { border-left: 4px solid #3B82F6; }
.prod-card-info[b-hi0y861o5r]    { border-left: 4px solid #06B6D4; }
.prod-card-danger[b-hi0y861o5r]  { border-left: 4px solid #EF4444; }

.profile-empty-section[b-hi0y861o5r] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    background: var(--bs-tertiary-bg, #f9fafb);
    border-radius: 8px;
    color: var(--bs-secondary-color, #6b7280);
    font-size: 0.9rem;
}
/* /Presentation/Components/Pages/Perfil/Components/ProfileRoles.razor.rz.scp.css */
/* ProfileRoles (per-001) — Estilos aislados para badges de roles */

.role-badge[b-mu3psetacc] {
    position: relative;
    cursor: default;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.role-badge:hover[b-mu3psetacc] {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}

.role-tooltip[b-mu3psetacc] {
    display: none;
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    background: var(--bs-dark, #1f2937);
    color: #fff;
    padding: 0.4rem 0.75rem;
    border-radius: 6px;
    font-size: 0.75rem;
    white-space: nowrap;
    z-index: 100;
    pointer-events: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.role-tooltip[b-mu3psetacc]::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: var(--bs-dark, #1f2937);
}

.role-badge:hover .role-tooltip[b-mu3psetacc] {
    display: block;
}

.profile-empty-section[b-mu3psetacc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    background: var(--bs-tertiary-bg, #f9fafb);
    border-radius: 8px;
    color: var(--bs-secondary-color, #6b7280);
    font-size: 0.9rem;
}
/* /Presentation/Components/Pages/Perfil/Components/ProfileSecurity.razor.rz.scp.css */
/* ProfileSecurity (per-001) v2 — Estilos aislados con info enriquecida */

.profile-security-table th[b-8rfg5c1xjl] {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #6b7280;
    border-bottom-width: 1px;
}

.profile-security-table td[b-8rfg5c1xjl] {
    vertical-align: middle;
    font-size: 0.82rem;
}

.profile-security-table tr.table-active[b-8rfg5c1xjl] {
    background-color: #f0f7ff;
}

.ip-badge[b-8rfg5c1xjl] {
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    background: #f3f4f6;
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 0.78rem;
    color: #374151;
    border: 1px solid #e5e7eb;
}

.device-info[b-8rfg5c1xjl] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

/* Badges de estado (Activa / Cerrada) con más padding vertical */
.profile-security-table .badge[b-8rfg5c1xjl] {
    padding: 0.5em 0.9em !important;
    font-size: 0.75rem;
}

/* Badge de SO más espaciado */
.so-badge[b-8rfg5c1xjl] {
    font-size: 0.7rem;
    color: #6b7280;
    background: #f3f4f6;
    padding: 3px 10px;
    border-radius: 10px;
    display: inline-block;
    width: fit-content;
    border: 1px solid #e5e7eb;
}

/* Badge de conteo en el header */
.profile-section-header .badge[b-8rfg5c1xjl] {
    padding: 0.45em 0.75em !important;
}

.profile-empty-section[b-8rfg5c1xjl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    background: var(--bs-tertiary-bg, #f9fafb);
    border-radius: 8px;
    color: var(--bs-secondary-color, #6b7280);
    font-size: 0.9rem;
}

/* Responsive: en móviles, ocultar columna Duración */
@media (max-width: 768px) {
    .profile-security-table th:nth-child(2)[b-8rfg5c1xjl],
    .profile-security-table td:nth-child(2)[b-8rfg5c1xjl] {
        display: none;
    }
}
/* /Presentation/Components/Pages/Perfil/Components/ProfileSettings.razor.rz.scp.css */
/* ProfileSettings (per-001) — Estilos aislados */
.fw-medium[b-xzcc3egul2] {
    font-weight: 500;
}

.profile-empty-section[b-xzcc3egul2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    background: var(--bs-tertiary-bg, #f9fafb);
    border-radius: 8px;
    color: var(--bs-secondary-color, #6b7280);
    font-size: 0.9rem;
}
/* /Presentation/Components/Pages/Perfil/Components/ProfileSidebar.razor.rz.scp.css */
/* Profile Sidebar - per-001 Enterprise User Profile Dashboard */
.profile-sidebar[b-1k3qf2w5s0] {
    position: sticky;
    top: 1rem;
    background: var(--bs-card-bg, #fff);
    border: 1px solid var(--bs-border-color, #e5e7eb);
    border-radius: 12px;
    padding: 1.5rem 1rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    transition: box-shadow 0.2s ease;
}

.profile-sidebar:hover[b-1k3qf2w5s0] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Avatar */
.profile-avatar-container[b-1k3qf2w5s0] {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid var(--bs-border-color, #e5e7eb);
    background: var(--bs-light, #f8f9fa);
}

.profile-avatar[b-1k3qf2w5s0] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Nombre */
.profile-name[b-1k3qf2w5s0] {
    font-weight: 600;
    font-size: 1.05rem;
    color: var(--bs-body-color, #111827);
    line-height: 1.3;
}

/* Rol */
.profile-role[b-1k3qf2w5s0] {
    font-size: 0.875rem;
    color: var(--bs-secondary-color, #6b7280);
}

/* Empresa */
.profile-company[b-1k3qf2w5s0] {
    font-size: 0.8rem;
    color: var(--bs-secondary-color, #9ca3af);
}

/* Estadísticas */
.profile-stats[b-1k3qf2w5s0] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.stat-item[b-1k3qf2w5s0] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.stat-icon[b-1k3qf2w5s0] {
    width: 18px;
    text-align: center;
    font-size: 0.875rem;
    color: var(--bs-secondary-color, #9ca3af);
    flex-shrink: 0;
}

.stat-info[b-1k3qf2w5s0] {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.stat-label[b-1k3qf2w5s0] {
    color: var(--bs-secondary-color, #9ca3af);
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.stat-value[b-1k3qf2w5s0] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--bs-body-color, #111827);
}

/* bg-purple personalizado (Invitado) */
.bg-purple[b-1k3qf2w5s0] {
    background-color: #8B5CF6 !important;
    color: #fff !important;
}
/* /Presentation/Components/Pages/Perfil/ProfilePhotos.razor.rz.scp.css */
/* ProfilePhotos (per-002) — Estilos de tabs y cards de imagen embebido en UserProfile */

/* ===== TABS ===== */
.editor-tabs.nav-tabs[b-ti9tarayxy] {
    border-bottom: none !important;
    display: flex;
    padding: 0 !important;
    margin: 0 !important;
    background: #e8eaed;
    list-style: none;
    gap: 0;
    position: relative;
    height: 44px;
    flex-shrink: 0;
    min-height: 44px;
}

.editor-tabs .nav-item[b-ti9tarayxy] {
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
    display: flex;
    align-items: stretch;
}

.editor-tabs .nav-link[b-ti9tarayxy] {
    display: flex !important;
    align-items: center !important;
    justify-content: center;
    gap: 7px;
    padding: 0 20px !important;
    margin: 0 !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    color: #5f6368 !important;
    border: none !important;
    background: transparent !important;
    transition: all 0.15s ease;
    cursor: pointer;
    white-space: nowrap;
    position: relative;
    height: 44px !important;
    text-decoration: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

.editor-tabs .nav-link:hover[b-ti9tarayxy] {
    color: #202124 !important;
    background: rgba(0, 0, 0, 0.04) !important;
}

.editor-tabs .nav-link.active[b-ti9tarayxy] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
    height: 44px !important;
    padding: 0 20px !important;
    margin: 0 !important;
}

.editor-tabs .nav-link.active[b-ti9tarayxy]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 12px;
    right: 12px;
    height: 3px;
    background: #1a73e8;
    border-radius: 3px 3px 0 0;
}

.editor-tabs .nav-item:not(:last-child) .nav-link:not(.active)[b-ti9tarayxy]::after {
    content: '';
    position: absolute;
    right: 0;
    top: 10px;
    bottom: 10px;
    width: 1px;
    background: #dadce0;
}

.editor-tabs .nav-link i[b-ti9tarayxy] {
    font-size: 14px;
    width: 16px;
    text-align: center;
    color: inherit;
}

/* ===== TAB CONTENT ===== */
.photo-tab-content[b-ti9tarayxy] {
    background: #f8f9fa;
    border-top: none;
    min-height: 300px;
    position: relative;
}

.photo-tab-pane[b-ti9tarayxy] {
    padding: 20px 24px 24px;
}

/* ===== CARDS DE IMAGEN ===== */
.inst-split-card[b-ti9tarayxy] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    overflow: hidden;
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.inst-split-card:hover[b-ti9tarayxy] {
    box-shadow: 0 4px 16px rgba(0,0,0,0.08);
    border-color: #d1d5db;
}

.inst-split-header[b-ti9tarayxy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid #f3f4f6;
    background: #fff;
}

.inst-split-header h6[b-ti9tarayxy] {
    font-size: 0.825rem;
    font-weight: 600;
    color: #374151;
    margin: 0;
}

.inst-split-header h6 i[b-ti9tarayxy] {
    color: #1a73e8;
    font-size: 0.9rem;
    width: 18px;
    text-align: center;
}

.inst-date-badge[b-ti9tarayxy] {
    font-size: 0.65rem;
    color: #9ca3af;
    white-space: nowrap;
    letter-spacing: 0.01em;
}

.inst-split-body[b-ti9tarayxy] {
    display: flex;
    flex: 1;
    min-height: 0;
}

.inst-preview-zone[b-ti9tarayxy] {
    flex: 0 0 55%;
    display: flex;
    flex-direction: column;
    background: #f9fafb;
    border-right: 1px solid #f0f0f0;
}

.inst-preview-img[b-ti9tarayxy] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    min-height: 130px;
    position: relative;
}

.inst-preview-img img[b-ti9tarayxy] {
    max-height: 110px;
    max-width: 100%;
    width: auto;
    object-fit: contain;
    border-radius: 6px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    transition: transform 0.2s ease;
}

.inst-preview-img img:hover[b-ti9tarayxy] {
    transform: scale(1.03);
}

.inst-placeholder[b-ti9tarayxy] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 16px;
    min-height: 130px;
    color: #d1d5db;
}

.inst-placeholder i[b-ti9tarayxy] {
    font-size: 2.2rem;
    color: #d1d5db;
}

.inst-placeholder span[b-ti9tarayxy] {
    font-size: 0.65rem;
    color: #9ca3af;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.inst-img-meta[b-ti9tarayxy] {
    position: absolute;
    top: 6px;
    left: 6px;
    z-index: 2;
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
}

.inst-meta-badge[b-ti9tarayxy] {
    background: rgba(0, 0, 0, 0.65);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    color: #fff;
    font-size: 0.6rem;
    font-weight: 500;
    padding: 3px 9px;
    border-radius: 4px;
    letter-spacing: 0.02em;
    white-space: nowrap;
    line-height: 1.5;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

.editor-tab-content .badge[b-ti9tarayxy] {
    padding-top: 0.4em !important;
    padding-bottom: 0.4em !important;
}

.inst-actions[b-ti9tarayxy] {
    display: flex;
    gap: 6px;
    padding: 10px 12px;
    border-top: 1px solid #f0f0f0;
    background: #fff;
}

.inst-btn[b-ti9tarayxy] {
    font-size: 0.75rem;
    border-radius: 3px;
    padding: 5px 12px;
    border: 1px solid transparent;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: all 0.15s ease;
    font-weight: 500;
    line-height: 1.4;
}

.inst-btn-primary[b-ti9tarayxy] {
    background: #fff;
    border-color: #d1d5db;
    color: #374151;
}

.inst-btn-primary:hover:not(.disabled)[b-ti9tarayxy] {
    background: #f3f4f6;
    border-color: #9ca3af;
}

.inst-btn-danger[b-ti9tarayxy] {
    background: #fff;
    border-color: #fecaca;
    color: #dc2626;
}

.inst-btn-danger:hover:not(.disabled)[b-ti9tarayxy] {
    background: #fef2f2;
    border-color: #fca5a5;
}

.inst-btn.disabled[b-ti9tarayxy] {
    opacity: 0.5;
    cursor: not-allowed;
}

.inst-info-zone[b-ti9tarayxy] {
    flex: 0 0 45%;
    display: flex;
    flex-direction: column;
    padding: 12px 14px;
    gap: 8px;
    background: #fafafa;
}

.inst-info-header[b-ti9tarayxy] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.7rem;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding-bottom: 6px;
    border-bottom: 1px solid #e5e7eb;
}

.inst-info-header i[b-ti9tarayxy] {
    color: #1a73e8;
    font-size: 0.75rem;
}

.inst-info-item[b-ti9tarayxy] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.inst-info-label[b-ti9tarayxy] {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.68rem;
    font-weight: 600;
    color: #374151;
}

.inst-info-label i[b-ti9tarayxy] {
    width: 14px;
    text-align: center;
    font-size: 0.65rem;
    color: #1a73e8;
}

.inst-info-desc[b-ti9tarayxy] {
    margin: 0 0 0 19px;
    font-size: 0.72rem;
    color: #6b7280;
    line-height: 1.45;
}

.inst-info-tip[b-ti9tarayxy] {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-top: auto;
    padding: 6px 8px;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 6px;
    font-size: 0.68rem;
    color: #92400e;
    line-height: 1.4;
}

.inst-info-tip i[b-ti9tarayxy] {
    color: #f59e0b;
    font-size: 0.7rem;
    margin-top: 1px;
    flex-shrink: 0;
}
/* /Presentation/Components/Pages/Perfil/UserProfile.razor.rz.scp.css */
/* ===== PESTAÑAS — EXACTO InstitucionPanel ===== */
.editor-tabs.nav-tabs[b-z1o8hx8zf3] {
    border-bottom: none !important;
    display: flex;
    padding: 0 !important;
    margin: 0 !important;
    background: #e8eaed;
    list-style: none;
    gap: 0;
    position: relative;
    height: 44px;
    flex-shrink: 0;
    min-height: 44px;
}

.editor-tabs .nav-item[b-z1o8hx8zf3] {
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
    display: flex;
    align-items: stretch;
}

.editor-tabs .nav-item:first-child[b-z1o8hx8zf3] {
    margin: 0 !important;
    padding: 0 !important;
}

.editor-tabs .nav-link[b-z1o8hx8zf3] {
    display: flex !important;
    align-items: center !important;
    justify-content: center;
    gap: 7px;
    padding: 0 20px !important;
    margin: 0 !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    color: #5f6368 !important;
    border: none !important;
    background: transparent !important;
    transition: all 0.15s ease;
    cursor: pointer;
    white-space: nowrap;
    position: relative;
    height: 44px !important;
    text-decoration: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

.editor-tabs .nav-link:hover[b-z1o8hx8zf3] {
    color: #202124 !important;
    background: rgba(0, 0, 0, 0.04) !important;
}

.editor-tabs .nav-link.active[b-z1o8hx8zf3] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
    height: 44px !important;
    padding: 0 20px !important;
    margin: 0 !important;
}

.editor-tabs .nav-item:first-child .nav-link.active[b-z1o8hx8zf3] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
}

.editor-tabs .nav-link.active[b-z1o8hx8zf3]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 12px;
    right: 12px;
    height: 3px;
    background: #1a73e8;
    border-radius: 3px 3px 0 0;
}

.editor-tabs .nav-item:not(:last-child) .nav-link:not(.active)[b-z1o8hx8zf3]::after {
    content: '';
    position: absolute;
    right: 0;
    top: 10px;
    bottom: 10px;
    width: 1px;
    background: #dadce0;
}

.editor-tabs .nav-link i[b-z1o8hx8zf3] {
    font-size: 14px;
    width: 16px;
    text-align: center;
    color: inherit;
}

/* ===== CONTENIDO CON TABS — EXACTO InstitucionPanel ===== */
.tab-content.editor-tab-content[b-z1o8hx8zf3] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    overflow: hidden;
    position: relative;
}

.tab-content.editor-tab-content > *[b-z1o8hx8zf3] {
    position: absolute;
    inset: 0;
    overflow-y: auto;
    padding: 20px 24px 24px;
}

/* ── Contenedor principal (mismo que InstitucionPanel) ── */
.editor-container[b-z1o8hx8zf3] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

/* ── Header con breadcrumb ── */
.editor-header[b-z1o8hx8zf3] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-z1o8hx8zf3] {
    font-size: 13px;
}

.editor-header-right[b-z1o8hx8zf3] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* ── Title bar ── */
.editor-title-bar[b-z1o8hx8zf3] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-z1o8hx8zf3],
.editor-title-bar .fw-semibold[b-z1o8hx8zf3],
.editor-title-bar small[b-z1o8hx8zf3] {
    color: #1a1d23 !important;
}

/* ── Loading y error states deben ser estáticos, no absolute ── */
.tab-content.editor-tab-content > .d-flex[b-z1o8hx8zf3],
.tab-content.editor-tab-content > .alert[b-z1o8hx8zf3] {
    position: static;
    padding: 0;
    margin: 0;
}

/* ── Grid layout: Content + Sidebar dentro del tab ── */
.profile-layout[b-z1o8hx8zf3] {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 24px;
    align-items: start;
    height: 100%;
}

@media (max-width: 1199.98px) {
    .profile-layout[b-z1o8hx8zf3] {
        grid-template-columns: 1fr;
    }

    .profile-sidebar-col[b-z1o8hx8zf3] {
        order: -1;
    }
}

/* ── Sidebar sticky ── */
.profile-sidebar-col[b-z1o8hx8zf3] {
    position: sticky;
    top: 0;
}

/* ── Separación entre secciones dentro del contenido ── */
.profile-content > section[b-z1o8hx8zf3],
.profile-content > .card[b-z1o8hx8zf3],
.profile-content[b-z1o8hx8zf3] >  section,
.profile-content[b-z1o8hx8zf3] >  .card {
    margin-bottom: 20px;
}

/* ── Separación entre secciones del perfil ── */
.profile-content[b-z1o8hx8zf3]  section {
    margin-bottom: 20px;
}

/* ── Cards ── */
.profile-card[b-z1o8hx8zf3] {
    border: 1px solid var(--bs-border-color, #e5e7eb);
    border-radius: 10px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    transition: box-shadow 0.2s ease;
}

.profile-card:hover[b-z1o8hx8zf3] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.profile-section-header[b-z1o8hx8zf3] {
    background: transparent;
    font-weight: 600;
    font-size: 0.925rem;
    border-bottom: 1px solid var(--bs-border-color, #e5e7eb);
    padding: 0.75rem 1rem;
}

/* ── Avatar con iniciales ── */
.profile-initials-avatar[b-z1o8hx8zf3] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, #0D8ABC, #0A6E94);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 3px solid var(--bs-border-color, #e5e7eb);
}

.profile-initials-avatar span[b-z1o8hx8zf3] {
    color: #fff;
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
/* /Presentation/Components/Pages/UsuariosEnLineaPanel.razor.rz.scp.css */
.usuarios-en-linea-panel[b-q971x9prtl] {
    width: 250px;
    background-image: var(--sidebar-gradient);
    color: var(--sidebar-text);
    display: flex;
    flex-direction: column;
    box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1);
    z-index: 100;
    transition: width 0.3s ease;
    height: 100%;
    overflow: hidden;
    font-family: 'Roboto', 'Segoe UI', sans-serif;
    border-left: 1px solid var(--sidebar-border);
    flex-shrink: 0;
}

/* ── Header ── */
.usuarios-en-linea-header[b-q971x9prtl] {
    background-color: var(--sidebar-bg-overlay);
    padding: 10px 12px;
    border-bottom: 1px solid var(--sidebar-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    min-height: 44px;
}

.usuarios-en-linea-title-group[b-q971x9prtl] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    flex: 1;
}

.usuarios-en-linea-title[b-q971x9prtl] {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--sidebar-header-color);
    text-transform: uppercase;
    letter-spacing: 0.4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.usuarios-en-linea-count[b-q971x9prtl] {
    background-color: var(--sidebar-hover);
    color: var(--sidebar-text);
    font-size: 0.68rem;
    font-weight: 700;
    min-width: 20px;
    height: 20px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 6px;
    flex-shrink: 0;
}

.usuarios-en-linea-live-dot[b-q971x9prtl] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #22c55e;
    box-shadow: 0 0 4px rgba(34, 197, 94, 0.8);
    flex-shrink: 0;
}

.usuarios-en-linea-toggle[b-q971x9prtl] {
    background: none;
    border: none;
    color: var(--sidebar-text);
    cursor: pointer;
    font-size: 0.9rem;
    padding: 4px 6px;
    border-radius: 4px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.15s;
}

.usuarios-en-linea-toggle:hover[b-q971x9prtl] {
    background-color: var(--sidebar-hover);
}

/* ── Body ── */
.usuarios-en-linea-body[b-q971x9prtl] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 8px;
}

.usuarios-en-linea-body[b-q971x9prtl]::-webkit-scrollbar {
    width: 6px;
}

.usuarios-en-linea-body[b-q971x9prtl]::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.1);
}

.usuarios-en-linea-body[b-q971x9prtl]::-webkit-scrollbar-thumb {
    background: var(--sidebar-hover);
    border-radius: 3px;
}

.usuarios-en-linea-body[b-q971x9prtl]::-webkit-scrollbar-thumb:hover {
    background: var(--sidebar-hover);
}

/* ── Item ── */
.usuarios-en-linea-item[b-q971x9prtl] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 8px;
    border-radius: 6px;
    cursor: default;
    transition: background-color 0.15s;
}

.usuarios-en-linea-item:hover[b-q971x9prtl] {
    background-color: var(--sidebar-hover);
}

.usuarios-en-linea-avatar[b-q971x9prtl] {
    position: relative;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    flex-shrink: 0;
    overflow: visible;
    background-color: var(--sidebar-hover);
    display: flex;
    align-items: center;
    justify-content: center;
}

.usuarios-en-linea-avatar img[b-q971x9prtl] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--sidebar-border);
}

.usuarios-en-linea-inicial[b-q971x9prtl] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--sidebar-text);
    background-color: var(--sidebar-hover);
    border: 2px solid var(--sidebar-border);
}

.usuarios-en-linea-presence[b-q971x9prtl] {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #22c55e;
    box-shadow: 0 0 0 2px var(--sidebar-border);
}

.usuarios-en-linea-info[b-q971x9prtl] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.usuarios-en-linea-nombre[b-q971x9prtl] {
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--sidebar-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.usuarios-en-linea-rol[b-q971x9prtl] {
    font-size: 0.64rem;
    color: var(--sidebar-sub-header-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Empty state ── */
.usuarios-en-linea-empty[b-q971x9prtl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 24px 8px;
    color: var(--sidebar-sub-header-color);
    font-size: 0.72rem;
    text-align: center;
}

.usuarios-en-linea-empty i[b-q971x9prtl] {
    font-size: 1.4rem;
    opacity: 0.6;
}

/* ── Footer ── */
.usuarios-en-linea-footer[b-q971x9prtl] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px;
    border-top: 1px solid var(--sidebar-border);
    background-color: var(--sidebar-bg-overlay);
    font-size: 0.66rem;
    color: var(--sidebar-sub-header-color);
    white-space: nowrap;
}

.usuarios-en-linea-footer .online[b-q971x9prtl] {
    color: #22c55e;
}

.usuarios-en-linea-footer .offline[b-q971x9prtl] {
    color: #f59e0b;
}

/* ── Colapsado ── */
.usuarios-en-linea-collapsed[b-q971x9prtl] {
    width: 52px;
}

.usuarios-en-linea-collapsed .usuarios-en-linea-header[b-q971x9prtl] {
    justify-content: center;
    padding: 10px 6px;
}

.usuarios-en-linea-collapsed .usuarios-en-linea-title-group[b-q971x9prtl] {
    display: none;
}

.usuarios-en-linea-collapsed .usuarios-en-linea-toggle i[b-q971x9prtl] {
    transform: none;
}

.usuarios-en-linea-collapsed .usuarios-en-linea-body[b-q971x9prtl] {
    padding: 8px 6px;
}

.usuarios-en-linea-collapsed .usuarios-en-linea-item[b-q971x9prtl] {
    justify-content: center;
    padding: 4px 0;
}

.usuarios-en-linea-collapsed .usuarios-en-linea-info[b-q971x9prtl] {
    display: none;
}

.usuarios-en-linea-collapsed .usuarios-en-linea-empty span[b-q971x9prtl] {
    display: none;
}

.usuarios-en-linea-collapsed .usuarios-en-linea-footer span[b-q971x9prtl] {
    display: none;
}

/* ════════════════════════════════════════════
   TOASTS DE PRESENCIA — notificaciones de conexión/desconexión
   ════════════════════════════════════════════ */

.suros-presence-toasts[b-q971x9prtl] {
    position: fixed;
    top: 72px;
    right: 18px;
    z-index: 5000;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    pointer-events: none;
    max-width: min(380px, calc(100vw - 36px));
}

.suros-presence-toast[b-q971x9prtl] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    width: 100%;
    padding: 12px 14px;
    border-radius: 14px;
    background: rgba(15, 23, 42, 0.92);
    color: #f8fafc;
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-left-width: 4px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.38);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    animation: surosToastIn-b-q971x9prtl 0.32s cubic-bezier(0.21, 1.02, 0.73, 1) forwards;
    pointer-events: auto;
}

.suros-presence-toast.connect[b-q971x9prtl] {
    border-left-color: #22c55e;
}

.suros-presence-toast.disconnect[b-q971x9prtl] {
    border-left-color: #ef4444;
}

.suros-presence-toast.leaving[b-q971x9prtl] {
    animation: surosToastOut-b-q971x9prtl 0.3s ease forwards;
}

/* Avatar del toast */
.suros-presence-toast-avatar[b-q971x9prtl] {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    flex-shrink: 0;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.10);
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid rgba(255, 255, 255, 0.16);
}

.suros-presence-toast-avatar img[b-q971x9prtl] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.suros-presence-toast-avatar span[b-q971x9prtl] {
    font-size: 1rem;
    font-weight: 700;
    color: #f8fafc;
}

/* Cuerpo del toast */
.suros-presence-toast-body[b-q971x9prtl] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.suros-presence-toast-body strong[b-q971x9prtl] {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.suros-presence-toast.connect .suros-presence-toast-body strong[b-q971x9prtl] {
    color: #4ade80;
}

.suros-presence-toast.disconnect .suros-presence-toast-body strong[b-q971x9prtl] {
    color: #f87171;
}

.suros-presence-toast-body span[b-q971x9prtl] {
    font-size: 0.74rem;
    color: rgba(248, 250, 252, 0.82);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Icono de estado del toast */
.suros-presence-toast-icon[b-q971x9prtl] {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.72rem;
}

.suros-presence-toast.connect .suros-presence-toast-icon[b-q971x9prtl] {
    background: rgba(34, 197, 94, 0.18);
    color: #4ade80;
}

.suros-presence-toast.disconnect .suros-presence-toast-icon[b-q971x9prtl] {
    background: rgba(239, 68, 68, 0.18);
    color: #f87171;
}

/* Animaciones */
@keyframes surosToastIn-b-q971x9prtl {
    from {
        opacity: 0;
        transform: translateX(48px) scale(0.96);
    }
    to {
        opacity: 1;
        transform: translateX(0) scale(1);
    }
}

@keyframes surosToastOut-b-q971x9prtl {
    from {
        opacity: 1;
        transform: translateX(0) scale(1);
    }
    to {
        opacity: 0;
        transform: translateY(-8px) scale(0.97);
    }
}

/* Variante tema claro */
[data-theme="light"] .suros-presence-toast[b-q971x9prtl] {
    background: rgba(255, 255, 255, 0.97);
    color: #0f172a;
    border-color: #e2e8f0;
    border-left-width: 4px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.14);
}

[data-theme="light"] .suros-presence-toast-avatar[b-q971x9prtl] {
    background: #f1f5f9;
    border-color: #e2e8f0;
}

[data-theme="light"] .suros-presence-toast-avatar span[b-q971x9prtl] {
    color: #334155;
}

[data-theme="light"] .suros-presence-toast.connect .suros-presence-toast-body strong[b-q971x9prtl] {
    color: #15803d;
}

[data-theme="light"] .suros-presence-toast.disconnect .suros-presence-toast-body strong[b-q971x9prtl] {
    color: #b91c1c;
}

[data-theme="light"] .suros-presence-toast-body span[b-q971x9prtl] {
    color: #475569;
}

[data-theme="light"] .suros-presence-toast.connect .suros-presence-toast-icon[b-q971x9prtl] {
    background: rgba(34, 197, 94, 0.16);
    color: #16a34a;
}

[data-theme="light"] .suros-presence-toast.disconnect .suros-presence-toast-icon[b-q971x9prtl] {
    background: rgba(239, 68, 68, 0.14);
    color: #dc2626;
}

/* Toast tipo mensaje (acento azul) */
.suros-presence-toast.message[b-q971x9prtl] {
    border-left-color: #3b82f6;
}

.suros-presence-toast.message .suros-presence-toast-body strong[b-q971x9prtl] {
    color: #60a5fa;
}

.suros-presence-toast.message .suros-presence-toast-icon[b-q971x9prtl] {
    background: rgba(59, 130, 246, 0.18);
    color: #60a5fa;
}

[data-theme="light"] .suros-presence-toast.message .suros-presence-toast-body strong[b-q971x9prtl] {
    color: #1d4ed8;
}

[data-theme="light"] .suros-presence-toast.message .suros-presence-toast-icon[b-q971x9prtl] {
    background: rgba(59, 130, 246, 0.14);
    color: #2563eb;
}

/* ════════════════════════════════════════════
   MENÚ CONTEXTUAL — click derecho sobre un usuario
   ════════════════════════════════════════════ */

.suros-context-backdrop[b-q971x9prtl] {
    position: fixed;
    inset: 0;
    z-index: 5090;
    background: transparent;
}

.suros-presence-context-layer[b-q971x9prtl] {
    position: fixed;
    z-index: 5100;
    transform: translateX(-100%) translateY(-25%);
    max-width: min(320px, calc(100vw - 24px));
}

.suros-presence-context[b-q971x9prtl] {
    background: rgba(15, 23, 42, 0.95);
    color: #f8fafc;
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 12px;
    padding: 8px;
    min-width: 210px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.42);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    animation: surosCtxIn-b-q971x9prtl 0.18s ease forwards;
    font-family: 'Roboto', 'Segoe UI', sans-serif;
}

@keyframes surosCtxIn-b-q971x9prtl {
    from {
        opacity: 0;
        transform: scale(0.96);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.suros-context-header[b-q971x9prtl] {
    padding: 4px 8px 8px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    margin-bottom: 6px;
}

.suros-context-title[b-q971x9prtl] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: var(--sidebar-header-color, #79c8ff);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

/* Botones del menú */
.suros-context-btn[b-q971x9prtl] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 8px 10px;
    border: none;
    border-radius: 8px;
    background: none;
    color: #f8fafc;
    font-size: 0.78rem;
    cursor: pointer;
    text-align: left;
    transition: background-color 0.12s;
}

.suros-context-btn i[b-q971x9prtl] {
    width: 18px;
    text-align: center;
    color: #94a3b8;
    font-size: 0.85rem;
}

.suros-context-btn:hover[b-q971x9prtl] {
    background: rgba(255, 255, 255, 0.10);
}

.suros-context-btn:hover i[b-q971x9prtl] {
    color: #60a5fa;
}

/* ── Modo mensaje ── */
.suros-context-input-row[b-q971x9prtl] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.suros-context-input[b-q971x9prtl] {
    flex: 1;
    min-width: 0;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    color: #f8fafc;
    font-size: 0.78rem;
    padding: 8px 10px;
    outline: none;
    transition: border-color 0.15s;
}

.suros-context-input[b-q971x9prtl]::placeholder {
    color: rgba(248, 250, 252, 0.45);
}

.suros-context-input:focus[b-q971x9prtl] {
    border-color: #3b82f6;
}

.suros-context-send[b-q971x9prtl] {
    width: 34px;
    height: 34px;
    border: none;
    border-radius: 8px;
    background: #2563eb;
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    transition: background-color 0.15s;
    flex-shrink: 0;
}

.suros-context-send:hover[b-q971x9prtl] {
    background: #1d4ed8;
}

.suros-context-hint[b-q971x9prtl] {
    display: block;
    margin-top: 6px;
    font-size: 0.64rem;
    color: rgba(248, 250, 252, 0.5);
}

/* ── Modo información ── */
.suros-context-info[b-q971x9prtl] {
    min-width: 260px;
}

.suros-context-info-header[b-q971x9prtl] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 4px 4px 10px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.suros-context-info-avatar[b-q971x9prtl] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    flex-shrink: 0;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.10);
    border: 2px solid rgba(255, 255, 255, 0.16);
    display: flex;
    align-items: center;
    justify-content: center;
}

.suros-context-info-avatar img[b-q971x9prtl] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.suros-context-info-avatar span[b-q971x9prtl] {
    font-size: 1rem;
    font-weight: 700;
    color: #f8fafc;
}

.suros-context-info-name[b-q971x9prtl] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.suros-context-info-name strong[b-q971x9prtl] {
    font-size: 0.82rem;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.suros-context-info-name span[b-q971x9prtl] {
    font-size: 0.7rem;
    color: rgba(248, 250, 252, 0.65);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.suros-context-close[b-q971x9prtl] {
    width: 26px;
    height: 26px;
    border: none;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.08);
    color: rgba(248, 250, 252, 0.7);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    flex-shrink: 0;
    transition: background-color 0.12s;
}

.suros-context-close:hover[b-q971x9prtl] {
    background: rgba(239, 68, 68, 0.25);
    color: #f87171;
}

.suros-context-info-body[b-q971x9prtl] {
    padding: 8px 4px 2px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.suros-context-info-row[b-q971x9prtl] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.suros-context-info-row > i[b-q971x9prtl] {
    width: 16px;
    margin-top: 2px;
    text-align: center;
    color: #60a5fa;
    font-size: 0.78rem;
    flex-shrink: 0;
}

.suros-context-info-row div[b-q971x9prtl] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.suros-context-info-row small[b-q971x9prtl] {
    font-size: 0.62rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    color: rgba(248, 250, 252, 0.45);
}

.suros-context-info-row span[b-q971x9prtl] {
    font-size: 0.76rem;
    color: #f8fafc;
    word-break: break-word;
}

/* Variante tema claro para el menú contextual */
[data-theme="light"] .suros-presence-context[b-q971x9prtl] {
    background: rgba(255, 255, 255, 0.97);
    color: #0f172a;
    border-color: #e2e8f0;
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.16);
}

[data-theme="light"] .suros-context-header[b-q971x9prtl] {
    border-bottom-color: #f1f5f9;
}

[data-theme="light"] .suros-context-title[b-q971x9prtl] {
    color: #1d4ed8;
}

[data-theme="light"] .suros-context-btn[b-q971x9prtl] {
    color: #0f172a;
}

[data-theme="light"] .suros-context-btn i[b-q971x9prtl] {
    color: #64748b;
}

[data-theme="light"] .suros-context-btn:hover[b-q971x9prtl] {
    background: #f1f5f9;
}

[data-theme="light"] .suros-context-btn:hover i[b-q971x9prtl] {
    color: #2563eb;
}

[data-theme="light"] .suros-context-input[b-q971x9prtl] {
    background: #f8fafc;
    border-color: #e2e8f0;
    color: #0f172a;
}

[data-theme="light"] .suros-context-input[b-q971x9prtl]::placeholder {
    color: #94a3b8;
}

[data-theme="light"] .suros-context-hint[b-q971x9prtl] {
    color: #64748b;
}

[data-theme="light"] .suros-context-info-header[b-q971x9prtl] {
    border-bottom-color: #f1f5f9;
}

[data-theme="light"] .suros-context-info-avatar[b-q971x9prtl] {
    background: #f1f5f9;
    border-color: #e2e8f0;
}

[data-theme="light"] .suros-context-info-avatar span[b-q971x9prtl] {
    color: #334155;
}

[data-theme="light"] .suros-context-info-name span[b-q971x9prtl] {
    color: #64748b;
}

[data-theme="light"] .suros-context-close[b-q971x9prtl] {
    background: #f1f5f9;
    color: #64748b;
}

[data-theme="light"] .suros-context-info-row > i[b-q971x9prtl] {
    color: #2563eb;
}

[data-theme="light"] .suros-context-info-row small[b-q971x9prtl] {
    color: #64748b;
}

[data-theme="light"] .suros-context-info-row span[b-q971x9prtl] {
    color: #0f172a;
}
/* /Presentation/Components/Shared/CaptchaOverlay.razor.rz.scp.css */
.captcha-inline[b-pwveqjs091] {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 10px 0 6px 0;
}

.captcha-prompt[b-pwveqjs091] {
  font-weight: 700;
  font-size: 1.05rem;
  background: #f6f8ff;
  padding: 8px 12px;
  border-radius: 8px;
  color: #3d3d3d;
  min-width: 120px;
  text-align: center;
}

.captcha-input[b-pwveqjs091] {
  max-width: 110px;
}

.captcha-actions[b-pwveqjs091] {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  align-items: center;
  margin-top: 8px;
  flex-wrap: wrap;
}

.captcha-actions .btn[b-pwveqjs091] {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 38px;
  line-height: 1;
  padding: 0 14px;
  border-radius: 8px;
  font-weight: 600;
  border-width: 1px;
  box-shadow: 0 1px 2px rgba(16,24,40,.04);
}

.captcha-actions .btn:hover[b-pwveqjs091] {
  filter: brightness(0.98);
}

.captcha-actions .btn:focus-visible[b-pwveqjs091] {
  outline: 3px solid rgba(102,126,234,.35);
  outline-offset: 2px;
}

.captcha-btn i[b-pwveqjs091] {
  font-size: 16px;
  color:white !important; 
  margin-left:8px;
}

.captcha-btn.compact[b-pwveqjs091] {
    height: 36px;
    padding: 0 12px;
    color: white !important;
    text-align:center;
}

@media (max-width: 420px) {
  .captcha-actions[b-pwveqjs091] { gap: 10px; }
  .captcha-actions .btn[b-pwveqjs091] { height: 36px; padding: 0 12px; }
  .captcha-input[b-pwveqjs091] { max-width: 100px; }
}
/* /Presentation/Components/Shared/CaquetaCoverageMap.razor.rz.scp.css */
.coverage-backdrop[b-4zmms3440x] {
    position: fixed;
    inset: 0;
    z-index: 10000;
    background: radial-gradient(1200px 800px at 80% 40%, rgba(59, 130, 246, 0.22), transparent 60%), rgba(2, 6, 23, 0.65);
    backdrop-filter: blur(6px);
    display: grid;
    place-items: center;
    padding: 1.25rem;
}

.coverage-card[b-4zmms3440x] {
    width: min(860px, 90vw);
    border-radius: 1.25rem;
    background: linear-gradient(160deg, rgba(15, 23, 42, 0.78), rgba(15, 23, 42, 0.92));
    box-shadow:
        0 30px 60px rgba(2, 6, 23, 0.8),
        0 0 0 1px rgba(148, 163, 184, 0.25);
    display: grid;
    grid-template-rows: auto 1fr;
    overflow: hidden;
}

.coverage-header[b-4zmms3440x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.9rem 1.1rem 0.9rem 1.25rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.25);
}

.coverage-title[b-4zmms3440x] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-weight: 700;
    font-size: 1.05rem;
}

.coverage-title i[b-4zmms3440x] {
    color: #79c8ff;
}

.coverage-close[b-4zmms3440x] {
    background: rgba(255, 255, 255, 0.1);
    color: #e5e7eb;
    border: 1px solid rgba(148, 163, 184, 0.3);
    width: 36px;
    height: 36px;
    border-radius: 0.6rem;
    cursor: pointer;
}

.coverage-stage[b-4zmms3440x] {
    position: relative;
    width: 100%;
    height: 520px;
    background:
        radial-gradient(circle at 10% 0%, rgba(56, 189, 248, 0.24), transparent 55%),
        radial-gradient(circle at 90% 100%, rgba(37, 99, 235, 0.22), transparent 55%),
        linear-gradient(145deg, rgba(15, 23, 42, 0.96), rgba(15, 23, 42, 0.88)),
        url("/images/logosuros.png");
    background-size:
        120% 120%,
        120% 120%,
        cover,
        48%;
    background-repeat: no-repeat;
    background-position:
        0% 0%,
        100% 100%,
        center,
        center;
    opacity: 0.98;
}

.coverage-svg[b-4zmms3440x] {
    width: 100%;
    height: 100%;
}

.link[b-4zmms3440x] {
    stroke: rgba(148, 163, 184, 0.6);
    stroke-width: 1.5;
    stroke-linecap: round;
}

.link-to-cloud[b-4zmms3440x] {
    stroke: rgba(59, 130, 246, 0.9);
    stroke-width: 1.8;
}

.link-to-leader[b-4zmms3440x] {
    stroke: rgba(125, 211, 252, 0.9);
    stroke-width: 1.4;
    stroke-dasharray: 4 4;
}

.dot[b-4zmms3440x] {
    display: none;
}

.node-leader .dot[b-4zmms3440x] {
    display: none;
}

.node-leader .label[b-4zmms3440x] {
    font-weight: 700;
}

.leader-badge-rect[b-4zmms3440x] {
    fill: rgba(15, 23, 42, 0.95);
    stroke: rgba(96, 165, 250, 0.9);
    stroke-width: 1.2;
}

.leader-badge-text[b-4zmms3440x] {
    fill: #e5e7eb;
    font-size: 11px;
    font-weight: 600;
    text-anchor: middle;
    dominant-baseline: middle;
}

/* Estilos de pines tipo etiqueta de ubicación */
.pin-body[b-4zmms3440x] {
    fill: #0ea5e9;
    stroke: #e0f2fe;
    stroke-width: 1.4;
    filter: drop-shadow(0 8px 16px rgba(15, 23, 42, 0.5));
}

.pin-leader[b-4zmms3440x] {
    fill: #2563eb;
    stroke: #bfdbfe;
}

.pin-core[b-4zmms3440x] {
    fill: #e0f2fe;
}

.node:hover .pin-body[b-4zmms3440x] {
    transform-box: fill-box;
    transform-origin: center;
    transform: scale(1.08);
}

/* Tooltip */
.tip[b-4zmms3440x] {
    opacity: 0;
    transition: opacity 180ms ease-out;
    pointer-events: none;
}

.tip-rect[b-4zmms3440x] {
    fill: rgba(15, 23, 42, 0.94);
    stroke: rgba(96, 165, 250, 0.6);
    stroke-width: 1;
}

.tip-title[b-4zmms3440x] {
    fill: #e5e7eb;
    font-size: 12px;
    font-weight: 600;
}

.tip-sub[b-4zmms3440x] {
    fill: #9ca3af;
    font-size: 11px;
}

.node:hover .tip[b-4zmms3440x] {
    opacity: 1;
}

/* Nube tecnológica */
.cloud-main[b-4zmms3440x] {
    stroke: rgba(148, 163, 184, 0.6);
    stroke-width: 1.2;
}

.cloud-chip[b-4zmms3440x] {
    fill: rgba(248, 250, 252, 0.9);
    stroke: rgba(148, 163, 184, 0.8);
    stroke-width: 0.8;
}

.cloud-link[b-4zmms3440x] {
    stroke: rgba(59, 130, 246, 0.8);
    stroke-width: 1.1;
    stroke-linecap: round;
}

.label[b-4zmms3440x] {
    fill: #e5e7eb;
    font-size: 12px;
    text-anchor: middle;
    dominant-baseline: hanging;
    paint-order: stroke;
    stroke: rgba(15, 23, 42, 0.8);
    stroke-width: 2px;
}

.suros-footer-social-link--map[b-4zmms3440x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

@media (max-width: 768px) {
    .coverage-stage[b-4zmms3440x] { height: 440px; }
}
/* /Presentation/Components/Shared/ClientsLogoSlider.razor.rz.scp.css */
.cms-clients-slider[b-3ng1brvuvg] {
    position: relative;
    z-index: 1;
    margin-top: 2rem;
    overflow: visible;
    padding-block: 1rem;
}

.cms-clients-slider-track[b-3ng1brvuvg] {
    display: flex;
    gap: 2.5rem;
    align-items: center;
    width: max-content;
    animation: cms-clients-scroll-b-3ng1brvuvg 28s linear infinite;
}

.cms-clients-slider:hover .cms-clients-slider-track[b-3ng1brvuvg] {
    animation-play-state: paused;
}

.cms-clients-slider-item[b-3ng1brvuvg] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding: 0.5rem 0.5rem;
    border-radius: 0.8rem;
    background: radial-gradient(circle at top left, #ffffff, #ffffff);
    box-shadow:
        0 18px 35px rgba(15, 23, 42, 0.28),
        0 0 0 1px rgba(255, 255, 255, 0.6),
        0 6px 25px rgba(255, 255, 255, 0.14);
    transform: translateY(0) scale(1);
    transition:
        transform 220ms ease-out,
        box-shadow 220ms ease-out,
        background 220ms ease-out;
    overflow: visible;
}

.cms-clients-slider-item[b-3ng1brvuvg]::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background:
        radial-gradient(60% 70% at 30% 30%, rgba(255, 255, 255, 0.6) 0%, transparent 60%),
        radial-gradient(70% 60% at 70% 70%, rgba(255, 255, 255, 0.45) 0%, transparent 62%);
    filter: blur(10px);
    opacity: 0.38;
    transform: scale(0.98);
    pointer-events: none;
    animation: cms-card-glow-b-3ng1brvuvg 4.8s ease-in-out infinite;
    transition:
        opacity 220ms ease-out,
        transform 220ms ease-out,
        filter 220ms ease-out;
}

.cms-clients-slider-item:hover[b-3ng1brvuvg] {
    transform: translateY(-8px) scale(1.12);
    box-shadow:
        0 26px 55px rgba(15, 23, 42, 0.45),
        0 0 0 1px rgba(255, 255, 255, 0.8),
        0 10px 35px rgba(255, 255, 255, 0.2);
    background: radial-gradient(circle at top left, #ffffff, #e5f0ff);
}

.cms-clients-slider-item:hover[b-3ng1brvuvg]::after {
    opacity: 0.55;
    transform: scale(1);
    filter: blur(12px);
}

.cms-clients-slider-item img[b-3ng1brvuvg] {
    display: block;
    max-height: 54px;
    max-width: 190px;
    filter: grayscale(0.1);
    opacity: 0.9;
    transition:
        transform 180ms ease-out,
        filter 180ms ease-out,
        opacity 180ms ease-out;
}

.cms-clients-slider-item img:hover[b-3ng1brvuvg] {
    transform: translateY(-3px) scale(1.06);
    filter: grayscale(0);
    opacity: 1;
}

.cms-client-overlay[b-3ng1brvuvg] {
    position: absolute;
    left: 50%;
    bottom: calc(100% + 10px);
    transform: translateX(-50%) translateY(6px);
    min-width: 280px;
    max-width: 360px;
    padding: 0.7rem 0.85rem;
    border-radius: 14px;
    background:
        radial-gradient(circle at 12% 0, #1e40af 0, transparent 55%),
        #020617;
    color: #eaf2ff;
    box-shadow:
        0 22px 55px rgba(15, 23, 42, 0.9),
        0 0 0 1px rgba(30, 64, 175, 0.8);
    opacity: 0;
    pointer-events: none;
    transition:
        opacity 160ms ease-out,
        transform 160ms ease-out;
    z-index: 20;
}

.cms-clients-slider-item:hover .cms-client-overlay[b-3ng1brvuvg] {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.cms-client-overlay-header[b-3ng1brvuvg] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.4rem;
}

.cms-client-name[b-3ng1brvuvg] {
    font-weight: 600;
    font-size: 0.95rem;
    color: #e5f0ff;
}

.cms-client-years[b-3ng1brvuvg] {
    font-size: 0.78rem;
    color: #c7d2fe;
}

.cms-client-overlay-body[b-3ng1brvuvg] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.25rem 0.5rem;
}

.cms-client-detail[b-3ng1brvuvg] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    align-items: center;
    font-size: 0.76rem;
.cms-detail-icon {
    width: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #60a5fa;
    font-size: 0.8rem;
}

    color: #bfdbfe;
    opacity: 0.95;
    color: #bfdbfe;
    opacity: 0.95;
    min-width: 70px;
    opacity: 0.9;[b-3ng1brvuvg]
}

@keyframes cms-clients-scroll-b-3ng1brvuvg {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

@media (max-width: 768px) {
    .cms-clients-slider[b-3ng1brvuvg] {
        margin-top: 1.5rem;
    }

    .cms-clients-slider-track[b-3ng1brvuvg] {
        gap: 1.75rem;
    }

    .cms-clients-slider-item img[b-3ng1brvuvg] {
        max-height: 38px;
        max-width: 150px;
    }
}

@keyframes cms-card-glow-b-3ng1brvuvg {
    0% {
        opacity: 0.34;
        filter: blur(9px);
        transform: scale(0.98);
    }
    50% {
        opacity: 0.52;
        filter: blur(12px);
        transform: scale(1);
    }
    100% {
        opacity: 0.34;
        filter: blur(9px);
        transform: scale(0.98);
    }
}
/* /Presentation/Components/Shared/Editor/EditorCanvas/EditorCanvas.razor.rz.scp.css */
/* EditorCanvas.razor.css — Estilos del lienzo de edición */

.editor-canvas-container[b-6ijyhtx3uq] {
    flex-grow: 1;
    overflow-y: auto;
    padding: 12px;
    background: #fff;
}

/* --- Estado vacío --- */
.canvas-empty-state[b-6ijyhtx3uq] {
    min-height: 250px;
    cursor: pointer;
    border: 2px dashed #d1d5db;
    border-radius: 12px;
    transition: all 0.3s ease;
    margin: 40px 20px;
    color: #6b7280 !important;
}

.canvas-empty-state *[b-6ijyhtx3uq] {
    color: #6b7280 !important;
}

.canvas-empty-state:hover[b-6ijyhtx3uq] {
    border-color: #2563eb;
    background: #f0f4ff;
}

/* --- Lista de bloques --- */
.canvas-blocks[b-6ijyhtx3uq] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* --- Bloque individual --- */
.canvas-block[b-6ijyhtx3uq] {
    border: 2px solid transparent;
    border-radius: 8px;
    padding: 8px 12px;
    transition: all 0.15s ease;
    position: relative;
    background: #fff;
}

.canvas-block:hover[b-6ijyhtx3uq] {
    border-color: #e2e4e9;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
}

.canvas-block.selected[b-6ijyhtx3uq] {
    border-color: #2563eb;
    box-shadow: 0 0 0 2px rgba(37,99,235,0.1);
}

.canvas-block.drag-over[b-6ijyhtx3uq] {
    border-color: #2563eb;
    background: #f0f4ff;
    box-shadow: 0 0 0 2px rgba(37,99,235,0.15);
    transform: scale(1.01);
}

/* --- Barra de acciones del bloque --- */
.block-actions-bar[b-6ijyhtx3uq] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
    opacity: 0;
    transition: opacity 0.15s ease;
}

.canvas-block:hover .block-actions-bar[b-6ijyhtx3uq],
.canvas-block.selected .block-actions-bar[b-6ijyhtx3uq] {
    opacity: 1;
}

.block-drag-handle[b-6ijyhtx3uq] {
    cursor: grab;
    color: #9ca3af;
    font-size: 16px;
    letter-spacing: -2px;
    user-select: none;
}

.block-drag-handle:active[b-6ijyhtx3uq] {
    cursor: grabbing;
}

.block-type-badge[b-6ijyhtx3uq] {
    font-size: 10px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.block-actions-right[b-6ijyhtx3uq] {
    margin-left: auto;
    display: flex;
    gap: 4px;
}

.block-actions-right .btn-link[b-6ijyhtx3uq] {
    font-size: 14px;
    text-decoration: none;
}

/* --- Contenido del bloque: Texto --- */
.block-content[b-6ijyhtx3uq] {
    min-height: 24px;
    outline: none;
    color: #1a1d23 !important;
}

.block-content *[b-6ijyhtx3uq] {
    color: #1a1d23 !important;
}

.block-text[b-6ijyhtx3uq] {
    font-size: 14px;
    line-height: 1.6;
    padding: 4px 8px;
    border-radius: 4px;
    background: #fafafa;
    color: #1a1d23 !important;
}

.block-text:focus[b-6ijyhtx3uq] {
    background: #fff;
    box-shadow: 0 0 0 2px rgba(37,99,235,0.1);
}

/* --- Separador --- */
.block-separator[b-6ijyhtx3uq] {
    text-align: center;
    padding: 4px 0;
}

.block-separator hr[b-6ijyhtx3uq] {
    margin: 4px 0;
    border-color: #d1d5db;
}

/* --- Salto --- */
.block-salto[b-6ijyhtx3uq] {
    text-align: center;
    padding: 8px;
    color: #9ca3af;
    font-size: 12px;
}

/* --- Lista --- */
.block-lista[b-6ijyhtx3uq] {
    font-size: 14px;
    line-height: 1.6;
    padding: 4px 8px;
    border-radius: 4px;
    background: #fffbeb;
    font-family: 'Courier New', monospace;
    color: #1a1d23 !important;
}

.block-lista:focus[b-6ijyhtx3uq] {
    background: #fff;
    box-shadow: 0 0 0 2px rgba(245,158,11,0.15);
}

/* --- Condicional --- */
.block-condicional[b-6ijyhtx3uq] {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 8px;
    padding: 8px;
}

.condicional-header[b-6ijyhtx3uq],
.condicional-footer[b-6ijyhtx3uq] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.condicional-footer[b-6ijyhtx3uq] {
    margin-bottom: 0;
    margin-top: 8px;
}

.condicional-tag[b-6ijyhtx3uq] {
    font-family: 'Courier New', monospace;
    font-size: 12px;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 4px;
}

.condicional-tag.abierto[b-6ijyhtx3uq] {
    color: #16a34a;
    background: #dcfce7;
}

.condicional-tag.cerrado[b-6ijyhtx3uq] {
    color: #dc2626;
    background: #fef2f2;
}

.condicional-var-input[b-6ijyhtx3uq] {
    font-family: 'Courier New', monospace;
    font-size: 12px;
    max-width: 200px;
}

.condicional-body[b-6ijyhtx3uq] {
    min-height: 40px;
    padding: 8px;
    background: white;
    border-radius: 4px;
    border: 1px solid #e2e4e9;
    outline: none;
    font-size: 13px;
    line-height: 1.5;
    color: #1a1d23 !important;
}

.condicional-body:focus[b-6ijyhtx3uq] {
    border-color: #16a34a;
    box-shadow: 0 0 0 2px rgba(22,163,74,0.1);
}

/* --- Botón --- */
.block-boton .input-group[b-6ijyhtx3uq] {
    gap: 0;
}

.block-boton .input-group-text[b-6ijyhtx3uq] {
    font-size: 12px;
    background: #f3f4f6;
    border-color: #d1d5db;
    color: #374151 !important;
}

.block-boton input[b-6ijyhtx3uq] {
    font-size: 13px;
    color: #1a1d23 !important;
}

/* --- Chips de variables inline --- */
.variable-chip-inline[b-6ijyhtx3uq] {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 3px;
    color: white;
    font-size: 12px;
    font-weight: 500;
    font-family: 'Courier New', monospace;
    cursor: pointer;
    user-select: none;
    transition: all 0.15s ease;
}

.variable-chip-inline:hover[b-6ijyhtx3uq] {
    filter: brightness(1.1);
    transform: scale(1.05);
}

/* --- Botón de agregar bloque --- */
.canvas-blocks + .text-center[b-6ijyhtx3uq] {
    border-top: 1px solid #f3f4f6;
    margin-top: 8px;
}

/* --- Transiciones de bloques --- */
.canvas-block[b-6ijyhtx3uq] {
    animation: blockFadeIn-b-6ijyhtx3uq 0.2s ease;
}

@keyframes blockFadeIn-b-6ijyhtx3uq {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* --- Preview markdown en contenteditable --- */
.block-content strong[b-6ijyhtx3uq],
.block-content em[b-6ijyhtx3uq],
.block-content s[b-6ijyhtx3uq] {
    color: #1a1d23 !important;
}

.block-content strong[b-6ijyhtx3uq] {
    font-weight: 700;
}

.block-content em[b-6ijyhtx3uq] {
    font-style: italic;
}

.block-content s[b-6ijyhtx3uq] {
    text-decoration: line-through;
}

/* --- Responsive --- */
@media (max-width: 768px) {
    .block-actions-bar[b-6ijyhtx3uq] {
        opacity: 1;
    }
}
/* /Presentation/Components/Shared/Editor/EditorCanvas/ToolbarFormato.razor.rz.scp.css */
/* ToolbarFormato.razor.css — Estilos scoped al componente ToolbarFormato */

/* ── Toolbar ── */
.toolbar-formato[b-0um3x8yu0a] {
    position: relative;
    border-radius: 8px 8px 0 0;
    gap: 2px !important;
}

/* Botones ghost: reset completo del <button> nativo */
.toolbar-icn-btn[b-0um3x8yu0a] {
    all: unset;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    padding: 4px 8px;
    font-size: 13px;
    border-radius: 6px;
    background: transparent;
    color: #4b5563;
    cursor: pointer;
    transition: all 0.12s ease;
    font-family: inherit;
    line-height: 1;
    user-select: none;
}

.toolbar-icn-btn:hover[b-0um3x8yu0a] {
    background: #eef2ff;
    color: #4f46e5;
}

.toolbar-icn-btn:active[b-0um3x8yu0a] {
    background: #e0e7ff;
    color: #4338ca;
}

/* Quitar flecha del dropdown-toggle (emoji) */
.toolbar-icn-btn.dropdown-toggle[b-0um3x8yu0a]::after {
    display: none !important;
}

.toolbar-formato .vr[b-0um3x8yu0a] {
    opacity: 0.3;
    height: 20px;
    align-self: center;
}

/* ── Emoji Picker: dropdown ── */
.emoji-picker-dropdown[b-0um3x8yu0a] {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1050;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.10);
    padding: 10px;
    margin-top: 6px;
    min-width: 268px;
}

.emoji-grid[b-0um3x8yu0a] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 2px;
}

/* Reset completo del <button> para emojis — sin bordes negros */
.emoji-picker-dropdown .emoji-btn[b-0um3x8yu0a] {
    all: unset;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    font-size: 20px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.1s ease;
    line-height: 1;
}

.emoji-picker-dropdown .emoji-btn:hover[b-0um3x8yu0a] {
    background: #f3f4f6;
    transform: scale(1.25);
}

.emoji-picker-dropdown .emoji-btn:active[b-0um3x8yu0a] {
    transform: scale(0.9);
    background: #e5e7eb;
}
/* /Presentation/Components/Shared/Editor/EditorPlantillaBase.razor.rz.scp.css */
.editor-container[b-rds0svqv79] {
    height: calc(100vh - 148px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 400px;
}

/* --- Header superior --- */
.editor-header[b-rds0svqv79] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e2e4e9;
    gap: 16px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.editor-header-left .breadcrumb[b-rds0svqv79] {
    font-size: 13px;
}

.editor-header-right[b-rds0svqv79] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* --- Barra de título --- */
.editor-title-bar[b-rds0svqv79] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-bottom: 1px solid #e2e4e9;
    color: #1a1d23;
    flex-shrink: 0;
}

.editor-title-bar h4[b-rds0svqv79],
.editor-title-bar .fw-semibold[b-rds0svqv79],
.editor-title-bar small[b-rds0svqv79] {
    color: #1a1d23 !important;
}

/* Contenedor ul.nav-tabs */
.editor-tabs.nav-tabs[b-rds0svqv79] {
    border-bottom: none !important;
    display: flex;
    padding: 0 !important;
    margin: 0 !important;
    background: #e8eaed;
    list-style: none;
    gap: 0;
    position: relative;
    height: 44px;
    flex-shrink: 0;
    min-height: 44px;
}

/* Cada li.nav-item — reset total, primer hijo igual a los demás */
.editor-tabs .nav-item[b-rds0svqv79] {
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
    display: flex;
    align-items: stretch;
}

/* Forzar a que el primer nav-item sea IDÉNTICO a los demás */
.editor-tabs .nav-item:first-child[b-rds0svqv79] {
    margin: 0 !important;
    padding: 0 !important;
}

/* Neutralizar Bootstrap .nav-link dentro de nuestras tabs del editor.
   Ahora se usa <div> (no <button>) para evitar user-agent styles del botón.
   Altura explícita 44px para que todas las tabs tengan exactamente el mismo alto. */
.editor-tabs .nav-link[b-rds0svqv79] {
    display: flex !important;
    align-items: center !important;
    justify-content: center;
    gap: 7px;
    padding: 0 20px !important;
    margin: 0 !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    color: #5f6368 !important;
    border: none !important;
    background: transparent !important;
    transition: all 0.15s ease;
    cursor: pointer;
    white-space: nowrap;
    position: relative;
    height: 44px !important;
    text-decoration: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

.editor-tabs .nav-link:hover[b-rds0svqv79] {
    color: #202124 !important;
    background: rgba(0, 0, 0, 0.04) !important;
}

.editor-tabs .nav-link.active[b-rds0svqv79] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
    height: 44px !important;
    padding: 0 20px !important;
    margin: 0 !important;
}

/* Primer nav-link activo = idéntico a los demás nav-link activos */
.editor-tabs .nav-item:first-child .nav-link.active[b-rds0svqv79] {
    color: #1a73e8 !important;
    background: #ffffff !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
}

/* Línea delgada azul abajo del tab activo (tipo Material Design) */
.editor-tabs .nav-link.active[b-rds0svqv79]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 12px;
    right: 12px;
    height: 3px;
    background: #1a73e8;
    border-radius: 3px 3px 0 0;
}

/* Separador sutil entre tabs inactivos */
.editor-tabs .nav-item:not(:last-child) .nav-link:not(.active)[b-rds0svqv79]::after {
    content: '';
    position: absolute;
    right: 0;
    top: 10px;
    bottom: 10px;
    width: 1px;
    background: #dadce0;
}

.editor-tabs .nav-link i[b-rds0svqv79] {
    font-size: 14px;
    width: 16px;
    text-align: center;
    color: inherit;
}

.editor-tab-content[b-rds0svqv79] {
    background: #f8f9fa;
    border-top: none;
    flex: 1;
    min-height: 0;
    overflow: hidden;
    position: relative; /* para que los hijos con absolute se posicionen contra este */
}

/* Cada panel interno llena el 100% con position:absolute, inset:0.
   Esto NO depende de que el padre tenga "altura definida" en términos CSS;
   position:absolute siempre resuelve contra el padding-box del padre posicionado. */
.editor-tab-content > *[b-rds0svqv79] {
    position: absolute;
    inset: 0;
    overflow-y: auto;
}

/* === Layout 3 Columnas (pestaña Diseñador) === */
.editor-three-columns[b-rds0svqv79] {
    display: grid;
    grid-template-columns: 301px 1fr 360px;
    gap: 0;
    height: 100%;
    overflow: hidden;
}

/* El panel central del editor debe ocupar todo el espacio vertical */
.editor-panel-center[b-rds0svqv79] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: #fff;
}

.editor-canvas-container[b-rds0svqv79] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
}

/* --- Panel izquierdo: Variables + Componentes --- */
.editor-panel-left[b-rds0svqv79] {
    background: #fff;
    border-right: 1px solid #e2e4e9;
    overflow-y: auto;
    padding: 12px;
}

.editor-panel-left[b-rds0svqv79]::-webkit-scrollbar {
    width: 6px;
}

.editor-panel-left[b-rds0svqv79]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 3px;
}

/* --- Barra de estadísticas debajo del editor --- */
.editor-stats-bar[b-rds0svqv79] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 16px;
    background: #f8f9fa;
    border-top: 1px solid #e2e4e9;
    font-size: 12px;
}

.editor-stats-bar i[b-rds0svqv79] {
    margin-right: 4px;
}

/* --- Panel derecho: Vista previa + Detalles --- */
.editor-panel-right[b-rds0svqv79] {
    background: #fff;
    border-left: 1px solid #e2e4e9;
    overflow-y: auto;
    padding: 12px;
}

.editor-panel-right[b-rds0svqv79]::-webkit-scrollbar {
    width: 6px;
}

.editor-panel-right[b-rds0svqv79]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 3px;
}

/* --- Responsive --- */
@media (max-width: 1440px) {
    .editor-three-columns[b-rds0svqv79] {
        grid-template-columns: 260px 1fr 320px;
    }
}

@media (max-width: 1024px) {
    .editor-three-columns[b-rds0svqv79] {
        grid-template-columns: 240px 1fr;
    }
    .editor-panel-right[b-rds0svqv79] {
        display: none; /* Se muestra como bottom sheet o modal */
    }
}

/* --- Indicador de autosave --- */
.autosave-indicator[b-rds0svqv79] {
    position: fixed;
    bottom: 40px;
    left: 16px;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 11px;
    z-index: 1050;
    transition: all 0.3s ease;
}

.autosave-indicator.dirty[b-rds0svqv79] {
    background: #fffbeb;
    border: 1px solid #fde68a;
    color: #92400e;
}

.autosave-indicator.saved[b-rds0svqv79] {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #166534;
}

/* --- Atajos de teclado --- */
.keyboard-shortcuts-footer[b-rds0svqv79] {
    flex-shrink: 0;
}

.keyboard-shortcuts-footer kbd[b-rds0svqv79] {
    display: inline-block;
    padding: 2px 7px;
    font-size: 10.5px;
    font-family: 'SF Mono', 'Cascadia Code', 'Consolas', 'Courier New', monospace;
    font-weight: 600;
    background: #e8eaed;
    color: #1a1d23;
    border: 1px solid #c4c7cc;
    border-radius: 4px;
    box-shadow: 0 1px 0 #c4c7cc, inset 0 1px 0 rgba(255,255,255,0.6);
}

@media (max-width: 768px) {
    .editor-three-columns[b-rds0svqv79] {
        grid-template-columns: 1fr;
    }
    .editor-panel-left[b-rds0svqv79] {
        display: none; /* Se muestra como sidebar colapsable */
    }
    .editor-header[b-rds0svqv79] {
        flex-direction: column;
        align-items: stretch;
    }
    .editor-header-right[b-rds0svqv79] {
        justify-content: flex-end;
    }
}

/* --- Transiciones --- */
.editor-panel-left[b-rds0svqv79],
.editor-panel-center[b-rds0svqv79],
.editor-panel-right[b-rds0svqv79] {
    transition: all 0.3s ease;
}
/* /Presentation/Components/Shared/Editor/Panels/PanelBloques.razor.rz.scp.css */
/* PanelBloques.razor.css */
.panel-bloques[b-zf2i241ewf] {
    margin-bottom: 12px;
}

.panel-title[b-zf2i241ewf] {
    font-size: 13px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 8px;
}

.panel-title i[b-zf2i241ewf] {
    margin-right: 6px;
    color: #2563eb;
}

.bloques-grid[b-zf2i241ewf] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
}

/* Botón ghost: sin borde, sin fondo, solo ícono + label */
.bloque-item[b-zf2i241ewf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 8px 4px;
    min-height: 56px;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: #4b5563;
    cursor: pointer;
    transition: all 0.15s ease;
    font-size: 13px;
    font-family: inherit;
}

.bloque-item:hover[b-zf2i241ewf] {
    background: #f3f4f6;
    color: #1f2937;
    transform: translateY(-1px);
}

.bloque-item:active[b-zf2i241ewf] {
    background: #e5e7eb;
    transform: translateY(0);
}

.bloque-icono[b-zf2i241ewf] {
    font-size: 16px;
    margin-bottom: 2px;
    line-height: 1.3;
}

.bloque-label[b-zf2i241ewf] {
    font-size: 10px;
    line-height: 1.2;
    font-weight: 500;
}
/* /Presentation/Components/Shared/Editor/Panels/PanelDetallesPlantilla.razor.rz.scp.css */
/* PanelDetallesPlantilla.razor.css */
.panel-detalles[b-adzvzhe88c] {
    font-size: 13px;
}

.panel-title[b-adzvzhe88c] {
    font-size: 13px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 8px;
}

.panel-title i[b-adzvzhe88c] {
    margin-right: 6px;
    color: #2563eb;
}

.detalle-item[b-adzvzhe88c] {
    margin-bottom: 8px;
}

.detalle-label[b-adzvzhe88c] {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 2px;
}

.detalle-value[b-adzvzhe88c] {
    font-size: 13px;
    color: #1a1d23;
    word-break: break-all;
}

.text-monospace[b-adzvzhe88c] {
    font-family: 'Courier New', monospace;
    font-size: 12px;
    background: #f3f4f6;
    padding: 2px 6px;
    border-radius: 4px;
}
/* /Presentation/Components/Shared/Editor/Panels/PanelVistaPrevia.razor.rz.scp.css */
/* PanelVistaPrevia.razor.css */
.panel-vista-previa[b-r460ailhlt] {
    font-size: 13px;
}

.panel-title[b-r460ailhlt] {
    font-size: 13px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 8px;
}

.panel-title i[b-r460ailhlt] {
    margin-right: 6px;
    color: #2563eb;
}

/* Frame WhatsApp */
.whatsapp-frame[b-r460ailhlt] {
    background: #e5ddd5;
    border-radius: 12px;
    overflow: hidden;
    border: 2px solid #25D366;
    max-width: 320px;
    margin: 0 auto;
}

.wa-header[b-r460ailhlt] {
    background: #075E54 !important;
    color: #ffffff !important;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.wa-header *[b-r460ailhlt] {
    color: #ffffff !important;
}

.wa-back[b-r460ailhlt] {
    font-size: 16px;
    cursor: pointer;
}

.wa-header-info[b-r460ailhlt] {
    flex-grow: 1;
}

.wa-header-title[b-r460ailhlt] {
    font-size: 14px;
    font-weight: 600;
    display: block;
}

.wa-header-status[b-r460ailhlt] {
    font-size: 11px;
    opacity: 0.8;
}

.wa-menu[b-r460ailhlt] {
    cursor: pointer;
}

.wa-body[b-r460ailhlt] {
    min-height: 200px;
    padding: 12px;
    background-color: #e5ddd5 !important;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><rect width="100" height="100" fill="%23e5ddd5"/><circle cx="50" cy="50" r="50" fill="%23d4c9b8" opacity="0.2"/></svg>');
}

.wa-message[b-r460ailhlt] {
    display: flex;
    justify-content: flex-start;
}

.wa-bubble[b-r460ailhlt] {
    background: #ffffff !important;
    color: #1a1d23 !important;
    border-radius: 8px;
    padding: 8px 12px;
    max-width: 280px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
    font-size: 13px;
    line-height: 1.5;
}

.wa-bubble *[b-r460ailhlt] {
    color: #1a1d23 !important;
}

.wa-bubble-html[b-r460ailhlt] {
    word-wrap: break-word;
    white-space: normal;
}

.wa-bubble-html strong[b-r460ailhlt] {
    font-weight: 700;
}

.wa-bubble-html em[b-r460ailhlt] {
    font-style: italic;
}

.wa-bubble-html s[b-r460ailhlt] {
    text-decoration: line-through;
}

.wa-time[b-r460ailhlt] {
    font-size: 10px;
    color: #999;
    text-align: right;
    margin-top: 4px;
}

.wa-empty[b-r460ailhlt] {
    text-align: center;
    padding: 40px 20px;
}

.wa-indicators[b-r460ailhlt] {
    font-size: 11px;
    color: #6b7280;
}

.wa-indicators small[b-r460ailhlt],
.wa-indicators .text-success[b-r460ailhlt],
.wa-indicators .text-warning[b-r460ailhlt],
.wa-indicators .text-danger[b-r460ailhlt] {
    color: #6b7280 !important;
}

.wa-indicators .text-success[b-r460ailhlt] {
    color: #16a34a !important;
}

.wa-indicators .text-danger[b-r460ailhlt] {
    color: #dc2626 !important;
}

.wa-empty[b-r460ailhlt] {
    text-align: center;
    padding: 40px 20px;
    color: #6b7280 !important;
}

.wa-empty *[b-r460ailhlt] {
    color: #6b7280 !important;
}
/* /Presentation/Components/Shared/Editor/Tabs/TabVariables.razor.rz.scp.css */
/* TabVariables.razor.css */
/* Accordion de variables completamente personalizado (sin Bootstrap) */

.tab-variables[b-6cfhx34xvi] {
    color: #1f2937;
    height: 100%;
    overflow-y: auto;
    padding: 16px;
    /* Asegurar que el scroll siempre funcione */
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

/* Scrollbar sutil para el contenedor */
.tab-variables[b-6cfhx34xvi]::-webkit-scrollbar {
    width: 6px;
}

.tab-variables[b-6cfhx34xvi]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 3px;
}

.tab-variables[b-6cfhx34xvi]::-webkit-scrollbar-track {
    background: transparent;
}

.tab-variables h5[b-6cfhx34xvi] {
    color: #1f2937 !important;
}

/* Header fijo: no se mueve al hacer scroll */
.tab-variables-header[b-6cfhx34xvi] {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #f8f9fa;
    padding: 0 0 12px 0;
}

/* Contenedor del accordion */
.var-accordion[b-6cfhx34xvi] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-bottom: 2rem; /* aire al final para que no quede pegado */
}

/* Cada item del accordion */
.var-accordion-item[b-6cfhx34xvi] {
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #fff;
    /* SIN overflow:hidden — así el body expandido nunca se recorta */
}

/* Header clickeable */
.var-accordion-header[b-6cfhx34xvi] {
    display: flex;
    align-items: center;
    padding: 10px 14px;
    cursor: pointer;
    user-select: none;
    background: #f9fafb;
    transition: background 0.15s ease;
}

.var-accordion-header:hover[b-6cfhx34xvi] {
    background: #f3f4f6;
}

.var-accordion-header.expanded[b-6cfhx34xvi] {
    background: #eef2ff;
    border-bottom: 1px solid #e5e7eb;
}

/* Chevron animado */
.var-chevron[b-6cfhx34xvi] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    transition: transform 0.2s ease;
    color: #6b7280;
    flex-shrink: 0;
}

.var-chevron.open[b-6cfhx34xvi] {
    transform: rotate(90deg);
}

/* Cuerpo expandible */
.var-accordion-body[b-6cfhx34xvi] {
    padding: 8px;
    background: #fff;
}

/* Items de variable */
.variable-item[b-6cfhx34xvi] {
    transition: background 0.1s ease;
}

.variable-item:hover[b-6cfhx34xvi] {
    background: #f9fafb !important;
}

.variable-item.obligatoria[b-6cfhx34xvi] {
    border-left: 3px solid #f59e0b;
}

.variable-chip[b-6cfhx34xvi] {
    display: inline-block;
    font-family: 'Courier New', monospace;
    font-size: 0.8rem;
    color: #fff;
    padding: 2px 8px;
    border-radius: 4px;
    white-space: nowrap;
}

.categoria-chip[b-6cfhx34xvi] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* Botones de acción en items */
.variable-item .btn-link[b-6cfhx34xvi] {
    opacity: 0.4;
    transition: opacity 0.15s ease;
    text-decoration: none;
}

.variable-item:hover .btn-link[b-6cfhx34xvi] {
    opacity: 1;
}

.min-width-0[b-6cfhx34xvi] {
    min-width: 0;
}

/* Modal - scroll si hay muchos campos */
.modal-body[b-6cfhx34xvi] {
    max-height: 70vh;
    overflow-y: auto;
}

/* Texto de ayuda en formulario */
.form-text[b-6cfhx34xvi] {
    font-size: 0.75rem;
    color: #6b7280;
}
/* /Presentation/Components/Shared/Editor/Variables/ExploradorVariables.razor.rz.scp.css */
/* ExploradorVariables.razor.css */
.explorador-variables[b-8rznva4o9l] {
    font-size: 12px;
}

.panel-title[b-8rznva4o9l] {
    font-size: 13px;
    font-weight: 600;
    color: #374151;
}

.variable-grupo[b-8rznva4o9l] {
    border-radius: 6px;
}

.grupo-indicador[b-8rznva4o9l] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.variable-item[b-8rznva4o9l] {
    cursor: pointer;
    transition: background 0.15s ease;
}

.variable-item:hover[b-8rznva4o9l] {
    background: #f0f4ff;
}

.variable-chip-sm[b-8rznva4o9l] {
    display: inline-block;
    padding: 2px 6px;
    border-radius: 4px;
    color: white;
    font-size: 10px;
    font-family: 'Courier New', monospace;
    white-space: nowrap;
    flex-shrink: 0;
}

.cursor-pointer[b-8rznva4o9l] {
    cursor: pointer;
}

@keyframes fadeIn-b-8rznva4o9l {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

.variable-items[b-8rznva4o9l] {
    animation: fadeIn-b-8rznva4o9l 0.2s ease;
}
/* /Presentation/Components/Shared/Editor/Versionado/HistorialVersiones.razor.rz.scp.css */
.version-timeline[b-3ejcr3k0pr] {
    padding: 4px 0;
    /* La altura y scroll los maneja el contenedor padre .editor-tab-content > * */
}

/* Scrollbar fina */
.version-timeline[b-3ejcr3k0pr]::-webkit-scrollbar {
    width: 5px;
}
.version-timeline[b-3ejcr3k0pr]::-webkit-scrollbar-track {
    background: transparent;
}
.version-timeline[b-3ejcr3k0pr]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 3px;
}

.version-item[b-3ejcr3k0pr] {
    position: relative;
    padding-bottom: 6px;
    padding-left: 4px;
}

.version-item[b-3ejcr3k0pr]::before {
    content: '';
    position: absolute;
    left: 15px;
    top: 22px;
    bottom: 0;
    width: 2px;
    background: #e5e7eb;
}

.version-item:last-child[b-3ejcr3k0pr]::before {
    display: none;
}

.version-dot[b-3ejcr3k0pr] {
    width: 28px;
    text-align: center;
    flex-shrink: 0;
    padding-top: 1px;
}

.dot-activa i[b-3ejcr3k0pr] {
    color: #16a34a;
    font-size: 15px;
}

.dot-reemplazada i[b-3ejcr3k0pr] {
    color: #9ca3af;
    font-size: 12px;
}

.dot-borrador i[b-3ejcr3k0pr] {
    color: #f59e0b;
    font-size: 14px;
}

.version-content[b-3ejcr3k0pr] {
    background: #f9fafb;
    border-radius: 6px;
    padding: 5px 10px;
    border: 1px solid #f3f4f6;
}

.version-item.activa .version-content[b-3ejcr3k0pr] {
    background: #f0fdf4;
    border-color: #bbf7d0;
}

.version-number[b-3ejcr3k0pr] {
    font-size: 13px;
    color: #1f2937;
}

.version-content p[b-3ejcr3k0pr] {
    font-size: 12px;
    line-height: 1.3;
    margin-bottom: 2px !important;
    color: #6b7280;
}

.version-content small[b-3ejcr3k0pr] {
    font-size: 11px;
}

.version-actions[b-3ejcr3k0pr] {
    margin-top: 3px;
    display: flex;
    gap: 3px;
    flex-wrap: wrap;
}

.version-actions .btn[b-3ejcr3k0pr] {
    font-size: 11px;
    padding: 1px 6px;
    line-height: 1.4;
}

.version-actions .btn i[b-3ejcr3k0pr] {
    font-size: 10px;
    margin-right: 2px;
}

/* Badges más pequeños */
.version-content .badge[b-3ejcr3k0pr] {
    font-size: 10px;
    padding: 1px 5px;
    line-height: 1.3;
}
/* /Presentation/Components/Shared/FaqSection.razor.rz.scp.css */
.faq-section[b-64tcczbvfl] {
    grid-column: 2;
    margin: 2.5rem auto 3.5rem 0;
    max-width: 1120px;
}

.faq-layout[b-64tcczbvfl] {
    display: grid;
    grid-template-columns: minmax(260px, 0.9fr) minmax(0, 1.4fr);
    gap: 2.25rem;
    align-items: flex-start;
    position: relative;
}

.faq-intro[b-64tcczbvfl] {
    position: relative;
    z-index: 1;
}

.faq-intro h2[b-64tcczbvfl] {
    font-size: 1.9rem;
    margin-bottom: 0.75rem;
    background: linear-gradient(90deg, #38bdf8, #6366f1);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.faq-intro p[b-64tcczbvfl] {
    margin: 0;
    color: #9ca3af;
    max-width: 420px;
}

.faq-list[b-64tcczbvfl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 1.25rem;
    position: relative;
    z-index: 1;
}

.faq-loading[b-64tcczbvfl],
.faq-empty[b-64tcczbvfl] {
    grid-column: 1 / -1;
    min-height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #9ca3af;
}

.faq-item[b-64tcczbvfl] {
    border-radius: 999px;
    background: radial-gradient(circle at 10% 0, rgba(15,23,42,0.98), rgba(15,23,42,0.9));
    border: 1px solid rgba(148, 163, 184, 0.5);
    box-shadow: 0 18px 40px rgba(15,23,42,0.9);
    overflow: hidden;
    transition:
        transform 180ms ease-out,
        box-shadow 200ms ease-out,
        border-color 200ms ease-out,
        border-radius 200ms ease-out;
}

.faq-item.expanded[b-64tcczbvfl] {
    border-radius: 1.25rem;
    box-shadow: 0 26px 60px rgba(15,23,42,0.95);
    border-color: rgba(59,130,246,0.9);
}

.faq-item-button[b-64tcczbvfl] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1.2rem;
    background: transparent;
    border: none;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.faq-list:has(.faq-item.expanded) .faq-item[b-64tcczbvfl] {
    border-radius: 1.25rem;
}

.faq-list:has(.faq-item.expanded) .faq-item-button[b-64tcczbvfl] {
    align-items: flex-start;
}

.faq-item-button:hover[b-64tcczbvfl] {
    transform: translateY(-1px);
}

.faq-question[b-64tcczbvfl] {
    font-size: 0.95rem;
    font-weight: 500;
    color: #e5e7eb;
    padding-right: 0.75rem;
}

.faq-toggle-icon[b-64tcczbvfl] {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: radial-gradient(circle at 30% 0, #38bdf8, #2563eb);
    color: #0b1220;
    box-shadow: 0 10px 24px rgba(37, 99, 235, 0.85);
    flex-shrink: 0;
}

.faq-answer[b-64tcczbvfl] {
    padding: 0 1.2rem 1rem 1.2rem;
    font-size: 0.9rem;
    color: #e5e7eb;
    border-top: 1px solid rgba(51, 65, 85, 0.9);
}

.faq-popover[b-64tcczbvfl] {
    position: absolute;
    right: 0;
    top: -1.5rem;
    transform: none;
    min-width: 260px;
    max-width: 320px;
    padding: 14px 18px;
    background: radial-gradient(circle at top left, rgba(46, 168, 255, 0.2), rgba(0, 10, 32, 0.98));
    border-radius: 14px;
    border: 1px solid rgba(151, 206, 255, 0.7);
    box-shadow: 0 22px 40px rgba(0, 0, 0, 0.7), 0 0 30px rgba(46, 168, 255, 0.5);
    color: #eaf2f9;
    font-size: 0.8rem;
    line-height: 1.5;
    z-index: 5;
}

.faq-popover-title[b-64tcczbvfl] {
    font-weight: 600;
    margin-bottom: 4px;
    font-size: 0.85rem;
}

.faq-popover-body[b-64tcczbvfl] {
    opacity: 0.95;
}

@media (max-width: 1024px) {
    .faq-section[b-64tcczbvfl] {
        margin-left: auto;
        margin-right: auto;
    }

    .faq-layout[b-64tcczbvfl] {
        grid-template-columns: minmax(0, 1fr);
    }

    .faq-list[b-64tcczbvfl] {
        grid-template-columns: minmax(0, 1fr);
    }

    .faq-popover[b-64tcczbvfl] {
        position: static;
        transform: none;
        margin-top: 1rem;
        grid-column: 1 / -1;
    }
}

@media (max-width: 768px) {
    .faq-section[b-64tcczbvfl] {
        grid-column: 1;
        margin: 1.5rem auto 1.8rem auto;
        padding-inline: 0.5rem;
    }

    .faq-intro h2[b-64tcczbvfl] {
        font-size: 1.6rem;
    }

    .faq-intro p[b-64tcczbvfl] {
        max-width: none;
        font-size: 0.94rem;
    }

    .faq-question[b-64tcczbvfl] {
        font-size: 0.92rem;
    }

    .faq-answer[b-64tcczbvfl] {
        font-size: 0.86rem;
    }

    .faq-item-button[b-64tcczbvfl] {
        padding: 0.85rem 1rem;
    }
}
/* /Presentation/Components/Shared/FavoritesPanel.razor.rz.scp.css */
/* Panel de Favoritos — scoped styles */
.favorites-panel[b-n23wyvia3r] {
    padding: 4px 16px;
    border-bottom: 1px solid #e0e0e0;
    background: #f8f9fa;
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 34px;
}

.favorites-panel .fav-title[b-n23wyvia3r] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #888;
    white-space: nowrap;
    flex-shrink: 0;
}

.fav-cards-wrapper[b-n23wyvia3r] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 4px;
    overflow: hidden;
}

.fav-scroll-btn[b-n23wyvia3r] {
    flex-shrink: 0;
    background: none;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 2px 6px;
    font-size: 0.65rem;
    color: #888;
    cursor: pointer;
    opacity: 0.5;
    transition: opacity 0.15s;
    line-height: 1.2;
}
.fav-scroll-btn:hover[b-n23wyvia3r] { opacity: 1; background: #fff; }

.fav-cards-container[b-n23wyvia3r] {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    flex: 1;
    scroll-behavior: smooth;
    -ms-overflow-style: none;
    scrollbar-width: none;
    padding: 2px 0;
}
.fav-cards-container[b-n23wyvia3r]::-webkit-scrollbar { display: none; }

.fav-card[b-n23wyvia3r] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 2px 10px;
    border-radius: 6px;
    background: #fff;
    border: 1px solid #dee2e6;
    cursor: pointer;
    white-space: nowrap;
    position: relative;
    transition: all 0.15s ease;
    font-size: 0.8rem;
    flex-shrink: 0;
    user-select: none;
}
.fav-card:hover[b-n23wyvia3r] {
    background: #e9ecef;
    border-color: #0D6EFD;
}

.fav-card .fav-card-icon[b-n23wyvia3r] {
    font-size: 0.85rem;
    color: #0D6EFD;
    flex-shrink: 0;
}

.fav-card .fav-card-text[b-n23wyvia3r] {
    max-width: 90px;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #333;
}

.fav-card .fav-remove[b-n23wyvia3r],
.fav-card .fav-move[b-n23wyvia3r] {
    display: none;
    background: none;
    border: none;
    padding: 0 2px;
    font-size: 0.5rem;
    color: #888;
    cursor: pointer;
    line-height: 1;
}
.fav-card:hover .fav-remove[b-n23wyvia3r],
.fav-card:hover .fav-move[b-n23wyvia3r] {
    display: inline-block;
}

.fav-card .fav-move-group[b-n23wyvia3r] {
    display: none;
    gap: 1px;
    margin-right: 2px;
}
.fav-card:hover .fav-move-group[b-n23wyvia3r] {
    display: inline-flex;
}

.fav-card .fav-remove:hover[b-n23wyvia3r] { color: #dc3545; }
.fav-card .fav-move:hover[b-n23wyvia3r] { color: #0D6EFD; }

/* Empty state */
.favorites-panel.fav-empty[b-n23wyvia3r] {
    font-size: 0.82rem;
    color: #999;
    padding: 4px 16px;
    gap: 4px;
}
/* /Presentation/Components/Shared/OfflineSync.razor.rz.scp.css */
@keyframes blink-b-5tac20hnrb {
    0% { opacity: 1; }
    50% { opacity: 0; }
    100% { opacity: 1; }
}
.blinking[b-5tac20hnrb] {
    animation: blink-b-5tac20hnrb 1s infinite;
}
/* /Presentation/Components/Shared/OtpEvidence.razor.rz.scp.css */
/* Estilos aislados para el componente OtpEvidence (mecanismo OTP) */

.otp-section[b-2r9b28q42c] {
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
}

.otp-actions[b-2r9b28q42c] {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  position: relative;
}

.otp-actions .btn[b-2r9b28q42c] {
  width: 100%;
}

.otp-actions span[b-2r9b28q42c] {
  color: #666;
}

.otp-actions .btn.btn-primary[b-2r9b28q42c] {
  color: #fff !important;
}

.otp-actions .btn.btn-primary i[b-2r9b28q42c],
.otp-actions .btn.btn-primary span[b-2r9b28q42c] {
  color: #fff !important;
}

.otp-ttl[b-2r9b28q42c] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.ttl-info-button[b-2r9b28q42c] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  color: #666;
  padding: 0 4px;
}

.ttl-info-button:focus[b-2r9b28q42c] {
  outline: 2px solid #80bdff;
  outline-offset: 2px;
}

.ttl-popover[b-2r9b28q42c] {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  background: #fff;
  border: 1px solid #ddd;
  box-shadow: 0 6px 16px rgba(0,0,0,0.15);
  border-radius: 8px;
  padding: 10px;
  width: min(320px, 90vw);
  z-index: 1000;
}

.ttl-popover-header[b-2r9b28q42c] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
  font-weight: 600;
}

.ttl-popover-close[b-2r9b28q42c] {
  background: transparent;
  border: none;
  color: #666;
}

.ttl-popover-body[b-2r9b28q42c] {
  color: #555;
  font-size: 0.95rem;
}

.ttl-overlay[b-2r9b28q42c] {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.2);
  z-index: 900;
}

.otp-display[b-2r9b28q42c] {
  margin-top: 0;
}

.otp-info[b-2r9b28q42c] {
  font-size: 1.1rem;
}

.otp-code-row[b-2r9b28q42c] {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}

.otp-code-label[b-2r9b28q42c] {
  font-weight: 600;
  color: #333;
}

.otp-display strong[b-2r9b28q42c] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  font-weight: 800;
  font-size: clamp(1.3rem, 2.6vw, 1.6rem);
  letter-spacing: 0.12em;
  color: #fff;
  background: linear-gradient(135deg, #052e6d 0%, #3260bd 50%, #052e6d 100%);
  border: 1px solid rgba(255,255,255,0.25);
  border-radius: 6px;
  padding: 6px 12px;
  box-shadow: 0 4px 12px rgba(13,110,253,0.35);
  text-shadow: 0 1px 1px rgba(0,0,0,0.25);
  margin: 0 auto !important;
}

.otp-expiration[b-2r9b28q42c] {
  display: block;
  margin-left: 0;
  margin-top: 6px;
  color: #888;
  font-size: 0.8rem;
}

.evidence-form[b-2r9b28q42c] {
  margin-top: 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.evidence-hint[b-2r9b28q42c] {
  color: #6b7280;
  font-size: 0.8rem;
}

.evidence-actions[b-2r9b28q42c] {
  display: flex;
  gap: 10px;
  align-items: center;
}

/* Botón outline-primary para descarga */
.otp-download-btn[b-2r9b28q42c] {
  width: 100%;
  padding: 0.55rem 1rem;
  font-size: 0.85rem;
  font-weight: 600;
  border-radius: 8px;
  border-width: 2px;
}

.otp-download-btn:hover[b-2r9b28q42c] {
  background-color: #0d6efd;
  color: #fff !important;
}

.otp-download-btn i[b-2r9b28q42c] {
  font-size: 0.9rem;
}

.otp-actions .btn.btn-primary:disabled i[b-2r9b28q42c],
.otp-actions .btn.btn-primary:disabled span[b-2r9b28q42c] {
  color: #fff !important;
}

.otp-ttl .ttl-info-button i[b-2r9b28q42c] {
  color: #28a745 !important;
}

.message-success[b-2r9b28q42c] {
  color: #059669;
  font-size: 0.8rem;
  font-weight: 500;
  line-height: 1.45;
  padding: 0.25rem 0.25rem;
  word-break: break-word;
}

.message-error[b-2r9b28q42c] {
  color: #dc3545;
  font-size: 0.8rem;
}

@media (max-width: 576px) {
  .otp-actions[b-2r9b28q42c] {
    flex-direction: column;
    align-items: stretch;
  }

  .otp-actions .btn[b-2r9b28q42c] {
    width: 100%;
  }

  .otp-display .otp-info[b-2r9b28q42c] {
    font-size: 1rem;
  }

  .otp-display strong[b-2r9b28q42c] {
    font-size: clamp(1.2rem, 4vw, 1.5rem);
  }

  .evidence-hint[b-2r9b28q42c] {
    font-size: 0.75rem;
  }
}
/* /Presentation/Components/Shared/PopulationGroupsSelect.razor.rz.scp.css */
.pop-group-select[b-cyoec2gymy] {
    position: relative;
    width: 100%;
}

/* ─── Tags ─── */

.pop-group-tags[b-cyoec2gymy] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 6px;
}

.pop-group-tag[b-cyoec2gymy] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    font-size: 0.72rem;
    font-weight: 500;
    background: #e8f4fd;
    color: #1a5a8c;
    border: 1px solid #c5e1f5;
    border-radius: 4px;
    line-height: 1.5;
    transition: background 0.15s;
}

.pop-group-tag:hover[b-cyoec2gymy] {
    background: #d0eafc;
}

.pop-group-tag-remove[b-cyoec2gymy] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0;
    width: 14px;
    height: 14px;
    font-size: 0.5rem;
    line-height: 1;
    border: none;
    background: transparent;
    color: #6c8aaa;
    cursor: pointer;
    border-radius: 50%;
    transition: all 0.15s;
}

.pop-group-tag-remove:hover[b-cyoec2gymy] {
    background: #c81e1e;
    color: #fff;
}

/* ─── Input wrapper + search ─── */

.pop-group-input-wrapper[b-cyoec2gymy] {
    position: relative;
}

.pop-group-search-icon[b-cyoec2gymy] {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.72rem;
    color: #8a9aa8;
    pointer-events: none;
    z-index: 1;
}

.pop-group-search[b-cyoec2gymy] {
    width: 100%;
    padding: 6px 10px 6px 28px;
    font-size: 0.78rem;
    line-height: 1.5;
    color: #212529;
    background: #fff;
    border: 1px solid #ced4da;
    border-radius: 4px;
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.pop-group-search:focus[b-cyoec2gymy] {
    border-color: #86b7fe;
    box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.15);
}

.pop-group-search[b-cyoec2gymy]::placeholder {
    color: #9ba6b0;
    font-size: 0.75rem;
}

/* ─── Dropdown ─── */

.pop-group-dropdown[b-cyoec2gymy] {
    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    right: 0;
    max-height: 240px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid #d4dce4;
    border-radius: 4px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    z-index: 1050;
}

.pop-group-dropdown-item[b-cyoec2gymy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 7px 12px;
    font-size: 0.78rem;
    color: #212529;
    cursor: pointer;
    transition: background 0.1s;
    border-bottom: 1px solid #f0f2f4;
}

.pop-group-dropdown-item:last-child[b-cyoec2gymy] {
    border-bottom: none;
}

.pop-group-dropdown-item:hover[b-cyoec2gymy] {
    background: #f0f7ff;
}

.pop-group-dropdown-item-selected[b-cyoec2gymy] {
    background: #f0f7ff;
    font-weight: 500;
}

.pop-group-dropdown-item-text[b-cyoec2gymy] {
    flex: 1;
}

.pop-group-dropdown-item-check[b-cyoec2gymy] {
    font-size: 0.7rem;
    margin-left: 8px;
}

.pop-group-dropdown-item-add[b-cyoec2gymy] {
    font-size: 0.65rem;
    color: #8a9aa8;
    margin-left: 8px;
}

.pop-group-dropdown-item:hover .pop-group-dropdown-item-add[b-cyoec2gymy] {
    color: #0d6efd;
}

.pop-group-dropdown-empty[b-cyoec2gymy] {
    padding: 16px 12px;
    text-align: center;
    font-size: 0.75rem;
    color: #7a8a98;
}

/* ─── Contador ─── */

.pop-group-counter[b-cyoec2gymy] {
    margin-top: 4px;
    font-size: 0.68rem;
    color: #6c8aaa;
    font-weight: 500;
}
/* /Presentation/Components/Shared/SearchableSelect.razor.rz.scp.css */
.searchable-select[b-so4aiyheb2] {
    position: relative;
    width: 100%;
}

.searchable-select-input[b-so4aiyheb2] {
    font-size: 0.78rem;
    padding: 4px 28px 4px 10px;
    height: 28px;
    border-color: #d1d5db;
    border-radius: 3px;
}

.searchable-select-input:focus[b-so4aiyheb2] {
    border-color: #1a73e8;
    box-shadow: 0 0 0 2px rgba(26,115,232,0.15);
}

.searchable-select-clear[b-so4aiyheb2] {
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    padding: 2px 4px;
    font-size: 0.6rem;
    line-height: 1;
    z-index: 2;
}

.searchable-select-clear:hover[b-so4aiyheb2] {
    color: #dc2626;
}

.searchable-select-dropdown[b-so4aiyheb2] {
    position: absolute;
    z-index: 1060;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
    max-height: 200px;
    overflow-y: auto;
    margin-top: 2px;
}

.searchable-select-option[b-so4aiyheb2] {
    display: flex;
    align-items: center;
    padding: 6px 10px;
    font-size: 0.78rem;
    color: #374151;
    cursor: pointer;
    transition: background 0.1s;
    border-bottom: 1px solid #f3f4f6;
}

.searchable-select-option:last-child[b-so4aiyheb2] {
    border-bottom: none;
}

.searchable-select-option:hover[b-so4aiyheb2] {
    background: #f3f4f6;
}

.searchable-select-option.active[b-so4aiyheb2] {
    background: #e8f0fe;
    color: #1a73e8;
    font-weight: 500;
}

.searchable-select-empty[b-so4aiyheb2] {
    text-align: center;
    padding: 12px 10px;
    color: #9ca3af;
    font-size: 0.75rem;
    font-style: italic;
}

.searchable-select-dropdown[b-so4aiyheb2]::-webkit-scrollbar {
    width: 4px;
}

.searchable-select-dropdown[b-so4aiyheb2]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 2px;
}
/* /Presentation/Components/Shared/SplashLoading.razor.rz.scp.css */
/* ── Overlay ── */
.splash-overlay[b-hweckj1oni] {
    position: fixed;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: radial-gradient(ellipse at 50% 35%, #001c3d 0%, #000b1f 45%, #000 100%);
    z-index: 10000;
    overflow: hidden;
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
}

/* ── Animated background ── */
.splash-bg[b-hweckj1oni] {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 30% 20%, rgba(46, 168, 255, 0.07) 0%, transparent 50%),
        radial-gradient(ellipse at 70% 80%, rgba(0, 212, 255, 0.04) 0%, transparent 50%);
    animation: bgBreath-b-hweckj1oni 6s ease-in-out infinite;
}

.splash-bg-orb[b-hweckj1oni] {
    position: absolute;
    width: 500px;
    height: 500px;
    top: 35%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: radial-gradient(circle, rgba(0, 212, 255, 0.04) 0%, transparent 65%);
    animation: orbFloat-b-hweckj1oni 8s ease-in-out infinite;
}

@keyframes bgBreath-b-hweckj1oni {
    0%, 100% { opacity: 0.5; }
    50% { opacity: 1; }
}

@keyframes orbFloat-b-hweckj1oni {
    0%, 100% { transform: translate(-50%, -50%) scale(1); }
    50% { transform: translate(-50%, -55%) scale(1.15); }
}

/* ── Floating Particles ── */
.particles-container[b-hweckj1oni] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
}

.particle[b-hweckj1oni] {
    position: absolute;
    bottom: -8px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(46, 168, 255, 0.5), rgba(0, 212, 255, 0.2));
    animation: particleRise-b-hweckj1oni linear infinite;
    will-change: transform, opacity;
}

@keyframes particleRise-b-hweckj1oni {
    0% {
        transform: translateY(0) scale(1);
        opacity: 0;
    }
    8% {
        opacity: var(--p-opacity, 0.4);
    }
    85% {
        opacity: var(--p-opacity, 0.2);
    }
    100% {
        transform: translateY(-105vh) scale(0.2);
        opacity: 0;
    }
}

/* ── Center Content ── */
.splash-center[b-hweckj1oni] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 28px;
    z-index: 10;
    animation: fadeInUp-b-hweckj1oni 0.8s ease-out;
}

@keyframes fadeInUp-b-hweckj1oni {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ════════════════════════════════════════════
   THE PROTAGONIST — Medical Cross Universe
   ════════════════════════════════════════════ */

.cross-universe[b-hweckj1oni] {
    position: relative;
    width: 220px;
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ── Ring ── */
.ring-svg[b-hweckj1oni] {
    position: absolute;
    width: 100%;
    height: 100%;
    animation: ringSpin-b-hweckj1oni 5s linear infinite;
    filter: drop-shadow(0 0 20px rgba(46, 168, 255, 0.15));
}

.ring-svg-inner[b-hweckj1oni] {
    animation: ringSpinInner-b-hweckj1oni 7s linear infinite;
}

@keyframes ringSpin-b-hweckj1oni {
    to { transform: rotate(360deg); }
}

@keyframes ringSpinInner-b-hweckj1oni {
    to { transform: rotate(-360deg); }
}

.ring-arc[b-hweckj1oni] {
    animation: ringDash-b-hweckj1oni 2.4s ease-in-out infinite;
    transform-origin: center;
}

@keyframes ringDash-b-hweckj1oni {
    0% {
        stroke-dashoffset: 723;
        opacity: 0.3;
    }
    50% {
        stroke-dashoffset: 120;
        opacity: 1;
    }
    100% {
        stroke-dashoffset: 723;
        opacity: 0.3;
    }
}

.ring-dash-inner[b-hweckj1oni] {
    animation: ringDashDrift-b-hweckj1oni 4s linear infinite;
}

@keyframes ringDashDrift-b-hweckj1oni {
    to { stroke-dashoffset: -200; }
}

/* ── THE CROSS (Protagonist) ── */
.cross-svg[b-hweckj1oni] {
    width: 100px;
    height: 100px;
    position: relative;
    z-index: 2;
    animation:
        crossLevitate-b-hweckj1oni 4s ease-in-out infinite,
        crossEntrance-b-hweckj1oni 0.8s cubic-bezier(0.22, 0.8, 0.25, 1) forwards;
    filter: drop-shadow(0 0 30px rgba(46, 168, 255, 0.4));
}

@keyframes crossEntrance-b-hweckj1oni {
    from {
        opacity: 0;
        transform: scale(0.5) rotate(-180deg);
    }
    to {
        opacity: 1;
        transform: scale(1) rotate(0deg);
    }
}

@keyframes crossLevitate-b-hweckj1oni {
    0%, 100% {
        transform: translateY(0);
        filter: drop-shadow(0 0 25px rgba(46, 168, 255, 0.3));
    }
    50% {
        transform: translateY(-8px);
        filter: drop-shadow(0 0 45px rgba(0, 212, 255, 0.6));
    }
}

.cross-bar[b-hweckj1oni] {
    transition: all 0.3s ease;
}

/* Inner shine animation on the cross */
.cross-svg .cross-vert:last-child[b-hweckj1oni],
.cross-svg .cross-horiz:last-child[b-hweckj1oni] {
    animation: crossShine-b-hweckj1oni 3s ease-in-out infinite;
}

@keyframes crossShine-b-hweckj1oni {
    0%, 100% { opacity: 0.06; }
    50% { opacity: 0.15; }
}

/* ── Loading Message ── */
.splash-message[b-hweckj1oni] {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-top: 5px;
}

.msg-text[b-hweckj1oni] {
    color: #e0ecfa;
    font-size: 23px;
    font-weight: 300;
    letter-spacing: 3px;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4);
}

.msg-dots[b-hweckj1oni] {
    display: inline-flex;
    gap: 4px;
    margin-left: 3px;
    padding-bottom: 3px;
}

.dot[b-hweckj1oni] {
    width: 6px;
    height: 6px;
    background: linear-gradient(135deg, #2ea8ff, #00d4ff);
    border-radius: 50%;
    animation: dotBounce-b-hweckj1oni 1.5s ease-in-out infinite;
}

.dot:nth-child(1)[b-hweckj1oni] { animation-delay: 0s; }
.dot:nth-child(2)[b-hweckj1oni] { animation-delay: 0.25s; }
.dot:nth-child(3)[b-hweckj1oni] { animation-delay: 0.5s; }

@keyframes dotBounce-b-hweckj1oni {
    0%, 80%, 100% {
        opacity: 0.15;
        transform: scale(0.7);
    }
    40% {
        opacity: 1;
        transform: scale(1.1);
    }
}

/* ── Status Sub-message ── */
.splash-status[b-hweckj1oni] {
    color: rgba(224, 236, 250, 0.45);
    font-size: 13px;
    font-weight: 300;
    letter-spacing: 1.5px;
    margin-top: -12px;
    min-height: 20px;
    opacity: 0;
    transition: opacity 0.6s ease;
}

.splash-status.visible[b-hweckj1oni] {
    opacity: 1;
}

/* ── Footer ── */
.splash-footer[b-hweckj1oni] {
    position: absolute;
    bottom: 32px;
    display: flex;
    align-items: center;
    gap: 14px;
    z-index: 10;
    animation: footerFade-b-hweckj1oni 1.5s ease-out 0.5s both;
}

@keyframes footerFade-b-hweckj1oni {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.footer-line[b-hweckj1oni] {
    width: 50px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(46, 168, 255, 0.25), transparent);
}

.footer-text[b-hweckj1oni] {
    color: rgba(224, 236, 250, 0.25);
    font-size: 12px;
    letter-spacing: 4px;
    font-weight: 400;
    text-transform: uppercase;
}

.footer-version[b-hweckj1oni] {
    color: rgba(224, 236, 250, 0.15);
    font-size: 11px;
    letter-spacing: 2px;
    font-weight: 300;
}

/* ── Responsive ── */
@media (max-width: 768px) {
    .cross-universe[b-hweckj1oni] {
        width: 170px;
        height: 170px;
    }

    .cross-svg[b-hweckj1oni] {
        width: 78px;
        height: 78px;
    }

    .msg-text[b-hweckj1oni] {
        font-size: 18px;
        letter-spacing: 2px;
    }

    .splash-status[b-hweckj1oni] {
        font-size: 12px;
    }

    .splash-bg-orb[b-hweckj1oni] {
        width: 300px;
        height: 300px;
    }

    .particle[b-hweckj1oni] {
        display: none;
    }
}

@media (max-width: 480px) {
    .cross-universe[b-hweckj1oni] {
        width: 140px;
        height: 140px;
    }

    .cross-svg[b-hweckj1oni] {
        width: 65px;
        height: 65px;
    }

    .msg-text[b-hweckj1oni] {
        font-size: 16px;
        letter-spacing: 1.5px;
    }

    .splash-center[b-hweckj1oni] {
        gap: 22px;
    }

    .splash-footer[b-hweckj1oni] {
        bottom: 20px;
    }
}
/* /Presentation/Components/Shared/SurosHeroIntro.razor.rz.scp.css */
@font-face {
    font-family: Raleway-Bold;
    src: url('/fonts/raleway/phylactere.ttf');
}

.header-caption[b-73qr96g4oi] {
    position: fixed;
    top: 10%;
    left: 20%;
    color: #eaf2f9;
    font-size: clamp(20px, 2.2vw + 8px, 32px);
    line-height: 1.25;
    letter-spacing: 0.3px;
    max-width: min(760px, 46vw);
    z-index: 10;
    padding: 12px 20px;
    border-radius: 10px;
    text-shadow: 0 2px 6px rgba(0, 0, 0, .35);
    background: linear-gradient(90deg, rgba(46, 168, 255, .5), rgba(0, 43, 77, .18));
    font-family: 'Raleway', sans-serif;
}

.bg-watermark[b-73qr96g4oi] {
    position: fixed;
    top: 50%;
    left: 48%;
    transform: translate(-50%, -50%);
    z-index: 0;
    opacity: 0.60;
    pointer-events: none;
    width: 60vw;
    max-width: 600px;
}

.bg-watermark-clinica[b-73qr96g4oi] {
    position: fixed;
    top: 81%;
    left: 61%;
    transform: translate(-50%, -50%);
    z-index: 0;
    opacity: 0.40;
    pointer-events: none;
    width: 20vw;
    max-width: 200px;
}

.bg-watermark-equipo[b-73qr96g4oi] {
    position: fixed;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    z-index: 0;
    opacity: 0.32;
    pointer-events: none;
    height: 82vh;
    max-height: 780px;
    width: auto;
}

.hero-suros[b-73qr96g4oi] {
    position: fixed;
    inset: 0;
    background: radial-gradient(ellipse at 30% 50%, #001a33 0%, #000714 45%, #000 80%);
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    z-index: 9999;
    opacity: 1;
    transition: opacity 700ms ease;
}

.hero-suros.hidden[b-73qr96g4oi] {
    opacity: 0;
    pointer-events: none;
}

.hero-stage[b-73qr96g4oi] {
    position: relative;
    width: min(1100px, 92vw);
    height: min(500px, 52vh);
}

.signal-svg[b-73qr96g4oi] {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    z-index: 1;
    filter: drop-shadow(0 0 6px #2ea8ff) drop-shadow(0 0 16px rgba(46, 168, 255, .35));
}

.signal-svg svg[b-73qr96g4oi] {
    width: 100%;
    height: 120px;
}

.text-and-check[b-73qr96g4oi] {
    position: absolute;
    left: 45%;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: min(24px, 3vw);
    z-index: 2;
}

.suros-text[b-73qr96g4oi] {
    color: #fff;
    font-weight: 600;
    letter-spacing: .5px;
    font-size: 13em;
    display: inline-flex;
    align-items: start;
    margin-top: -20px;
    font-family: 'Raleway-Bold', 'Raleway', sans-serif;
}

.suros-text .su[b-73qr96g4oi],
.suros-text .sur[b-73qr96g4oi] {
    opacity: 0;
    animation: fadeIn-b-73qr96g4oi 700ms ease forwards;
    animation-delay: 2.7s;
    margin-left: 0 !important;
}

.suros-text .u[b-73qr96g4oi] {
    opacity: 0;
    animation: fadeIn-b-73qr96g4oi 700ms ease forwards;
    animation-delay: 3.1s;
    margin-left: 0 !important;
}

.suros-text .r[b-73qr96g4oi] {
    opacity: 0;
    animation: fadeIn-b-73qr96g4oi 500ms ease forwards;
    animation-delay: 3.3s;
    margin-left: 0 !important;
}

.suros-text .s[b-73qr96g4oi] {
    opacity: 0;
    animation: fadeIn-b-73qr96g4oi 700ms ease forwards;
    animation-delay: 3.5s;
    margin-left: 0 !important;
}

.o-wrap[b-73qr96g4oi] {
    position: relative;
    display: inline-block;
}

.hero-suros .o[b-73qr96g4oi] {
    margin-top: -18px !important;
    display: inline-block;
    font-size: 1.1em;
    transform: translateY(-260%) scale(1.12);
    opacity: 0;
    filter: drop-shadow(0 10px 22px rgba(0, 0, 0, .35));
    text-shadow: 0 4px 14px rgba(0, 0, 0, .25);
    animation: dropImpact-b-73qr96g4oi 1400ms cubic-bezier(.22, .8, .25, 1) 0.6s forwards, shockGlow-b-73qr96g4oi 900ms ease-out 1s both;
    will-change: transform, filter;
}

.tilde[b-73qr96g4oi] {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -0.10em;
    opacity: 0;
    color: #ffffff;
    font-size: 1em;
    animation: accentImpact-b-73qr96g4oi 700ms cubic-bezier(.22, .8, .25, 1) 1.9s forwards;
    color: #ff2e2e;
}

.medical-bg[b-73qr96g4oi] {
    position: fixed;
    inset: 0;
    z-index: 1;
    overflow: hidden;
    /* Permite clics en el contenido subyacente salvo en los hex interactivos */
    pointer-events: none;
}

.hex[b-73qr96g4oi] {
    position: absolute;
    width: clamp(88px, 10vw, 180px);
    height: clamp(88px, 10vw, 180px);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0)),
        var(--hex-fill, rgba(255, 255, 255, 0.28));
    box-shadow: 0 16px 32px rgba(0, 0, 0, .25), 0 0 28px rgba(46, 168, 255, 0.55);
    border: 2px solid rgba(255, 255, 255, 0.8);
    clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
    backdrop-filter: blur(3px);
    will-change: transform, opacity;
    cursor: pointer;
    /* Reactiva la interacción solo en los hexágonos */
    pointer-events: auto;
    transition:
        left 700ms cubic-bezier(0.22, 0.61, 0.36, 1),
        top 700ms cubic-bezier(0.22, 0.61, 0.36, 1),
        transform 420ms ease,
        box-shadow 420ms ease;
}

.hex.strong[b-73qr96g4oi] {
    background: rgba(255, 255, 255, 0.38);
}

.hex .icon[b-73qr96g4oi] {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: rgba(121, 200, 255, 0.92);
    font-size: clamp(40px, 4.5vw, 65px);
    opacity: 1;
    filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .35));
    text-shadow: 0 4px 14px rgba(0, 0, 0, .25);
    will-change: transform, opacity;
}

.hex[b-73qr96g4oi]::before,
.hex[b-73qr96g4oi]::after {
    content: "";
    position: absolute;
    inset: -24%;
    opacity: 0;
    transform: translate3d(0, 12%, 0);
    filter: blur(0.5px);
    pointer-events: none;
    mix-blend-mode: screen;
}

.hex[b-73qr96g4oi]::before {
    background-image:
        repeating-linear-gradient(
            90deg,
            rgba(121, 200, 255, 0.2) 0,
            rgba(121, 200, 255, 0.2) 3px,
            transparent 3px,
            transparent 7px
        ),
        repeating-linear-gradient(
            0deg,
            rgba(46, 168, 255, 0.22) 0,
            rgba(46, 168, 255, 0.22) 3px,
            transparent 3px,
            transparent 7px
        );
    background-size: 125% 125%;
}

.hex[b-73qr96g4oi]::after {
    inset: -10%;
    background-image:
        linear-gradient(90deg, rgba(121, 200, 255, 0.26) 10%, transparent 40%, rgba(46, 168, 255, 0.3) 70%, transparent 100%),
        repeating-linear-gradient(
            135deg,
            rgba(121, 200, 255, 0.3) 0,
            rgba(121, 200, 255, 0.3) 2px,
            transparent 2px,
            transparent 6px
        );
    background-size: 185% 185%;
    transform: translate3d(-80%, 0, 0);
}

.hex:hover[b-73qr96g4oi]::before {
    opacity: 1;
    animation: hero-hex-grid-b-73qr96g4oi 900ms ease-out forwards 80ms;
}

.hex:hover[b-73qr96g4oi]::after {
    opacity: 1;
    animation: hero-hex-sweep-b-73qr96g4oi 1100ms ease-out forwards 140ms;
}

.hex.main .icon[b-73qr96g4oi] {
    color: #79c8ff;
    opacity: 0.95;
}

.hex.lg[b-73qr96g4oi] {
    width: clamp(120px, 12vw, 220px);
    height: clamp(120px, 12vw, 220px);
}

.hex.sm[b-73qr96g4oi] {
    width: clamp(64px, 7vw, 120px);
    height: clamp(64px, 7vw, 120px);
}

.hex.xs[b-73qr96g4oi] {
    width: clamp(48px, 5.4vw, 96px);
    height: clamp(48px, 5.4vw, 96px);
}

.hex .icon.sm[b-73qr96g4oi] {
    font-size: clamp(24px, 2.8vw, 36px);
}

.hex .icon.xs[b-73qr96g4oi] {
    font-size: clamp(18px, 2.2vw, 28px);
}

.hex .hex-shortcut[b-73qr96g4oi] {
    position: absolute;
    left: 50%;
    bottom: 6px;
    transform: translateX(-50%);
    width: clamp(22px, 2.2vw, 28px);
    height: clamp(22px, 2.2vw, 28px);
    display: grid;
    place-items: center;
    border-radius: 999px;
    font-weight: 700;
    font-size: clamp(11px, 1.2vw, 13px);
    color: #0b1b2e;
    background: radial-gradient(circle at 30% 0, #9bd6ff, #2ea8ff);
    box-shadow: 0 8px 14px rgba(0,0,0,.35), 0 0 10px rgba(46,168,255,.55);
    text-shadow: none;
    pointer-events: auto;
}

.hex .hex-shortcut.is-dim[b-73qr96g4oi] {
    background: radial-gradient(circle at 30% 0, rgba(155,214,255,.5), rgba(46,168,255,.35));
    color: rgba(11,27,46,.6);
    box-shadow: 0 6px 12px rgba(0,0,0,.28), 0 0 8px rgba(46,168,255,.25);
    filter: grayscale(0.2);
}

.p1[b-73qr96g4oi]  { left: 76%; top: 10%; }  /* fila 1, centro un poco más a la izq */
.p2[b-73qr96g4oi]  { left: 86%; top: 18%; }  /* fila 1, derecha */
.p3[b-73qr96g4oi]  { left: 70%; top: 26%; }  /* fila 2, izquierda */
.p4[b-73qr96g4oi]  { left: 80%; top: 34%; }  /* fila 2, centro */
.p5[b-73qr96g4oi]  { left: 90%; top: 44%; }  /* fila 2–3, derecha */
.p6[b-73qr96g4oi]  { left: 72%; top: 54%; }  /* fila 3, izquierda, más separada */
.p7[b-73qr96g4oi]  { left: 82%; top: 62%; }  /* fila 3, centro */
.p8[b-73qr96g4oi]  { left: 68%; top: 72%; }  /* fila 4, izquierda */
.p9[b-73qr96g4oi]  { left: 78%; top: 80%; }  /* fila 4, centro */
.p10[b-73qr96g4oi] { left: 88%; top: 88%; }  /* fila 4, derecha */
.p11[b-73qr96g4oi] { left: 66%; top: 42%; }  /* hex extra, rellena hueco medio-izq */
.p12[b-73qr96g4oi] { left: 92%; top: 28%; }  /* hex extra, zona sup-der */

.hex-popover-fixed[b-73qr96g4oi] {
    position: fixed;
    top: 11%;
    right: 22%;
    min-width: 240px;
    max-width: 280px;
    padding: 14px 18px;
    background: radial-gradient(circle at top left, rgba(46, 168, 255, 0.2), rgba(0, 10, 32, 0.96));
    border-radius: 14px;
    border: 1px solid rgba(151, 206, 255, 0.7);
    box-shadow: 0 22px 40px rgba(0, 0, 0, 0.65), 0 0 30px rgba(46, 168, 255, 0.5);
    color: #eaf2f9;
    font-size: 0.8rem;
    line-height: 1.5;
    z-index: 10;
    pointer-events: none;
}

.hex-hover-layer[b-73qr96g4oi] {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 9;
}

.hex-hover-card[b-73qr96g4oi] {
    position: absolute;
    width: 320px;
    height: 200px;
    border-radius: 22px;
    overflow: hidden;
    background:
        radial-gradient(circle at 8% 0%, rgba(255, 255, 255, 0.25), transparent 55%),
        linear-gradient(135deg, rgba(15, 23, 42, 0.96), rgba(15, 23, 42, 0.92));
    border: 1px solid rgba(255, 255, 255, 0.35);
    backdrop-filter: saturate(120%) blur(2px);
    box-shadow:
        0 18px 40px rgba(0, 0, 0, 0.55),
        0 0 28px rgba(46, 168, 255, 0.35);
    opacity: 0;
    transform: translate3d(0, 0, 0) scale(0.7);
    will-change: transform, opacity;
}

.hex-hover-card img[b-73qr96g4oi] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: inherit;
}

.hex-hover-card.is-closing[b-73qr96g4oi] {
    transition:
        opacity 200ms ease-out,
        transform 200ms ease-out;
    opacity: 0;
    transform: translate3d(0, 0, 0) scale(0.7);
}

.hex-popover-fixed-title[b-73qr96g4oi] {
    font-weight: 600;
    margin-bottom: 4px;
    font-size: 0.85rem;
}

.hex-popover-fixed-description[b-73qr96g4oi] {
    opacity: 0.92;
}

@keyframes dropImpact-b-73qr96g4oi {
    0% {
        transform: translateY(-260%) scale(1.12);
        filter: blur(6px) drop-shadow(0 22px 44px rgba(0, 0, 0, .45));
        opacity: 0;
    }

    20% {
        transform: translateY(-80%) scale(1.06);
        filter: blur(2px) drop-shadow(0 18px 36px rgba(0, 0, 0, .4));
        opacity: 1;
    }

    60% {
        transform: translateY(10%) scale(0.95);
        filter: blur(0) drop-shadow(0 30px 45px rgba(0, 0, 0, .35));
    }

    78% {
        transform: translateY(-6%) scale(1.02);
    }

    100% {
        transform: translateY(0) scale(1);
        filter: blur(0) drop-shadow(0 8px 16px rgba(0, 0, 0, .28));
        opacity: 1;
    }
}

@media (max-width: 1024px) {
    .hero-suros[b-73qr96g4oi],
    .medical-bg[b-73qr96g4oi],
    .bg-watermark[b-73qr96g4oi],
    .bg-watermark-clinica[b-73qr96g4oi],
    .bg-watermark-equipo[b-73qr96g4oi] {
        display: none;
    }
}

@keyframes accentImpact-b-73qr96g4oi {
    0% {
        opacity: 0;
        transform: translateX(-50%) translateY(-40%) rotate(-25deg) scale(0.85);
        filter: blur(4px);
    }

    50% {
        opacity: 1;
        transform: translateX(-50%) translateY(-8%) rotate(6deg) scale(1.1);
        filter: blur(0);
    }

    100% {
        opacity: 1;
        transform: translateX(-50%) translateY(0) rotate(0deg) scale(1);
    }
}

@keyframes shockGlow-b-73qr96g4oi {
    0% {
        text-shadow: 0 0 0 rgba(255, 255, 255, 0);
    }

    35% {
        text-shadow: 0 10px 28px rgba(0, 0, 0, .35), 0 0 24px rgba(46, 168, 255, .5);
    }

    100% {
        text-shadow: 0 4px 14px rgba(0, 0, 0, .25);
    }
}

@keyframes hero-hex-grid-b-73qr96g4oi {
    0% {
        opacity: 0;
        transform: translate3d(0, 18%, 0) scale(0.97);
        filter: blur(2.5px);
    }
    40% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1.02);
        filter: blur(0);
    }
    100% {
        opacity: 0.32;
        transform: translate3d(0, -8%, 0) scale(1.06);
        filter: blur(2px);
    }
}

@keyframes hero-hex-sweep-b-73qr96g4oi {
    0% {
        opacity: 0;
        transform: translate3d(-90%, 0, 0);
    }
    40% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: translate3d(110%, 0, 0);
    }
}

@keyframes fadeIn-b-73qr96g4oi {
    from {
        opacity: 0;
        filter: blur(2px);
    }

    to {
        opacity: 1;
        filter: blur(0);
    }
}

@keyframes pulse-b-73qr96g4oi {
    0%,
    100% {
        transform: translate(-50%, -50%) scale(1);
        filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .35));
    }

    50% {
        transform: translate(-50%, -50%) scale(1.2);
        filter: drop-shadow(0 0 15px rgba(121, 200, 255, 0.8));
    }
}

.hex.float[b-73qr96g4oi] {
    animation: floatY-b-73qr96g4oi 6s ease-in-out infinite;
}

.hex.soft[b-73qr96g4oi] {
    animation: fadeSoft-b-73qr96g4oi 8s ease-in-out infinite;
}

.hex .icon.pulse[b-73qr96g4oi] {
    animation: pulse-b-73qr96g4oi 2.6s ease-in-out infinite;
}

/* Destello corto cuando se pulsa la tecla de acceso directo */
.hex.hex-keyflash[b-73qr96g4oi],
.hex.hex-keyflash .hex-shortcut[b-73qr96g4oi] {
    filter: brightness(1.35) saturate(1.1);
    box-shadow: 0 18px 36px rgba(0,0,0,.45), 0 0 18px rgba(46,168,255,.65);
    transition: filter 180ms ease, box-shadow 180ms ease;
}

@keyframes floatY-b-73qr96g4oi {
    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-6px);
    }
}

@keyframes fadeSoft-b-73qr96g4oi {
    0% {
        opacity: .65;
    }

    50% {
        opacity: .35;
    }

    100% {
        opacity: .65;
    }
}
/* /Presentation/Components/Shared/SurosLandingHeader.razor.rz.scp.css */
.suros-header[b-6uzu6bj8mw] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 60;
    backdrop-filter: blur(16px);
    background: linear-gradient(90deg, rgba(5, 8, 22, 0.9), rgba(15, 23, 42, 0.78));
    border-bottom: 1px solid rgba(148, 163, 184, 0.35);
}

.suros-header-inner[b-6uzu6bj8mw] {
    max-width: 1280px;
    margin: 0 auto;
    padding: 1.05rem 1.75rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.75rem;
}

.suros-header-brand[b-6uzu6bj8mw] {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    text-decoration: none;
}

.suros-header-logo[b-6uzu6bj8mw] {
    height: 38px;
    width: auto;
    filter: drop-shadow(0 4px 10px rgba(15, 23, 42, 0.9));
}

.suros-header-brand-text[b-6uzu6bj8mw] {
    display: flex;
    flex-direction: column;
}

.suros-header-brand-title[b-6uzu6bj8mw] {
    font-weight: 700;
    font-size: 0.98rem;
    color: #e5e7eb;
}

.suros-header-brand-subtitle[b-6uzu6bj8mw] {
    font-size: 0.78rem;
    color: #9ca3af;
}

.suros-header-nav[b-6uzu6bj8mw] {
    display: inline-flex;
    align-items: center;
    gap: 1.5rem;
    font-size: 0.9rem;
}

.suros-header-link[b-6uzu6bj8mw] {
    position: relative;
    color: #d1d5db;
    text-decoration: none;
    padding: 0.25rem 0;
    transition:
        color 160ms ease-out,
        transform 160ms ease-out;
}

.suros-header-link[b-6uzu6bj8mw]::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -0.2rem;
    width: 0;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, #38bdf8, #6366f1);
    transition: width 180ms ease-out;
}

.suros-header-link:hover[b-6uzu6bj8mw] {
    color: #f9fafb;
    transform: translateY(-1px);
}

.suros-header-link:hover[b-6uzu6bj8mw]::after {
    width: 100%;
}

.suros-header-nav-item[b-6uzu6bj8mw] {
    position: relative;
}

.suros-header-link--dropdown[b-6uzu6bj8mw] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: none;
    border: none;
    cursor: pointer;
}

.suros-header-link-caret[b-6uzu6bj8mw] {
    font-size: 0.65rem;
}

.suros-header-dropdown[b-6uzu6bj8mw] {
    position: absolute;
    top: calc(100% + 0.9rem);
    left: 50%;
    transform: translateX(-50%);
    display: none;
    padding: 2rem 2.4rem;
    border-radius: 0.4rem;
    background: rgba(8, 13, 24, 0.86);
    box-shadow:
        0 28px 70px rgba(15, 23, 42, 0.9),
        0 0 0 1px rgba(56, 70, 92, 0.45);
    color: #e5e7eb;
    white-space: nowrap;
    z-index: 70;
    min-width: 1180px;
    overflow: hidden;
    backdrop-filter: none;
}

.suros-header-nav-item.is-open .suros-header-dropdown[b-6uzu6bj8mw] {
    display: grid;
    grid-template-columns: repeat(3, minmax(380px, 1fr));
    column-gap: 3.9rem;
    row-gap: 3rem;
}

/* Eliminamos capas adicionales para que el fondo sea solo la marca de agua */
.suros-header-dropdown[b-6uzu6bj8mw]::before,
.suros-header-dropdown[b-6uzu6bj8mw]::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: none;
    opacity: 0;
    animation: none;
}

.suros-header-nav-item.is-open .suros-header-dropdown[b-6uzu6bj8mw]::before,
.suros-header-nav-item.is-open .suros-header-dropdown[b-6uzu6bj8mw]::after {
    opacity: 0;
    transform: none;
}

.suros-header-dropdown-column[b-6uzu6bj8mw] {
    min-width: 220px;
    padding: 0 1rem;
    position: relative;
}

.suros-header-dropdown-column:hover[b-6uzu6bj8mw] {
    transform: translateY(-2px);
    transition: transform 180ms ease-out;
}

.suros-header-dropdown-title[b-6uzu6bj8mw] {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 1.1rem;
    font-weight: 700;
    color: #35bdf5;
    letter-spacing: 0.2px;
    line-height: 1.1;
    position: relative;
}

.suros-header-dropdown-title[b-6uzu6bj8mw]::after {
    content: "";
    position: absolute;
    left: 2.2rem;
    right: 0;
    bottom: -0.45rem;
    height: 1px;
    background: linear-gradient(90deg, rgba(56, 189, 248, 0.8), rgba(99, 102, 241, 0.3));
}

.suros-header-dropdown-subtitle[b-6uzu6bj8mw] {
    font-size: 0.86rem;
    color: #9fb1c5;
    margin: 0.8rem 0 1.1rem 2.2rem;
}

.suros-header-dropdown-list[b-6uzu6bj8mw] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.75rem;
    font-size: 0.95rem;
}

.suros-header-dropdown-list a[b-6uzu6bj8mw] {
    color: #dbe7f0;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.2rem 0;
    transition:
        color 160ms ease-out,
        transform 160ms ease-out;
}

.suros-header-dropdown-list a:hover[b-6uzu6bj8mw] {
    color: #f9fafb;
    transform: translateX(3px);
}

.suros-header-infograph[b-6uzu6bj8mw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 4px;
    background: radial-gradient(circle at 30% 0, rgba(56, 189, 248, 0.85), rgba(99, 102, 241, 0.85));
    box-shadow: 0 10px 22px rgba(37, 99, 235, 0.45);
    color: #09101d;
    font-size: 1rem;
}

.suros-header-dropdown-column:not(:last-child)[b-6uzu6bj8mw]::after {
    content: "";
    position: absolute;
    top: 0.2rem;
    right: -1.6rem;
    bottom: 0.2rem;
    width: 1px;
    background: linear-gradient(180deg, rgba(148, 163, 184, 0.45), rgba(148, 163, 184, 0.08));
}

.suros-li-icon[b-6uzu6bj8mw] {
    color: #35bdf5;
    opacity: 0.95;
    width: 18px;
    text-align: center;
}

@keyframes suros-header-orbit-b-6uzu6bj8mw {
    0% {
        transform: translate3d(-16%, -8%, 0) scale(1.02);
    }
    50% {
        transform: translate3d(4%, 2%, 0) scale(1.08);
    }
    100% {
        transform: translate3d(14%, 6%, 0) scale(1.04);
    }
}


.suros-header-actions[b-6uzu6bj8mw] {
    display: flex;
    align-items: center;
}

.suros-header-cta[b-6uzu6bj8mw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 0.55rem 1.6rem;
    border-radius: 999px;
    border: none;
    background: radial-gradient(circle at 20% 0, #22c55e, #16a34a);
    color: #ecfdf5;
    font-weight: 600;
    font-size: 0.9rem;
    text-decoration: none;
    box-shadow:
        0 14px 30px rgba(22, 163, 74, 0.55),
        0 0 0 1px rgba(15, 23, 42, 0.9);
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition:
        transform 160ms ease-out,
        box-shadow 160ms ease-out,
        filter 160ms ease-out;
}

.suros-header-cta[b-6uzu6bj8mw]::before,
.suros-header-cta[b-6uzu6bj8mw]::after {
    content: "";
    position: absolute;
    inset: -40%;
    opacity: 0;
    transform: translate3d(0, 10%, 0);
    filter: blur(1px);
    pointer-events: none;
    mix-blend-mode: screen;
}

.suros-header-cta[b-6uzu6bj8mw]::after {
    inset: -10%;
    background-image:
        linear-gradient(90deg, rgba(22, 163, 74, 0.28) 10%, transparent 40%, rgba(22, 163, 74, 0.32) 70%, transparent 100%),
        repeating-linear-gradient(
            135deg,
            rgba(22, 163, 74, 0.26) 0,
            rgba(22, 163, 74, 0.26) 2px,
            transparent 2px,
            transparent 6px
        );
    background-size: 180% 180%;
    transform: translate3d(-80%, 0, 0);
}

.suros-header-cta[b-6uzu6bj8mw]::before {
    background-image:
        repeating-linear-gradient(
            90deg,
            rgba(34, 197, 94, 0.22) 0,
            rgba(34, 197, 94, 0.22) 4px,
            transparent 4px,
            transparent 8px
        ),
        repeating-linear-gradient(
            0deg,
            rgba(16, 185, 129, 0.2) 0,
            rgba(16, 185, 129, 0.2) 4px,
            transparent 4px,
            transparent 8px
        );
    background-size: 120% 120%;
}

.suros-header-cta:hover[b-6uzu6bj8mw]::before {
    opacity: 1;
    animation: suros-header-cta-grid-b-6uzu6bj8mw 900ms ease-out forwards 80ms;
}

.suros-header-cta:hover[b-6uzu6bj8mw]::after {
    opacity: 1;
    animation: suros-header-cta-sweep-b-6uzu6bj8mw 1100ms ease-out forwards 140ms;
}

.suros-header-cta-icon[b-6uzu6bj8mw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.95);
    box-shadow: 0 0 0 1px rgba(16, 185, 129, 0.8);
    font-size: 0.9rem;
}

.suros-header-cta-icon .fa-whatsapp[b-6uzu6bj8mw] {
    color: #22c55e;
}

.suros-header-cta-label[b-6uzu6bj8mw] {
    white-space: nowrap;
}

.suros-header-cta:hover[b-6uzu6bj8mw] {
    transform: translateY(-1px);
    box-shadow:
        0 18px 40px rgba(22, 163, 74, 0.8),
        0 0 0 1px rgba(34, 197, 94, 0.9);
    filter: brightness(1.05);
}

.suros-header-cta:active[b-6uzu6bj8mw] {
    transform: translateY(0);
    box-shadow:
        0 10px 24px rgba(15, 23, 42, 0.9),
        0 0 0 1px rgba(15, 23, 42, 0.9);
}

@keyframes suros-header-cta-grid-b-6uzu6bj8mw {
    0% {
        opacity: 0;
        transform: translate3d(0, 20%, 0) scale(0.96);
        filter: blur(3px);
    }
    40% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1.02);
        filter: blur(0);
    }
    100% {
        opacity: 0.35;
        transform: translate3d(0, -10%, 0) scale(1.12);
        filter: blur(3px);
    }
}

@keyframes suros-header-cta-sweep-b-6uzu6bj8mw {
    0% {
        opacity: 0;
        transform: translate3d(-90%, 0, 0);
    }
    40% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: translate3d(110%, 0, 0);
    }
}

@media (max-width: 1024px) {
    .suros-header-inner[b-6uzu6bj8mw] {
        padding: 0.95rem 1rem;
        gap: 1rem;
    }

    .suros-header-nav[b-6uzu6bj8mw] {
        gap: 1rem;
        font-size: 0.82rem;
    }

    .suros-header-brand-subtitle[b-6uzu6bj8mw] {
        display: none;
    }
}

@media (max-width: 768px) {
    .suros-header-inner[b-6uzu6bj8mw] {
        padding: 0.9rem 0.85rem;
    }

    .suros-header-nav[b-6uzu6bj8mw] {
        display: none;
    }
}
/* /Presentation/Components/Shared/SurosScrollNavigator.razor.rz.scp.css */
.scroll-nav[b-0lshk0fqyl] {
    position: fixed;
    right: 1.6%;
    top: 70%;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 10px 8px;
    background: radial-gradient(circle at 30% 0%, rgba(46, 168, 255, 0.18), rgba(0, 12, 32, 0.9));
    border: 1px solid rgba(151, 206, 255, 0.6);
    border-radius: 16px;
    box-shadow: 0 16px 32px rgba(0, 0, 0, .45), 0 0 22px rgba(46, 168, 255, .35);
    z-index: 11000;
    pointer-events: auto !important;
    backdrop-filter: blur(6px);
}

.btn-scroll[b-0lshk0fqyl] {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    border: 1px solid rgba(151, 206, 255, 0.65);
    background: linear-gradient(145deg, rgba(255,255,255,0.08), rgba(255,255,255,0)),
        rgba(8, 30, 58, 0.6);
    color: #9bd6ff;
    box-shadow: 0 8px 18px rgba(0,0,0,.35), 0 0 16px rgba(46,168,255,.25);
    transition: transform 180ms ease, box-shadow 220ms ease, background 180ms ease, color 180ms ease;
    cursor: pointer;
    pointer-events: auto !important;
}

.btn-scroll i[b-0lshk0fqyl] {
    font-size: 26px;
}

.btn-scroll:hover:not(:disabled)[b-0lshk0fqyl] {
    transform: translateY(-1px) scale(1.05);
    color: #cfeaff;
    box-shadow: 0 12px 26px rgba(0,0,0,.45), 0 0 20px rgba(46,168,255,.45);
}

.btn-scroll:active:not(:disabled)[b-0lshk0fqyl] {
    transform: translateY(0) scale(0.98);
}

.btn-scroll:disabled[b-0lshk0fqyl] {
    opacity: 0.45;
    cursor: default;
    filter: grayscale(0.2);
}

.scroll-divider[b-0lshk0fqyl] {
    width: 28px;
    height: 1px;
    background: linear-gradient(90deg, rgba(151,206,255,0), rgba(151,206,255,0.6), rgba(151,206,255,0));
}

@media (max-width: 900px) {
    .scroll-nav[b-0lshk0fqyl] {
        right: 1%;
        transform: translateY(-50%) scale(0.9);
    }
    .btn-scroll[b-0lshk0fqyl] {
        width: 46px;
        height: 46px;
    }
}
/* /Presentation/Components/Shared/SurosTechStackShowcase.razor.rz.scp.css */
.suros-tech-wrapper[b-n9rq6ysrg2] {
    grid-column: 2;
    justify-self: start;
    margin: 1.5rem auto 0 0;
    max-width: 1120px;
}

.suros-tech-card[b-n9rq6ysrg2] {
    display: grid;
    grid-template-columns: minmax(260px, 0.9fr) minmax(480px, 1.4fr);
    align-items: stretch;
    gap: 2.25rem;
    padding: 2rem 2.25rem;
    border-radius: 1.5rem;
    background: linear-gradient(160deg, rgba(15, 23, 42, 0.78), rgba(15, 23, 42, 0.88));
    box-shadow:
        0 24px 55px rgba(2, 6, 23, 0.85),
        0 0 0 1px rgba(15, 23, 42, 0.7);
    position: relative;
    overflow: hidden;
}

.suros-tech-card[b-n9rq6ysrg2]::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 0% 0%, rgba(59, 130, 246, 0.38), transparent 60%),
        radial-gradient(circle at 100% 100%, rgba(236, 72, 153, 0.24), transparent 60%);
    opacity: 0.22;
    pointer-events: none;
}

.suros-tech-card[b-n9rq6ysrg2]::after {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(56, 189, 248, 0.35), transparent 70%);
    filter: blur(16px);
    opacity: 0.45;
    transform: translate3d(30%, -40%, 0);
    mix-blend-mode: screen;
    pointer-events: none;
}

.suros-tech-intro[b-n9rq6ysrg2] {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.suros-tech-pill[b-n9rq6ysrg2] {
    align-self: flex-start;
    padding: 0.2rem 0.9rem;
    border-radius: 999px;
    font-size: 0.75rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    background: rgba(15, 23, 42, 0.92);
    border: 1px solid rgba(148, 163, 184, 0.6);
    color: #e5e7eb;
}

.suros-tech-title[b-n9rq6ysrg2] {
    font-size: 1.7rem;
    font-weight: 700;
    margin: 0;
}

.suros-tech-text[b-n9rq6ysrg2] {
    margin: 0;
    font-size: 0.98rem;
    color: #e5e7eb;
}

.suros-tech-subtext[b-n9rq6ysrg2] {
    margin: 0;
    font-size: 0.9rem;
    color: #9ca3af;
}

.suros-tech-list[b-n9rq6ysrg2] {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(4, minmax(130px, 1fr));
    gap: 1.25rem;
}

.suros-tech-item[b-n9rq6ysrg2] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.6rem;
}

.suros-tech-icon[b-n9rq6ysrg2] {
    width: 46px;
    height: 46px;
    border-radius: 1.1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at 30% 0, #38bdf8, #2563eb);
    box-shadow:
        0 16px 34px rgba(15, 23, 42, 0.9),
        0 0 0 1px rgba(15, 23, 42, 0.6);
    color: #f9fafb;
}

.suros-tech-icon i[b-n9rq6ysrg2] {
    font-size: 1.25rem;
}

.suros-tech-meta[b-n9rq6ysrg2] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.suros-tech-name[b-n9rq6ysrg2] {
    font-size: 0.92rem;
    font-weight: 600;
}

.suros-tech-role[b-n9rq6ysrg2] {
    font-size: 0.8rem;
    color: #9ca3af;
}

.suros-tech-bar[b-n9rq6ysrg2] {
    position: relative;
    width: 100%;
    height: 4px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.9);
    overflow: hidden;
}

.suros-tech-bar-fill[b-n9rq6ysrg2] {
    --fill: 0.9;
    position: absolute;
    inset: 0;
    width: calc(var(--fill) * 100%);
    background: linear-gradient(90deg, #38bdf8, #6366f1, #033474);
    border-radius: inherit;
    transform-origin: left center;
    transform: scaleX(1);
    opacity: 0.96;
}

@media (max-width: 1024px) {
    .suros-tech-card[b-n9rq6ysrg2] {
        grid-template-columns: 1fr;
        padding: 1.75rem 1.5rem;
    }

    .suros-tech-list[b-n9rq6ysrg2] {
        grid-template-columns: repeat(3, minmax(120px, 1fr));
    }
}

@media (max-width: 768px) {
    .suros-tech-wrapper[b-n9rq6ysrg2] {
        grid-column: 1;
        margin-inline: 0;
    }

    .suros-tech-card[b-n9rq6ysrg2] {
        border-radius: 1.25rem;
    }

    .suros-tech-list[b-n9rq6ysrg2] {
        grid-template-columns: repeat(2, minmax(120px, 1fr));
        gap: 1rem;
    }

    .suros-tech-title[b-n9rq6ysrg2] {
        font-size: 1.5rem;
        overflow-wrap: anywhere;
        hyphens: auto;
    }

    .suros-tech-text[b-n9rq6ysrg2],
    .suros-tech-subtext[b-n9rq6ysrg2] {
        max-width: none;
        overflow-wrap: anywhere;
        word-break: normal;
    }
}