/* ITAHUKA Video Platform v4.6.0 — published Theme Studio runtime */
:root {
  --it-theme-bg: #f4f6f8;
  --it-theme-surface: #ffffff;
  --it-theme-surface-alt: #eef2f6;
  --it-theme-surface-strong: #111827;
  --it-theme-text: #101828;
  --it-theme-muted: #667085;
  --it-theme-border: #dfe4ea;
  --it-theme-accent: #0f6b44;
  --it-theme-accent-hover: #0b5435;
  --it-theme-accent-contrast: #ffffff;
  --it-theme-live: #e31b2b;
  --it-theme-header: #ffffff;
  --it-theme-header-text: #101828;
  --it-theme-sidebar: #ffffff;
  --it-theme-chat: #ffffff;
  --it-theme-theater: #070b10;
  --it-theme-selection: #dff3e9;
  --it-theme-font: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --it-theme-body-size: 15px;
  --it-theme-heading-weight: 800;
  --it-theme-label-weight: 700;
  --it-theme-line-height: 1.5;
  --it-theme-radius: 14px;
  --it-theme-button-radius: 999px;
  --it-theme-border-width: 1px;
  --it-theme-shadow: 0 8px 28px rgba(15, 23, 42, .10);
  --it-theme-content-width: 1760px;
  --it-theme-sidebar-width: 240px;
  --it-theme-chat-width: 390px;
  --it-theme-live-gap: 18px;
  --it-theme-player-radius: 14px;
  --it-theme-header-height: 64px;
  --it-theme-backdrop-blur: 10px;

  /* Compatibility tokens used throughout the existing application. */
  --canvas: var(--it-theme-bg);
  --paper: var(--it-theme-surface);
  --ink: var(--it-theme-text);
  --muted: var(--it-theme-muted);
  --line: var(--it-theme-border);
  --nav: var(--it-theme-header);
  --red: var(--it-theme-accent);
  --red-dark: var(--it-theme-accent-hover);
  --radius: var(--it-theme-radius);
  --shadow: var(--it-theme-shadow);
}

html { background: var(--it-theme-bg); }
body.themed-ui {
  background: var(--it-theme-bg);
  color: var(--it-theme-text);
  font-family: var(--it-theme-font);
  font-size: var(--it-theme-body-size);
  line-height: var(--it-theme-line-height);
  accent-color: var(--it-theme-accent);
}
body.themed-ui ::selection { background: var(--it-theme-selection); color: var(--it-theme-text); }
body.themed-ui a { color: inherit; }
body.themed-ui h1,
body.themed-ui h2,
body.themed-ui h3,
body.themed-ui h4 { color: var(--it-theme-text); font-weight: var(--it-theme-heading-weight); }
body.themed-ui small,
body.themed-ui .meta,
body.themed-ui .muted,
body.themed-ui .page-heading p { color: var(--it-theme-muted); }

/* Header */
body.themed-ui .site-header.yt-header {
  height: var(--it-theme-header-height) !important;
  min-height: var(--it-theme-header-height) !important;
  background: var(--it-theme-header) !important;
  color: var(--it-theme-header-text) !important;
  border-color: var(--it-theme-border) !important;
  box-shadow: 0 1px 0 var(--it-theme-border);
}
body.themed-ui .site-header .nav-shell { min-height: var(--it-theme-header-height) !important; height: var(--it-theme-header-height) !important; }
body.themed-ui .site-header .site-logo-text,
body.themed-ui .site-header .site-logo-text strong,
body.themed-ui .site-header .account-links,
body.themed-ui .site-header .header-icon,
body.themed-ui .site-header .menu-button,
body.themed-ui .site-header .voice-button { color: var(--it-theme-header-text) !important; }
body.themed-ui .site-header .menu-button span { background: currentColor !important; }
body.themed-ui .site-header .header-icon svg { fill: currentColor !important; }
body.themed-ui .site-header .search-box {
  border-color: var(--it-theme-border) !important;
  background: var(--it-theme-surface-alt) !important;
}
body.themed-ui .site-header .search-box input {
  background: transparent !important;
  color: var(--it-theme-header-text) !important;
  border-color: transparent !important;
}
body.themed-ui .site-header .search-box input::placeholder { color: var(--it-theme-muted) !important; }
body.themed-ui .site-header .search-box button,
body.themed-ui .site-header .voice-button,
body.themed-ui .site-header .create-button,
body.themed-ui .site-header .sign-in-button {
  border-color: var(--it-theme-border) !important;
  background: var(--it-theme-surface-alt) !important;
  color: var(--it-theme-header-text) !important;
  border-radius: var(--it-theme-button-radius) !important;
}
body.themed-ui .site-header .account-dropdown {
  background: var(--it-theme-surface) !important;
  color: var(--it-theme-text) !important;
  border-color: var(--it-theme-border) !important;
  border-radius: var(--it-theme-radius) !important;
  box-shadow: var(--it-theme-shadow) !important;
}
body.themed-ui .site-header .account-dropdown a:hover,
body.themed-ui .site-header .account-dropdown button:hover { background: var(--it-theme-surface-alt) !important; }
body.theme-compact-header { --it-theme-header-height: 56px; }

