﻿/* Southern States Utility Theme - Replace Purple with Brand Colors */

/* Primary text and elements - use dark blue-gray instead of cream for readability */
.has-text-primary {
    color: #213c4e !important;
}

.has-background-primary {
    background-color: #213c4e !important;
}

/* Catch-all for any remaining primary color references */
*[class*="primary"]:not(.is-success):not(.is-danger):not(.is-warning):not(.is-info):not(.is-link) {
    color: #213c4e !important;
}

/* Table styling with Southern States colors */
.ui.orange.table {
    border-top: 0.2em solid #213c4e !important;
}

    .ui.orange.table thead th {
        background-color: #213c4e !important;
        color: white !important;
    }

    .ui.orange.table tbody tr:hover {
        background-color: rgba(33, 60, 78, 0.1) !important;
    }

.ui.orange.striped.table > tr:nth-child(2n) > td,
.ui.orange.striped.table tbody tr:nth-child(2n) > td {
    background-color: rgba(33, 60, 78, 0.05) !important;
}

/* Primary color hover states */
a.has-text-primary:hover, a.has-text-primary:focus {
    color: #182241 !important;
}

/* Border utilities with new primary color */
.has-border-top-primary-1,
.has-border-top-primary-2,
.has-border-top-primary-3,
.has-border-top-primary-4 {
    border-top-color: #213c4e !important;
}

.has-border-left-primary-1,
.has-border-left-primary-2,
.has-border-left-primary-3 {
    border-left-color: #213c4e !important;
}

/* Primary Button States - Dark Blue-Gray */
.button.is-primary {
    background-color: #213c4e !important;
    border-color: #213c4e !important;
    color: white !important;
}

    .button.is-primary:hover,
    .button.is-primary.is-hovered {
        background-color: #182241 !important;
        border-color: #182241 !important;
        color: white !important;
    }

    .button.is-primary:focus,
    .button.is-primary.is-focused {
        background-color: #182241 !important;
        border-color: #182241 !important;
        color: white !important;
        box-shadow: 0 0 0 0.125em rgba(33, 60, 78, 0.25) !important;
    }

    .button.is-primary:active,
    .button.is-primary.is-active {
        background-color: #0f1a2e !important;
        border-color: #0f1a2e !important;
        color: white !important;
    }

    .button.is-primary[disabled],
    .button.is-primary:disabled {
        background-color: #213c4e !important;
        border-color: #213c4e !important;
        box-shadow: none !important;
        opacity: 0.5 !important;
        color: white !important;
    }

    /* Outlined Primary Buttons */
    .button.is-primary.is-outlined {
        background-color: transparent !important;
        border-color: #213c4e !important;
        color: #213c4e !important;
    }

        .button.is-primary.is-outlined:hover,
        .button.is-primary.is-outlined.is-hovered {
            background-color: #213c4e !important;
            border-color: #213c4e !important;
            color: white !important;
        }

        .button.is-primary.is-outlined:focus,
        .button.is-primary.is-focused {
            background-color: #213c4e !important;
            border-color: #213c4e !important;
            color: white !important;
            box-shadow: 0 0 0 0.125em rgba(33, 60, 78, 0.25) !important;
        }

        .button.is-primary.is-outlined:active,
        .button.is-primary.is-outlined.is-active {
            background-color: #182241 !important;
            border-color: #182241 !important;
            color: white !important;
        }

        .button.is-primary.is-outlined[disabled],
        .button.is-primary.is-outlined:disabled {
            background-color: transparent !important;
            border-color: #213c4e !important;
            color: #213c4e !important;
            opacity: 0.5 !important;
        }

