/* Add this to the top of your style.css file */
.font-varsity {
    font-family: 'Bungee', sans-serif;
    text-shadow: 2px 2px 8px rgba(0,0,0,0.5);
}


/* Custom styles */
body {
    font-family: 'Inter', sans-serif;
    background-color: #111827; /* bg-gray-900 */
}

/* View Switching */
.view { display: none; }
.view.active { display: block; }

/* Modal Styles */
.modal { position: fixed; inset: 0; background-color: rgba(0, 0, 0, 0.7); display: none; align-items: center; justify-content: center; z-index: 50; }
.modal.active { display: flex; }
.modal-content { background-color: #1F2937; padding: 2rem; border-radius: 0.5rem; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); width: 100%; max-width: 60rem; max-height: 90vh;
    overflow-y: auto;}
.modal-content-lg {
    background-color: #1F2937; /* bg-gray-800 */
    padding: 2rem;
    border-radius: 0.5rem;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    width: 100%;
    max-width: 48rem; /* max-w-3xl */
    max-height: 90vh; 
    overflow-y: auto; 
}
/* Form & Button Styles */
.input-field, .label { display: block; width: 100%; }
.label { margin-bottom: 0.5rem; color: #D1D5DB; }
.input-field { background-color: #374151; border: 1px solid #4B5563; border-radius: 0.375rem; padding: 0.5rem 1rem; color: white; }
.input-field:focus { outline: none; --tw-ring-color: #3B82F6; box-shadow: 0 0 0 2px var(--tw-ring-color); }
.btn-primary { background-color: #2563EB; color: white; font-weight: bold; padding: 0.5rem 1rem; border-radius: 0.375rem; }
.btn-primary:hover { background-color: #1D4ED8; }
.btn-secondary { background-color: #4B5563; color: white; font-weight: bold; padding: 0.5rem 1rem; border-radius: 0.375rem; }
.btn-secondary:hover { background-color: #6B7280; }
.btn-warning {
    background: linear-gradient(to bottom, #F97316, #EA580C); /* Orange gradient */
    color: white;
    font-weight: bold;
    border-radius: 0.375rem;
    border: 1px solid #9A3412; /* Darker orange border */
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    padding-top: 0.6rem; /* A little extra padding */
    padding-bottom: 0.6rem;
    transition: all 0.2s ease-in-out;
}
.btn-warning:hover {
    background: linear-gradient(to bottom, #FB923C, #F97316); /* Lighter gradient on hover */
    box-shadow: 0 4px 8px rgba(0,0,0,0.3);
    transform: translateY(-2px);
}
.btn-success { background-color: #16A34A; color: white; } /* bg-green-600 */
.btn-success:hover { background-color: #15803D; } /* bg-green-700 */

/* Subscription UI Styles */
#subscription-status-display {
    transition: all 0.3s ease;
}

#subscription-badge {
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    transition: all 0.2s ease;
}

#dynasty-count-display {
    color: #9CA3AF;
    font-size: 0.75rem;
}

/* Subscription Modal Styles */
#subscription-paywall-modal .modal-content {
    max-width: 48rem;
}

#subscription-paywall-modal .grid {
    margin: 2rem 0;
}

#subscription-paywall-modal .bg-gray-900 {
    background-color: #111827;
    border-radius: 0.5rem;
    padding: 1.5rem;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

#subscription-paywall-modal .bg-gray-900:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3);
}

#subscription-paywall-modal .border-amber-500 {
    border-color: #F59E0B;
    box-shadow: 0 0 20px rgba(245, 158, 11, 0.2);
}

#subscription-paywall-modal stripe-buy-button {
    width: 100%;
    margin-top: 1rem;
}

/* Success Banner */
#success-banner {
    position: fixed;
    top: 20px;
    right: 20px;
    background-color: #10B981;
    color: white;
    padding: 1rem 1.5rem;
    border-radius: 0.5rem;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3);
    transform: translateX(400px);
    opacity: 0;
    transition: all 0.3s ease;
    z-index: 1000;
}

#success-banner.active {
    transform: translateX(0);
    opacity: 1;
}

