/*!* static/css/style.css - Updated with ABEA Color Theme *!*/

/*:root {*/
/*    --primary-blue: #1a73e8;       !* Blue from logo *!*/
/*    --primary-dark-blue: #0d5bb5;  !* Darker blue for gradients *!*/
/*    --secondary-green: #34a853;    !* Green from logo *!*/
/*    --accent-red: #ea4335;         !* Red from logo *!*/
/*    --accent-yellow: #fbbc04;      !* Yellow/Gold from ABEA letters *!*/
/*    --dark-color: #202124;*/
/*    --light-color: #f8f9fa;*/
/*    --gray-color: #dadce0;*/
/*}*/

/*!* General Styles *!*/
/*body {*/
/*    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;*/
/*    color: #333;*/
/*    line-height: 1.6;*/
/*    background-color: #f8f9fa;*/
/*}*/

/*!* Logo Styles *!*/
/*.logo-container {*/
/*    display: inline-block;*/
/*}*/

/*.logo-vertical {*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    height: 50px;*/
/*    border-radius: 5px;*/
/*    overflow: hidden;*/
/*    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);*/
/*}*/

/*.logo-section {*/
/*    flex: 1;*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*    font-weight: bold;*/
/*    font-family: 'Arial Black', sans-serif;*/
/*    text-align: center;*/
/*    padding: 0 8px;*/
/*    min-width: 40px;*/
/*    font-size: 0.7rem;*/
/*}*/

/*!* Language Switcher *!*/
/*.language-switcher {*/
/*    font-size: 0.85rem;*/
/*}*/

/*.language-switcher .form-select {*/
/*    background-color: rgba(255, 255, 255, 0.2);*/
/*    color: white;*/
/*    border: 1px solid rgba(255, 255, 255, 0.3);*/
/*}*/

/*.language-switcher .form-select:focus {*/
/*    background-color: rgba(255, 255, 255, 0.3);*/
/*    color: white;*/
/*}*/

/*!* Navigation *!*/
/*.navbar {*/
/*    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);*/
/*    padding-top: 0.5rem;*/
/*    padding-bottom: 0.5rem;*/
/*}*/

/*.navbar-brand {*/
/*    padding: 0;*/
/*}*/

/*.nav-link {*/
/*    font-weight: 500;*/
/*    padding: 0.5rem 1rem !important;*/
/*    border-radius: 5px;*/
/*    transition: all 0.3s ease;*/
/*    color: rgba(255, 255, 255, 0.9) !important;*/
/*}*/

/*.nav-link:hover, .nav-link.active {*/
/*    background-color: rgba(255, 255, 255, 0.15);*/
/*    color: white !important;*/
/*}*/

/*.nav-link.active {*/
/*    font-weight: 600;*/
/*    border-bottom: 3px solid var(--accent-yellow);*/
/*}*/

/*!* Dropdown Menu *!*/
/*.dropdown-menu {*/
/*    border: none;*/
/*    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);*/
/*    border-radius: 10px;*/
/*    padding: 0.5rem 0;*/
/*}*/

/*.dropdown-item {*/
/*    padding: 0.5rem 1.5rem;*/
/*    transition: all 0.2s ease;*/
/*}*/

/*.dropdown-item:hover {*/
/*    background-color: rgba(26, 115, 232, 0.1);*/
/*    color: var(--primary-blue);*/
/*}*/

/*!* Hero Section *!*/
/*.hero-section {*/
/*    background: linear-gradient(135deg, var(--primary-blue) 0%, var(--primary-dark-blue) 100%);*/
/*    color: white;*/
/*    padding: 100px 0;*/
/*    text-align: center;*/
/*    position: relative;*/
/*    overflow: hidden;*/
/*}*/

/*.hero-section::before {*/
/*    content: '';*/
/*    position: absolute;*/
/*    top: 0;*/
/*    left: 0;*/
/*    right: 0;*/
/*    bottom: 0;*/
/*    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 1000"><path fill="%23ffffff" fill-opacity="0.03" d="M0,0L1000,0L1000,1000L0,1000Z"/></svg>');*/
/*}*/

