/* Cinema theme — header / nav */
.cn-header { position: sticky; top: 0; z-index: 80; height: var(--header-h); background: linear-gradient(to bottom, rgba(10,14,26,0.95), rgba(10,14,26,0.72)); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-bottom: 1px solid var(--cinema-border); }
.cn-header-inner { max-width: var(--content-max); margin: 0 auto; height: 100%; padding: 0 var(--section-px); display: grid; grid-template-columns: auto 1fr auto; gap: 16px; align-items: center; }
.cn-logo { display: flex; align-items: center; gap: 8px; height: 100%; }
.cn-logo img { max-height: 36px; width: auto; }
.cn-logo-text { font-weight: 700; letter-spacing: 0.04em; font-size: 15px; }

.cn-nav-pills { display: flex; align-items: center; justify-content: center; }
.cn-nav-pills ul { display: flex; gap: 4px; padding: 4px; margin: 0; list-style: none; background: rgba(255,255,255,0.04); border-radius: 999px; border: 1px solid var(--cinema-border); }
.cn-nav-pills li a { display: inline-flex; align-items: center; gap: 6px; padding: 7px 18px; border-radius: 999px; font-size: 13px; font-weight: 500; color: var(--cinema-text-muted); transition: all 180ms ease; }
.cn-nav-pills li a:hover { color: var(--cinema-text); background: rgba(255,255,255,0.04); }
.cn-nav-pills li.active a { background: var(--cinema-bg-elevated); color: var(--cinema-text); box-shadow: inset 0 0 0 1px var(--cinema-border); }

.cn-actions { display: flex; align-items: center; gap: 10px; justify-content: flex-end; }
.cn-action-btn { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--cinema-border); background: rgba(255,255,255,0.04); color: var(--cinema-text); display: inline-flex; align-items: center; justify-content: center; transition: all 180ms ease; position: relative; }
.cn-action-btn:hover { background: rgba(255,255,255,0.1); color: var(--cinema-text); }
.cn-bell-dot { position: absolute; top: 6px; right: 6px; width: 8px; height: 8px; border-radius: 50%; background: var(--cinema-accent); box-shadow: 0 0 0 2px var(--cinema-bg); }
.cn-avatar { width: 36px; height: 36px; border-radius: 50%; overflow: hidden; cursor: pointer; border: 2px solid var(--cinema-border); transition: border-color 180ms ease; background: var(--cinema-bg-elevated); display: inline-flex; align-items: center; justify-content: center; color: var(--cinema-text-muted); font-size: 14px; }
.cn-avatar:hover { border-color: var(--cinema-accent); }
.cn-avatar img { width: 100%; height: 100%; object-fit: cover; }

.cn-hamburger { display: inline-flex; }
.cn-nav-pills li a { white-space: nowrap; }
@media (max-width: 1024px) {
    .cn-nav-pills { display: none; }
    .cn-hamburger { width: 40px; height: 40px; }
    .cn-header-inner { grid-template-columns: auto 1fr auto; gap: 8px; }
    .cn-logo { justify-self: start; }
    .cn-logo img { max-height: 28px; }
    .cn-actions { gap: 6px; }
    .cn-action-btn, .cn-avatar { width: 36px; height: 36px; }
}
@media (max-width: 768px) {
    .cn-search-input { display: none; }
}
@media (max-width: 480px) {
    .cn-action-btn:not(.cn-hamburger) { display: none; }
}

/* Search trigger inline icon */
.cn-search-trigger { color: var(--cinema-text-muted); transition: color 180ms ease; cursor: pointer; }
.cn-search-trigger:hover { color: var(--cinema-text); }

/* Search dropdown override (Alpine typeahead) — restyle to dark */
.search-dropdown, .search-typeahead-results, .typeahead-list { background: var(--cinema-bg-elevated) !important; color: var(--cinema-text) !important; border: 1px solid var(--cinema-border) !important; border-radius: 10px !important; box-shadow: var(--cinema-shadow) !important; }
.search-dropdown a, .search-typeahead-results a { color: var(--cinema-text) !important; }
.search-dropdown a:hover, .search-typeahead-results a:hover { background: var(--cinema-bg-hover) !important; }

/* Search input dark */
.cn-search-wrap { position: relative; display: inline-flex; align-items: center; }
.cn-search-input { background: rgba(255,255,255,0.06); border: 1px solid var(--cinema-border); color: var(--cinema-text); border-radius: 999px; padding: 8px 18px; font-size: 13px; outline: none; min-width: 180px; transition: all 180ms ease; }
.cn-search-input::placeholder { color: var(--cinema-text-muted); }
.cn-search-input:focus { background: rgba(255,255,255,0.1); border-color: rgba(255,46,99,0.5); }

.cn-search-dropdown { position: absolute; top: calc(100% + 8px); right: 0; min-width: 320px; max-width: 380px; background: var(--cinema-bg-elevated); border: 1px solid var(--cinema-border); border-radius: 10px; box-shadow: var(--cinema-shadow); padding: 6px; z-index: 90; max-height: 60vh; overflow-y: auto; }
.cn-search-status { padding: 14px; color: var(--cinema-text-muted); font-size: 13px; text-align: center; }
.cn-search-list { list-style: none; padding: 0; margin: 0; }
.cn-search-list li a { display: flex; align-items: center; gap: 10px; padding: 8px; border-radius: 6px; color: var(--cinema-text); text-decoration: none; transition: background 160ms ease; }
.cn-search-list li a:hover { background: rgba(255,255,255,0.06); color: var(--cinema-text); }
.cn-search-list img { width: 38px; height: 56px; object-fit: cover; border-radius: 4px; flex-shrink: 0; background: rgba(0,0,0,0.4); }
.cn-search-meta { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.cn-search-meta strong { font-size: 13px; font-weight: 600; color: var(--cinema-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cn-search-meta span { font-size: 11px; color: var(--cinema-text-muted); }