#success-banner i {
    margin-right: 0.5rem;
}
.btn-danger {
    background-color: #DC2626; /* bg-red-600 */
    color: white;
    font-weight: bold;
    padding: 0.5rem 1rem;
    border-radius: 0.375rem;
}
.btn-danger:hover { background-color: #B91C1C; } /* bg-red-700 */

/* Dynasty Dashboard Styles */
.nav-link { display: flex; align-items: center; padding: 0.5rem 1rem; border-radius: 0.375rem; color: #D1D5DB; transition: background-color 0.2s; }
.nav-link:hover { background-color: #374151; }
.nav-link.active { background-color: #2563EB; color: white; font-weight: 600; }
.nav-icon { width: 1.5rem; text-align: center; margin-right: 0.75rem; }
.dynasty-page { display: none; }
.dynasty-page.active { display: block; }

/* Home Dashboard Card Styles */
.dashboard-card { background-color: #1F2937; padding: 1.5rem; border-radius: 0.5rem; }
.dashboard-card-title { font-size: 1.125rem; font-weight: 600; border-bottom: 1px solid #374151; padding-bottom: 0.75rem; margin-bottom: 0.75rem; }
.record-item, .stat-item { display: flex; justify-content: space-between; align-items: baseline; }
.record-label, .stat-label { color: #9CA3AF; }
.record-value, .stat-value { font-weight: 600; font-size: 1.125rem; }
.game-item { display: flex; align-items: center; gap: 1rem; padding: 0.75rem 0; border-bottom: 1px solid #374151; }
.game-item:last-child { border-bottom: none; }
.game-item img { height: 2.25rem; width: 2.25rem; object-fit: contain; }
.game-info { flex-grow: 1; }
.game-matchup { font-weight: 600; font-size: 1rem; }
.game-details { font-size: 0.875rem; color: #9CA3AF; }
.game-result { text-align: right; }
.game-result-status { font-weight: 700; font-size: 1.125rem; }
.game-result-w { color: #4ADE80; }
.game-result-l { color: #F87171; }
.game-result-score { font-size: 0.875rem; }


/* Roster, Recruiting, Transfer Table Styles */
.roster-table { width: 100%; border-collapse: collapse; }
.roster-table th { text-align: left; padding: 0.75rem; border-bottom: 2px solid #4B5563; }
.roster-table th.sortable { cursor: pointer; }
.roster-table th.sortable:hover { background-color: #374151; }
.roster-table td { padding: 0.75rem; border-bottom: 1px solid #374151; }
.roster-table tbody tr:hover { background-color: #1c2431; }
.redshirt-icon { cursor: pointer; font-size: 1.25rem; }
.redshirt-icon.active { color: #EF4444; } /* Red */
.player-redshirted { color: #F87171; } /* Red text for redshirted players */

/* Player Card Modal */
.player-card-header { display: flex; gap: 1.5rem; margin-bottom: 1.5rem; }
.player-card-jersey { position: relative; width: 80px; height: 80px; flex-shrink: 0; }
.player-card-jersey .fa-shirt { font-size: 80px; color: #4B5563; }
.player-card-jersey-number {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-25%, -55%); /* Fine-tuned horizontal and vertical alignment */
    font-size: 1.75rem;
    font-weight: 800;
    color: white;
    text-shadow: 0 0 3px black;
}
.player-card-info { display: flex; flex-direction: column; }
.player-card-tabs { display: flex; border-bottom: 1px solid #4B5563; margin-bottom: 1rem; }
.player-card-tab { padding: 0.5rem 1rem; cursor: pointer; color: #9CA3AF; }
.player-card-tab.active { color: white; border-bottom: 2px solid #3B82F6; }
.player-card-tab-content { display: none; }
.player-card-tab-content.active { display: block; }
.career-stats-table { width: 100%; }

/* Depth Chart Styles */
.depth-chart-section-title { font-size: 1.5rem; font-weight: 700; margin-top: 2rem; margin-bottom: 1rem; border-bottom: 2px solid #3B82F6; padding-bottom: 0.5rem;}
.depth-chart-subsection-title { font-size: 1.25rem; font-weight: 600; margin-top: 1.5rem; margin-bottom: 1rem; color: #9CA3AF;}
.depth-chart-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
.depth-chart-card { background-color: #1F2937; padding: 1.5rem; border-radius: 0.5rem; }
.depth-chart-card-title { font-size: 1.25rem; font-weight: 700; border-bottom: 1px solid #374151; padding-bottom: 0.75rem; margin-bottom: 0.75rem; }
.depth-chart-list { list-style: none; padding-left: 0; }
.depth-chart-list-item { display: flex; align-items: center; gap: 0.75rem; padding: 0.5rem 0; border-bottom: 1px solid #374151; }
.depth-chart-list-item:last-child { border-bottom: none; }
.depth-chart-player-rank { font-weight: 600; color: #9CA3AF; }
.depth-chart-player-info { display: flex; justify-content: space-between; flex-grow: 1; }
.depth-chart-player-name { font-weight: 700; }
.depth-chart-player-jersey { font-size: 0.875rem; color: #9CA3AF; margin-right: 0.25rem; }
.depth-chart-player-details { color: #9CA3AF; }

/* Recruiting & Transfer Styles */
.star-rating .fa-star, .star-rating .fas { color: #FBBF24; } /* text-amber-400 */
.star-icon.fas { color: #FBBF24; }
.form-checkbox-gem { accent-color: #34D399; } /* Emerald-400 */
.form-checkbox-bust { accent-color: #F87171; } /* Red-400 */
.recruit-tag { padding: 0.125rem 0.5rem; border-radius: 9999px; font-size: 0.75rem; font-weight: 600; }
.recruit-tag-gem { background-color: #10B981; color: white; } /* Emerald-500 */
.recruit-tag-bust { background-color: #EF4444; color: white; } /* Red-500 */
.recruit-info-grid { display: grid; grid-template-columns: auto 1fr; gap: 0.5rem 1rem; font-size: 0.875rem; }
.top-recruit-table { width: 100%; }
.top-recruit-table td { padding: 0.5rem; vertical-align: middle;}
.top-recruit-table .input-field { padding: 0.25rem 0.5rem; font-size: 0.875rem;}
.top-recruit-table .rank-cell { font-weight: bold; color: #9CA3AF; text-align: right; padding-right: 1rem; }

/* Class Distribution Table */
.class-dist-container { margin-top: 2rem; background-color: #1F2937; border-radius: 0.5rem; }
.class-dist-header { padding: 1rem 1.5rem; cursor: pointer; display: flex; justify-content: space-between; align-items: center;}
.class-dist-header h3 { font-size: 1.25rem; font-weight: 700; }
.class-dist-content { padding: 0 1.5rem 1.5rem; max-height: 0; overflow: hidden; transition: max-height 0.3s ease-out; }
.class-dist-content.expanded { max-height: 1000px; /* Adjust as needed */ }
.class-dist-table { width: 100%; border-collapse: collapse; }
.class-dist-table th, .class-dist-table td { padding: 0.75rem; text-align: center; border: 1px solid #374151; }
.class-dist-table th { background-color: #374151; }
.class-dist-table td.pos-header { text-align: left; font-weight: 600; }

/* Schedule Table Styles */
.schedule-row {
    display: grid;
    /* Defines 8 columns: WEEK, VISITS, RANK, LOC, OPP, OPP RANK, RESULT, SCORE */
    grid-template-columns: 1.75fr 1fr 0.75fr 1fr 2.5fr 0.75fr 1fr 2fr;
    gap: 0.75rem;
    align-items: center;
    padding: 0.5rem;
    border-radius: 0.375rem;
}
.schedule-row:nth-child(odd) { background-color: #1F2937; }
.schedule-row-header { font-weight: bold; color: #9CA3AF; padding-bottom: 0.5rem; border-bottom: 1px solid #4B5563; }
.schedule-week-label { font-weight: 600; }
.score-input { width: 5rem; text-align: center; }
.result-select.result-win { background-color: #166534; color: white; }
.result-select.result-loss { background-color: #991B1B; color: white; }
.custom-select-container { position: relative; }
.custom-select-display { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; }
.custom-select-display img { height: 1.5rem; width: 1.5rem; object-fit: contain; }
.custom-select-options { position: absolute; top: 100%; left: 0; right: 0; background-color: #374151; border: 1px solid #4B5563; border-radius: 0.375rem; max-height: 200px; overflow-y: auto; z-index: 10; display: none; }
.custom-select-options.active { display: block; }
.custom-select-option { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem; cursor: pointer; }
.custom-select-option:hover { background-color: #4B5563; }
.custom-select-option img { height: 1.5rem; width: 1.5rem; object-fit: contain; }

/* Schedule Section Styles */
.schedule-section-container { 
    margin-top: 1.5rem; 
    background-color: #1F2937; /* bg-gray-800 */
    border-radius: 0.5rem; 
    overflow: hidden; /* Important for the border-radius to apply correctly */
}
.schedule-section-header { 
    padding: 1rem 1.5rem; 
    cursor: pointer; 
    display: flex; 
    justify-content: space-between; 
    align-items: center;
    border-bottom: 1px solid #374151; /* Separator for when content is visible */
}
.schedule-section-header h3 { 
    font-size: 1.5rem; 
    font-weight: 700; 
}
.schedule-section-header .fa-chevron-down {
    transition: transform 0.3s ease-out;
}
.schedule-section-content.expanded + .schedule-section-header .fa-chevron-down {
    transform: rotate(180deg);
}
.schedule-section-content { 
    padding: 0;
    max-height: 0; 
    overflow: hidden; 
    transition: max-height 0.5s ease-in-out, padding 0.5s ease-in-out; 
}
.schedule-section-content.expanded { 
    padding: 1rem;
    max-height: 2000px; /* Adjust to a value larger than the content will ever be */
}

/* Player Stats Page Styles */
.stats-category-container {
    margin-top: 2rem;
}
.stats-category-header {
    font-size: 1.5rem;
    font-weight: 700;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #3B82F6; /* blue-500 */
    margin-bottom: 1rem;
}
.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem 1.5rem;
}
.stats-grid .label {
    font-size: 0.875rem; /* text-sm */
    margin-bottom: 0.25rem;
}
.stats-grid .input-field {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

/* Player Card Stats Section Styles */
.player-stats-section-container { 
    margin-top: 1rem; 
    border-radius: 0.5rem; 
    overflow: hidden;
    border: 1px solid #374151; /* bg-gray-700 */
}
.player-stats-section-header { 
    background-color: #374151; /* bg-gray-700 */
    padding: 0.75rem 1rem; 
    cursor: pointer; 
    display: flex; 
    justify-content: space-between; 
    align-items: center;
}
.player-stats-section-header h4 { 
    font-size: 1.125rem; /* text-lg */
    font-weight: 700; 
}
.player-stats-section-header .fa-chevron-down {
    transition: transform 0.3s ease-out;
}
.player-stats-section-content.expanded + .player-stats-section-header .fa-chevron-down {
    transform: rotate(180deg);
}
.player-stats-section-content { 
    padding: 0;
    max-height: 0; 
    overflow: hidden; 
    transition: max-height 0.3s ease-out, padding 0.3s ease-out; 
}
.player-stats-section-content.expanded { 
    padding: 1rem;
    max-height: 1000px; 
}

/* In style.css */
.btn-remove-stat-row {
    background-color: transparent;
    color: #F87171; /* text-red-400 */
    border: none;
    cursor: pointer;
    font-size: 1rem;
    padding: 0 0.5rem;
}
.btn-remove-stat-row:hover {
    color: #DC2626; /* text-red-600 */
}
/* Bio format

ting */
.whitespace-pre-wrap {
    white-space: pre-wrap;
}

/* Add to the end of style.css */
.stats-category-container .roster-table th,
.stats-category-container .roster-table td,
.player-stats-section-container .roster-table th,
.player-stats-section-container .roster-table td {
    white-space: nowrap;
}

/* Add to the end of style.css */
.nav-link-disabled {
    color: #6B7280; /* gray-500 */
    pointer-events: none;
}

/* Add or replace this rule at the end of style.css */
/* Update this rule in style.css */
.offseason-indicator {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.125rem; /* 18px */
    height: 1.125rem; /* 18px */
    /* REMOVE an_old_margin_property: 0.75rem; */
    border-radius: 9999px;
    background-color: #F97316; /* text-orange-500 */
    color: white;
    font-size: 0.875rem;
    font-weight: bold;
    line-height: 1; /* Ensures vertical centering of the ! */
}

/* Add to the end of style.css */
#dynasty-sidebar {
    width: 260px; /* Sets a fixed width */
    flex-shrink: 0; /* Prevents the sidebar from shrinking */
}

/* Add to the end of style.css */
[data-tooltip] {
    position: relative; /* This is required for positioning the tooltip */
}

.nav-link-disabled[data-tooltip]:hover::after {
    content: attr(data-tooltip); /* Use the attribute value as the tooltip's content */
    position: absolute;
    bottom: 100%; /* Position the tooltip above the link */
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 8px; /* Add some space between the link and the tooltip */
    
    background-color: #374151; /* A dark background */
    color: #FFF;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    white-space: nowrap; /* Keep the tooltip on a single line */
    z-index: 100; /* Ensure it appears above other elements */
}

/* Tab Styles for School Records */
.sub-tabs {
    display: flex;
    border-bottom: 1px solid #4B5563; /* gray-600 */
    margin-bottom: 1.5rem;
}
.sub-tab-link {
    padding: 0.75rem 1.5rem;
    cursor: pointer;
    color: #9CA3AF; /* gray-400 */
    font-weight: 600;
    border-bottom: 3px solid transparent;
    margin-bottom: -1px; /* Overlap with the container's border */
}
.sub-tab-link.active {
    color: white;
    border-bottom-color: #3B82F6; /* blue-500 */
}

.sub-tab-link.text-orange-500 {
    color: #F97316; /* orange-500 */
}

.sub-tab-content {
    display: none;
}
.sub-tab-content.active {
    display: block;
}

/* Trophy Room / Awards Styles */
.award-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 1.5rem;
}
.award-card {
    background-color: #1F2937; /* bg-gray-800 */
    border-radius: 0.5rem;
    padding: 1.5rem;
    border-left: 4px solid #FBBF24; /* amber-400 */
}
.award-card h4 {
    font-size: 1.25rem;
    font-weight: 700;
}
.award-card p {
    color: #D1D5DB; /* gray-300 */
    margin-top: 0.25rem;
}

/* School Records Styles */
.team-stats-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
}
.team-stats-category h4 {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 1rem;
    border-bottom: 1px solid #374151;
    padding-bottom: 0.5rem;
}
.stats-input-group {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 1rem;
    align-items: center;
    margin-bottom: 1rem;
}
.stats-input-group .input-field {
    text-align: right;
}
.stats-display-group {
    display: flex;
    justify-content: space-between;
    font-size: 0.875rem;
    color: #9CA3AF;
    margin-top: 0.5rem;
}

.history-card {
    background-color: #1F2937; /* bg-gray-800 */
    border-radius: 0.5rem;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}
.history-card-header {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 1rem;
}
.history-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* Force a 3-column grid */
    gap: 1rem;
}
.history-stat-item {
    background-color: #374151; /* bg-gray-700 */
    padding: 0.75rem;
    border-radius: 0.375rem;
}
.history-stat-label {
    font-size: 0.875rem;
    color: #9CA3AF; /* gray-400 */
}
.history-stat-value {
    font-size: 1.125rem;
    font-weight: 600;
}

.record-holder-card {
    background-color: #1F2937;
    border-radius: 0.5rem;
    padding: 1.5rem;
}
.record-holder-title {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 1rem;
}
.record-item {
    display: flex;
    justify-content: space-between;
    padding: 0.5rem 0;
    border-bottom: 1px solid #374151;
}
.record-item:last-child {
    border-bottom: none;
}
.record-stat-name {
    font-weight: 600;
}
.record-holder-info {
    text-align: right;
}
.record-holder-value {
    font-weight: 700;
    font-size: 1.125rem;
}
.record-holder-player {
    font-size: 0.875rem;
    color: #9CA3AF;
}

.custom-select-options.opens-up {
    top: auto;
    bottom: 100%;
}

.trophy-icon {
    display: inline-block;
    margin-left: 0.75rem; /* 12px */
    font-size: 1.25rem; /* text-xl */
    cursor: default;
    position: relative; /* Needed for the tooltip */
}

.trophy-icon.silver {
    color: #C0C0C0; /* A standard silver color */
}

.trophy-icon.gold {
    color: #FFD700; /* A standard gold color */
}

/* Tooltip styles */
.trophy-icon::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: 125%; /* Position above the icon */
    left: 50%;
    transform: translateX(-50%);
    
    background-color: #374151; /* bg-gray-700 */
    color: #FFF;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    white-space: nowrap;
    
    opacity: 0; /* Hidden by default */
    visibility: hidden;
    transition: opacity 0.2s, visibility 0.2s;
    z-index: 10;
}

.trophy-icon:hover::after {
    opacity: 1;
    visibility: visible;
}

/* This makes the orange indicator on the School Records link work correctly */
#school-records-nav-link .offseason-indicator {
    background-color: #F97316; /* bg-orange-500 */
    color: white;
}

/* In style.css, add to the end of the file */

.award-card {
    position: relative; /* Allows absolute positioning for the delete button */
    cursor: pointer;
}

.award-card:hover {
    background-color: #374151; /* bg-gray-700 */
}

/* Rule 1: Gives the player name dropdown a generous, fixed width */
#update-stats-page .player-select {
    width: 220px;
}

/* Rule 2: Gives the smaller numerical stat boxes a functional minimum width */
#update-stats-page input[type="number"] {
    width: 80px;
}

/* In style.css */

/* Styling for the new Position/Number Changes page */
.pos-change-container {
    max-width: 600px; /* Constrains the width for better readability */
}

.pos-change-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem; /* 24px */
    align-items: end;
}

.pos-change-grid .label {
    font-size: 0.875rem; /* text-sm */
    color: #9CA3AF; /* gray-400 */
}

/* Positions the delete button on the dynasty list item */
.dynasty-list-item-container {
    position: relative;
}

.delete-dynasty-btn {
    position: absolute;
    top: 0.5rem;  /* 8px */
    right: 0.5rem; /* 8px */
    color: #9CA3AF; /* gray-400 */
    background-color: #374151; /* bg-gray-700 */
    border: none;
    font-size: 0.75rem; /* text-sm */
    cursor: pointer;
    width: 1.5rem; /* 24px */
    height: 1.5rem; /* 24px */
    border-radius: 9999px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.delete-dynasty-btn:hover {
    color: white;
    background-color: #DC2626; /* bg-red-600 */
}

#confirm-checklist-btn:disabled {
    background-color: #4B5563; /* bg-gray-600 */
    color: #9CA3AF;           /* text-gray-400 */
    cursor: not-allowed;
}

#confirm-checklist-btn:disabled:hover {
    background-color: #4B5563; /* Keep the same gray on hover */
}

/* Styling for the new bowl game dropdown on the schedule page */
.bowl-game-select {
    font-size: 0.8rem;      /* Smaller font size */
    padding: 0.2rem 0.5rem; /* Reduced padding */
    margin-top: 0.25rem;    /* A little space from the week label */
    width: 100%;
}

/* Styling for the new bowl winner trophy icon */
.trophy-icon.bowl-win {
    color: #8B4513; /* A bronze/football color */
}

/* Informational box styling for Player Progression page */
.info-box-warning {
    background-color: rgba(217, 119, 6, 0.2); /* bg-amber-600 with opacity */
    border: 1px solid #B45309; /* border-amber-700 */
    color: #FCD34D; /* text-amber-300 */
    padding: 0.75rem; /* p-3 */
    border-radius: 0.375rem; /* rounded-md */
    margin-bottom: 1.5rem; /* mb-6 */
    font-size: 0.875rem; /* text-sm */
}

/* --- Hall of Fame Feature Styles --- */

/* "Hall of Fame" text next to a player's name on their card */
.player-card-hof-indicator {
    background-color: #FBBF24; /* amber-400 */
    color: #422006; /* A dark brown for text */
    padding: 0.2rem 0.6rem;
    border-radius: 0.25rem;
    font-size: 0.8rem;
    font-weight: 700;
    margin-left: 0.75rem;
    vertical-align: middle; /* Aligns it nicely with the name */
}

/* The button used to induct a player */
.btn-induct-hof {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 1rem;
    background-color: transparent;
    border: 2px solid #FBBF24; /* amber-400 */
    color: #FBBF24;
    padding: 0.5rem 1rem;
    border-radius: 0.375rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-induct-hof:hover {
    background-color: #FBBF24;
    color: #1F2937; /* bg-gray-800 */
}

/* Disabled state for the induction button */
.btn-induct-hof:disabled {
    border-color: #4B5563; /* gray-600 */
    color: #4B5563;
    cursor: not-allowed;
}
.btn-induct-hof:disabled:hover {
    background-color: transparent;
    color: #4B5563;
}


/* Grid container for the Hall of Fame banners */
.hof-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.5rem;
    margin-top: 1rem;
}

/* Individual Hall of Fame banner style */
.hof-banner {
    background: linear-gradient(145deg, #2c3e50, #1F2937);
    border: 1px solid #4B5563; /* gray-600 */
    border-left: 5px solid #FBBF24; /* amber-400 */
    border-radius: 0.5rem;
    padding: 1.5rem;
    text-align: center;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
}

.hof-banner-name {
    font-size: 1.5rem;
    font-weight: 700;
    color: white;
}

.hof-banner-details {
    font-size: 1.1rem;
    color: #D1D5DB; /* gray-300 */
    margin: 0.25rem 0;
}

.hof-banner-induction {
    margin-top: 1rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: #FBBF24; /* amber-400 */
    background-color: rgba(251, 191, 36, 0.1);
    padding: 0.25rem 0.5rem;
    border-radius: 9999px;
    display: inline-block;
}

/* Makes text gold for HOF players in the roster view */
.player-name-hof {
    color: #FBBF24; /* amber-400 */
    font-weight: 600;
}

/* Adds a pointer cursor to HOF banners to indicate they are clickable */
.hof-banner {
    cursor: pointer;
    transition: transform 0.2s ease-in-out;
}
.hof-banner:hover {
    transform: translateY(-4px); /* Slight lift effect on hover */
}

.pagination-container {
    display: flex;
    justify-content: center;
    padding: 1.5rem 0;
}

/* Add to the end of style.css */
.btn-bug-report {
    position: fixed;
    top: 1rem; /* 16px */
    right: 1rem; /* 16px */
    z-index: 1000; /* Ensures it stays on top of other elements */
    
    background-color: #f59e0b; /* A distinct amber/yellow color */
    color: #422006; /* Dark brown text for contrast */
    padding: 0.5rem 1rem;
    border-radius: 9999px; /* A pill shape */
    font-weight: 600;
    font-size: 0.875rem;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    transition: all 0.2s ease-in-out;
}

.btn-bug-report:hover {
    background-color: #d97706; /* Darker amber on hover */
    transform: translateY(-2px);
    box-shadow: 0 6px 12px rgba(0,0,0,0.15);
}



/* Add this at the end of your style.css file */

/* Action buttons for tables (Edit/Delete) */
.action-btn-group {
    display: flex;
    gap: 0.5rem; /* 8px */
}

.btn-action {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.25rem;
    font-size: 1rem; /* 16px */
    border-radius: 0.25rem; /* 4px */
    transition: background-color 0.2s;
    width: 2rem;
    height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-action-edit {
    color: #60A5FA; /* blue-400 */
}

.btn-action-edit:hover {
    background-color: #374151; /* gray-700 */
    color: #93C5FD; /* blue-300 */
}

.btn-action-delete {
    color: #F87171; /* red-400 */
}

.btn-action-delete:hover {
    background-color: #374151; /* gray-700 */
    color: #FCA5A5; /* red-300 */
}

/* Styling for the new 'To' school selector in the transfer out table */
.transfer-out-school-select {
    background-color: #374151; /* bg-gray-700 */
    border: 1px solid #4B5563; /* bg-gray-600 */
    border-radius: 0.375rem;
    padding: 0.25rem 0.5rem;
    color: white;
    min-width: 150px;
}

/* Makes the stat inputs in the player card compact */
.player-card-stat-input {
    width: 65px;
    background-color: #4B5563; /* gray-600 */
    border: 1px solid #6B7280; /* gray-500 */
    color: white;
    text-align: center;
    border-radius: 0.25rem;
    padding: 0.125rem 0.25rem;
    -moz-appearance: textfield; /* Hides number spinners in Firefox */
}

/* Hides number spinners in Chrome, Safari, Edge, Opera */
.player-card-stat-input::-webkit-outer-spin-button,
.player-card-stat-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Container for the edit/save buttons on the player card */
.player-card-stats-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: 1.5rem;
}

/* Hide elements by default */
.edit-stats-view {
    display: none;
}


.accolade-name {
    color: #fdf5c1; /* A standard gold color */
    font-weight: 600; /* Make it a bit bolder */
}

.accolade-year-container {
    margin-top: 1rem;
    background-color: #1F2937; /* bg-gray-800 */
    border-radius: 0.5rem;
    overflow: hidden;
    border: 1px solid #374151; /* A subtle border */
}

.accolade-year-header {
    padding: 1rem 1.5rem;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: background-color 0.2s;
}

.accolade-year-header:hover {
    background-color: #374151; /* bg-gray-700 */
}

.accolade-year-header h3 {
    font-size: 1.25rem; /* text-xl */
    font-weight: 700;
}

.accolade-year-header .fa-chevron-down {
    transition: transform 0.3s ease-out;
}

.accolade-year-content {
    padding: 0 1.5rem; /* Keep horizontal padding */
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-in-out, padding 0.4s ease-in-out;
}

/* --- State change when .expanded is added to the container --- */
.accolade-year-container.expanded .accolade-year-content {
    padding: 0 1.5rem 1.5rem; /* Add vertical padding back */
    max-height: 2000px; /* A large value to allow content to show */
}

.accolade-year-container.expanded .accolade-year-header .fa-chevron-down {
    transform: rotate(180deg);
}

/* --- FINAL GUARANTEED FIX: Offseason Stats Layout --- */

/* The main container for the tabs, separate from the scrolling content */
.stats-tabs-container {
    display: flex;
    border-bottom: 1px solid #4B5563;
    background-color: #1F2937;
}
.stats-tab-btn {
    padding: 0.75rem 1.5rem;
    font-weight: 600;
    color: #9CA3AF;
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    cursor: pointer;
    white-space: nowrap;
}
.stats-tab-btn.active {
    color: white;
    border-bottom-color: #3B82F6;
}

/* The main layout container, using Flexbox */
.stats-update-layout {
    display: flex;
    height: 75vh; /* Set a fixed height */
    border: 1px solid #4B5563;
    border-radius: 0.5rem;
    overflow: hidden; /* Hide parent overflow */
}

/* Left pane: Player names and positions */
.stats-player-pane {
    flex: 0 0 280px; /* Do not grow, do not shrink, base width 280px */
    overflow: hidden; /* Hide its own scrollbar */
    background-color: #1F2937;
    border-right: 1px solid #4B5563;
}

/* Right pane: Stat entry fields */
.stats-data-pane {
    flex: 1 1 auto; /* Grow and shrink to fill space */
    overflow: auto; /* THE ONLY SCROLLING ELEMENT */
}

/* Header for both panes */
.stats-header {
    background-color: #374151;
    font-weight: 600;
    padding: 0 1rem; /* Adjust padding */
    border-bottom: 1px solid #4B5563;
    position: sticky;
    top: 0;
    z-index: 10;
    height: 53px; /* Match the row height */
    display: flex;
    align-items: center;
}

/* A single row in the layout */
.stats-row {
    display: flex;
    align-items: center;
    height: 53px; /* Fixed height for alignment */
    border-bottom: 1px solid #374151;
}
.stats-row:hover {
    background-color: #1c2431;
}

/* Individual cells */
.stats-cell-name { width: 200px; padding-left: 1rem; font-weight: 600;}
.stats-cell-pos { width: 80px; padding-left: 1rem; }
.stats-cell-data { min-width: 95px; text-align: center; }

/* The container for each category's stat fields */
.stats-group {
    display: flex;
}

.stats-update-input {
    width: 85px;
    padding: 0.25rem;
    text-align: center;
    background-color: #4B5563;
    border: 1px solid #6B7280;
    border-radius: 4px;
}

/* Add this new rule to specifically target the stat names in the header */
#stats-data-header .stats-cell-data {
    font-size: 0.7rem;
    font-weight: normal;
    color: #D1D5DB;
    padding-left: -10rem; /* ADD THIS LINE to shift text left */
    background-color: #374151;
}
/* ADD THIS NEW RULE to fix the "Pos" header alignment */
.stats-header-player {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    color: transparent; /* Makes the text invisible */
}
/* ADD this new rule below it */
.stats-header-player::before {
    content: 'Player'; /* Add placeholder text for alignment */
}

/* Add this to the end of style.css */
.player-transferring-out {
    color: #F87171 !important; /* red-400 with important to override other styles */
    text-decoration: line-through;
    opacity: 0.8;
}

.player-transferring-out .stats-cell-name,
.player-transferring-out .stats-cell-pos {
    color: #F87171 !important;
}

.player-transferring-out .stats-update-input {
    border-color: #F87171;
}

/* Add to the end of your style.css file */

/* Depth Chart Reordering Styles */
.depth-chart-list-item {
    position: relative; /* Needed for positioning the arrows */
    padding-right: 3rem; /* Make space for the arrows */
}

.depth-chart-arrows {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    display: none; /* Hidden by default */
    gap: 0.25rem;
}

.depth-chart-list-item:hover .depth-chart-arrows {
    display: flex; /* Show on hover */
}

.depth-chart-arrow-btn {
    background: none;
    border: none;
    color: #9CA3AF; /* gray-400 */
    cursor: pointer;
    padding: 0.25rem;
}

.depth-chart-arrow-btn:hover {
    color: #FFFFFF;
}

.depth-chart-arrow-btn:disabled {
    color: #4B5563; /* gray-600 */
    cursor: not-allowed;
}

#save-depth-chart-container {
    position: sticky;
    top: 0;
    z-index: 20;
    padding: 1rem;
    background-color: rgba(23, 37, 84, 0.9); /* A translucent blue */
    backdrop-filter: blur(5px);
    border-radius: 0.5rem;
    margin-bottom: 1rem;
    text-align: center;
}

/* Add to the end of style.css */
.input-error {
    border: 2px solid #F87171 !important; /* red-400 */
    background-color: #450a0a; /* A dark red background */
}

.scroll-indicator-container {
    position: relative;
}

.scroll-indicator-container::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 50px;
    /* This creates a gradient that fades from the page background to transparent */
    background: linear-gradient(to top, #111827, transparent);
    pointer-events: none; /* Allows you to click on content 'behind' the fade */
}

.award-card .action-btn-group {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    display: none; /* Hide buttons by default */
}

.award-card:hover .action-btn-group {
    display: flex; /* Show buttons on hover */
}

.search-result-item {
    display: flex;
    align-items: center;
    gap: 0.75rem; /* 12px */
    padding: 0.5rem 0.75rem; /* 8px 12px */
    cursor: pointer;
    transition: background-color 0.2s;
}

.search-result-item:hover {
    background-color: #4B5563; /* gray-600 */
}

.search-result-item img {
    height: 1.75rem; /* 28px */
    width: 1.75rem; /* 28px */
    object-fit: contain;
}

.search-result-details {
    font-size: 0.75rem; /* 12px */
    color: #9CA3AF; /* gray-400 */
}

.trophy-icon.bronze {
    color: #CD7F32; /* A bronze color */
}

.trophy-icon.white {
    color: #E5E7EB; /* A light gray/white color */
}

.coaching-history-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 1.5rem;
}

.coaching-history-table th,
.coaching-history-table td {
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 1px solid #374151; /* gray-700 */
}

.coaching-history-table th {
    background-color: #374151; /* gray-700 */
    font-weight: 600;
}

.coaching-history-table tbody tr:hover {
    background-color: #1c2431;
}

/* --- H2H Record Finder Widget Styles --- */
.h2h-widget {
    margin-top: 2rem;
    background-color: #1F2937; /* bg-gray-800 */
    padding: 1.5rem;
    border-radius: 0.5rem;
}

.h2h-widget-header {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.h2h-select-container {
    display: flex;
    gap: 1rem;
    align-items: center;
    margin-bottom: 1.5rem;
}

#h2h-opponent-select {
    flex-grow: 1;
}

.h2h-results-summary {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.h2h-game-list-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
    border-bottom: 1px solid #374151; /* gray-700 */
    font-size: 0.875rem;
}
.h2h-game-list-item:last-child {
    border-bottom: none;
}

.h2h-game-result {
    font-weight: 700;
}

/* Add to the end of style.css */
.btn-offseason-checklist {
    background-color: #f59e0b; /* A distinct amber/yellow color */
    color: #422006; /* Dark brown text for contrast */
    padding: 0.5rem 1rem;
    border-radius: 0.375rem; /* Standard button radius */
    font-weight: 600;
    font-size: 0.875rem;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border: none;
    cursor: pointer;
    transition: background-color 0.2s ease-in-out;
}

.btn-offseason-checklist:hover {
    background-color: #d97706; /* Darker amber on hover */
}


/* Offseason Workflow Popup Text Resizing */
#offseason-workflow-modal .modal-content-lg .text-gray-300 {
    font-size: 0.8rem; /* Slightly smaller than the default text size */
    line-height: 1.5; /* Adjust line spacing for readability */
}

#offseason-workflow-modal .modal-content-lg h3 {
    font-size: 1.15rem; /* Makes the title a bit smaller */
}

#offseason-workflow-modal .modal-content-lg li {
    margin-bottom: 0.25rem; /* Reduces space between list items */
}

#offseason-workflow-modal .modal-content-lg strong {
    font-size: 0.85rem; /* Ensures the bolded headers are still prominent */
}

/* --- Career Accolades Styles --- */
.accolades-card {
    background-color: #1F2937; /* bg-gray-800 */
    padding: 1.5rem;
    border-radius: 0.5rem;
}

.accolades-header {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #374151;
}

.accolades-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.accolade-item {
    background-color: #374151; /* bg-gray-700 */
    padding: 0.75rem;
    border-radius: 0.375rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.accolade-label {
    font-size: 0.875rem;
    color: #9CA3AF; /* gray-400 */
}

.accolade-value {
    font-size: 1.125rem;
    font-weight: 600;
}


.btn-danger-confirm {
    background-color: #FBBF24; /* amber-400 */
    color: #422006; /* dark brown */
    font-weight: bold;
}
.btn-danger-confirm:hover {
    background-color: #F59E0B; /* amber-500 */
}

.btn-action-download {
    color: #4ADE80; /* A nice green color */
}

.btn-action-download:hover {
    background-color: #374151; /* gray-700 */
    color: #A7F3D0; /* A lighter green on hover */
}

/* --- Success Banner & Confirmation Modal Styles --- */

/* Confirmation Modal - uses existing modal styles, no new CSS needed unless you want to customize it further */

/* Success Banner */
#success-banner {
    position: fixed;
    top: -100px; /* Start off-screen */
    left: 50%;
    transform: translateX(-50%);
    background-color: #22c55e; /* green-500 */
    color: white;
    padding: 1rem 2rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    z-index: 2000; /* Ensures it's on top of everything */
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-weight: 600;
    transition: top 0.5s ease-in-out;
}

#success-banner.show {
    top: 2rem; /* Slide into view */
}

/* Add to the end of your style.css file */

.btn-discord {
    position: fixed;
    top: 4.5rem; /* Position it below the bug report button */
    right: 1rem;
    z-index: 1000;
    
    background-color: #5865F2; /* Discord's brand color */
    color: #FFFFFF;
    width: 2.75rem;   /* Make it a circle */
    height: 2.75rem;  /* Make it a circle */
    border-radius: 9999px; 
    font-size: 1.25rem; /* Slightly larger icon */
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    transition: all 0.2s ease-in-out;
}

.btn-discord:hover {
    background-color: #4752C4; /* Darker Discord color on hover */
    transform: translateY(-2px);
    box-shadow: 0 6px 12px rgba(0,0,0,0.15);
}

/* --- Home Page Banner Styles --- */
.home-banner {
    background: linear-gradient(to right, #2f116f, #1a3d6b); /* purple-800 to purple-700 */
    padding: 1.5rem 2rem;
    border-radius: 0.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: white;
}

.home-banner-actions {
    display: flex;
    align-items: center;
    gap: 1.5rem; /* Adds space between the buttons and the week display */
}

.home-banner-week {
    text-align: right;
    background-color: rgba(0,0,0,0.2);
    padding: 0.5rem 1rem;
    border-radius: 0.375rem;
    flex-shrink: 0; /* Prevents the week box from shrinking */
}

.home-banner-week span {
    font-size: 0.875rem;
    color: #ddd6fe; /* purple-200 */
}

.home-banner-week p {
    font-size: 1.25rem;
    font-weight: 700;
}

/* --- Record Boxes Styles --- */
.record-boxes-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.record-box {
    background-color: #1F2937; /* bg-gray-800 */
    padding: 1.5rem;
    border-radius: 0.5rem;
    border-left: 4px solid #3b82f6; /* blue-500 */
}

.record-box-title {
    color: #9CA3AF; /* gray-400 */
    font-weight: 600;
}

.record-box-value {
    font-size: 2.25rem; /* text-4xl */
    font-weight: 800; /* extrabold */
    margin-top: 0.25rem;
}

.record-box-subtext {
    font-size: 0.875rem; /* text-sm */
    color: #6B7280; /* gray-500 */
}

/* --- Season Progress Box Styles --- */
.season-progress-box {
    margin-top: 1rem;
}

.progress-bar-container {
    background-color: #374151; /* bg-gray-700 */
    border-radius: 9999px;
    height: 10px;
    overflow: hidden;
}

.progress-bar-fill {
    background-color: #3b82f6; /* bg-blue-500 */
    height: 100%;
    border-radius: 9999px;
    transition: width 0.5s ease-in-out;
}

.progress-labels {
    display: flex;
    justify-content: space-between;
    font-size: 0.75rem; /* text-xs */
    color: #9CA3AF; /* gray-400 */
    margin-top: 0.5rem;
}

.progress-stats {
    margin-bottom: 0.75rem; /* Adds space below the text */
}

/* --- Recent Activity Box Styles --- */
.activity-item {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.activity-icon {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.125rem;
    color: white;
}

.activity-icon-win {
    background-color: #16a34a; /* green-600 */
}

.activity-icon-loss {
    background-color: #dc2626; /* red-600 */
}

.activity-icon-recruit {
    background-color: #fbbf24; /* amber-400 */
    color: #422006; /* dark brown text */
}

.analysis-table-pivoted th, .analysis-table-pivoted td {
    text-align: center;
}
.analysis-table-pivoted td:first-child {
    text-align: left;
}

/* --- Global Tooltip for Position Hover --- */
.tooltip-global {
    position: fixed; /* Positions relative to the viewport */
    display: none;   /* Hidden by default */
    background-color: #111827; /* bg-gray-900 */
    border: 1px solid #4B5563; /* border-gray-600 */
    color: white;
    padding: 0.75rem; /* 12px */
    border-radius: 0.375rem; /* rounded-md */
    box-shadow: 0 4px 15px rgba(0,0,0,0.4);
    z-index: 1000; /* Ensures it's on top of other content */
    pointer-events: none; /* Prevents the tooltip from blocking mouse events */
    font-size: 0.875rem; /* text-sm */
    max-width: 300px;
}

.tooltip-global ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.tooltip-global li {
    display: flex;
    justify-content: space-between;
}

.tooltip-global li .player-name {
    margin-right: 1rem; /* Space between name and overall */
}

/* --- Dev Trait Styling --- */
.dev-trait {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem; /* 8px */
    font-weight: 600;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
}

.dev-trait-impact {
    color: #60A5FA; /* text-blue-400 */
    background-color: rgba(59, 130, 246, 0.15); /* Faint blue background */
}

.dev-trait-star {
    color: #FBBF24; /* text-amber-400 */
    background-color: rgba(251, 191, 36, 0.15); /* Faint amber background */
}

.dev-trait-elite {
    color: #C084FC; /* text-purple-400 */
    background-color: rgba(192, 132, 252, 0.15); /* Faint purple background */
}

/* --- Schedule Page Tidying --- */
/* Hides the default dropdown arrow on the schedule page's select elements */
#schedule-page .input-field {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-right: 0.5rem; /* Remove default padding for the arrow */
}

/* --- Recruiting Visit Styles --- */
.visit-tracker {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    color: #9CA3AF; /* gray-400 */
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    transition: background-color 0.2s;
}

.visit-tracker:hover {
    background-color: #374151; /* gray-700 */
    color: white;
}

.visit-tracker.full {
    color: #FBBF24; /* amber-400 */
    font-weight: 600;
}

.visit-list-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #374151;
    padding: 0.5rem 0.75rem;
    border-radius: 0.25rem;
}

/* Message box for when recruiting visits are not allowed */
#visit-restriction-message {
    background-color: rgba(217, 119, 6, 0.2); /* bg-amber-600 with opacity */
    border: 1px solid #B45309; /* border-amber-700 */
    color: #FCD34D; /* text-amber-300 */
    padding: 0.75rem;
    border-radius: 0.375rem;
    text-align: center;
    margin-bottom: 1.5rem;
}

/* Aligns the week name and visit counter on the same line */
.schedule-week-label {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
}

/* Narrows the rank selection boxes on the schedule page */
.rank-select {
    width: 5rem; /* 80px */
    text-align: center;
}

/* Highlights the current week on the schedule page */
.current-week-row {
    background-color: rgba(59, 130, 246, 0.25) !important; /* A semi-transparent blue */
    border: 1px solid rgba(59, 130, 246, 0.5);
}

.captain-icon {
    cursor: pointer;
    font-size: 1.25rem;
    color: #6B7280; /* gray-500 */
}
.captain-icon.active {
    color: #FBBF24; /* amber-400 */
}

.captain-indicator-icon {
    color: #4ADE80; /* This is the same color as Tailwind's text-green-400 */
    font-weight: bold;
}