/*.hero-title {*/
/*    font-size: 3.5rem;*/
/*    font-weight: 700;*/
/*    margin-bottom: 1.5rem;*/
/*    position: relative;*/
/*    z-index: 1;*/
/*}*/

/*.hero-subtitle {*/
/*    font-size: 1.25rem;*/
/*    margin-bottom: 2rem;*/
/*    opacity: 0.9;*/
/*    position: relative;*/
/*    z-index: 1;*/
/*}*/

/*!* Cards *!*/
/*.card {*/
/*    border: none;*/
/*    border-radius: 12px;*/
/*    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);*/
/*    transition: transform 0.3s ease, box-shadow 0.3s ease;*/
/*    margin-bottom: 25px;*/
/*    overflow: hidden;*/
/*}*/

/*.card:hover {*/
/*    transform: translateY(-10px);*/
/*    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);*/
/*}*/

/*.card-header {*/
/*    border-bottom: 3px solid var(--primary-blue);*/
/*    background-color: white;*/
/*    font-weight: 600;*/
/*}*/

/*!* Section Titles *!*/
/*.section-title {*/
/*    position: relative;*/
/*    margin-bottom: 3rem;*/
/*    padding-bottom: 1rem;*/
/*    color: var(--primary-blue);*/
/*}*/

/*.section-title:after {*/
/*    content: '';*/
/*    position: absolute;*/
/*    bottom: 0;*/
/*    left: 0;*/
/*    width: 60px;*/
/*    height: 4px;*/
/*    background: linear-gradient(90deg, var(--primary-blue), var(--accent-yellow));*/
/*    border-radius: 2px;*/
/*}*/

/*!* Buttons *!*/
/*.btn {*/
/*    border-radius: 8px;*/
/*    font-weight: 500;*/
/*    padding: 0.6rem 1.8rem;*/
/*    transition: all 0.3s ease;*/
/*    border: none;*/
/*}*/

/*.btn-primary {*/
/*    background: linear-gradient(135deg, var(--primary-blue), var(--primary-dark-blue));*/
/*    color: white;*/
/*}*/

/*.btn-primary:hover {*/
/*    background: linear-gradient(135deg, var(--primary-dark-blue), var(--primary-blue));*/
/*    transform: translateY(-2px);*/
/*    box-shadow: 0 5px 15px rgba(26, 115, 232, 0.4);*/
/*}*/

/*.btn-success {*/
/*    background: linear-gradient(135deg, var(--secondary-green), #2d9249);*/
/*    color: white;*/
/*}*/

/*.btn-warning {*/
/*    background: linear-gradient(135deg, var(--accent-yellow), #e6a800);*/
/*    color: #333;*/
/*    font-weight: 600;*/
/*}*/

/*.btn-warning:hover {*/
/*    background: linear-gradient(135deg, #e6a800, var(--accent-yellow));*/
/*    color: #333;*/
/*    transform: translateY(-2px);*/
/*    box-shadow: 0 5px 15px rgba(251, 188, 4, 0.4);*/
/*}*/

/*.btn-danger {*/
/*    background: linear-gradient(135deg, var(--accent-red), #d32f2f);*/
/*    color: white;*/
/*}*/

/*.btn-outline-primary {*/
/*    color: var(--primary-blue);*/
/*    border: 2px solid var(--primary-blue);*/
/*    background: transparent;*/
/*}*/

/*.btn-outline-primary:hover {*/
/*    background: var(--primary-blue);*/
/*    color: white;*/
/*}*/

/*!* Forms *!*/
/*.form-control, .form-select {*/
/*    border: 2px solid #e9ecef;*/
/*    border-radius: 8px;*/
/*    padding: 0.75rem 1rem;*/
/*    transition: all 0.3s ease;*/
/*}*/

/*.form-control:focus, .form-select:focus {*/
/*    border-color: var(--primary-blue);*/
/*    box-shadow: 0 0 0 0.25rem rgba(26, 115, 232, 0.25);*/
/*}*/

