/* Viraleza Custom Styles */

html {
    /* font-size: 14px; */
}

/* h1 keeps default browser size (32px) and isn't reduced by root font-size */
h1 {
    font-size: 32px !important;
}

:root {
    --primary: #000000; /* Black */
    --primary-hover: #171717; /* Dark gray hover */
    --primary-light: #404040; /* Gray 700 */
    --primary-dark: #000000; /* Black */
}

/* Primary Buttons */
.btn-primary {
    background-color: var(--primary);
    color: white;
}

.btn-primary:hover {
    background-color: var(--primary-hover);
}

/* Focus rings */
.focus-ring-primary:focus {
    outline: none;
    ring: 2px;
    ring-color: var(--primary);
}

/* Tailwind overrides for primary color */
.bg-primary {
    background-color: var(--primary) !important;
}

.bg-primary-hover:hover {
    background-color: var(--primary-hover) !important;
}

.text-primary {
    color: var(--primary) !important;
}

.border-primary {
    border-color: var(--primary) !important;
}

/* Custom checkbox/radio colors */
input[type="checkbox"]:checked,
input[type="radio"]:checked {
    background-color: var(--primary);
    border-color: var(--primary);
}

/* Links */
a.link-primary {
    color: var(--primary);
}

a.link-primary:hover {
    color: var(--primary-hover);
}