/* ═══════════════════════════════════════════════════
   FLOOR TILE STYLES  — floor.css
   Depends on tiles.css and sidebar.css variables
═══════════════════════════════════════════════════ */

/* Floor panel accent colour override — lighter cyan-teal */
#floorPanel .tile-info {
    border-color: rgba(56, 182, 255, .28);
    background: linear-gradient(135deg, rgba(56, 182, 255, .1) 0%, rgba(10, 22, 38, .88) 100%);
}

#floorPanel .tile-info h3 {
    color: #5ecfff;
}

#floorPanel .filter-bar {
    border-color: rgba(56, 182, 255, .18);
    background: rgba(56, 182, 255, .07);
}

#floorPanel .filter-btn.active {
    background: linear-gradient(135deg, #1e90ff, #5ecfff);
    box-shadow: 0 3px 12px rgba(56, 182, 255, .4);
}

#floorPanel .section-title {
    color: rgba(160, 220, 255, .48);
}

#floorPanel .tile-card.active {
    border-color: #5ecfff;
    box-shadow: 0 0 0 2px rgba(94, 207, 255, .3), 0 8px 28px rgba(56, 182, 255, .22);
}

#floorPanel .tile-card.active::after {
    background: #5ecfff;
    color: var(--bg);
}

/* Floor tiles get a subtle perspective feel on hover */
#floorPanel .tile-card:hover .tile-image {
    filter: brightness(1.06) saturate(1.12) contrast(1.04);
}

/* Floor section badge label */
#floorPanel .section-title::before {
    content: '🪵';
    font-size: .8rem;
}

/* Floor pattern tile selector */
#floorPatternTileSelector {
    background: rgba(56, 182, 255, .05);
    border-color: rgba(56, 182, 255, .18);
}

#floorPatternTileSelector .section-title {
    color: #5ecfff;
}

#floorPatternTileSelector .tile-card.active {
    border-color: #5ecfff;
}