/* CSS moderne et épuré pour ProTeam.php */

/* Import de la police Inter pour un look moderne */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');



/* Variables CSS pour la cohérence des couleurs */

:root {

    --primary-color: #1e40af;

    --secondary-color: #3b82f6;

    --accent-color: #f59e0b;

    --success-color: #10b981;

    --danger-color: #ef4444;

    --warning-color: #f59e0b;

    --dark-color: #1f2937;

    --gray-50: #f9fafb;

    --gray-100: #f3f4f6;

    --gray-200: #e5e7eb;

    --gray-300: #d1d5db;

    --gray-400: #9ca3af;

    --gray-500: #6b7280;

    --gray-600: #4b5563;

    --gray-700: #374151;

    --gray-800: #1f2937;

    --gray-900: #111827;

    --white: #ffffff;

    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);

    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);

    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);

    --border-radius: 8px;

    --border-radius-lg: 12px;

    --radius-sm: 0.375rem;

    --radius-md: 0.5rem;

    --radius-lg: 0.75rem;

}



/* Reset et base */

* {

    box-sizing: border-box;

    margin: 0;

    padding: 0;

}



body {

    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);

    line-height: 1.6;

    color: var(--gray-800);

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

}



/* Container et layout */

.container {

    max-width: 1400px;

    margin: 0 auto;

    padding: 0 1rem;

}



.container-flex {

    max-width: 1400px;

    margin: 0 auto;

    padding: 0 1rem;

}



/* Header moderne de l'équipe */

#STHSPHPTeamStat_SubHeader {

    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));

    border-radius: 0 0 var(--border-radius-lg) var(--border-radius-lg);

    box-shadow: var(--shadow-lg);

    margin-bottom: 2rem;

    overflow: hidden;

}



.STHSPHPTeamHeader_Table {

    width: 100%;

    border-collapse: collapse;

    padding: 0;

}



.STHSPHPTeamHeader_Logo {

    width: 140px;

    padding: 1.5rem;

    vertical-align: middle;

    background: rgba(255, 255, 255, 0.1);

    text-align: center;

}



.STHSPHPTeamHeader_Logo img,

.STHSPHPTeamStatImage {

    width: 100px !important;

    height: 100px !important;

    border-radius: var(--border-radius);

    box-shadow: var(--shadow-md);

    background: var(--white);

    padding: 0.5rem;

    object-fit: contain;

}



.team-logo-placeholder {

    width: 100px;

    height: 100px;

    background: rgba(255, 255, 255, 0.2);

    border-radius: var(--border-radius);

    display: flex;

    align-items: center;

    justify-content: center;

    margin: 0 auto;

}



.team-logo-placeholder span {

    font-size: 2rem;

    font-weight: 700;

    color: white;

    text-transform: uppercase;

}



.STHSPHPTeamHeader_TeamName {

    font-size: 2.5rem;

    font-weight: 800;

    color: var(--white);

    padding: 1rem 2rem;

    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);

    letter-spacing: -0.025em;

}



.STHSPHPTeamHeader_Stat {

    font-size: 1rem;

    color: var(--white);

    padding: 0 2rem 1.5rem 2rem;

    line-height: 1.8;

    opacity: 0.95;

}



/* Navigation des onglets moderne */

.STHSPHPTeamStat_Main {

    background: transparent !important;

    padding: 0;

    display: block !important;

}



.tabsmain {

    background: var(--white);

    border-radius: var(--border-radius-lg);

    box-shadow: var(--shadow-md);

    margin-bottom: 2rem;

    overflow: hidden;

}



.tabmain-links {

    display: flex;

    flex-wrap: wrap;

    background: var(--gray-100) !important;

    border-bottom: 1px solid var(--gray-200);

    margin: 0;

    padding: 0;

    list-style: none;

    overflow-x: auto;

}



.tabmain-links li {

    margin: 0;

    flex-shrink: 0;

}



.tabmain-links a {

    display: block;

    padding: 1rem 1.5rem;

    color: var(--gray-600);

    text-decoration: none;

    font-weight: 500;

    font-size: 0.9rem;

    transition: all 0.2s ease;

    border-bottom: 3px solid transparent;

    position: relative;

}



.tabmain-links a:hover {

    color: var(--primary-color);

    background: var(--white);

}



.tabmain-links .activemain a,

.tabmain-links a.active {

    color: var(--primary-color) !important;

    background: var(--white) !important;

    border-bottom-color: var(--primary-color) !important;

    font-weight: 600 !important;

}



.activemain {

    background: var(--white) !important;

    border-bottom: 3px solid var(--primary-color) !important;

}



/* Contenu des onglets */

.cardbook {

    padding: 2rem;

}



.tabmain {

    padding: 2rem;

    background: var(--white);

    display: none;

    animation: fadeIn 0.3s ease-out;

}



.tabmain.active {

    display: block;

}



/* Styles spécifiques pour l'onglet Schedule */

#tabmain3 {

    padding: 1rem !important;

    max-width: 100%;

    overflow-x: auto;

}



#tabmain3 .schedule-filters {

    margin-bottom: 20px;

    padding: 15px;

    background: #f8f9fa;

    border-radius: 8px;

    border: 1px solid #e9ecef;

}



#tabmain3 .schedule-container {

    width: 100%;

    overflow-x: auto;

    margin-bottom: 20px;

    display: flex;

    justify-content: center;

}



#tabmain3 .schedule-table {

    width: 100%;

    min-width: 900px;

    max-width: 1200px;

    font-size: 10px;

    border-collapse: collapse;

    border: 1px solid #ddd;

    background: white;

    box-shadow: 0 2px 4px rgba(0,0,0,0.1);

    margin: 0 auto;

}



#tabmain3 .schedule-table th {

    background: #1e40af;

    border: 1px solid rgba(255, 255, 255, 0.3);

    padding: 6px 4px;

    text-align: center;

    font-weight: 600;

    font-size: 11px;

    line-height: 1.2;

    color: white;

    white-space: nowrap;

}



#tabmain3 .schedule-table td {

    border: 1px solid #ddd;

    padding: 10px 6px;

    text-align: center;

    vertical-align: middle;

}



#tabmain3 .schedule-table tr:hover {

    background-color: #f8f9fa;

}



#tabmain3 .schedule-table .home-game {

    background-color: #f0f8ff;

}



#tabmain3 .schedule-table .away-game {

    background-color: #fff8f0;

}



#tabmain3 .schedule-table .played-game {

    opacity: 1;

}



#tabmain3 .schedule-table .upcoming-game {

    opacity: 0.8;

}