/*!* Alerts *!*/
/*.alert {*/
/*    border: none;*/
/*    border-radius: 10px;*/
/*    padding: 1rem 1.5rem;*/
/*    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);*/
/*}*/

/*.alert-success {*/
/*    background-color: rgba(52, 168, 83, 0.1);*/
/*    color: #155724;*/
/*    border-left: 4px solid var(--secondary-green);*/
/*}*/

/*.alert-danger {*/
/*    background-color: rgba(234, 67, 53, 0.1);*/
/*    color: #721c24;*/
/*    border-left: 4px solid var(--accent-red);*/
/*}*/

/*.alert-warning {*/
/*    background-color: rgba(251, 188, 4, 0.1);*/
/*    color: #856404;*/
/*    border-left: 4px solid var(--accent-yellow);*/
/*}*/

/*.alert-info {*/
/*    background-color: rgba(26, 115, 232, 0.1);*/
/*    color: #0c5460;*/
/*    border-left: 4px solid var(--primary-blue);*/
/*}*/

/*!* Progress bars *!*/
/*.progress {*/
/*    height: 10px;*/
/*    border-radius: 5px;*/
/*    background-color: #e9ecef;*/
/*}*/

/*.progress-bar {*/
/*    border-radius: 5px;*/
/*}*/

/*!* Badges *!*/
/*.badge {*/
/*    padding: 0.5em 0.8em;*/
/*    border-radius: 20px;*/
/*    font-weight: 500;*/
/*}*/

/*.bg-primary {*/
/*    background: linear-gradient(135deg, var(--primary-blue), var(--primary-dark-blue)) !important;*/
/*}*/

/*.bg-success {*/
/*    background: linear-gradient(135deg, var(--secondary-green), #2d9249) !important;*/
/*}*/

/*.bg-danger {*/
/*    background: linear-gradient(135deg, var(--accent-red), #d32f2f) !important;*/
/*}*/

/*.bg-warning {*/
/*    background: linear-gradient(135deg, var(--accent-yellow), #e6a800) !important;*/
/*    color: #333;*/
/*}*/

/*!* Executive Members *!*/
/*.executive-card {*/
/*    text-align: center;*/
/*    padding: 25px;*/
/*    border-radius: 15px;*/
/*    background: white;*/
/*    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);*/
/*    transition: all 0.3s ease;*/
/*}*/

/*.executive-card:hover {*/
/*    transform: translateY(-10px);*/
/*    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);*/
/*}*/

/*.executive-img {*/
/*    width: 150px;*/
/*    height: 150px;*/
/*    border-radius: 50%;*/
/*    object-fit: cover;*/
/*    border: 5px solid var(--primary-blue);*/
/*    margin: 0 auto 20px;*/
/*    box-shadow: 0 5px 15px rgba(26, 115, 232, 0.3);*/
/*}*/

/*!* Partners *!*/
/*.partner-logo {*/
/*    height: 80px;*/
/*    object-fit: contain;*/
/*    filter: grayscale(100%);*/
/*    opacity: 0.7;*/
/*    transition: all 0.3s ease;*/
/*    padding: 15px;*/
/*}*/

/*.partner-logo:hover {*/
/*    filter: grayscale(0%);*/
/*    opacity: 1;*/
/*    transform: scale(1.1);*/
/*}*/

/*!* Membership Cards *!*/
/*.membership-card {*/
/*    border: 2px solid #e9ecef;*/
/*    transition: all 0.3s ease;*/
/*    position: relative;*/
/*    overflow: hidden;*/
/*}*/

/*.membership-card.popular {*/
/*    border-color: var(--accent-yellow);*/
/*    transform: translateY(-5px);*/
/*}*/

/*.membership-card.popular::before {*/
/*    content: 'POPULAR';*/
/*    position: absolute;*/
/*    top: 15px;*/
/*    right: -35px;*/
/*    background: var(--accent-yellow);*/
/*    color: #333;*/
/*    padding: 5px 35px;*/
/*    transform: rotate(45deg);*/
/*    font-size: 12px;*/
/*    font-weight: bold;*/
/*    z-index: 1;*/
/*}*/