body.theme-static-header .site-header.yt-header { position: relative !important; top: auto !important; }
body.theme-static-header .public-sidebar.yt-sidebar { top: 0 !important; height: 100vh !important; }
body.theme-noise::after {
  content: "";
  position: fixed;
  z-index: 9999;
  inset: 0;
  opacity: .025;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}
body.themed-ui:not(.theme-reduced-motion) .site-header,
body.themed-ui:not(.theme-reduced-motion) .public-sidebar,
body.themed-ui:not(.theme-reduced-motion) .panel,
body.themed-ui:not(.theme-reduced-motion) .video-thumb,
body.themed-ui:not(.theme-reduced-motion) button,
body.themed-ui:not(.theme-reduced-motion) a { transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease, opacity .18s ease; }

/* Public sidebar and content geometry */
body.themed-ui .public-sidebar.yt-sidebar {
  width: var(--it-theme-sidebar-width) !important;
  top: var(--it-theme-header-height) !important;
  height: calc(100vh - var(--it-theme-header-height)) !important;
  background: var(--it-theme-sidebar) !important;
  color: var(--it-theme-text) !important;
  border-color: var(--it-theme-border) !important;
}
body.themed-ui .public-sidebar nav > a,
body.themed-ui .public-sidebar .sidebar-label { color: var(--it-theme-text) !important; }
body.themed-ui .public-sidebar nav > a:hover { background: var(--it-theme-surface-alt) !important; }
body.themed-ui .public-sidebar nav > a.active {
  background: var(--it-theme-selection) !important;
  color: var(--it-theme-accent) !important;
  font-weight: var(--it-theme-label-weight);
}
body.themed-ui .public-sidebar hr { border-color: var(--it-theme-border) !important; }
body.themed-ui .public-content { margin-left: var(--it-theme-sidebar-width) !important; }
body.theme-hide-sidebar .public-sidebar { display: none !important; }
body.theme-hide-sidebar .public-content { margin-left: 0 !important; }
body.themed-ui .page-space > .container { width: min(var(--it-theme-content-width), calc(100% - 40px)); max-width: none; }

/* Common surfaces */
body.themed-ui .panel,
body.themed-ui .video-card,
body.themed-ui .sidebar-card,
body.themed-ui .playlist-card,
body.themed-ui .comments-section,
body.themed-ui .comment-compose,
body.themed-ui .community-compose,
body.themed-ui .admin-card,
body.themed-ui .create-playlist {
  background: var(--it-theme-surface);
  color: var(--it-theme-text);
  border-color: var(--it-theme-border);
  border-radius: var(--it-theme-radius);
  box-shadow: var(--it-theme-shadow);
}
body.themed-ui .video-thumb,
body.themed-ui .playlist-cover,
body.themed-ui .playlist-hero-cover,
body.themed-ui .related-item img,
body.themed-ui .related-placeholder { border-radius: calc(var(--it-theme-radius) * .78); }
body.themed-ui .button,
body.themed-ui button.button {
  background: var(--it-theme-accent);
  border-color: var(--it-theme-accent);
  color: var(--it-theme-accent-contrast);
  border-radius: var(--it-theme-button-radius);
}
body.themed-ui .button:hover,
body.themed-ui button.button:hover { background: var(--it-theme-accent-hover); border-color: var(--it-theme-accent-hover); }
body.themed-ui .button-secondary {
  background: var(--it-theme-surface);
  color: var(--it-theme-text);
  border-color: var(--it-theme-border);
}
body.themed-ui input,
body.themed-ui textarea,
body.themed-ui select {
  background: var(--it-theme-surface);
  color: var(--it-theme-text);
  border-color: var(--it-theme-border);
}
body.themed-ui input:focus,
body.themed-ui textarea:focus,
body.themed-ui select:focus {
  border-color: var(--it-theme-accent) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--it-theme-accent) 18%, transparent) !important;
}
body.themed-ui .footer-shell,
body.themed-ui .site-footer { background: var(--it-theme-surface); color: var(--it-theme-muted); border-color: var(--it-theme-border); }

/* Theme effects */
body.theme-glass .panel,
body.theme-glass .it-live-player-card,
body.theme-glass .it-live-guide,
body.theme-glass .it-community-chat {
  background: color-mix(in srgb, var(--it-theme-surface) 86%, transparent) !important;
  backdrop-filter: blur(var(--it-theme-backdrop-blur));
  -webkit-backdrop-filter: blur(var(--it-theme-backdrop-blur));
}
body.theme-reduced-motion *,
body.theme-reduced-motion *::before,
body.theme-reduced-motion *::after {
  scroll-behavior: auto !important;
  animation-duration: .001ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: .001ms !important;
}

@media (max-width: 1100px) {
  body.themed-ui .public-content { margin-left: 0 !important; }
  body.themed-ui .page-space > .container { width: min(var(--it-theme-content-width), calc(100% - 24px)); }
}
@media (max-width: 760px) {
  body.themed-ui .page-space > .container { width: 100%; }
  body.themed-ui .site-header .nav-shell { min-height: 56px; height: 56px; }
  body.themed-ui { --it-theme-header-height: 56px; }
}
