/**
 * Player Records Premium Template CSS
 * 
 * Player-specific styling for records lists.
 * Uses shared components from box-base.css (.btfc-box, .btfc-box-header-underline, .btfc-records-grid)
 * 
 * RESPONSIVE BREAKPOINTS: Uses standardized values from breakpoints.css
 * - Mobile and smaller: max-width: 768px
 * - Small mobile only: max-width: 480px (changed from 576px)
 * 
 * @package BTFC_Stats
 */

/* ============================================================================
   SECTION 1: PLAYER-SPECIFIC RECORD ITEM ALIGNMENT
   ============================================================================ */

.btfc-player-records-premium .btfc-record-item {
    align-items: center; /* Center align for simpler player records */
}

/* ============================================================================
   SECTION 2: PLAYER CONTENT STRUCTURE
   ============================================================================ */

.btfc-record-player {
    flex: 1;
}

.btfc-record-player-name {
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    margin-bottom: var(--space-1);
}

.btfc-record-player-details {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

/* ============================================================================
   SECTION 3: PLAYER-SPECIFIC VALUE STYLING
   ============================================================================ */

.btfc-player-records-premium .btfc-record-value {
    min-width: 100px; /* Wider for player records */
}

/* ============================================================================
   SECTION 4: RESPONSIVE ADJUSTMENTS
   ============================================================================ */

@media (max-width: 768px) {
    .btfc-player-records-premium {
        padding: var(--space-4);
    }
}

@media (max-width: 480px) {
    .btfc-player-records-premium .btfc-record-value {
        min-width: 80px;
    }
}