/*.membership-price {*/
/*    font-size: 2.5rem;*/
/*    font-weight: bold;*/
/*    background: linear-gradient(135deg, var(--primary-blue), var(--accent-yellow));*/
/*    -webkit-background-clip: text;*/
/*    -webkit-text-fill-color: transparent;*/
/*    background-clip: text;*/
/*}*/

/*!* Dashboard *!*/
/*.dashboard-widget {*/
/*    background: white;*/
/*    border-radius: 12px;*/
/*    padding: 25px;*/
/*    margin-bottom: 25px;*/
/*    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);*/
/*    border-left: 4px solid var(--primary-blue);*/
/*}*/

/*.dashboard-stat {*/
/*    text-align: center;*/
/*    padding: 25px;*/
/*    background: white;*/
/*    border-radius: 12px;*/
/*    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);*/
/*    transition: all 0.3s ease;*/
/*}*/

/*.dashboard-stat:hover {*/
/*    transform: translateY(-5px);*/
/*    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);*/
/*}*/

/*.dashboard-stat i {*/
/*    font-size: 3rem;*/
/*    margin-bottom: 15px;*/
/*    display: block;*/
/*}*/

/*.dashboard-stat .number {*/
/*    font-size: 2.5rem;*/
/*    font-weight: bold;*/
/*    display: block;*/
/*    background: linear-gradient(135deg, var(--primary-blue), var(--accent-yellow));*/
/*    -webkit-background-clip: text;*/
/*    -webkit-text-fill-color: transparent;*/
/*    background-clip: text;*/
/*}*/

/*!* Color-specific icons *!*/
/*.text-primary { color: var(--primary-blue) !important; }*/
/*.text-success { color: var(--secondary-green) !important; }*/
/*.text-danger { color: var(--accent-red) !important; }*/
/*.text-warning { color: var(--accent-yellow) !important; }*/

/*!* Animations *!*/
/*@keyframes fadeIn {*/
/*    from { opacity: 0; transform: translateY(20px); }*/
/*    to { opacity: 1; transform: translateY(0); }*/
/*}*/

/*.fade-in {*/
/*    animation: fadeIn 0.5s ease forwards;*/
/*}*/

/*!* Loading spinner *!*/
/*.spinner-border {*/
/*    width: 3rem;*/
/*    height: 3rem;*/
/*    border-width: 0.25em;*/
/*}*/

/*!* Custom scrollbar *!*/
/*::-webkit-scrollbar {*/
/*    width: 10px;*/
/*}*/

/*::-webkit-scrollbar-track {*/
/*    background: #f1f1f1;*/
/*}*/

/*::-webkit-scrollbar-thumb {*/
/*    background: linear-gradient(180deg, var(--primary-blue), var(--secondary-green));*/
/*    border-radius: 5px;*/
/*}*/

/*::-webkit-scrollbar-thumb:hover {*/
/*    background: linear-gradient(180deg, var(--primary-dark-blue), #2d9249);*/
/*}*/

/*!* Responsive Design *!*/
/*@media (max-width: 768px) {*/
/*    .hero-title {*/
/*        font-size: 2.2rem;*/
/*    }*/

/*    .hero-subtitle {*/
/*        font-size: 1.1rem;*/
/*    }*/

/*    .executive-img {*/
/*        width: 120px;*/
/*        height: 120px;*/
/*    }*/

/*    .logo-vertical {*/
/*        height: 40px;*/
/*    }*/

/*    .logo-section {*/
/*        font-size: 0.6rem;*/
/*        padding: 0 6px;*/
/*        min-width: 35px;*/
/*    }*/

/*    .navbar-brand .text-white {*/
/*        font-size: 0.9rem;*/
/*    }*/
/*}*/

/*@media (max-width: 576px) {*/
/*    .logo-vertical {*/
/*        height: 35px;*/
/*    }*/

/*    .logo-section {*/
/*        font-size: 0.5rem;*/
/*        padding: 0 4px;*/
/*        min-width: 30px;*/
/*    }*/