#tabmain3 .schedule-stats {

    margin-top: 20px;

    padding: 20px;

    background: #f8f9fa;

    border-radius: 8px;

    border: 1px solid #e9ecef;

}



#tabmain3 .schedule-stats h4 {

    margin-bottom: 15px;

    color: #495057;

    font-weight: 600;

}



#tabmain3 .schedule-stats > div {

    display: flex;

    justify-content: space-around;

    text-align: center;

    flex-wrap: wrap;

    gap: 20px;

}



#tabmain3 .schedule-stats > div > div {

    flex: 1;

    min-width: 100px;

}



/* Responsive pour l'onglet Schedule */

@media (max-width: 1200px) {

    #tabmain3 .schedule-table {

        min-width: 800px;

        font-size: 10px;

    }

    

    #tabmain3 .schedule-table th,

    #tabmain3 .schedule-table td {

        padding: 8px 4px;

    }

}



@media (max-width: 768px) {

    #tabmain3 {

        padding: 0.5rem !important;

    }

    

    #tabmain3 .schedule-filters {

        padding: 10px;

        flex-direction: column;

        gap: 10px;

    }

    

    #tabmain3 .schedule-filters label {

        margin-right: 0;

        margin-bottom: 5px;

    }

    

    #tabmain3 .schedule-table {

        min-width: 700px;

        font-size: 10px;

    }

    

    #tabmain3 .schedule-stats > div {

        flex-direction: column;

        gap: 15px;

    }

    

    #tabmain3 .schedule-stats > div > div {

        min-width: auto;

    }

}



@media (max-width: 480px) {

    #tabmain3 .schedule-table {

        min-width: 600px;

        font-size: 10px;

    }

    

    #tabmain3 .schedule-table th,

    #tabmain3 .schedule-table td {

        padding: 6px 2px;

    }

}



/* Weekly Schedule */

.weekly-schedule {

    background: var(--white);

    border-radius: var(--border-radius-lg);

    box-shadow: var(--shadow-md);

    margin-bottom: 2rem;

    overflow: hidden;

}



.weekly-schedule h3 {

    background: var(--primary-color);

    color: white;

    margin: 0;

    padding: 1.5rem 2rem;

    border-bottom: none;

    font-size: 1.25rem;

    text-transform: uppercase;

    letter-spacing: 0.05em;

}



.schedule-container {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 0;

}



.schedule-section {

    padding: 1.5rem 2rem;

    border-right: 1px solid var(--gray-200);

}



.schedule-section:last-child {

    border-right: none;

}



.schedule-section h4 {

    font-size: 1rem;

    font-weight: 600;

    color: var(--primary-color);

    margin-bottom: 1rem;

    text-transform: uppercase;

    letter-spacing: 0.05em;

}



.schedule-days {

    display: flex;

    flex-direction: column;

    gap: 1rem;

}



.schedule-day {

    background: var(--gray-50);

    border-radius: var(--border-radius);

    padding: 1rem;

    border: 1px solid var(--gray-200);

    transition: all 0.2s ease;

}



.schedule-day:hover {

    box-shadow: var(--shadow-sm);

    border-color: var(--gray-300);

}



.game-date {

    font-size: 0.75rem;

    color: var(--gray-500);

    font-weight: 600;

    margin-bottom: 0.75rem;

    text-transform: uppercase;

    letter-spacing: 0.05em;

}



.game-matchup {

    display: flex;

    flex-direction: column;

    gap: 0.5rem;

}



.game-matchup.win {

    border-left: 3px solid var(--success-color);

}



.game-matchup.loss {

    border-left: 3px solid var(--danger-color);

}



.game-matchup.upcoming {

    border-left: 3px solid var(--primary-color);

}



.team-info {

    display: flex;

    align-items: center;

    gap: 0.75rem;

    padding: 0.5rem;

    border-radius: var(--radius-sm);

    background: var(--white);

}



.team-logo-mini {

    width: 20px;

    height: 20px;

    object-fit: contain;

}



.team-name {

    font-size: 0.875rem;

    font-weight: 500;

    color: var(--gray-800);

    flex: 1;

}



.score {

    font-size: 0.875rem;

    font-weight: 700;

    color: var(--primary-color);

    font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;

}



.game-type {

    font-size: 0.75rem;

    font-weight: 600;

    color: var(--accent-color);

    background: rgba(245, 158, 11, 0.1);

    padding: 0.25rem 0.5rem;

    border-radius: var(--radius-sm);

    text-align: center;

    margin-top: 0.5rem;

    text-transform: uppercase;

    letter-spacing: 0.05em;

}



.no-games {

    text-align: center;

    padding: 2rem;

    color: var(--gray-500);

    font-style: italic;

    background: var(--gray-50);

    border-radius: var(--border-radius);

    border: 1px dashed var(--gray-300);

}



/* Grille de statistiques */

.stats-grid {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 1.5rem;

    margin-bottom: 2rem;

}

/* Grille de statistiques pour tabmain02 - même style que tabmain01 */

#tabmain02 .stats-grid {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 1.5rem;

    margin-bottom: 2rem;

}



.stat-card {

    background: var(--white);

    border-radius: var(--border-radius-lg);

    padding: 1.5rem;

    box-shadow: var(--shadow-sm);

    transition: all 0.2s ease;

    border: 1px solid var(--gray-100);

    grid-column: span 1;

}

/* Cartes de statistiques pour tabmain02 - même style que tabmain01 */

#tabmain02 .stat-card {

    background: var(--white);

    border-radius: var(--border-radius-lg);

    padding: 1.5rem;

    box-shadow: var(--shadow-sm);

    transition: all 0.2s ease;

    border: 1px solid var(--gray-100);

    grid-column: span 1;

}



.stat-card:hover {

    box-shadow: var(--shadow-md);

    border-color: var(--gray-300);

}

/* Effet hover pour tabmain02 */

#tabmain02 .stat-card:hover {

    box-shadow: var(--shadow-md);

    border-color: var(--gray-300);

}



.stat-card h3 {

    margin: 0 0 1rem 0;

    font-size: 1.125rem;

    font-weight: 600;

    color: var(--gray-800);

    text-transform: uppercase;

    letter-spacing: 0.05em;

    padding-bottom: 0.5rem;

    border-bottom: 2px solid var(--primary-color);

}

/* Titres des cartes pour tabmain02 */

#tabmain02 .stat-card h3 {

    margin: 0 0 1rem 0;

    font-size: 1.125rem;

    font-weight: 600;

    color: var(--gray-800);

    text-transform: uppercase;

    letter-spacing: 0.05em;

    padding-bottom: 0.5rem;

    border-bottom: 2px solid var(--gray-100);

}



