/* Custom overrides for BulFencing theme */

/* Force html and body to maintain full height */
html,
body {
    height: 100% !important;
    min-height: 100% !important;
}

/* Force footer to stay at bottom */
.footer-area {
    margin-top: auto !important;
    position: relative !important;
}

.main-content {
    min-height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Ensure container takes full height */
.container-fluid {
    height: 100% !important;
    min-height: 100% !important;
}

/* Prevent sidebar JS from breaking layout */
body.boxed-size {
    height: 100% !important;
    margin: 0 !important;
}

/* Make content area flex to push footer down */
.main-content>div:first-of-type {
    flex: 1 !important;
}
.main-content.no-card-stretch>div:first-of-type {
    flex: 0 !important;
}

/* Hide burger menu buttons on desktop (widths >= 1200px) */
@media (min-width: 1200px) {

    #header-burger-menu,
    .header-burger-menu,
    #sidebar-burger-menu,
    .sidebar-burger-menu {
        display: none !important;
    }
}

/* Sidebar Menu Styling - Refined for "Left Column Labels" look */
.sidebar-area .menu-vertical .menu-item a.menu-link {
    display: flex !important;
    align-items: center !important;
    padding: 10px 15px !important;
    border-radius: 8px !important;
    transition: all 0.3s ease !important;
    margin-bottom: 5px !important;
}

.sidebar-area .menu-vertical .menu-item a.menu-link .title {
    font-size: 14px !important;
    font-weight: 500 !important;
    margin-left: 10px !important;
    white-space: normal !important;
    /* Allow wrapping */
    line-height: 1.3 !important;
    color: #555 !important;
}

.sidebar-area .menu-vertical .menu-item a.menu-link .menu-icon {
    flex-shrink: 0 !important;
    width: 20px !important;
    height: 20px !important;
    color: #555 !important;
}

/* Active Menu Item - Green Background as Requested */
.sidebar-area .menu-vertical .menu-item a.menu-link[href*="/club/"].active,
.sidebar-area .menu-vertical .menu-item a.menu-link[href*="/club/"]:hover,
.sidebar-area .menu-vertical .menu-item a.menu-link[href*="/coach/"].active,
.sidebar-area .menu-vertical .menu-item a.menu-link[href*="/coach/"]:hover,
.sidebar-area .menu-vertical .menu-item a.menu-link.active,
/* Catch-all for active */
.sidebar-area .menu-vertical .menu-item a.menu-link:hover {
    background-color: #004c35 !important;
    color: white !important;
    box-shadow: 0 4px 6px rgba(0, 76, 53, 0.2) !important;
}

.sidebar-area .menu-vertical .menu-item a.menu-link.active .title,
.sidebar-area .menu-vertical .menu-item a.menu-link:hover .title,
.sidebar-area .menu-vertical .menu-item a.menu-link[href*="/club/"].active .title,
.sidebar-area .menu-vertical .menu-item a.menu-link[href*="/club/"]:hover .title {
    color: white !important;
}

.sidebar-area .menu-vertical .menu-item a.menu-link.active .menu-icon,
.sidebar-area .menu-vertical .menu-item a.menu-link:hover .menu-icon,
.sidebar-area .menu-vertical .menu-item a.menu-link[href*="/club/"].active .menu-icon,
.sidebar-area .menu-vertical .menu-item a.menu-link[href*="/club/"]:hover .menu-icon {
    color: white !important;
}

/* GridView / Table Refinements */
.grid-view .table {
    border-radius: 15px !important;
    overflow: hidden !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border: 1px solid #dee2e6 !important;
    background-color: #fff !important;
}

.grid-view .table thead th {
    background-color: #f8f9fa !important;
    border-bottom: 2px solid #dee2e6 !important;
    color: #495057 !important;
    font-weight: 600 !important;
    padding: 15px !important;
    white-space: nowrap !important;
}

/* Home page: Top 3 cards */
.top-3-card-title {
    background-color: rgb(0 76 53) !important;
    color: #fff !important;
    font-size: 1.3rem !important;
    font-weight: 700 !important;
}

.top-3-card-list {
    font-size: 1.2rem !important;
    line-height: 1.5 !important;
    color: #212529 !important;
    padding-left: 1.5rem !important;
}

.top-3-fencer-name {
    color: #212529 !important;
    font-weight: 700 !important;
}

.top-3-card-item {
    list-style-position: outside !important;
}

.top-3-card-item::marker {
    font-weight: 700 !important;
}

.top-3-card-row {
    display: flex !important;
    justify-content: space-between !important;
    gap: 12px !important;
}

.top-3-fencer-points {
    color: #212529 !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
}

/* Home page: Upcoming races */
.upcoming-races-title {
    margin-bottom: 1.5rem !important;
    font-size: 1.3rem !important;
}

.upcoming-races-card {
    min-height: auto !important;
}

.upcoming-races-table thead th {
    background-color: rgb(0 76 53) !important;
    color: #fff !important;
    font-weight: 700 !important;
    font-size: 1.3rem !important;
}

.upcoming-races-table tbody td {
    font-size: 1.2rem !important;
    font-weight: 700 !important;
}

/* DetailView Redesign - Matching Form Styling & KILLING STRIPES */
.detail-view {
    border: none !important;
    background: transparent !important;
    margin-top: 20px !important;
    width: 100% !important;
    display: block !important;
}

.detail-view tbody {
    display: flex !important;
    flex-direction: column !important;
    gap: 25px !important;
    padding: 0 !important;
    background: transparent !important;
    width: 100% !important;
}

.detail-view tr {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    border: none !important;
    background: transparent !important;
    margin-bottom: 0 !important;
}

/* ID Hiding - Robust via First Child */
.detail-view tr:first-child {
    display: none !important;
}

@media (min-width: 992px) {
    .detail-view tbody {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 25px 40px !important;
        width: 100% !important;
    }

    /* Logo and Address span 2 columns to match form */
    .detail-view tr:has(th:contains("Лого")),
    .detail-view tr:has(th:contains("Адрес")),
    .detail-view tr:has(th:contains("Address")),
    .detail-view tr:has(th:contains("Logo")) {
        grid-column: span 2 !important;
    }
}

/* FORCE UNIFORMITY - Override any table-striped odd/even difference */
.detail-view tr:nth-of-type(odd),
.detail-view tr:nth-of-type(even) {
    background: transparent !important;
    --bs-table-accent-bg: transparent !important;
    box-shadow: none !important;
}

.detail-view th {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    padding: 0 0 8px 0 !important;
    font-weight: 500 !important;
    font-size: 1rem !important;
    color: #212529 !important;
    text-align: left !important;
    width: 100% !important;
    display: block !important;
    margin-bottom: 0 !important;
    box-shadow: none !important;
}

.detail-view td {
    background-color: #f4f6f9 !important;
    /* Explicit gray background */
    border: 1px solid #e9ecef !important;
    border-radius: 12px !important;
    padding: 10px 15px !important;
    width: 100% !important;
    min-height: 45px !important;
    display: flex !important;
    align-items: center !important;
    color: #333 !important;
    box-sizing: border-box !important;
    font-size: 1rem !important;
    box-shadow: none !important;
    --bs-table-accent-bg: transparent !important;
}

/* Search/Filter Fields - Make them look like DetailView fields for consistency */
.grid-view .filters input,
.grid-view .filters select {
    background-color: #fff !important;
    border: 1px solid #ced4da !important;
    border-radius: 8px !important;
    padding: 6px 12px !important;
}

/* Form Redesign - RESTORED */
.main-content form,
form[id*="-form"],
div[class$="-form"] form {
    display: flex !important;
    flex-direction: column !important;
    gap: 25px !important;
}

@media (min-width: 992px) {

    .main-content form,
    form[id*="-form"],
    div[class$="-form"] form {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 25px 40px !important;
    }

    [class*="field-address"],
    [class*="field-logo"],
    .form-group:has(.btn) {
        grid-column: span 2 !important;
    }
}

/* Required Field Indicator */
.field.required > label::after,
.field-required > label::after,
.form-group.required > label::after,
.required > label::after {
    content: " *";
    color: #a30000;
    font-weight: 600;
}

.help-block,
.invalid-feedback,
.has-error .help-block,
.field.has-error .help-block,
.field.has-error .invalid-feedback {
    color: #a30000;
    margin-top: 5px;
}

/* Button Styling - Ensuring Alignment and Previous Colors */
.btn {
    border-radius: 12px !important;
    padding: 0 25px !important;
    /* Vertical centering via height + flex */
    font-weight: 500 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    height: 48px !important;
    line-height: 1 !important;
    transition: all 0.2s ease !important;
    border: none !important;
}

.btn-success {
    background-color: #004c35 !important;
    color: white !important;
}

.btn-primary {
    background-color: #004c35 !important;
    /* Changed to Green #004c35 as requested */
    color: white !important;
}

.btn-secondary {
    background-color: #495057 !important;
    color: white !important;
}

.btn-danger {
    background-color: #a30000 !important;
    color: white !important;
}

/* Sidebar Branding Adjustment */
.sidebar-area .custom-logo-container {
    padding: 15px 20px !important;
}

.custom-navbar-link {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    text-decoration: none !important;
}

.custom-navbar-logo-wrapper {
    flex-shrink: 0 !important;
    width: 44px !important;
    height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.custom-navbar-img {
    max-width: 100% !important;
    max-height: 100% !important;
}

.custom-navbar-text {
    white-space: normal !important;
    font-size: 1.1rem !important;
    color: #212529 !important;
    line-height: 1.2 !important;
}

/* Login Form 2x2 */
#login-form {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 20px 30px !important;
}

#login-form .field-loginform-rememberme,
#login-form .mt-4 {
    margin-top: 0 !important;
    align-self: end !important;
}

@media (max-width: 576px) {
    .pagination .page-item--first .page-link,
    .pagination .page-item--last .page-link,
    .pagination .page-item--prev .page-link,
    .pagination .page-item--next .page-link {
        font-size: 0;
    }

    .pagination .page-item--first .page-link::before {
        content: "<<";
        font-size: 0.88rem;
    }

    .pagination .page-item--last .page-link::before {
        content: ">>";
        font-size: 0.88rem;
    }

    .pagination .page-item--prev .page-link::before {
        content: "<";
        font-size: 0.88rem;
    }

    .pagination .page-item--next .page-link::before {
        content: ">";
        font-size: 0.88rem;
    }
}
