label.error{
    color: #990000 !important;
}
input.error{
    border: 1px solid #990000 !important;
}
select.error{
    border: 1px solid #990000 !important;
}

.foto_vehiculo {
    width: 300px; /* ajusta el tamaño */
    border-radius: 6px;
    padding: 6px;
    background: #0f172a; /* fondo oscuro tipo interfaz */
    border: 3px solid #154360; /* borde azul informático */
    position: relative;
    box-shadow:
        0 0 8px rgba(21, 67, 96, 0.6),
        inset 0 0 12px rgba(21, 67, 96, 0.3);
    overflow: hidden;
}

/* Efecto de escaneo vertical */
.foto_vehiculo::before {
    content: "";
    position: absolute;
    left: 0;
    top: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, transparent 70%, rgba(21, 67, 96, 0.3));
    animation: scanMove 3s linear infinite;
}

@keyframes scanMove {
    0%   {
        top: -100%;
    }
    100% {
        top: 100%;
    }
}

.tarjetaOrden {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity .5s ease, transform .5s ease;
}

.tarjetaOrden.mostrar {
    opacity: 1;
    transform: translateY(0);
}

.barraProgresoBase {
    background: #344454;
    overflow: hidden;
    border-radius: 2px;
}

.barraProgresoNeon {
    position: relative;
    overflow: hidden;
    background: #2879c7 !important;
}

.barraProgresoNeon::after {
    content: '';
    position: absolute;
    top: 0;
    left: -35%;
    width: 35%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(54,169,255,0.05) 20%,
        rgba(76,190,255,0.25) 40%,
        rgba(116,215,255,0.75) 50%,
        rgba(190,240,255,0.95) 55%,
        rgba(116,215,255,0.75) 60%,
        rgba(76,190,255,0.25) 70%,
        transparent 100%
        );
    filter: blur(2px);
    animation: luzPanel 2.5s ease-in-out infinite;
}

@keyframes luzPanel {
    0% {
        left: -35%;
        opacity: 0;
    }

    10% {
        opacity: 1;
    }

    90% {
        opacity: 1;
    }

    100% {
        left: 100%;
        opacity: 0;
    }
}

/* Esquinas tipo marco digital */
.foto_vehiculo::after {
    content: "";
    position: absolute;
    inset: 0;
    border: 2px dashed rgba(21, 67, 96, 0.5);
    border-radius: 6px;
    pointer-events: none;
}

.datos_vehiculo .form-group {
    margin-bottom: 30px; /* separación entre bloques */
    margin-top: 30px
}

.datos_vehiculo label {
    margin-top: 6px; /* alinear verticalmente con el input */
}

.datos_vehiculo input {
    min-width: 120px; /* evita que se vean demasiado pequeños */
}

body.app-theme-dark .select2-container--default .select2-selection--single{
    height:34px!important;
    background-color:#1b1e24!important;
    border:1px solid #3a3f44!important;
    border-radius:3px!important;
    color:#fff!important;
}
body.app-theme-dark .select2-container--default .select2-selection--single .select2-selection__rendered{
    height:32px!important;
    line-height:32px!important;
    padding-left:10px!important;
    padding-right:30px!important;
    color:#fff!important;
    font-size:12px!important;
}
body.app-theme-dark .select2-container--default .select2-selection--single .select2-selection__placeholder{
    color:#fff!important;
    opacity:1!important;
}
body.app-theme-dark .select2-container--default .select2-selection--single .select2-selection__arrow{
    height:32px!important;
    top:0!important;
    right:5px!important;
}
body.app-theme-dark .select2-container--default .select2-selection--single .select2-selection__arrow b{
    border-color:#ccc transparent transparent transparent!important;
}
body.app-theme-dark .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b{
    border-color:transparent transparent #ccc transparent!important;
}
body.app-theme-dark .select2-dropdown{
    background-color:#1b1e24!important;
    border:1px solid #3a3f44!important;
    color:#fff!important;
}
body.app-theme-dark .select2-search--dropdown{
    background-color:#1b1e24!important;
    padding:5px!important;
}
body.app-theme-dark .select2-container--default .select2-search--dropdown .select2-search__field{
    height:32px!important;
    background-color:#10141a!important;
    border:1px solid #3a3f44!important;
    border-radius:2px!important;
    color:#fff!important;
    font-size:12px!important;
    padding:5px 8px!important;
    outline:none!important;
}
body.app-theme-dark .select2-container--default .select2-results{
    background-color:#1b1e24!important;
    color:#fff!important;
}
body.app-theme-dark .select2-container--default .select2-results__option{
    background-color:#1b1e24;
    color:#fff;
    font-size:12px;
    padding:7px 10px;
}
body.app-theme-dark .select2-container--default .select2-results__option[aria-selected="true"]{
    background-color:#2b3036!important;
    color:#fff!important;
}
body.app-theme-dark .select2-container--default .select2-results__option--highlighted[aria-selected]{
    background-color:#3276b1!important;
    color:#fff!important;
}
body.app-theme-dark .select2-container--default.select2-container--focus .select2-selection--single{
    border-color:#3276b1!important;
    outline:none!important;
}
body.app-theme-dark .select2-container--default.select2-container--open .select2-selection--single{
    border-color:#3276b1!important;
}
body.app-theme-dark .select2-results__options{
    background-color:#1b1e24!important;
}
body.app-theme-dark .select2-results__options::-webkit-scrollbar{
    width:8px;
}
body.app-theme-dark .select2-results__options::-webkit-scrollbar-track{
    background:#1b1e24;
}
body.app-theme-dark .select2-results__options::-webkit-scrollbar-thumb{
    background:#555b62;
    border-radius:4px;
}
body.app-theme-dark .select2-results__options::-webkit-scrollbar-thumb:hover{
    background:#6a7078;
}