.stat-item {

    display: flex;

    justify-content: space-between;

    align-items: center;

    padding: 0.75rem 0;

    border-bottom: 1px solid var(--gray-100);

}



.stat-item:last-child {

    border-bottom: none;

}

/* Éléments de statistiques pour tabmain02 */

#tabmain02 .stat-item {

    display: flex;

    justify-content: space-between;

    align-items: center;

    padding: 0.75rem 0;

    border-bottom: 1px solid var(--gray-100);

}



#tabmain02 .stat-item:last-child {

    border-bottom: none;

}



.stat-label {

    font-size: 0.875rem;

    color: var(--gray-600);

    font-weight: 500;

}



.stat-value {

    font-size: 0.875rem;

    font-weight: 600;

    color: var(--gray-800);

    font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;

}

/* Labels et valeurs pour tabmain02 */

#tabmain02 .stat-label {

    font-size: 0.875rem;

    color: var(--gray-600);

    font-weight: 500;

}



#tabmain02 .stat-value {

    font-size: 0.875rem;

    font-weight: 600;

    color: var(--gray-800);

    font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;

}



/* Team Leaders style Sportsnet */

.stat-card.team-leaders {

    grid-column: span 4;

    padding: 0;

    background: transparent;

    border: none;

    box-shadow: none;

}



.team-leaders h3 {

    padding: 0 1.5rem 1rem;

    margin-bottom: 1.5rem;

    background: transparent;

    border-bottom: 2px solid var(--primary-color);

}



.leaders-grid {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 1.5rem;

}



.leader-card {

    position: relative;

    height: 280px;

    border-radius: var(--border-radius-lg);

    overflow: hidden;

    box-shadow: var(--shadow-lg);

    transition: all 0.3s ease;

    cursor: pointer;

}



.leader-card:hover {

    transform: translateY(-5px);

    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);

}



.leader-card::before {

    content: '';

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    background: linear-gradient(

        180deg,

        rgba(30, 64, 175, 0.1) 0%,

        rgba(30, 64, 175, 0.4) 40%,

        rgba(30, 64, 175, 0.8) 100%

    );

    z-index: 2;

    transition: all 0.3s ease;

}



.leader-card:hover::before {

    background: linear-gradient(

        180deg,

        rgba(30, 64, 175, 0.2) 0%,

        rgba(30, 64, 175, 0.5) 40%,

        rgba(30, 64, 175, 0.9) 100%

    );

}



.leader-image {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    object-fit: cover;

    object-position: center top;

    z-index: 1;

    transition: all 0.3s ease;

}



.leader-card:hover .leader-image {

    transform: scale(1.05);

}



.leader-content {

    position: absolute;

    bottom: 0;

    left: 0;

    right: 0;

    padding: 1.5rem;

    z-index: 3;

    color: white;

}



.leader-stat-label {

    font-size: 0.875rem;

    font-weight: 600;

    text-transform: uppercase;

    letter-spacing: 0.05em;

    margin-bottom: 0.5rem;

    opacity: 0.9;

    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);

}



.leader-player-name {

    font-size: 1.25rem;

    font-weight: 700;

    margin-bottom: 0.25rem;

    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.7);

    line-height: 1.2;

}



.leader-stat-number {

    font-size: 2.5rem;

    font-weight: 900;

    line-height: 1;

    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.7);

    font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;

}



.leader-position {

    font-size: 0.75rem;

    opacity: 0.8;

    font-weight: 500;

    text-transform: uppercase;

    letter-spacing: 0.05em;

    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);

}



/* Tableaux modernes */

table {

    width: 100%;

    border-collapse: collapse;

    background: var(--white);

    border-radius: var(--border-radius);

    overflow: hidden;

    box-shadow: var(--shadow-sm);

    margin-bottom: 1.5rem;

}



th {

    background: var(--primary-color);

    color: white;

    font-weight: 600;

    font-size: 0.875rem;

    text-transform: uppercase;

    letter-spacing: 0.05em;

    padding: 1rem 0.75rem;

    text-align: left;

}



td {

    padding: 0.875rem 0.75rem;

    border-bottom: 1px solid var(--gray-100);

    font-size: 0.875rem;

    vertical-align: middle;

    color: var(--gray-800);

}



tr:hover {

    background: var(--gray-50);

}



tr:last-child td {

    border-bottom: none;

}



.STHSPHPPlayerStat_Table,

.STHSPHPGoalerStat_Table,

.STHSPHPTeamStat_Table {

    border-radius: var(--border-radius);

    overflow: hidden;

    box-shadow: var(--shadow-sm);

}



.STHSPHPPlayerStat_Table tr:nth-child(even),

.STHSPHPGoalerStat_Table tr:nth-child(even) {

    background: var(--gray-50);

}



/* Liens */

a {

    color: var(--primary-color);

    text-decoration: none;

    transition: color 0.2s ease;

}



a:hover {

    color: var(--secondary-color);

}



.player-link {

    color: var(--primary-color);

    text-decoration: none;

    font-weight: 500;

    transition: color 0.2s ease;

}



.player-link:hover {

    color: var(--secondary-color);

    text-decoration: underline;

}



/* Transactions */

.transactions-list {

    display: flex;

    flex-direction: column;

    gap: 1rem;

}



.transaction-item {

    background: var(--gray-50);

    border-radius: var(--border-radius);

    padding: 1rem;

    border: 1px solid var(--gray-200);

    transition: all 0.2s ease;

}



.transaction-item:hover {

    box-shadow: var(--shadow-sm);

    border-color: var(--gray-300);

}



.transaction-date {

    font-size: 0.75rem;

    color: var(--gray-500);

    font-weight: 500;

    margin-bottom: 0.5rem;

    text-transform: uppercase;

    letter-spacing: 0.05em;

}



.transaction-details {

    font-size: 0.875rem;

    color: var(--gray-800);

    line-height: 1.5;

}



/* Titres */

h1, h2, h3, h4, h5, h6 {

    color: var(--gray-800);

    font-weight: 600;

    margin-bottom: 1rem;

}



h3 {

    font-size: 1.5rem;

    font-weight: 600;

    color: var(--gray-800);

    margin: 2rem 0 1rem;

    padding-bottom: 0.5rem;

    border-bottom: 2px solid var(--gray-200);

}



/* Animations */

@keyframes fadeIn {

    from { opacity: 0; transform: translateY(10px); }

    to { opacity: 1; transform: translateY(0); }

}



/* Override des styles d'équipe existants */

