/* Fix WP styles */
div.notice {
    display: inline-block;

    a {
        color: #135e96;
        text-decoration-line: underline;
    }
}

.wco-plugin {
    li {
        margin-bottom: 0px;
    }
    
    #wp-cache-on-settings-form  {
        select {
            background-color: #f9fafb; /* Tailwind bg-gray-50 */
            border: 1px solid #d1d5db; /* Tailwind border-gray-300 */
            color: #111827; /* Tailwind text-gray-900 */
            font-size: 0.875rem; /* Tailwind text-sm */
            border-radius: 0.375rem; /* Tailwind rounded-lg */
            padding: 0.625rem; /* Tailwind p-2.5 */
            width: 100%;
            box-sizing: border-box;
            transition: border-color 0.2s, box-shadow 0.2s;
        }

        input {
             /* Background colors */
            background-color: #f9fafb; /* Tailwind bg-gray-50 */
            color: #111827; /* Tailwind text-gray-900 */
            /* Border */
            border: 1px solid #d1d5db; /* Tailwind border-gray-300 */
            /* Font */
            font-size: 0.875rem; /* Tailwind text-sm */
            /* Border radius */
            border-radius: 0.375rem; /* Tailwind rounded-lg */
            /* Focus ring (light mode) */
            transition: border-color 0.2s, box-shadow 0.2s; /* Tailwind focus effect */
            outline: none;
            box-shadow: 0 0 0 2px transparent; /* Initial state */
            /* On focus */
            &:focus {
                box-shadow: 0 0 0 2px #3b82f6; /* Tailwind focus:ring-blue-500 */
                border-color: #3b82f6; /* Tailwind focus:border-blue-500 */
            }
            /* Spacing */
            padding: 0.625rem; /* Tailwind p-2.5 */
            width: 100%; /* Tailwind w-full */
        }

        #default-checkbox {
            /* Width and height */
            width: 1rem; /* Tailwind w-4 */
            height: 1rem; /* Tailwind h-4 */
        
            /* Text color */
            color: #2563eb; /* Tailwind text-blue-600 */
        
            /* Background color */
            background-color: #f3f4f6; /* Tailwind bg-gray-100 */
        
            /* Border */
            border: 1px solid #d1d5db; /* Tailwind border-gray-300 */
        
            /* Border radius */
            border-radius: 0.375rem; /* Tailwind rounded */
        
            /* Focus ring */
            outline: none; /* Remove default focus styles */
            box-shadow: 0 0 0 2px transparent; /* Initial state */
            transition: box-shadow 0.2s ease, border-color 0.2s ease;
        
            /* Focus styles */
            &:focus {
                box-shadow: 0 0 0 2px #3b82f6; /* Tailwind focus:ring-blue-500 */
            }
        }        
    }
}