button.lv-close {
    background: #fb3c4a !important;
    border: 1px solid #fb3c4a !important;
    color: #fff !important;
}

button.lv-close:hover {
    background: #e52e3c !important;
    border-color: #e52e3c !important;
    color: #fff !important;
}

/* Estilo general de botones */
.swal-btn-compacto {
    font-size: 11px !important;
    font-weight: 500 !important;
    padding: 7px 12px !important;
    border-radius: 3px !important;
    margin: 0 3px !important;
    transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}

/* Crecimiento y sombra azul para todos los botones */
.swal-btn-compacto:hover,
.swal-btn-compacto:hover:focus {
    transform: scale(1.08);
    box-shadow: 0 0 15px 4px rgba(52, 152, 219, 0.55) !important;
}

/* Efecto al presionar */
.swal-btn-compacto:active {
    transform: scale(0.97);
}

/* Quitar sombra predeterminada al enfocar */
.swal-btn-compacto:focus:not(:hover) {
    box-shadow: none !important;
}

/* Texto descriptivo de SweetAlert2 */
.swal-contenido {
    font-size: 15px !important;
    line-height: 1.6 !important;
    font-weight: 400 !important;
    color: #444444 !important;
}

body.app-theme-dark .swal2-html-container {
    color: #E0E6ED !important;
}

.cu-raiz {
    position:relative;
    width:100%;
    color:#eaf5ff;
    background:#061a2b;
    border:1px solid #1d4865;
    border-radius:9px;
    overflow:hidden;
    font-family:inherit;
}

.cu-barra {
    height:37px;
    padding:0 14px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-bottom:1px solid #1b425b;
    background:#0a2033;
    font-size:12px;
    font-weight:700;
    letter-spacing:.7px;
}

.cu-barra i {
    color:#16c5ff;
    margin-right:7px;
}

.cu-restaurar {
    border:1px solid #285977;
    border-radius:5px;
    background:#123047;
    color:#c6eaff;
    padding:5px 10px;
    font-size:11px;
    cursor:pointer;
}

.cu-restaurar:hover {
    background:#1d4763;
    color:#fff;
}