.teamColorDark1, .teamColorDark2, .teamColorDark3, .teamColorDark4, .teamColorDark5, 

.teamColorDark6, .teamColorDark7, .teamColorDark8, .teamColorDark9, .teamColorDark10,

.teamColorDark11, .teamColorDark12, .teamColorDark13, .teamColorDark14, .teamColorDark15,

.teamColorDark16, .teamColorDark17, .teamColorDark18, .teamColorDark19, .teamColorDark20,

.teamColorDark21, .teamColorDark22, .teamColorDark23, .teamColorDark24, .teamColorDark25,

.teamColorDark26, .teamColorDark27, .teamColorDark28, .teamColorDark29, .teamColorDark30,

.teamColorDark31, .teamColorDark32, .teamColorDark33,

.teamColorPale1, .teamColorPale2, .teamColorPale3, .teamColorPale4, .teamColorPale5, 

.teamColorPale6, .teamColorPale7, .teamColorPale8, .teamColorPale9, .teamColorPale10,

.teamColorPale11, .teamColorPale12, .teamColorPale13, .teamColorPale14, .teamColorPale15,

.teamColorPale16, .teamColorPale17, .teamColorPale18, .teamColorPale19, .teamColorPale20,

.teamColorPale21, .teamColorPale22, .teamColorPale23, .teamColorPale24, .teamColorPale25,

.teamColorPale26, .teamColorPale27, .teamColorPale28, .teamColorPale29, .teamColorPale30,

.teamColorPale31, .teamColorPale32, .teamColorPale33 {

    background: transparent !important;

}



.teamColorMenu1, .teamColorMenu2, .teamColorMenu3, .teamColorMenu4, .teamColorMenu5, 

.teamColorMenu6, .teamColorMenu7, .teamColorMenu8, .teamColorMenu9, .teamColorMenu10,

.teamColorMenu11, .teamColorMenu12, .teamColorMenu13, .teamColorMenu14, .teamColorMenu15,

.teamColorMenu16, .teamColorMenu17, .teamColorMenu18, .teamColorMenu19, .teamColorMenu20,

.teamColorMenu21, .teamColorMenu22, .teamColorMenu23, .teamColorMenu24, .teamColorMenu25,

.teamColorMenu26, .teamColorMenu27, .teamColorMenu28, .teamColorMenu29, .teamColorMenu30,

.teamColorMenu31, .teamColorMenu32, .teamColorMenu33 {

    background: var(--gray-100) !important;

}



/* Responsive design */

@media (max-width: 1200px) {

    .stats-grid {

        grid-template-columns: repeat(2, 1fr);

    }



    .leaders-grid {

        grid-template-columns: repeat(2, 1fr);

    }



    .stat-card.team-leaders {

        grid-column: span 2;

    }



    /* Responsive pour tabmain02 */

    #tabmain02 .stats-grid {

        grid-template-columns: repeat(2, 1fr);

    }



    #tabmain02 .stat-card.team-leaders {

        grid-column: span 2;

    }

}



@media (max-width: 768px) {

    .STHSPHPTeamHeader_TeamName {

        font-size: 1.8rem;

        padding: 0.75rem 1rem;

    }

    

    .STHSPHPTeamHeader_Stat {

        font-size: 0.9rem;

        padding: 0 1rem 1rem 1rem;

    }

    

    .STHSPHPTeamHeader_Logo {

        width: 100px;

        padding: 1rem;

    }

    

    .STHSPHPTeamStatImage,

    .team-logo-placeholder {

        width: 60px !important;

        height: 60px !important;

    }

    

    .team-logo-placeholder span {

        font-size: 1.5rem;

    }

    

    .schedule-container {

        grid-template-columns: 1fr;

    }

    

    .schedule-section {

        border-right: none;

        border-bottom: 1px solid var(--gray-200);

        padding: 1rem 1.5rem;

    }

    

    .schedule-section:last-child {

        border-bottom: none;

    }

    

    .weekly-schedule h3 {

        padding: 1rem 1.5rem;

        font-size: 1.125rem;

    }

    

    .stats-grid {

        grid-template-columns: 1fr;

    }



    .leaders-grid {

        grid-template-columns: 1fr;

        gap: 1rem;

    }



    .stat-card.team-leaders {

        grid-column: span 1;

    }



    /* Responsive 768px pour tabmain02 */

    #tabmain02 .stats-grid {

        grid-template-columns: 1fr;

    }



    #tabmain02 .stat-card.team-leaders {

        grid-column: span 1;

    }

    

    .leader-card {

        height: 240px;

    }

    

    .leader-content {

        padding: 1rem;

    }

    

    .leader-player-name {

        font-size: 1.125rem;

    }

    

    .leader-stat-number {

        font-size: 2rem;

    }

    

    .tabmain-links {

        flex-direction: column;

    }

    

    .tabmain-links a {

        padding: 0.75rem 1rem;

        border-bottom: 1px solid var(--gray-200);

    }

    

    .tabmain,

    .cardbook {

        padding: 1rem;

    }

    

    table {

        font-size: 0.8rem;

    }

    

    th, td {

        padding: 0.5rem 0.25rem;

    }

}



@media (max-width: 480px) {

    .weekly-schedule h3 {

        padding: 0.75rem 1rem;

        font-size: 1rem;

    }

    

    .schedule-section {

        padding: 0.75rem 1rem;

    }

    

    .schedule-day {

        padding: 0.75rem;

    }

    

    .team-info {

        padding: 0.375rem;

    }

    

    .team-logo-mini {

        width: 16px;

        height: 16px;

    }

    

    .team-name {

        font-size: 0.75rem;

    }

    

    .score {

        font-size: 0.75rem;

    }

    

    .leader-card {

        height: 200px;

    }

    

    .leader-content {

        padding: 0.75rem;

    }

    

    .leader-player-name {

        font-size: 1rem;

    }

    

    .leader-stat-number {

        font-size: 1.75rem;

    }

    

    .stat-item {

        flex-direction: column;

        align-items: flex-start;

        gap: 0.25rem;

    }



    /* Responsive stat-item pour tabmain02 */

    #tabmain02 .stat-item {

        flex-direction: column;

        align-items: flex-start;

        gap: 0.25rem;

    }

    

    .STHSPHPPlayerStat_Table,

    .STHSPHPGoalerStat_Table {

        font-size: 0.75rem;

    }

    

    .STHSPHPPlayerStat_Table th,

    .STHSPHPPlayerStat_Table td,

    .STHSPHPGoalerStat_Table th,

    .STHSPHPGoalerStat_Table td {

        padding: 0.5rem 0.25rem;

    }

}