/*    .navbar-brand .text-white {*/
/*        display: none;*/
/*    }*/
/*}*/

/*!* Gradient backgrounds *!*/
/*.gradient-blue {*/
/*    background: linear-gradient(135deg, var(--primary-blue), var(--primary-dark-blue));*/
/*}*/

/*.gradient-green {*/
/*    background: linear-gradient(135deg, var(--secondary-green), #2d9249);*/
/*}*/

/*.gradient-red {*/
/*    background: linear-gradient(135deg, var(--accent-red), #d32f2f);*/
/*}*/

/*.gradient-yellow {*/
/*    background: linear-gradient(135deg, var(--accent-yellow), #e6a800);*/
/*}*/

/*!* ABEA Theme Colors *!*/
/*.color-blue { color: var(--primary-blue); }*/
/*.color-green { color: var(--secondary-green); }*/
/*.color-red { color: var(--accent-red); }*/
/*.color-yellow { color: var(--accent-yellow); }*/

/*.bg-blue { background-color: var(--primary-blue); }*/
/*.bg-green { background-color: var(--secondary-green); }*/
/*.bg-red { background-color: var(--accent-red); }*/
/*.bg-yellow { background-color: var(--accent-yellow); }*/

/*!* Feature Cards with ABEA Colors *!*/
/*.feature-card-blue {*/
/*    border-top: 4px solid var(--primary-blue);*/
/*}*/

/*.feature-card-green {*/
/*    border-top: 4px solid var(--secondary-green);*/
/*}*/

/*.feature-card-red {*/
/*    border-top: 4px solid var(--accent-red);*/
/*}*/

/*.feature-card-yellow {*/
/*    border-top: 4px solid var(--accent-yellow);*/
/*}*/

/*!* Status indicators *!*/
/*.status-active {*/
/*    background-color: rgba(52, 168, 83, 0.1);*/
/*    color: var(--secondary-green);*/
/*    padding: 0.25rem 0.75rem;*/
/*    border-radius: 20px;*/
/*    font-size: 0.85rem;*/
/*}*/

/*.status-pending {*/
/*    background-color: rgba(251, 188, 4, 0.1);*/
/*    color: var(--accent-yellow);*/
/*    padding: 0.25rem 0.75rem;*/
/*    border-radius: 20px;*/
/*    font-size: 0.85rem;*/
/*}*/

/*.status-expired {*/
/*    background-color: rgba(234, 67, 53, 0.1);*/
/*    color: var(--accent-red);*/
/*    padding: 0.25rem 0.75rem;*/
/*    border-radius: 20px;*/
/*    font-size: 0.85rem;*/
/*}*/

/* static/css/style.css - Complete Fixed Version */

:root {
    --primary-green: #2e7d32;
    --secondary-green: #4caf50;
    --accent-red: #d32f2f;
    --dark-red: #b71c1c;
    --light-gray: #f5f5f5;
    --medium-gray: #9e9e9e;
    --dark-gray: #424242;
    --text-white: #ffffff;
    --text-light: #f0f0f0;
}

/* ==================== NAVBAR FIXES ==================== */
.navbar {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--dark-red) 100%) !important;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

