/* ============================================
   components/TopIcons.css
   ============================================ */
.TopIcons { grid-area: TopIcons; display: flex; justify-content: space-between; align-items: center; background: var(--bg-white); padding: 0.5rem 1rem; box-shadow: 0 2px 10px rgba(0,0,0,0.08); position: sticky; top: 0; z-index: 100; }
.TopIcons .menu-icon { cursor: pointer; border: none; background: none; }
.TopIcons .menu-icon img { width: 34px; height: 34px; }

/* انیمیشن دیاکو سایت */
.TopIcons .brand-title {
    position: relative; display: inline-block; font-size: 1.6rem; font-weight: 700; letter-spacing: 1px; margin: 0 0.75rem; white-space: nowrap;
    background: linear-gradient(100deg, #1a2a3a 0%, #d4a847 20%, #f5d98a 40%, #4A90E2 60%, #d4a847 80%, #1a2a3a 100%);
    background-size: 300% auto; -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    animation: brandAurora 6s ease-in-out infinite, brandBreathe 3s ease-in-out infinite;
}
.TopIcons .brand-title::before {
    content: ''; position: absolute; inset: -4px -4px; border-radius: 12px; background: conic-gradient(from 0deg, transparent 0deg, rgba(212,168,71,0.5) 60deg, rgba(74,144,226,0.4) 120deg, transparent 180deg, rgba(212,168,71,0.5) 240deg, rgba(74,144,226,0.4) 300deg, transparent 360deg);
    filter: blur(8px); opacity: 0.5; z-index: -1; animation: brandHalo 5s linear infinite;
}
@keyframes brandAurora { 0% { background-position: 0% center; } 100% { background-position: 200% center; } }
@keyframes brandBreathe { 0%, 100% { filter: drop-shadow(0 0 3px rgba(212,168,71,0.4)); } 50% { filter: drop-shadow(0 0 10px rgba(212,168,71,0.7)); } }
@keyframes brandHalo { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

.TopIcons .left-icons { display: flex; gap: 1rem; }
.TopIcons .settings-btn { cursor: pointer; border: none; background: transparent; }
.TopIcons .settings-btn img { width: 28px; height: 28px; transition: transform 0.3s; }
.TopIcons .settings-btn:hover img { transform: rotate(90deg); }