/* Success Button States - Medium Blue-Gray for action buttons */
.button.is-success {
    background-color: #536c7c !important;
    border-color: #536c7c !important;
    color: white !important;
}

    .button.is-success:hover,
    .button.is-success.is-hovered {
        background-color: #213c4e !important;
        border-color: #213c4e !important;
        color: white !important;
    }

    .button.is-success:focus,
    .button.is-success.is-focused {
        background-color: #213c4e !important;
        border-color: #213c4e !important;
        color: white !important;
        box-shadow: 0 0 0 0.125em rgba(83, 108, 124, 0.25) !important;
    }

    .button.is-success:active,
    .button.is-success.is-active {
        background-color: #182241 !important;
        border-color: #182241 !important;
        color: white !important;
    }

    .button.is-success[disabled],
    .button.is-success:disabled {
        background-color: #536c7c !important;
        border-color: #536c7c !important;
        box-shadow: none !important;
        opacity: 0.5 !important;
        color: white !important;
    }

    /* Outlined Success Buttons */
    .button.is-success.is-outlined {
        background-color: transparent !important;
        border-color: #536c7c !important;
        color: #536c7c !important;
    }

        .button.is-success.is-outlined:hover,
        .button.is-success.is-outlined.is-hovered {
            background-color: #536c7c !important;
            border-color: #536c7c !important;
            color: white !important;
        }

        .button.is-success.is-outlined:focus,
        .button.is-success.is-outlined.is-focused {
            background-color: #536c7c !important;
            border-color: #536c7c !important;
            color: white !important;
            box-shadow: 0 0 0 0.125em rgba(83, 108, 124, 0.25) !important;
        }

        .button.is-success.is-outlined:active,
        .button.is-success.is-outlined.is-active {
            background-color: #213c4e !important;
            border-color: #213c4e !important;
            color: white !important;
        }

        .button.is-success.is-outlined[disabled],
        .button.is-success.is-outlined:disabled {
            background-color: transparent !important;
            border-color: #536c7c !important;
            color: #536c7c !important;
            opacity: 0.5 !important;
        }