/* Correction pour améliorer la lisibilité du texte du header */



.STHSPHPTeamHeader_TeamName {

    font-size: 2.5rem;

    font-weight: 800;

    color: #000000 !important;

    padding: 1rem 2rem;

    text-shadow: none !important;

    letter-spacing: -0.025em;

    background: none !important;

    -webkit-text-fill-color: #000000 !important;

}



.STHSPHPTeamHeader_Stat {

    font-size: 1rem;

    color: #000000 !important;

    padding: 0 2rem 1.5rem 2rem;

    line-height: 1.8;

    opacity: 1 !important;

    text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.8) !important;

    font-weight: 600;

}



/* Correction pour améliorer la lisibilité du texte du header */



.STHSPHPTeamHeader_Logo {

    width: 140px;

    padding: 1.5rem;

    vertical-align: middle;

    background: var(--primary-color) !important;

    text-align: center;

}



/* Weekly Schedule Compact */

.weekly-schedule-compact {

    background: var(--white);

    border-radius: var(--border-radius-lg);

    box-shadow: var(--shadow-md);

    margin-bottom: 1.5rem;

    overflow: hidden;

}



.weekly-schedule-compact h3 {

    background: var(--primary-color);

    color: white;

    margin: 0;

    padding: 1rem 1.5rem;

    border-bottom: none;

    font-size: 1.1rem;

    text-transform: uppercase;

    letter-spacing: 0.05em;

}



.schedule-container-compact {

    display: block;

    padding: 1rem 1.5rem;

}



.schedule-section-compact {

    padding: 0;

    border: none;

}



.schedule-section-compact:last-child {

    border: none;

}



.schedule-section-compact h4 {

    font-size: 1.125rem;

    font-weight: 600;

    color: var(--gray-900);

    margin-bottom: 0.75rem;

    text-transform: uppercase;

    letter-spacing: 0.05em;

    padding-bottom: 0.5rem;

    border-bottom: 2px solid var(--primary-color);

}



.schedule-days-compact {

    display: flex;

    flex-direction: row;

    gap: 0.5rem;

    flex-wrap: wrap;

    justify-content: center;

    align-items: center;

}



.schedule-day-compact {

    background: var(--white);

    border-radius: var(--border-radius);

    padding: 0.5rem;

    border: 1px solid var(--gray-200);

    transition: all 0.2s ease;

    width: 180px;

    height: 180px;

    display: flex;

    flex-direction: column;

    justify-content: space-between;

}



.schedule-day-compact:hover {

    box-shadow: var(--shadow-sm);

    border-color: var(--gray-300);

    background: var(--gray-50);

}



.game-date-compact {

    font-size: 0.9rem;

    color: var(--gray-500);

    font-weight: 600;

    margin-bottom: 0.4rem;

    text-transform: uppercase;

    letter-spacing: 0.05em;

    text-align: center;

}



.game-matchup-compact {

    display: flex;

    flex-direction: column;

    gap: 0.35rem;

    flex: 1;

}



.game-matchup-compact.win {

    border-left: 2px solid var(--success-color);

}



.game-matchup-compact.loss {

    border-left: 2px solid var(--danger-color);

}



.game-matchup-compact.upcoming {

    border-left: 2px solid var(--primary-color);

}



.team-info-compact {

    display: flex;

    align-items: center;

    gap: 0.6rem;

    padding: 0.4rem;

    border-radius: var(--radius-sm);

    background: var(--white);

    font-size: 1rem;

}



.team-logo-mini-compact {

    width: 24px;

    height: 24px;

    object-fit: contain;

    flex-shrink: 0;

}



.team-name-compact {

    font-size: 0.95rem;

    font-weight: 500;

    color: var(--gray-800);

    flex: 1;

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;

}



.score-compact {

    font-size: 1.1rem;

    font-weight: 700;

    color: var(--primary-color);

    font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;

    flex-shrink: 0;

}



.game-type-compact {

    font-size: 0.75rem;

    font-weight: 600;

    color: var(--accent-color);

    background: rgba(245, 158, 11, 0.1);

    padding: 0.25rem 0.5rem;

    border-radius: var(--radius-sm);

    text-align: center;

    margin-top: 0.4rem;

    text-transform: uppercase;

    letter-spacing: 0.05em;

}



.no-games-compact {

    text-align: center;

    padding: 1rem;

    color: var(--gray-500);

    font-style: italic;

    background: var(--gray-50);

    border-radius: var(--border-radius);

    border: 1px dashed var(--gray-300);

    font-size: 0.8rem;

}



@media (max-width: 768px) {

    .schedule-container-compact {

        padding: 0.75rem 1rem;

    }

    

    .schedule-section-compact {

        padding: 0;

        border: none;

    }

    

    .weekly-schedule-compact h3 {

        padding: 0.75rem 1rem;

        font-size: 1rem;

    }

    

    .schedule-day-compact {

        padding: 0.5rem;

        width: 180px;

        height: 180px;

    }

    

    .team-info-compact {

        padding: 0.15rem;

    }

    

    .team-logo-mini-compact {

        width: 12px;

        height: 12px;

    }

    

    .team-name-compact {

        font-size: 0.6rem;

    }

    

    .score-compact {

        font-size: 0.65rem;

    }

    

    .game-date-compact {

        font-size: 0.6rem;

    }

}



/* Weekly Schedule dans la grille */

.stat-card.weekly-schedule-in-grid {

    grid-column: span 4;

    padding: 1.5rem;

    background: var(--white);

    border: 1px solid var(--gray-100);

    box-shadow: var(--shadow-sm);

}



.weekly-schedule-in-grid h3 {

    margin: 0 0 1rem 0;

    font-size: 1.125rem;

    font-weight: 600;

    color: var(--gray-800);

    text-transform: uppercase;

    letter-spacing: 0.05em;

    padding-bottom: 0.5rem;

    border-bottom: 2px solid var(--primary-color);

}



/* Weekly Schedule Cards */

.weekly-schedule-card {

    background: white;

    border-radius: 8px;

    padding: 12px;

    text-align: center;

    box-shadow: 0 2px 4px rgba(0,0,0,0.1);

    transition: background-color 0.3s ease;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    min-height: 120px;

}



.weekly-schedule-card:hover {

    background-color: #f5f5f5;

}



/* Nouvelle section avec la même largeur que Weekly Schedule */

.new-section {

    grid-column: span 4;

    background: white;

    border-radius: 8px;

    padding: 20px;

    box-shadow: 0 2px 4px rgba(0,0,0,0.1);

    margin-top: 20px;

}



