/* Reset principal del switch */
body .ui-inputswitch.ui-widget.ui-widget-content {
    position: relative !important;
    display: inline-block !important;
    width: 51px !important;
    height: 31px !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 31px !important;
    background-color: #e9e9eb !important;
    cursor: pointer !important;
    overflow: hidden !important;
    box-shadow: none !important;
}

/* Estado activo */
body .ui-inputswitch.ui-widget.ui-widget-content.ui-inputswitch-checked {
    background-color: #004571 !important;
}

/* Sobreescribir específicamente el handle del switch */
body .ui-inputswitch .ui-inputswitch-handle.ui-state-default {
    display: block !important;
    position: absolute !important;
    top: 1.5px !important;
    left: 1.5px !important;
    width: 28px !important;
    height: 28px !important;
    background: #FFFFFF !important;
    border: none !important;
    border-radius: 50% !important;
    box-shadow: 0 3px 8px rgba(0,0,0,0.15) !important;
    transition: all 0.2s ease-in-out !important;
    margin: 0 !important;
    padding: 0 !important;
    /* Eliminar estilos por defecto de PrimeFaces */
    background-image: none !important;
    text-shadow: none !important;
    font-weight: normal !important;
    -moz-box-shadow: 0 3px 8px rgba(0,0,0,0.15) !important;
    -webkit-box-shadow: 0 3px 8px rgba(0,0,0,0.15) !important;
}

/* Posición del handle cuando está activo */
body .ui-inputswitch.ui-inputswitch-checked .ui-inputswitch-handle.ui-state-default {
    left: calc(51px - 29.5px) !important; /* Ancho total - (ancho del handle + 1.5px) */
    background: #FFFFFF !important;
}

/* Eliminar estados hover/focus por defecto */
body .ui-inputswitch .ui-inputswitch-handle.ui-state-hover,
body .ui-inputswitch .ui-inputswitch-handle.ui-state-focus,
body .ui-inputswitch .ui-inputswitch-handle.ui-state-active {
    background: #FFFFFF !important;
    border: none !important;
    box-shadow: 0 3px 12px rgba(0,0,0,0.2) !important;
}

/* Ocultar textos On/Off */
body .ui-inputswitch-on,
body .ui-inputswitch-off {
    display: none !important;
    visibility: hidden !important;
}

/* Estado deshabilitado */
body .ui-inputswitch.ui-state-disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

/* Asegurar que no hay estilos residuales del tema */
body .ui-inputswitch .ui-inputswitch-handle.ui-state-default[style] {
    width: 28px !important;
}