/* Global site styles */

:root {
    --bs-font-sans-serif: "Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

body {
    font-family: var(--bs-font-sans-serif);
    font-optical-sizing: auto;
    font-style: normal;
}

/* Validation state styling (jQuery Unobtrusive + Bootstrap 5) */
input.input-validation-error,
select.input-validation-error,
textarea.input-validation-error {
    border-color: #dc3545 !important;
    padding-right: calc(1.5em + .75rem);
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem);
}

input.valid, select.valid, textarea.valid {
    border-color: #198754 !important;
}

/* Ensure unobtrusive error messages appear */
span.field-validation-error,
span.invalid-feedback { display: block; }

/* For checkboxes/radios adjust spacing */
.form-check .field-validation-error { margin-top: .25rem; }

/* Navbar theme (orange) */
.navbar-orange {
    background-color: #e18c03;
}
.navbar-orange .navbar-brand,
.navbar-orange .nav-link,
.navbar-orange .navbar-text { color: #fff; }
    .navbar-orange .nav-link.active,
    .navbar-orange .nav-link:focus,
    .navbar-orange .nav-link:hover {
        color: #ead6b5;
    }

/* Outline style for navbar items */
.navbar-orange .nav-link {
    border: 1px solid rgba(255,255,255,0.45);
    border-radius: .375rem;
    margin: 0 .25rem;
    padding: .35rem .75rem;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.navbar-orange .nav-link:hover,
.navbar-orange .nav-link:focus {
    background: rgba(255,255,255,0.12);
    border-color: rgba(255,255,255,0.7);
}

.navbar-orange .nav-link.active {
    background: rgba(255,255,255,0.18);
    border-color: rgba(255,255,255,0.85);
}

.navbar-orange .nav-link:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}

/* Extra vertical spacing when navbar is collapsed (hamburger menu) */
@media (max-width: 991.98px) { /* below lg breakpoint */
    .navbar-orange .navbar-nav .nav-link {
        margin: .45rem 0; /* vertical spacing */
        width: 100%; /* full width tap target */
    }
}

/* Utility spacing tweaks */
.content-container { padding-top: 1rem; padding-bottom: 2rem; }

/* Admin table layout stability */
.participants-table,
.raceentries-table {
    table-layout: fixed;
    width: 100%;
}

.participants-table td,
.raceentries-table td {
    vertical-align: middle;
}

.participants-table .comments-col {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.participants-table .comments-col.participant-edit {
    white-space: normal;
    overflow: visible;
}

/* Public entries table */
.public-entries-table {
    table-layout: fixed;
    width: 100%;
}

.public-entries-table td, 
.public-entries-table th {
    vertical-align: top;
}

.category-id-col { width: 60px; }
.category-identifier-col { width: 120px; }
.club-name-col { width: 180px; }
.participant-col { min-width: 150px; }

/* Mobile responsive for public entries */
@media (max-width: 991px) {
    .public-entries-table {
        min-width: 600px; /* Ensure table has enough width for mobile participants column */
    }
    
    .desktop-participants { display: none; }
    .mobile-participants { 
        display: table-cell; 
        min-width: 200px;
    }
}

@media (min-width: 992px) {
    .desktop-participants { display: table-cell; }
    .mobile-participants { display: none; }
}

/* Placeholder for future theming (buttons, tables, etc.) */