/* Foys Page Mobile Fixes - Button Colors */

@media (max-width: 768px) {
    
    /* CRITICAL: Force btn-primary button colors on foys page */
    /* Use very specific selectors to override all other styles */
    .page-layout .page-header a.btn-primary,
    .page-layout .page-header a.btn-primary.inline-flex,
    .page-layout .page-header a.btn-primary.items-center,
    .page-layout .page-header a[href*="foys/create"],
    .page-layout .page-header .mt-4 a.btn-primary,
    .page-layout .page-header .mt-4.sm\:mt-0 a.btn-primary,
    .page-layout .page-header .flex a.btn-primary,
    .page-layout .page-header .flex.items-center a.btn-primary,
    a[href="#!/foys/create"].btn-primary,
    a[href="#!/foys/create"].btn-primary.inline-flex,
    a[href="#!/foys/create"].btn-primary.items-center {
        background-color: rgb(31, 60, 124) !important;
        background: rgb(31, 60, 124) !important;
        background-image: none !important;
        color: #ffffff !important;
        border: none !important;
        border-color: transparent !important;
        -webkit-text-fill-color: #ffffff !important;
        text-shadow: none !important;
    }
    
    .page-layout .page-header a.btn-primary:hover,
    .page-layout .page-header a.btn-primary.inline-flex:hover,
    .page-layout .page-header a.btn-primary.items-center:hover,
    .page-layout .page-header a[href*="foys/create"]:hover,
    .page-layout .page-header .mt-4 a.btn-primary:hover,
    .page-layout .page-header .mt-4.sm\:mt-0 a.btn-primary:hover,
    .page-layout .page-header .flex a.btn-primary:hover,
    .page-layout .page-header .flex.items-center a.btn-primary:hover,
    a[href="#!/foys/create"].btn-primary:hover,
    a[href="#!/foys/create"].btn-primary.inline-flex:hover {
        background-color: rgb(23, 48, 97) !important;
        background: rgb(23, 48, 97) !important;
        background-image: none !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        text-shadow: none !important;
    }
    
    /* Force icon color to white */
    .page-layout .page-header a.btn-primary i,
    .page-layout .page-header a.btn-primary.inline-flex i,
    .page-layout .page-header a.btn-primary.items-center i,
    .page-layout .page-header a[href*="foys/create"] i,
    .page-layout .page-header .mt-4 a.btn-primary i,
    .page-layout .page-header .mt-4.sm\:mt-0 a.btn-primary i,
    .page-layout .page-header .flex a.btn-primary i,
    .page-layout .page-header .flex.items-center a.btn-primary i,
    a[href="#!/foys/create"].btn-primary i,
    a[href="#!/foys/create"].btn-primary.inline-flex i {
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
    }
    
    /* Force ALL text inside button to white */
    .page-layout .page-header a.btn-primary *,
    .page-layout .page-header a.btn-primary.inline-flex *,
    .page-layout .page-header a[href*="foys/create"] *,
    a[href="#!/foys/create"].btn-primary * {
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
    }
}