.new-section h3 {

    margin: 0 0 15px 0;

    color: #333;

    font-size: 18px;

    font-weight: 600;

}



.new-section-content {

    color: #666;

    line-height: 1.5;

}



/* Team Graph Styles */

.team-graph-container {

    padding: 10px 0;

}



.graph-row {

    display: flex;

    align-items: center;

    margin-bottom: 12px;

    gap: 10px;

}



.graph-label {

    width: 120px;

    font-size: 12px;

    font-weight: 500;

    color: #333;

    text-align: right;

}



.graph-bar-container {

    flex: 1;

    height: 24px;

    background: #f5f5f5;

    border-radius: 12px;

    position: relative;

    overflow: hidden;

}



.graph-bar.team-bar {

    height: 100%;

    background: linear-gradient(90deg, #4CAF50, #45a049);

    border-radius: 12px;

    position: relative;

    transition: width 0.3s ease;

    display: flex;

    align-items: center;

    justify-content: flex-end;

    padding-right: 8px;

    min-width: 30px;

}



.graph-bar.team-bar .bar-value {

    color: white;

    font-size: 11px;

    font-weight: 600;

    text-shadow: 0 1px 2px rgba(0,0,0,0.3);

}



.graph-bar.league-avg {

    position: absolute;

    top: 0;

    width: 3px;

    height: 100%;

    background: #ff6b6b;

    border-radius: 1px;

    z-index: 2;

    box-shadow: 0 0 2px rgba(255, 107, 107, 0.5);

}



.best-team-label {

    position: absolute;

    right: -5px;

    top: 50%;

    transform: translateY(-50%);

    background: #333;

    color: white;

    padding: 2px 8px;

    border-radius: 4px;

    font-size: 9px;

    font-weight: 600;

    white-space: nowrap;

    z-index: 3;

    box-shadow: 0 1px 3px rgba(0,0,0,0.3);

    max-width: 120px;

    overflow: hidden;

    text-overflow: ellipsis;

}



.graph-legend {

    display: flex;

    justify-content: center;

    gap: 20px;

    margin-top: 15px;

    padding-top: 15px;

    border-top: 1px solid #eee;

}



.legend-item {

    display: flex;

    align-items: center;

    gap: 6px;

    font-size: 12px;

    color: #666;

}



.legend-color {

    width: 12px;

    height: 12px;

    border-radius: 2px;

}



.legend-color.team-color {

    background: linear-gradient(90deg, #4CAF50, #45a049);

}



.legend-color.league-color {

    background: #ff6b6b;

}



/* Roster Table Styles */

.roster-container {

    overflow-x: auto;

    margin: 20px 0;

}



.roster-table {

    width: 100% !important;

    min-width: auto !important;

    border-collapse: collapse !important;

    background: white !important;

    border-radius: 8px !important;

    overflow: hidden !important;

    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;

    font-size: 10px !important;

}



.roster-table th {

    background: #f8f9fa !important;

    padding: 6px 2px !important;

    font-size: 10px !important;

    font-weight: 600 !important;

    text-align: center !important;

    border-bottom: 2px solid #dee2e6 !important;

    color: #495057 !important;

    white-space: nowrap !important;

}



.roster-table td {

    padding: 4px 2px !important;

    font-size: 10px !important;

    text-align: center !important;

    border-bottom: 1px solid #f1f3f4 !important;

}


/* Make roster header in tabmain1 match tabmain4 blue */
#tabmain1 .roster-table thead th {
    background: var(--primary-color) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    padding: 6px 4px !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
}

#tabmain1 .roster-table thead tr {
    background: var(--primary-color) !important;
    border-bottom: 2px solid var(--primary-color) !important;
}

/* Ensure tabmain1 body cells match tabmain2 text sizing/color */
#tabmain1 .roster-table td {
    color: var(--gray-800) !important;
    font-size: 10px !important;
    font-family: inherit !important;
}

/* Make stats header in tabmain2 match tabmain4 blue */
#tabmain2 .stats-table thead th {
    background: var(--primary-color) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    padding: 6px 4px !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
}

#tabmain2 .stats-table thead tr {
    background: var(--primary-color) !important;
    border-bottom: 2px solid var(--primary-color) !important;
}

/* Make prospects header in tabmain7 match tabmain4 blue */
#tabmain7 .STHSPHPTeam_ProspectsTable thead th {
    background: var(--primary-color) !important;
    color: #ffffff !important;
    border: 1px solid var(--primary-color) !important;
}

#tabmain7 .STHSPHPTeam_ProspectsTable thead tr {
    background: var(--primary-color) !important;
    border-bottom: 2px solid var(--primary-color) !important;
}

/* Make tabmain7 font style match tabmain2 */
#tabmain7 .STHSPHPTeam_ProspectsTable {
    font-size: 14px !important;
    color: var(--gray-800) !important;
    font-family: inherit !important;
}
#tabmain7 .STHSPHPTeam_ProspectsTable td {
    color: var(--gray-800) !important;
    font-size: 14px !important;
}
#tabmain7 .STHSPHPTeam_ProspectsTable th {
    font-size: 11px !important;
    padding: 6px 4px !important;
    line-height: 1.2 !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
}
#tabmain7 .STHSPHPTeam_ProspectsTable a {
    color: var(--gray-800) !important;
    text-decoration: none !important;
}
#tabmain7 .STHSPHPTeam_ProspectsTable a:hover {
    color: var(--gray-800) !important;
    text-decoration: underline !important;
}

/* Make Prospects name column match player name styling */
#tabmain7 .STHSPHPTeam_ProspectsTable tbody td:first-child,
#tabmain7 .STHSPHPTeam_ProspectsTable tbody td:first-child a {
    font-weight: 500 !important;
    color: var(--gray-800) !important;
    text-align: left !important;
    font-size: 14px;
}

/* Ensure tabmain3 schedule cells match tabmain2 text sizing/color */
#tabmain3 .schedule-table td {
    color: var(--gray-800);
    font-size: 10px;
}



.roster-table tr:hover {

    background-color: #f8f9fa !important;

}



.roster-table .player-name {

    text-align: left !important;

    font-weight: 500 !important;

    min-width: 100px !important;

    max-width: 120px !important;

    overflow: hidden !important;

    text-overflow: ellipsis !important;

    white-space: nowrap !important;

}



.roster-table .player-name a {

    color: #007bff !important;

    text-decoration: none !important;

}



.roster-table .player-name a:hover {

    text-decoration: underline !important;

}

