/* Import czcionki Inter z Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@500;600&display=swap');

.bcenter-wrapper { 
    width: 100%; max-width: 1400px; margin: 0 auto; padding: 0; box-sizing: border-box; 
    font-family: 'Inter', sans-serif; 
}
.bcenter-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; width: 100%; }

@media (max-width: 1200px) { .bcenter-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 768px) { .bcenter-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 480px) { .bcenter-grid { grid-template-columns: repeat(2, 1fr); } }

.bcenter-card {
    position: relative; display: flex; flex-direction: column; justify-content: flex-end;
    height: 110px; padding: 15px; background: #111111; border: 1px solid #2a2a2a;
    border-radius: 6px; text-decoration: none !important; overflow: hidden;
    transition: all 0.3s ease;
}
.bcenter-card:hover { border-color: #ffffff; transform: translateY(-3px); box-shadow: 0 5px 15px rgba(0,0,0,0.3); }

.bcenter-card::before {
    content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background-image: var(--bg-img); background-size: cover; background-position: center;
    opacity: 0.2; transition: opacity 0.3s ease;
}
.bcenter-card:hover::before { opacity: 0.5; }

.bcenter-flag {
    position: absolute; top: 10px; right: 10px;
    width: 26px; height: 26px; border-radius: 50%;
    background-image: var(--flag-img); background-size: cover; background-position: center;
    border: 2px solid #1a1a1a; z-index: 3;
}

.bcenter-content { position: relative; z-index: 2; pointer-events: none; }
.bcenter-name { color: #ffffff; font-size: 0.90rem; font-weight: 600; margin: 0; line-height: 1.2; }
.bcenter-slug { color: #777; font-size: 0.65rem; margin-top: 4px; font-family: monospace; letter-spacing: 0.5px; }