/* assets/css/rose-linen.css * "ბროწეული" (Rose linen) — the shared base of the light, warm sub-brand: * a pale tint of the brand red for the ground, cream panels lifted by soft * warm shadows, one red spent only on what is live. * * Used by the TV page (modules/tv/) and the kino pages (kino.php, kinoteka.php, * kino-archive.php). Everything is scoped to body.ktv-page (set via * $body_class_extra), never :root, so the rest of the site is untouched. * Page components live in their own sheets: tv-broadcast.css, kino-rose.css. */ /* ========================================================================== 0. Tokens — day (default) and night (lamp switch) ========================================================================== */ body.ktv-page { --ktv-page: #f6efec; --ktv-panel: #fffdfc; --ktv-soft: #fbf6f4; --ktv-line: #eddcd6; --ktv-ink: #2a1f1d; --ktv-ink-2: #5b4a46; --ktv-ink-3: #735d58; --ktv-red: #b40000; --ktv-red-ink: #b40000; --ktv-red-tint: #fbe3de; --ktv-film: #3a2a27; --ktv-music: #e2c9c2; --ktv-aired: #eadcd7; --ktv-veil: rgba(42, 31, 29, 0.86); --ktv-nav: rgba(255, 253, 252, 0.9); --ktv-shadow: 0 1px 2px rgba(60, 20, 10, 0.05), 0 14px 30px -18px rgba(60, 20, 10, 0.22); --ktv-shadow-lift: 0 2px 4px rgba(60, 20, 10, 0.06), 0 22px 40px -18px rgba(60, 20, 10, 0.3); --ktv-r: 18px; --ktv-r-sm: 12px; --ktv-r-xs: 8px; --ktv-text: 'FiraGO', 'Noto Sans Georgian', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; --ktv-display: 'BPG Nino Mtavruli', 'FiraGO', 'Noto Sans Georgian', sans-serif; --ktv-display-weight: 400; --ktv-ease: cubic-bezier(0.16, 1, 0.3, 1); --ktv-fast: 180ms; --ktv-slow: 520ms; /* The dark kino layers (kino-style.css) read these — re-pointed for this page */ --kino-bg-primary: var(--ktv-page); --kino-bg-secondary: var(--ktv-soft); --kino-primary-color: var(--ktv-red); --kino-text-primary: var(--ktv-ink); --kino-text-secondary: var(--ktv-ink-2); --kino-border-color: var(--ktv-line); color-scheme: light; } html.ktv-lights-down body.ktv-page { --ktv-page: #1a1514; --ktv-panel: #231c1a; --ktv-soft: #2b2320; --ktv-line: #3a2e2b; --ktv-ink: #f6eeeb; --ktv-ink-2: #d3c3be; --ktv-ink-3: #a8958f; --ktv-red-ink: #ff7a70; --ktv-red-tint: #3d1f1b; --ktv-film: #f1e4df; --ktv-music: #6b5550; --ktv-aired: #3a2f2c; --ktv-nav: rgba(35, 28, 26, 0.92); --ktv-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 14px 30px -18px rgba(0, 0, 0, 0.7); --ktv-shadow-lift: 0 2px 4px rgba(0, 0, 0, 0.45), 0 22px 40px -18px rgba(0, 0, 0, 0.8); color-scheme: dark; } /* BPG Nino Mtavruli has none of the Polish diacritics: Latin-script pages set the display role in FiraGO Bold so a word never renders in two faces. */ html[lang='en'] body.ktv-page, html[lang='pl'] body.ktv-page { --ktv-display: var(--ktv-text); --ktv-display-weight: 700; } /* Bounded cross-fade while the lamp switch flips day and night */ html.ktv-fading body.ktv-page, html.ktv-fading body.ktv-page *:not(iframe):not(video) { transition: background-color var(--ktv-slow) var(--ktv-ease), color var(--ktv-slow) var(--ktv-ease), border-color var(--ktv-slow) var(--ktv-ease) !important; } /* ========================================================================== 0a. The page under the site's shared header and footer The header and footer are the site's own (includes/site_chrome/, assets/css/site-chrome.css) and stay navy here too. These pages skip style.css ($skip_site_stylesheet), so the ground, ink and face that the old kino-header.php set on are set here, and the page reserves the space under the fixed bar itself: 72px bar + 2px, as the old 78px bar had 80px. On phones (m-view) mobile.css reserves the top bar and the tab bar. ========================================================================== */ body.ktv-page { background: var(--ktv-page); color: var(--ktv-ink); font-family: var(--ktv-text); line-height: 1.5; -webkit-font-smoothing: antialiased; } body.ktv-page:not(.m-view) > main { padding-top: calc(var(--sc-h, 72px) + 2px); } body.ktv-page ::selection { background: var(--ktv-red); color: #fff; } /* Phones: the site's tab bar dims with the lamp, the navy top bar stays */ html.ktv-lights-down body.ktv-page.m-view .m-bottomnav { background: var(--ktv-panel); border-top-color: var(--ktv-line); } html.ktv-lights-down body.ktv-page.m-view .m-bottomnav a { color: var(--ktv-ink-3); } html.ktv-lights-down body.ktv-page.m-view .m-bottomnav a.active { color: var(--ktv-red-ink); } /* ========================================================================== 0b. Lamp — the "lights down" switch (TV masthead, kino heads) ========================================================================== */ .tv-lights-btn, .rl-lamp { flex: none; display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px; background: var(--ktv-panel); color: var(--ktv-ink-2); border: 0; border-radius: 999px; box-shadow: var(--ktv-shadow); font-family: var(--ktv-text); font-size: 0.8125rem; font-weight: 700; cursor: pointer; transition: box-shadow var(--ktv-fast) var(--ktv-ease), color var(--ktv-fast) var(--ktv-ease), transform var(--ktv-fast) var(--ktv-ease); } .tv-lights-btn i, .rl-lamp i { font-size: 0.95rem; } .tv-lights-btn:hover, .rl-lamp:hover { color: var(--ktv-ink); box-shadow: var(--ktv-shadow-lift); transform: translateY(-1px); } /* Pressed means the lights are down: a quiet chip, never the brightest surface */ .tv-lights-btn[aria-pressed='true'], .rl-lamp[aria-pressed='true'] { background: var(--ktv-soft); color: var(--ktv-ink); box-shadow: inset 0 0 0 1px var(--ktv-line); } .tv-lights-btn[aria-pressed='true'] i, .rl-lamp[aria-pressed='true'] i { color: var(--ktv-red-ink); }