/* Make tabmain1 player name link color match tabmain2 (neutral text) */
#tabmain1 .roster-table .player-name a {
    color: var(--gray-800) !important;
}
#tabmain1 .roster-table .player-name a:hover {
    color: var(--gray-800) !important;
}



.roster-table .position-cell {

    font-weight: 600 !important;

    color: #28a745 !important;

    min-width: 25px !important;

}



.roster-table .condition-cell {

    font-weight: 600 !important;

    min-width: 35px !important;

}



.roster-table .condition-cell.suspended {

    color: #dc3545 !important;

}



.roster-table .condition-cell.holdout {

    color: #ffc107 !important;

}



.roster-table .overall-cell {

    font-weight: 700 !important;

    color: #007bff !important;

    background: #e3f2fd !important;

    min-width: 25px !important;

}



.roster-table .salary-cell {

    text-align: right !important;

    font-family: monospace !important;

    min-width: 35px !important;

    font-size: 9px !important;

}



.roster-table .rookie {

    color: #6f42c1 !important;

    font-weight: 600 !important;

}



.roster-table .captain {

    color: #dc3545 !important;

    font-weight: 700 !important;

}



.roster-table .assistant {

    color: #fd7e14 !important;

    font-weight: 600 !important;

}



/* Optimisations pour éviter le scroll */

.roster-table th:nth-child(1), /* # */

.roster-table td:nth-child(1) {

    width: 25px !important;

    min-width: 25px !important;

}



.roster-table th:nth-child(2), /* Player */

.roster-table td:nth-child(2) {

    width: 40px !important;

    min-width: 40px !important;

}



.roster-table th:nth-child(3), /* POS */

.roster-table td:nth-child(3) {

    width: 25px !important;

    min-width: 25px !important;

}



/* Toutes les colonnes de ratings */

.roster-table th:nth-child(n+4):nth-child(-n+20),

.roster-table td:nth-child(n+4):nth-child(-n+20) {

    width: 25px !important;

    min-width: 25px !important;

}



/* Colonnes finales */

.roster-table th:nth-child(21), /* Age */

.roster-table td:nth-child(21) {

    width: 30px !important;

    min-width: 30px !important;

}



.roster-table th:nth-child(22), /* Contract */

.roster-table td:nth-child(22) {

    width: 20px !important;

    min-width: 20px !important;

}



.roster-table th:nth-child(23), /* Salary */

.roster-table td:nth-child(23) {

    width: 35px !important;

    min-width: 35px !important;

}



/* Responsive adjustments */

@media (max-width: 1400px) {

    .roster-table {

        font-size: 9px;

    }

    

    .roster-table th,

    .roster-table td {

        padding: 3px 1px;

        font-size: 9px;

    }

    

    .roster-table .player-name {

        min-width: 80px;

        max-width: 100px;

    }

}



@media (max-width: 1200px) {

    .roster-table {

        font-size: 8px;

    }

    

    .roster-table th,

    .roster-table td {

        padding: 2px 1px;

        font-size: 8px;

    }

    

    .roster-table .player-name {

        min-width: 70px;

        max-width: 90px;

    }

}



/* Styles spécifiques pour l'onglet Lines */

#tabmain4 {

    padding: 1rem !important;

    max-width: 100%;

    overflow-x: auto;

}



#tabmain4 .lines-section {

    margin-bottom: 2rem;

}



#tabmain4 .lines-section h4 {

    color: var(--primary-color);

    font-size: 1.2rem;

    font-weight: 600;

    margin-bottom: 1rem;

    padding-bottom: 0.5rem;

    border-bottom: 2px solid var(--gray-200);

}



#tabmain4 .lines-table-container {

    overflow-x: auto;

    margin-bottom: 1rem;

}



#tabmain4 .lines-table {

    width: 100%;

    min-width: 800px;

    border-collapse: collapse;

    background: white;

    box-shadow: 0 2px 4px rgba(0,0,0,0.1);

    border-radius: 8px;

    overflow: hidden;

}



#tabmain4 .lines-table th {

    background: var(--primary-color);

    color: white;

    padding: 6px 4px;

    text-align: center;

    font-weight: 600;

    font-size: 11px;

    line-height: 1.2;

    border: 1px solid rgba(255, 255, 255, 0.3);

}



#tabmain4 .lines-table td {

    padding: 10px 8px;

    text-align: center;

    border: 1px solid var(--gray-200);

    font-size: 14px !important;

    color: var(--gray-800) !important;

    font-family: inherit !important;

}

/* Make tabmain4 player links use neutral text color like tabmain2 */
#tabmain4 .lines-table a,
#tabmain4 .line-players a,
#tabmain4 .player-line-item a {
    color: var(--gray-800) !important;
    text-decoration: none !important;
    font-weight: 500 !important;
}
#tabmain4 .lines-table a:hover,
#tabmain4 .line-players a:hover,
#tabmain4 .player-line-item a:hover {
    color: var(--gray-800) !important;
    text-decoration: underline !important;
    font-weight: 500 !important;
}



#tabmain4 .lines-table tr:nth-child(even) {

    background: var(--gray-50);

}



#tabmain4 .lines-table tr:hover {

    background: var(--gray-100);

}



#tabmain4 .lines-table th:first-child,

#tabmain4 .lines-table td:first-child {

    background: var(--secondary-color);

    color: white;

    font-weight: 600;

}



#tabmain4 .no-lines-message {

    text-align: center;

    padding: 2rem;

    color: var(--gray-500);

    font-style: italic;

}



/* Responsive pour l'onglet Lines */

@media (max-width: 1200px) {

    #tabmain4 .lines-grid {

        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));

        gap: 0.75rem;

        padding: 1rem;

    }

}



@media (max-width: 768px) {

    #tabmain4 {

        padding: 0.5rem !important;

    }

    

    #tabmain4 .lines-grid {

        grid-template-columns: 1fr;

        gap: 0.5rem;

        padding: 0.75rem;

    }

    

    #tabmain4 .line-header {

        padding: 0.5rem 0.75rem;

    }

    

    #tabmain4 .line-players {

        padding: 0.75rem;

    }

    

    #tabmain4 .special-line .line-players {

        grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));

    }

}



@media (max-width: 480px) {

    #tabmain4 .player-line-item {

        flex-direction: column;

        align-items: flex-start;

        gap: 0.25rem;

    }

    

    #tabmain4 .line-position {

        flex-direction: column;

        align-items: flex-start;

        gap: 0.25rem;

    }

}



/* Styles spécifiques pour l'onglet Depth Chart */

#tabmain5 {

    padding: 1rem !important;

    max-width: 100%;

    overflow-x: auto;

}