.cu-ventana {
    position:relative;
    overflow:hidden;
    width:100%;
    background:radial-gradient(ellipse at 50% 45%,#102c42 0%,#071c2e 55%,#041424 100%);
}

.cu-plano {
    position:absolute;
    left:0;
    top:0;
    width:1600px;
    height:800px;
    transform-origin:top left;
    background-image:
        linear-gradient(rgba(54,133,175,.075) 1px,transparent 1px),
        linear-gradient(90deg,rgba(54,133,175,.075) 1px,transparent 1px);
    background-size:25px 25px;
}

.cu-lineas {
    position:absolute;
    inset:0;
    width:1600px;
    height:800px;
    overflow:visible;
    pointer-events:none;
}

.cu-ruta {
    fill:none;
    stroke-width:3;
    stroke-linecap:round;
    stroke-linejoin:round;
    filter:drop-shadow(0 0 4px currentColor);
}

.cu-ruta.azul {
    stroke:#10c5ff;
    color:#10c5ff;
}

.cu-ruta.violeta {
    stroke:#a65cff;
    color:#a65cff;
}

.cu-ruta.verde {
    stroke:#11dc91;
    color:#11dc91;
}

.cu-ruta.rojo {
    stroke:#ff315a;
    color:#ff315a;
}

.cu-ruta.punteada {
    stroke-dasharray:9 8;
}

/* ESTACIONES */

.cu-nodo {
    position:absolute;
    display:block;
    z-index:2;
    text-align:left;
    overflow:hidden;
    padding:13px 14px;
    border:1.5px solid var(--cu-color);
    border-radius:13px;
    background:linear-gradient(140deg,rgba(22,48,70,.96),rgba(7,23,39,.98));
    box-shadow:inset 0 0 17px rgba(0,0,0,.22),0 0 13px color-mix(in srgb,var(--cu-color) 22%,transparent);
    color:#fff;
    cursor:pointer;
    transition:box-shadow .2s,filter .2s,opacity .2s;
    font:inherit;
}

.cu-nodo:hover,
.cu-nodo.activo {
    z-index:4;
    box-shadow:0 0 25px color-mix(in srgb,var(--cu-color) 65%,transparent),inset 0 0 15px rgba(255,255,255,.05);
}

.cu-nodo:focus-visible {
    outline:3px solid #fff;
    outline-offset:3px;
}

.cu-cabecera {
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:10px;
}

.cu-numero {
    flex:none;
    width:35px;
    height:35px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    font-size:18px;
    font-weight:800;
    color:#061b2c;
    background:var(--cu-color);
    box-shadow:0 0 13px var(--cu-color);
}

.cu-titulo {
    font-size:13px;
    line-height:1.25;
    font-weight:800;
    letter-spacing:.15px;
}

.cu-subtitulo {
    display:block;
    font-size:10px;
    font-weight:700;
    margin:-7px 0 8px 45px;
    color:#f8c3cf;
}

.cu-cuerpo {
    display:flex;
    gap:12px;
    align-items:center;
}

.cu-icono {
    font-size:34px;
    color:var(--cu-color);
    width:40px;
    text-align:center;
    flex:none;
    text-shadow:0 0 10px color-mix(in srgb,var(--cu-color) 45%,transparent);
}

.cu-puntos {
    display:flex;
    flex-direction:column;
    gap:4px;
    font-size:11px;
    line-height:1.25;
    color:#d7e8f6;
}

.cu-puntos>span:before {
    content:'•';
    color:var(--cu-color);
    margin-right:5px;
}

.cu-nodo[data-id="4"] {
    background:linear-gradient(140deg,#3b2b17,#131c27);
}

.cu-nodo[data-id="12"] {
    display:flex;
    align-items:center;
    gap:30px;
    background:linear-gradient(90deg,#063c67,#0a2948);
}

.cu-nodo[data-id="12"] .cu-cabecera {
    margin:0;
    min-width:420px;
}

.cu-nodo[data-id="12"] .cu-cuerpo {
    flex:1;
}

.cu-nodo[data-id="12"] .cu-puntos {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:6px 16px;
}

/* INDICADORES */

.cu-chip {
    position:absolute;
    z-index:3;
    font-size:12px;
    font-weight:700;
    border-radius:5px;
    padding:5px 9px;
    white-space:nowrap;
}

.cu-chip-si {
    color:#9fffc6;
    background:#08472c;
    border:1px solid #12d98a;
}

.cu-chip-no {
    color:#ffd5dd;
    background:#521322;
    border:1px solid #ff315a;
}

.cu-nota {
    position:absolute;
    color:#ffb4c1;
    font-size:11px;
    white-space:nowrap;
}

/* LEYENDA */

.cu-leyenda {
    display:flex;
    flex-wrap:wrap;
    gap:15px;
    padding:10px 14px;
    background:#071b2c;
    border-top:1px solid #1b425b;
    font-size:10px;
    color:#b8d0e0;
}

.cu-leyenda span {
    display:flex;
    align-items:center;
    gap:6px;
}

.cu-leyenda i {
    width:10px;
    height:10px;
    border-radius:3px;
    display:inline-block;
}

/* PANEL LATERAL */

.cu-panel {
    position:absolute;
    right:12px;
    top:12px;
    bottom:12px;
    width:345px;
    max-width:calc(100% - 24px);
    overflow-y:auto;
    z-index:10;
    padding:14px;
    background:linear-gradient(160deg,#09243b 0%,#071b2e 65%,#091a2a 100%);
    border:1px solid #276c91;
    border-radius:11px;
    box-shadow:0 12px 35px rgba(0,0,0,.55),inset 0 0 20px rgba(0,180,255,.04);
    scrollbar-width:thin;
    scrollbar-color:#246184 #071b2e;
}

.cu-panel[hidden] {
    display:none!important;
}

.cu-cerrar {
    position:absolute;
    top:10px;
    right:12px;
    background:none;
    border:0;
    color:#d9e9f4;
    font-size:17px;
    cursor:pointer;
}

.cu-panel-encabezado {
    display:flex;
    align-items:center;
    gap:11px;
    padding:3px 20px 13px 0;
}

.cu-panel-icono {
    width:49px;
    height:49px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    background:linear-gradient(145deg,#06436a,#082c48);
    border:1px solid #145b84;
    border-radius:8px;
    color:#08c9ff;
    font-size:25px;
    box-shadow:inset 0 0 15px rgba(0,190,255,.12);
}

.cu-panel-numero {
    margin-bottom:5px;
    color:#15cfff;
    font-size:11px;
    font-weight:800;
}

.cu-panel-titulo {
    margin:0;
    color:#fff;
    font-size:19px;
    line-height:1.3;
    font-weight:800;
}

.cu-panel-descripcion {
    padding-bottom:13px;
    margin-bottom:13px;
    border-bottom:1px solid #284a62;
    font-size:11px;
    line-height:1.7;
    color:#d4e2ed;
}

.cu-panel-actividades {
    padding-top:0;
    border-top:0;
}

.cu-panel-actividades>strong {
    display:block;
    font-size:12px;
    margin-bottom:12px;
    color:#e7f5ff;
}

.cu-panel-actividades>p {
    margin:0 0 9px;
    color:#cbdce9;
    font-size:12px;
}

.cu-panel-actividades>p i {
    color:#13dca1;
    margin-right:8px;
}

/* GUÍA INTERACTIVA */

.cu-guia {
    display:flex;
    flex-direction:column;
    gap:12px;
}

.cu-guia-seccion {
    padding-bottom:12px;
    border-bottom:1px solid #284a62;
}

.cu-guia-titulo {
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:9px;
    color:#0fc8ff;
    font-size:10px;
    font-weight:800;
}

.cu-guia-titulo i {
    width:27px;
    text-align:center;
    font-size:23px;
    color:#00c8ff;
}

.cu-guia-ruta {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:10px 8px;
    background:linear-gradient(90deg,#07539b,#0874d1);
    border:1px solid #0b9dff;
    border-radius:6px;
    color:#fff;
    font-size:11px;
    font-weight:700;
    box-shadow:inset 0 0 12px rgba(255,255,255,.06);
}

.cu-guia-ruta i {
    color:#e2f7ff;
}

.cu-guia-texto {
    padding-left:37px;
    font-size:11px;
    line-height:1.6;
    color:#e0edf7;
}

.cu-guia-datos {
    margin-left:37px;
    padding:8px 9px;
    background:rgba(5,20,35,.65);
    border:1px solid #244d68;
    border-radius:6px;
}

.cu-guia-dato {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-bottom:7px;
    font-size:10.5px;
    line-height:1.45;
    color:#dceaf5;
}

.cu-guia-dato:last-child {
    margin-bottom:0;
}

.cu-guia-dato i {
    margin-top:2px;
    color:#0ee68b;
    font-size:12px;
}

.cu-guia-nota {
    display:flex;
    gap:9px;
    margin-top:10px;
    padding:9px;
    border:1px solid #365773;
    border-radius:5px;
    background:rgba(71,112,143,.24);
    color:#c9dce9;
    font-size:10px;
    line-height:1.5;
}

.cu-guia-nota i {
    color:#a8cce8;
    font-size:16px;
}

.cu-guia-boton {
    display:block;
    width:100%;
    padding:12px 10px;
    border:1px solid #168cff;
    border-radius:6px;
    background:linear-gradient(90deg,#075bc8,#087dff);
    color:#fff;
    font-size:12px;
    font-weight:800;
    text-align:center;
    cursor:pointer;
}

.cu-guia-boton i {
    margin-right:7px;
    font-size:15px;
}

.cu-guia-boton:hover {
    background:linear-gradient(90deg,#0874e8,#119aff);
}

.cu-guia-boton:disabled {
    opacity:.65;
    cursor:not-allowed;
}

/* ESTACIÓN SELECCIONADA */

.cu-plano.cu-enfocado .cu-nodo:not(.activo) {
    opacity:.35;
}

.cu-plano.cu-enfocado .cu-lineas {
    opacity:.25;
}

/* BOTONES DE REFERENCIA DEL CIRCUITO */

.cu-guia-item {
    display:flex;
    align-items:flex-start;
    gap:8px;
}

.cu-guia-item > span {
    flex:1;
}

.cu-btn-referencia {
    flex:none;
    border:1px solid #267da9;
    background:#123c59;
    color:#50d2ff;
    border-radius:6px;
    padding:4px 7px;
    font-size:12px;
    cursor:pointer;
    transition:.2s;
}

.cu-btn-referencia:hover {
    background:#17608a;
    color:#fff;
    box-shadow:0 0 12px rgba(16,197,255,.3);
}

.cu-btn-ver-pdf {
    display:block;
    width:100%;
    margin-top:12px;
    padding:10px;
    font-weight:700;
}

/* MODALES INFORMATIVOS */

.cu-ref-modal .modal-dialog {
    max-width:780px;
}

.cu-ref-modal .modal-content {
    background:#081d30;
    border:1px solid #287da8;
    border-radius:12px;
    color:#eaf5ff;
    box-shadow:0 20px 60px rgba(0,0,0,.6);
}

.cu-ref-modal .modal-header {
    background:#0d2b45;
    border-bottom:1px solid #285673;
    border-radius:12px 12px 0 0;
    padding:18px 22px;
}

.cu-ref-modal .modal-title {
    color:#fff;
    font-size:18px;
    font-weight:700;
}

.cu-ref-modal .modal-title i {
    color:#16c5ff;
    margin-right:10px;
}

.cu-ref-modal .close {
    color:#fff;
    opacity:.85;
}

.cu-ref-modal .modal-body {
    padding:24px;
    max-height:65vh;
    overflow-y:auto;
}

.cu-ref-modal .modal-footer {
    border-top:1px solid #285673;
    padding:14px 22px;
}

.cu-ref-pasos {
    display:flex;
    flex-direction:column;
    gap:10px;
}

.cu-ref-paso {
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:11px 13px;
    background:#102c43;
    border:1px solid #244a64;
    border-radius:7px;
    font-size:13px;
    line-height:1.5;
    color:#dcecf8;
}

.cu-ref-indice {
    display:flex;
    align-items:center;
    justify-content:center;
    flex:none;
    width:25px;
    height:25px;
    border-radius:50%;
    background:#125a7d;
    color:#8ce6ff;
    font-weight:700;
    font-size:12px;
}

.cu-ref-seccion {
    margin-bottom:24px;
}

.cu-ref-seccion h4 {
    color:#40cfff;
    font-size:15px;
    font-weight:700;
    margin:0 0 12px;
}

.cu-ref-ruta {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px;
    padding:11px 13px;
    margin-bottom:15px;
    background:#123f64;
    border:1px solid #276e9c;
    border-radius:7px;
    color:#fff;
    font-size:12px;
    font-weight:600;
}

.cu-ref-ruta i {
    color:#56caff;
    font-size:10px;
}

.cu-ref-nota {
    display:flex;
    align-items:flex-start;
    gap:10px;
    margin-top:18px;
    padding:14px;
    background:#12334c;
    border:1px solid #286589;
    border-radius:8px;
    color:#a8dfff;
    font-size:12px;
    line-height:1.6;
}

.cu-ref-nota i {
    color:#38c9ff;
    margin-top:2px;
}

.cu-ref-descripcion {
    color:#cbdce9;
    font-size:13px;
    line-height:1.7;
    margin-bottom:18px;
}


/* TUTORIAL INTERACTIVO - CIRCUITO DE USO */

.cu-tutorial-modal .modal-dialog {
    max-width:780px;
}

.cu-tutorial-subtitulo {
    display:block;
    margin:7px 0 0 29px;
    color:#65cfff;
    font-size:10px;
    letter-spacing:1.5px;
    font-weight:700;
}

.cu-tutorial-superior {
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:12px;
}

.cu-tutorial-etiqueta {
    font-size:11px;
    font-weight:700;
    color:#8ccce9;
    letter-spacing:.6px;
}

.cu-tutorial-contador {
    color:#55d6ff;
    background:#123c59;
    border:1px solid #287da8;
    padding:5px 10px;
    border-radius:20px;
    font-size:11px;
    font-weight:700;
}

.cu-tutorial-progreso {
    display:flex;
    gap:6px;
    margin-bottom:20px;
}

.cu-tutorial-progreso span {
    flex:1;
    height:6px;
    background:#29475b;
    border-radius:10px;
    transition:background .25s,box-shadow .25s;
}

.cu-tutorial-progreso span.activo {
    background:#20c6ff;
    box-shadow:0 0 9px rgba(32,198,255,.45);
}

.cu-tutorial-tarjeta {
    background:#102c43;
    border:1px solid #285673;
    border-radius:12px;
    padding:20px;
    animation:cuTutorialEntrada .25s ease;
}

@keyframes cuTutorialEntrada {
    from {opacity:0;transform:translateY(8px);}
    to {opacity:1;transform:translateY(0);}
}

.cu-tutorial-cabecera {
    display:flex;
    align-items:center;
    gap:15px;
    margin-bottom:16px;
}

.cu-tutorial-icono {
    display:flex;
    align-items:center;
    justify-content:center;
    flex:none;
    width:58px;
    height:58px;
    background:#164868;
    border:1px solid #287da8;
    border-radius:12px;
    color:#67d9ff;
    font-size:27px;
}

.cu-tutorial-numero {
    display:block;
    color:#67d9ff;
    font-size:10px;
    font-weight:700;
    letter-spacing:1px;
    margin-bottom:5px;
}

.cu-tutorial-cabecera h3 {
    margin:0;
    color:#fff;
    font-size:19px;
    font-weight:700;
}

.cu-tutorial-descripcion {
    color:#dcecf8;
    font-size:13px;
    line-height:1.7;
    margin-bottom:20px;
}

.cu-tutorial-ejemplo {
    background:#081d30;
    border:1px solid #244a64;
    border-radius:9px;
    padding:18px;
}

.cu-demo-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}

.cu-demo-campo label {
    display:block;
    color:#9ed9f4;
    font-size:11px;
    font-weight:700;
    margin-bottom:7px;
}

.cu-tutorial-modal .cu-demo-campo .form-control {
    background:#112f47!important;
    border:1px solid #346380!important;
    border-radius:6px;
    color:#fff!important;
    opacity:1;
    height:36px;
    font-size:13px;
}

.cu-demo-agregar {
    margin-top:13px;
    padding:9px 14px;
    background:#126b91;
    border:1px solid #26b9f0;
    border-radius:6px;
    color:#fff;
    cursor:default;
    font-size:12px;
    font-weight:700;
}

.cu-demo-token {
    display:flex;
    align-items:center;
    gap:15px;
}

.cu-demo-token > i {
    font-size:35px;
    color:#48d2ff;
}

.cu-demo-token .cu-demo-campo {
    flex:1;
}

.cu-demo-aviso {
    margin-top:14px;
    padding:11px;
    background:#12334c;
    border-left:3px solid #28c8ff;
    color:#a8dfff;
    font-size:11px;
    line-height:1.6;
}

.cu-demo-final {
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    gap:10px;
    padding:15px;
}

.cu-demo-final > i {
    font-size:48px;
    color:#11dc91;
}

.cu-demo-final strong {
    font-size:17px;
    color:#fff;
}

.cu-demo-final span {
    color:#a8c8db;
    font-size:12px;
}

.cu-demo-final .btn {
    margin-top:8px;
    opacity:1;
}

.cu-tutorial-footer {
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.cu-tutorial-anterior {
    background:#17364e;
    color:#dcecf8;
    border:1px solid #315a73;
}

.cu-tutorial-anterior:hover {
    background:#244c68;
    color:#fff;
}

.cu-tutorial-siguiente {
    background:#087fb3;
    color:#fff;
    border:1px solid #20bfff;
    font-weight:700;
}

.cu-tutorial-siguiente:hover {
    background:#0b9ad4;
    color:#fff;
}

.cu-tutorial-anterior:disabled {
    opacity:.35;
}

@media(max-width:576px) {
    .cu-tutorial-tarjeta {
        padding:14px;
    }

    .cu-demo-grid {
        grid-template-columns:1fr;
    }

    .cu-tutorial-cabecera h3 {
        font-size:16px;
    }

    .cu-tutorial-icono {
        width:46px;
        height:46px;
        font-size:22px;
    }
}