/* Make all navbar text clearly visible */
.navbar-brand,
.navbar-nav .nav-link,
.navbar-nav .dropdown-toggle,
.navbar-nav .btn {
    color: rgba(255, 255, 255, 0.95) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.navbar-nav .nav-link {
    font-weight: 500;
    padding: 0.5rem 1rem !important;
    border-radius: 5px;
    transition: all 0.3s ease;
    margin: 0 2px;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus,
.navbar-nav .dropdown-toggle:hover,
.navbar-nav .dropdown-toggle:focus {
    background-color: rgba(255, 255, 255, 0.15) !important;
    color: white !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
}

.navbar-nav .nav-link.active {
    background-color: rgba(255, 255, 255, 0.2) !important;
    color: white !important;
    font-weight: 600;
    border-bottom: 3px solid white;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

/* Dropdown menu */
.dropdown-menu {
    background-color: white !important;
    border: none;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    padding: 0.5rem 0;
}

.dropdown-item {
    color: var(--dark-gray) !important;
    padding: 0.6rem 1.5rem;
    transition: all 0.2s ease;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: rgba(46, 125, 50, 0.1) !important;
    color: var(--primary-green) !important;
}

/* Register/Login buttons */
.navbar-nav .btn {
    background-color: var(--accent-red) !important;
    border-color: var(--accent-red) !important;
    color: white !important;
    font-weight: 600;
    padding: 0.5rem 1.5rem !important;
    border-radius: 30px;
    transition: all 0.3s ease;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.navbar-nav .btn:hover {
    background-color: #c62828 !important;
    border-color: #c62828 !important;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(211, 47, 47, 0.3);
}

/* Navbar toggler */
.navbar-toggler {
    border: 2px solid rgba(255, 255, 255, 0.5);
    padding: 0.25rem 0.5rem;
}

.navbar-toggler:focus {
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.5);
}

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.95%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* User profile dropdown */
.navbar-nav .dropdown-toggle.d-flex {
    color: white !important;
}

.navbar-nav .dropdown-toggle.d-flex:hover {
    background-color: rgba(255, 255, 255, 0.15) !important;
}

/* Mobile menu */
@media (max-width: 991.98px) {
    .navbar-nav {
        padding: 1rem 0;
    }

    .navbar-nav .nav-item {
        margin: 0.3rem 0;
    }

    .navbar-nav .nav-link {
        padding: 0.8rem 1rem !important;
        border-radius: 8px;
    }

    .navbar-nav .nav-link.active {
        border-bottom: 3px solid white;
    }

    .navbar-nav .btn {
        margin-top: 0.5rem;
        width: 100%;
        text-align: center;
    }

    .dropdown-menu {
        background-color: white !important;
        box-shadow: none;
        border: 1px solid rgba(0, 0, 0, 0.1);
        margin: 0.5rem 0;
    }
}

/* ==================== GENERAL STYLES ==================== */
body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: var(--dark-gray);
    line-height: 1.6;
    background-color: var(--light-gray);
}

/* Language Switcher */
.language-switcher {
    padding: 0.5rem 0;
    font-size: 0.85rem;
}

.language-switcher .form-select {
    background-color: rgba(255, 255, 255, 0.2);
    color: white;
    border: 1px solid rgba(255, 255, 255, 0.3);
    max-width: 150px;
}

.language-switcher .form-select:focus {
    background-color: rgba(255, 255, 255, 0.3);
    color: white;
    box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.25);
}

/* Logo */
.logo-container img {
    max-height: 50px;
    transition: transform 0.3s ease;
}

.logo-container img:hover {
    transform: scale(1.05);
}

/* Messages */
.alert {
    border: none;
    border-radius: 10px;
    padding: 1rem 1.5rem;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
}

.alert-success {
    background-color: rgba(46, 125, 50, 0.1);
    color: #155724;
    border-left: 4px solid var(--primary-green);
}

.alert-danger {
    background-color: rgba(211, 47, 47, 0.1);
    color: #721c24;
    border-left: 4px solid var(--accent-red);
}

.alert-warning {
    background-color: rgba(183, 28, 28, 0.1);
    color: #856404;
    border-left: 4px solid var(--dark-red);
}

.alert-info {
    background-color: rgba(158, 158, 158, 0.1);
    color: #0c5460;
    border-left: 4px solid var(--medium-gray);
}

/* Cards */
.card {
    border: none;
    border-radius: 12px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    margin-bottom: 25px;
    overflow: hidden;
}

.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.12);
}

.card-header {
    border-bottom: 3px solid var(--primary-green);
    background-color: white;
    font-weight: 600;
    padding: 1rem 1.5rem;
}

/* Buttons */
.btn {
    border-radius: 8px;
    font-weight: 500;
    padding: 0.6rem 1.5rem;
    transition: all 0.3s ease;
    border: none;
}

.btn-primary {
    background: linear-gradient(135deg, var(--primary-green), var(--secondary-green));
    color: white;
}