#tabmain5 .depth-section {

    margin-bottom: 2rem;

}



#tabmain5 .depth-section h4 {

    color: var(--primary-color);

    font-size: 1.2rem;

    font-weight: 600;

    margin-bottom: 1rem;

    padding-bottom: 0.5rem;

    border-bottom: 2px solid var(--gray-200);

}



#tabmain5 .depth-chart-container {

    overflow-x: auto;

    margin-bottom: 1rem;

}



#tabmain5 .depth-chart-table {

    width: 100%;

    min-width: 900px;

    border-collapse: collapse;

    background: white;

    box-shadow: 0 2px 4px rgba(0,0,0,0.1);

    border-radius: 8px;

    overflow: hidden;

}



#tabmain5 .depth-chart-table th {

    background: var(--primary-color);

    color: white;

    padding: 6px 4px;

    text-align: center;

    font-weight: 600;

    font-size: 11px;

    line-height: 1.2;

    border: 1px solid rgba(255, 255, 255, 0.3);

}



#tabmain5 .depth-column {

    vertical-align: top;

    padding: 0;

    border: 1px solid var(--gray-200);

}



#tabmain5 .depth-player-list {

    width: 100%;

    border-collapse: collapse;

}



#tabmain5 .depth-player-list tr {

    border-bottom: 1px solid var(--gray-100);

}



#tabmain5 .depth-player-list tr:last-child {

    border-bottom: none;

}



#tabmain5 .depth-player-list tr:hover {

    background: var(--gray-50);

}



#tabmain5 .depth-player-list td {

    padding: 8px 12px;

    border: none;

}



#tabmain5 .player-name {

    font-weight: 500;

    color: black;

}



#tabmain5 .player-name a {

    color: black;

    text-decoration: none;

    font-weight: 600;

}



#tabmain5 .player-name a:hover {

    color: black;

    text-decoration: underline;

}



#tabmain5 .player-stats {

    display: flex;

    gap: 8px;

    flex-wrap: wrap;

}



#tabmain5 .stat-item {

    background: var(--gray-100);

    color: black;

    padding: 2px 6px;

    border-radius: 4px;

    font-size: 0.75rem;

    font-weight: 500;

}



#tabmain5 .depth-player-stats .stat-item {

    font-size: 10px;

    color: black;

    margin-right: 8px;

}



/* Styles spécifiques pour l'onglet Capology */

#tabmain6 {

    padding: 1rem !important;

    max-width: 100%;

    overflow-x: auto;

}



#tabmain6 .cap-summary {

    margin-bottom: 20px;

    padding: 15px;

    background: #f8f9fa;

    border-radius: 8px;

    border: 1px solid #e9ecef;

}



#tabmain6 .cap-summary h4 {

    color: var(--primary-color);

    font-size: 1.2rem;

    font-weight: 600;

    margin-bottom: 1rem;

}



#tabmain6 .cap-table-container {

    overflow-x: auto;

    margin-bottom: 1rem;

    border-radius: 8px;

    box-shadow: 0 2px 4px rgba(0,0,0,0.1);

}



#tabmain6 .cap-table {

    width: 100%;

    min-width: 1200px;

    border-collapse: collapse;

    background: white;

    border-radius: 8px;

    overflow: hidden;

}



#tabmain6 .cap-table th {

    background: var(--primary-color);

    color: white;

    padding: 8px 6px;

    border: 1px solid #ddd;

    text-align: center;

    font-weight: 600;

    font-size: 11px;

}



#tabmain6 .cap-table td {

    padding: 6px 4px;

    border: 1px solid #ddd;

    font-size: 11px;

    color: black;

}



#tabmain6 .cap-table tr:nth-child(even) {

    background-color: #f9f9f9;

}



#tabmain6 .cap-table tr:hover {

    background-color: #f0f8ff;

}



#tabmain6 .cap-table a {

    color: black;

    text-decoration: none;

    font-weight: 500;

}



#tabmain6 .cap-table a:hover {

    color: black;

    text-decoration: underline;

}



#tabmain6 .cap-legend {

    margin-top: 20px;

    padding: 15px;

    background: #f8f9fa;

    border-radius: 8px;

    border: 1px solid #e9ecef;

}



#tabmain6 .cap-legend h4 {

    color: var(--primary-color);

    font-size: 1.1rem;

    font-weight: 600;

    margin-bottom: 1rem;

}



#tabmain6 .cap-legend div {

    display: grid;

    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));

    gap: 10px;

    font-size: 12px;

}



/* Couleurs pour les statuts de free agents */

#tabmain6 .cap-table .rfa-status {

    background-color: #fff3e0;

    color: #ef6c00;

    font-weight: 500;

}



#tabmain6 .cap-table .ufa-status {

    background-color: #ffebee;

    color: #c62828;

    font-weight: 500;

}



/* Couleurs pour les pourcentages du salary cap */

#tabmain6 .cap-table .cap-over {

    background-color: #f44336;

    color: #fff;

    font-weight: bold;

}



#tabmain6 .cap-table .cap-warning {

    background-color: #FFA500;

    color: #000;

    font-weight: bold;

}



#tabmain6 .cap-table .cap-caution {

    background-color: #FFFF00;

    color: #000;

    font-weight: bold;

}



#tabmain6 .cap-table .cap-good {

    background-color: #00ff00;

    color: #000;

    font-weight: bold;

}



/* Styles pour ajuster la taille du GamesScroller dans ProTeam2.php */

.gamesScroller {

    max-width: 100%;

    overflow: hidden;

}



.gamesScroller .GameDayTable {

    min-width: 120px !important;

    width: 120px !important;

    max-width: 120px !important;

}



.gamesScroller .scroll-container {

    max-width: 100%;

    overflow: hidden !important;

    scrollbar-width: none !important; /* Firefox */

    -ms-overflow-style: none !important; /* Internet Explorer 10+ */

}



.gamesScroller .scroll-container::-webkit-scrollbar {

    display: none !important; /* Chrome, Safari, Opera */

}



.gamesScroller .scroll-container table {

    width: auto;

    min-width: 100%;

}



/* Ajustement pour les boutons de défilement */

.gamesScroller .scrollButtons {

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    z-index: 2;

}



.gamesScroller .scrollDivTop,

.gamesScroller .scrollDivBot {

    height: 35px;

    width: 35px;

}



/* Ajustement pour le contenu des matchs */

.gamesScroller .GameDayTable table {

    font-size: 10px;

}



.gamesScroller .GameDayTable img {

    width: 20px !important;

    height: auto;

}



.gamesScroller .GameDayTable td {

    padding: 2px 4px;

}