/* ========================================
   BREADCRUMBS — LIGHT
======================================== */
.gk-breadcrumbs {
    padding: 16px 0;
    margin-top: 72px;
    font-size: 0.82rem;
    color: var(--gk-text-muted);
}
.gk-breadcrumbs a { color: var(--gk-text-muted); }
.gk-breadcrumbs a:hover { color: var(--gk-accent); }
.gk-breadcrumbs__sep { margin: 0 8px; opacity: 0.4; }

/* ========================================
   LOADING SKELETON — LIGHT
======================================== */
.gk-skeleton {
    background: linear-gradient(90deg, #F0F0F0 25%, #E0E0E0 50%, #F0F0F0 75%);
    background-size: 200% 100%;
    animation: gk-shimmer 1.5s infinite;
    border-radius: var(--gk-radius-sm);
}
@keyframes gk-shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ========================================
   SCROLLBAR — LIGHT
======================================== */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #F5F5F5; }
::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.15); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: rgba(0, 0, 0, 0.25); }

/* ========================================
   ANIMATIONS
======================================== */
@keyframes gk-fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}
.gk-animate-in { animation: gk-fadeIn 0.5s ease forwards; }
.gk-card { animation: gk-fadeIn 0.4s ease backwards; }
.gk-movies-grid .gk-card:nth-child(1) { animation-delay: 0s; }
.gk-movies-grid .gk-card:nth-child(2) { animation-delay: 0.05s; }
.gk-movies-grid .gk-card:nth-child(3) { animation-delay: 0.1s; }
.gk-movies-grid .gk-card:nth-child(4) { animation-delay: 0.15s; }
.gk-movies-grid .gk-card:nth-child(5) { animation-delay: 0.2s; }
.gk-movies-grid .gk-card:nth-child(6) { animation-delay: 0.25s; }
.gk-movies-grid .gk-card:nth-child(7) { animation-delay: 0.3s; }
.gk-movies-grid .gk-card:nth-child(8) { animation-delay: 0.35s; }
.gk-movies-grid .gk-card:nth-child(9) { animation-delay: 0.4s; }
.gk-movies-grid .gk-card:nth-child(10) { animation-delay: 0.45s; }
.gk-movies-grid .gk-card:nth-child(11) { animation-delay: 0.5s; }
.gk-movies-grid .gk-card:nth-child(12) { animation-delay: 0.55s; }

/* ========================================
   FILTER BAR — LIGHT
======================================== */
.gk-filter-bar {
    display: flex; gap: 8px; padding: 12px 0;
    overflow-x: auto; scrollbar-width: none;
}
.gk-filter-bar::-webkit-scrollbar { display: none; }
.gk-filter-btn {
    padding: 8px 18px; border-radius: 50px;
    background: var(--gk-bg-card); border: 1px solid var(--gk-border);
    color: var(--gk-text-muted); font-size: 0.82rem; font-weight: 600;
    font-family: var(--gk-font-body); cursor: pointer;
    transition: all var(--gk-transition-fast); white-space: nowrap;
}
.gk-filter-btn:hover, .gk-filter-btn.active {
    background: var(--gk-accent); border-color: var(--gk-accent); color: #fff;
}

/* ========================================
   TOOLTIP
======================================== */
[data-tooltip] { position: relative; }
[data-tooltip]::after {
    content: attr(data-tooltip); position: absolute; bottom: 100%; left: 50%;
    transform: translateX(-50%) translateY(-8px);
    background: var(--gk-text); color: #fff;
    padding: 6px 12px; border-radius: 6px; font-size: 0.75rem;
    white-space: nowrap; pointer-events: none; opacity: 0;
    transition: opacity 0.2s, transform 0.2s;
}
[data-tooltip]:hover::after {
    opacity: 1; transform: translateX(-50%) translateY(-4px);
}

/* ========================================
   BACK TO TOP — LIGHT
======================================== */
.gk-back-to-top {
    position: fixed; bottom: 30px; right: 30px;
    width: 44px; height: 44px; border-radius: 12px;
    background: var(--gk-accent); color: #fff; border: none; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 4px 16px rgba(229, 9, 20, 0.25);
    opacity: 0; visibility: hidden;
    transition: all var(--gk-transition); z-index: 100;
}
.gk-back-to-top.visible { opacity: 1; visibility: visible; }
.gk-back-to-top:hover {
    transform: translateY(-4px);
    box-shadow: 0 6px 24px rgba(229, 9, 20, 0.35);
}

/* ========================================
   SELECTION & PRINT
======================================== */
::selection { background: var(--gk-accent); color: #fff; }

@media print {
    .gk-header, .gk-sidebar, .gk-footer, .gk-back-to-top { display: none !important; }
    body { background: #fff; color: #000; }
}