.btn-primary:hover {
    background: linear-gradient(135deg, var(--secondary-green), var(--primary-green));
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(46, 125, 50, 0.3);
}

.btn-danger {
    background: linear-gradient(135deg, var(--accent-red), var(--dark-red));
    color: white;
}

.btn-danger:hover {
    background: linear-gradient(135deg, var(--dark-red), var(--accent-red));
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(211, 47, 47, 0.3);
}

.btn-outline-primary {
    color: var(--primary-green);
    border: 2px solid var(--primary-green);
    background: transparent;
}

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

/* Forms */
.form-control, .form-select {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    transition: all 0.3s ease;
}

.form-control:focus, .form-select:focus {
    border-color: var(--primary-green);
    box-shadow: 0 0 0 0.25rem rgba(46, 125, 50, 0.25);
}

/* Progress bars */
.progress {
    height: 10px;
    border-radius: 5px;
    background-color: #e9ecef;
}

.progress-bar {
    border-radius: 5px;
    background: linear-gradient(135deg, var(--primary-green), var(--secondary-green));
}

/* Badges */
.badge {
    padding: 0.5em 0.8em;
    border-radius: 20px;
    font-weight: 500;
}

.bg-primary {
    background: linear-gradient(135deg, var(--primary-green), var(--secondary-green)) !important;
}

.bg-success {
    background: linear-gradient(135deg, var(--secondary-green), #2d9249) !important;
}

.bg-danger {
    background: linear-gradient(135deg, var(--accent-red), var(--dark-red)) !important;
}

.bg-warning {
    background: linear-gradient(135deg, #ff9800, #f57c00) !important;
}

/* Tables */
.table th {
    color: var(--primary-green);
    font-weight: 600;
    border-top: none;
    padding: 1rem;
}

.table td {
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    padding: 1rem;
    vertical-align: middle;
}

.table-hover tbody tr:hover {
    background-color: rgba(46, 125, 50, 0.05);
}

/* Section Titles */
.section-title {
    position: relative;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    color: var(--primary-green);
    font-weight: 600;
}

.section-title:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 60px;
    height: 4px;
    background: linear-gradient(90deg, var(--primary-green), var(--accent-red));
    border-radius: 2px;
}

/* Hero Sections */
.hero-section {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--dark-red) 100%);
    color: white;
    padding: 100px 0;
    position: relative;
    overflow: hidden;
}

.hero-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 1000"><path fill="%23ffffff" fill-opacity="0.03" d="M0,0L1000,0L1000,1000L0,1000Z"/></svg>');
}

.hero-title {
    font-size: 3.5rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
    position: relative;
    z-index: 1;
}

.hero-subtitle {
    font-size: 1.25rem;
    margin-bottom: 2rem;
    opacity: 0.9;
    position: relative;
    z-index: 1;
}

/* Executive Members */
.executive-card {
    text-align: center;
    padding: 25px;
    border-radius: 15px;
    background: white;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.executive-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
}

.executive-img {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    object-fit: cover;
    border: 5px solid var(--primary-green);
    margin: 0 auto 20px;
    box-shadow: 0 5px 15px rgba(46, 125, 50, 0.3);
}

/* Partners */
.partner-logo {
    height: 80px;
    object-fit: contain;
    filter: grayscale(100%);
    opacity: 0.7;
    transition: all 0.3s ease;
    padding: 15px;
}

.partner-logo:hover {
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(1.1);
}

/* Membership Cards */
.membership-card {
    border: 2px solid #e9ecef;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.membership-card.popular {
    border-color: var(--primary-green);
    transform: translateY(-5px);
}

.membership-card.popular::before {
    content: 'POPULAR';
    position: absolute;
    top: 15px;
    right: -35px;
    background: var(--primary-green);
    color: white;
    padding: 5px 35px;
    transform: rotate(45deg);
    font-size: 12px;
    font-weight: bold;
    z-index: 1;
}

