/* Details Pages Shared Styles - Tennis Theme */

/* ===== TENNIS COLOR SCHEME ===== */
:root {
    --tennis-green-dark: #1B5E20;
    --tennis-green: #2E7D32;
    --tennis-green-light: #43A047;
    --tennis-orange: #FF6F00;
    --tennis-orange-light: #FFA000;
    --tennis-white: #FFFFFF;
    --tennis-cream: #FFF8E1;
}

/* Gradient Header Backgrounds */
.bg-gradient-primary {
    background: linear-gradient(135deg, var(--tennis-green) 0%, var(--tennis-green-dark) 100%) !important;
    color: white !important;
}

.bg-gradient-success {
    background: linear-gradient(135deg, #56ab2f 0%, #a8e063 100%) !important;
}

.bg-gradient-info {
    background: linear-gradient(135deg, #2193b0 0%, #6dd5ed 100%) !important;
}

.bg-gradient-warning {
    background: linear-gradient(135deg, var(--tennis-orange) 0%, var(--tennis-orange-light) 100%) !important;
}

.bg-gradient-danger {
    background: linear-gradient(135deg, #eb3349 0%, #f45c43 100%) !important;
}

/* Ensure text color on gradient backgrounds */
.bg-gradient-primary,
.bg-gradient-success,
.bg-gradient-info,
.bg-gradient-warning,
.bg-gradient-danger {
    background-attachment: fixed !important;
}

/* Header Icon Circle */
.header-icon-circle {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Hover effect for cards */
.hover-shadow {
    transition: box-shadow 0.3s ease-in-out;
}

.hover-shadow:hover {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

/* User/Team/Schedule Details specific styles */
.user-details,
.team-details,
.schedule-details {
    background-color: #f8f9fa;
}

/* Loading spinner container */
.loading-container {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3rem 0;
}

/* Error and Info alerts in card bodies */
.card-body .alert {
    border-radius: 0.375rem;
}

.card-body .alert i {
    vertical-align: middle;
}

/* Statistics Cards on Detail Pages */
.stats-card-value {
    font-size: 2rem;
    font-weight: bold;
    color: var(--tennis-green-dark);
}

.stats-card-label {
    font-size: 0.875rem;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.stats-card-icon {
    font-size: 2.5rem;
    opacity: 0.8;
}

/* Detail Info Rows */
.detail-info-row {
    padding: 0.75rem 0;
    border-bottom: 1px solid #e9ecef;
}

.detail-info-row:last-child {
    border-bottom: none;
}

.detail-info-label {
    font-weight: 600;
    color: #495057;
}

.detail-info-value {
    color: #212529;
}

/* ELO History Chart Styles */
#eloChart {
    height: 350px;
}

.card canvas {
    animation: fadeIn 0.5s ease-in-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Chart container */
.chart-container {
    position: relative;
    margin-top: 1rem;
}

/* ELO improvement badge */
.elo-improvement {
    font-size: 0.875rem;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    margin-left: 0.5rem;
}

.elo-improvement.positive {
    background-color: #c6efce;
    color: #006100;
}

.elo-improvement.negative {
    background-color: #ffc7ce;
    color: #9c0006;
}

/* Responsive adjustments */
@media (max-width: 767.98px) {
    .header-icon-circle {
        width: 60px;
        height: 60px;
        padding: 0.75rem !important;
    }
    
    .header-icon-circle i {
        font-size: 1.5rem !important;
    }
    
    .stats-card-value {
        font-size: 1.5rem;
    }
    
    .stats-card-icon {
        font-size: 2rem;
    }
}