/* Force all button content to be visible */
.button.is-primary * {
    color: white !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.button.is-primary {
    color: white !important;
    background-color: #213c4e !important;
    border-color: #213c4e !important;
    font-size: 1rem !important;
    font-weight: normal !important;
    text-decoration: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}

    /* Fix outlined button icons and text */
    .button.is-primary.is-outlined span,
    .button.is-primary.is-outlined .icon,
    .button.is-primary.is-outlined .fas {
        color: #213c4e !important;
    }

    .button.is-primary.is-outlined:hover span,
    .button.is-primary.is-outlined:hover .icon,
    .button.is-primary.is-outlined:hover .fas {
        color: white !important;
    }

/* Special styling for cream backgrounds where appropriate */
.formbox {
    background-color: #fff5d9 !important;
    border-top: 4px solid #213c4e !important;
}

/* Alternative: If you want some backgrounds to use the cream color */
.notification.is-light,
.hero.is-light {
    background-color: #fff5d9 !important;
    color: #213c4e !important;
}

/* Navbar and form styling */
nav.navbar {
    border-top: 4px solid #213c4e !important;
}

/* Override any conflicting styles */
.button.is-primary.is-outlined:hover {
    background-color: #213c4e !important;
    border-color: #213c4e !important;
    color: white !important;
}


/* Additional CSS to fix remaining purple elements on login page */

/* Force override any remaining primary color text */
.has-text-primary,
.subtitle strong,
p.subtitle strong {
    color: #213c4e !important;
}

/* Force override primary buttons with higher specificity */
button.button.is-primary,
.button.is-medium.is-primary,
button.is-primary {
    background-color: #213c4e !important;
    border-color: #213c4e !important;
    color: white !important;
}

    button.button.is-primary:hover,
    .button.is-medium.is-primary:hover,
    button.is-primary:hover {
        background-color: #182241 !important;
        border-color: #182241 !important;
        color: white !important;
    }

/* Force override border utilities */
.has-border-left-primary-3,
.has-border-top-primary-4,
.has-border-top-primary-1,
.has-border-top-primary-2 {
    border-color: #213c4e !important;
}

/* Specific targeting for notification borders */
.notification.has-border-left-primary-3 {
    border-left-color: #213c4e !important;
    border-left-width: 0.25rem !important;
    border-left-style: solid !important;
}

/* Force all icon colors in primary contexts */
.has-text-primary .icon,
.has-text-primary i,
.fas.fa-envelope {
    color: #213c4e !important;
}

/* Additional button content overrides */
.button.is-primary span,
.button.is-primary .icon,
.button.is-primary .fas {
    color: white !important;
}

/* Hero section primary colors */
.hero .has-text-primary {
    color: #213c4e !important;
}

/* Form box background using cream color */
.formbox {
    background-color: #fff5d9 !important;
    border-top-color: #213c4e !important;
}

/* Ensure input validation danger states still work */
.input.is-danger {
    border-color: #ff3860 !important;
}

.help.is-danger {
    color: #ff3860 !important;
}

/* AGGRESSIVE OVERRIDES - Add to the very end of semantic-override.css */

/* Nuclear option - override ALL primary colors with maximum specificity */
html body .has-text-primary,
html body .has-text-primary *,
html body .subtitle .has-text-primary,
html body .subtitle strong,
html body p.subtitle strong {
    color: #213c4e !important;
}

html body .has-background-primary,
html body .has-background-primary * {
    background-color: #213c4e !important;
}

/* Nuclear option - override ALL primary buttons */
html body .button.is-primary,
html body button.button.is-primary,
html body .button.is-medium.is-primary,
html body button.is-primary,
html body input[type="submit"].button.is-primary,
html body input[type="button"].button.is-primary {
    background-color: #213c4e !important;
    border-color: #213c4e !important;
    color: white !important;
}

    html body .button.is-primary:hover,
    html body button.button.is-primary:hover,
    html body .button.is-medium.is-primary:hover,
    html body button.is-primary:hover {
        background-color: #182241 !important;
        border-color: #182241 !important;
        color: white !important;
    }

    html body .button.is-primary:active,
    html body button.button.is-primary:active,
    html body .button.is-medium.is-primary:active,
    html body button.is-primary:active {
        background-color: #0f1a2e !important;
        border-color: #0f1a2e !important;
        color: white !important;
    }

    /* Force all button text and icons to be white */
    html body .button.is-primary *,
    html body .button.is-primary span,
    html body .button.is-primary .icon,
    html body .button.is-primary i {
        color: white !important;
    }

/* Override any CSS custom properties/variables that might be setting purple */
:root {
    --bulma-primary: #213c4e !important;
    --bulma-primary-h: 210deg !important;
    --bulma-primary-s: 30% !important;
    --bulma-primary-l: 22% !important;
}

/* Force override any remaining border utilities */
html body .has-border-left-primary-3,
html body .has-border-top-primary-4,
html body .has-border-top-primary-1,
html body .has-border-top-primary-2,
html body .has-border-top-primary-3,
html body .has-border-left-primary-1,
html body .has-border-left-primary-2 {
    border-color: #213c4e !important;
}

/* Target the specific notification class from login page */
html body .notification.has-border-left-primary-3 {
    border-left: 0.25rem solid #213c4e !important;
}

/* Override the form box background */
html body .formbox {
    background-color: #fff5d9 !important;
    border-top: 4px solid #213c4e !important;
}

/* Override navbar border */
html body nav.navbar {
    border-top: 4px solid #213c4e !important;
}

/* Fix for table button hover states - Add to semantic-override.css */

/* Fix table row hover affecting button text */
.ui.orange.table tbody tr:hover .button,
.ui.orange.table tbody tr:hover .button span,
.ui.orange.table tbody tr:hover .button * {
    color: white !important;
}

/* Specific fix for buttons inside table cells */
.ui.orange.table td .button {
    background-color: #213c4e !important;
    border-color: #213c4e !important;
    color: white !important;
}

    .ui.orange.table td .button:hover {
        background-color: #182241 !important;
        border-color: #182241 !important;
        color: white !important;
    }

    /* Fix for any outlined buttons in tables */
    .ui.orange.table td .button.is-outlined {
        background-color: transparent !important;
        border-color: #213c4e !important;
        color: #213c4e !important;
    }

        .ui.orange.table td .button.is-outlined:hover {
            background-color: #213c4e !important;
            border-color: #213c4e !important;
            color: white !important;
        }

/* Ensure button text is always visible regardless of parent hover states */
table .button,
.table .button {
    color: white !important;
    background-color: #213c4e !important;
}

    table .button:hover,
    .table .button:hover {
        color: white !important;
        background-color: #182241 !important;
    }

    /* Force override for any button text inside tables */
    table .button span,
    .table .button span,
    table .button *,
    .table .button * {
        color: white !important;
    }

/* Fix for Semantic UI table hover states interfering with buttons */
.ui.table tbody tr:hover .button {
    color: white !important;
    background-color: #213c4e !important;
}

    .ui.table tbody tr:hover .button:hover {
        color: white !important;
        background-color: #182241 !important;
    }