.membership-price {
    font-size: 2.5rem;
    font-weight: bold;
    background: linear-gradient(135deg, var(--primary-green), var(--accent-red));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Dashboard */
.dashboard-widget {
    background: white;
    border-radius: 12px;
    padding: 25px;
    margin-bottom: 25px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
    border-left: 4px solid var(--primary-green);
}

.dashboard-stat {
    text-align: center;
    padding: 25px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.dashboard-stat:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}

.dashboard-stat i {
    font-size: 3rem;
    margin-bottom: 15px;
    display: block;
}

.dashboard-stat .number {
    font-size: 2.5rem;
    font-weight: bold;
    display: block;
    background: linear-gradient(135deg, var(--primary-green), var(--accent-red));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Footer */
footer {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--dark-gray) 100%);
    color: white;
}

footer .social-links a {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: transform 0.3s ease;
}

footer .social-links a:hover {
    transform: translateY(-3px);
}

footer a.text-white-50:hover {
    color: white !important;
    text-decoration: underline;
}

/* Color-specific icons */
.text-primary { color: var(--primary-green) !important; }
.text-success { color: var(--secondary-green) !important; }
.text-danger { color: var(--accent-red) !important; }
.text-warning { color: #ff9800 !important; }

/* Animations */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.fade-in {
    animation: fadeIn 0.5s ease forwards;
}

/* Loading spinner */
.spinner-border {
    width: 3rem;
    height: 3rem;
    border-width: 0.25em;
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--primary-green), var(--accent-red));
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, var(--secondary-green), var(--dark-red));
}

/* Responsive Design */
@media (max-width: 768px) {
    .hero-title {
        font-size: 2.2rem;
    }

    .hero-subtitle {
        font-size: 1.1rem;
    }

    .executive-img {
        width: 120px;
        height: 120px;
    }

    .logo-container img {
        max-height: 40px;
    }

    .navbar-brand .text-white {
        font-size: 0.9rem;
    }
}

@media (max-width: 576px) {
    .logo-container img {
        max-height: 35px;
    }

    .navbar-brand .text-white {
        display: none;
    }
}

/* ABEA Theme Colors */
.color-green { color: var(--primary-green); }
.color-red { color: var(--accent-red); }
.color-gray { color: var(--dark-gray); }

.bg-green { background-color: var(--primary-green); }
.bg-red { background-color: var(--accent-red); }
.bg-gray { background-color: var(--dark-gray); }

/* Feature Cards */
.feature-card-green {
    border-top: 4px solid var(--primary-green);
}

.feature-card-red {
    border-top: 4px solid var(--accent-red);
}

.feature-card-gray {
    border-top: 4px solid var(--dark-gray);
}

/* Status indicators */
.status-active {
    background-color: rgba(46, 125, 50, 0.1);
    color: var(--primary-green);
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
    font-size: 0.85rem;
}

.status-pending {
    background-color: rgba(255, 152, 0, 0.1);
    color: #ff9800;
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
    font-size: 0.85rem;
}

.status-expired {
    background-color: rgba(211, 47, 47, 0.1);
    color: var(--accent-red);
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
    font-size: 0.85rem;
}

/* Owl Carousel Custom */
.owl-carousel .owl-item img {
    width: auto;
    max-width: 100%;
}

.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next {
    background: var(--primary-green) !important;
    color: white !important;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.owl-carousel .owl-dots button.owl-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--light-gray) !important;
    margin: 0 5px;
}

.owl-carousel .owl-dots button.owl-dot.active {
    background: var(--primary-green) !important;
}

/* Pagination */
.pagination .page-link {
    color: var(--primary-green);
    border: 1px solid #dee2e6;
}

.pagination .page-item.active .page-link {
    background-color: var(--primary-green);
    border-color: var(--primary-green);
    color: white;
}

/* Breadcrumb */
.breadcrumb {
    background-color: transparent;
    padding: 0;
}

.breadcrumb-item a {
    color: var(--primary-green);
    text-decoration: none;
}

.breadcrumb-item.active {
    color: var(--medium-gray);
}

/* Accessibility */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 3px solid var(--primary-green);
    outline-offset: 2px;
}