/* Space Gate Nova+ — Unified visual identity layer
   Load this file last. It maps old namespaces (oscar/sg/mc/episode) to one Nova design system. */
:root {
  color-scheme: dark;
  --nova-bg: #000000;
  --nova-bg-deep: #050505;
  --nova-bg-glow: #000000;
  --nova-surface: #0d0d0d;
  --nova-surface-2: #141414;
  --nova-surface-3: #1a1a1a;
  --nova-card: rgba(13,13,13,.94);
  --nova-card-strong: rgba(18,18,18,.98);
  --nova-text: #f8f9fb;
  --nova-text-2: #cdd3dd;
  --nova-muted: #aeb7c7;
  --nova-muted-2: #8e98a8;
  --nova-line: #2b3442;
  --nova-line-soft: rgba(255,255,255,.08);
  --nova-purple: #9B4DFF;
  --nova-blue: #14D7FF;
  --nova-cyan: #F04AD8;
  --nova-green: #14D7FF;
  --nova-orange: #F04AD8;
  --nova-danger: #F04AD8;
  --nova-brand-gradient: linear-gradient(135deg, #F04AD8 0%, #9B4DFF 48%, #14D7FF 100%);
  --nova-surface-gradient: linear-gradient(145deg, rgba(18,18,18,.98), rgba(0,0,0,.98));
  --nova-page-pad: clamp(18px, 2.1vw, 36px);
  --nova-radius-sm: 12px;
  --nova-radius-md: 18px;
  --nova-radius-lg: 24px;
  --nova-radius-xl: 30px;
  --nova-shadow: 0 18px 46px rgba(0,0,0,.34);
  --nova-shadow-soft: 0 12px 30px rgba(0,0,0,.22);

  /* Legacy namespace mapping. */
  --oscar-bg: var(--nova-bg);
  --oscar-bg-soft: var(--nova-bg-deep);
  --oscar-surface: var(--nova-surface);
  --oscar-surface-2: var(--nova-surface-2);
  --oscar-surface-3: var(--nova-surface-3);
  --oscar-glass: rgba(29,36,48,.86);
  --oscar-text: var(--nova-text);
  --oscar-text-2: var(--nova-text-2);
  --oscar-muted: var(--nova-muted-2);
  --oscar-border: var(--nova-line-soft);
  --oscar-red: var(--nova-purple);
  --oscar-red-2: #14D7FF;
  --oscar-purple: var(--nova-purple);
  --oscar-cyan: var(--nova-cyan);
  --accent: var(--nova-purple);

  --sg-bg: var(--nova-bg);
  --sg-bg-deep: var(--nova-bg-deep);
  --sg-surface: var(--nova-surface);
  --sg-surface-2: var(--nova-surface-2);
  --sg-text: var(--nova-text);
  --sg-muted: var(--nova-muted);
  --sg-line: var(--nova-line-soft);
  --sg-purple: var(--nova-purple);
  --sg-blue: var(--nova-blue);
  --sg-cyan: var(--nova-cyan);
  --page-pad: var(--nova-page-pad);
}

html,
body,
#app,
.app-root {
  min-height: 100%;
  background: #000000 !important;
  color: var(--nova-text) !important;
}

body {
  font-family: "Tajawal", "Noto Sans Arabic", "Segoe UI", Arial, sans-serif !important;
  direction: rtl;
}

button,
input,
select,
textarea { font-family: inherit !important; }
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--nova-cyan) !important;
  outline-offset: 2px;
}

/* Global shell */
.oscar-app,
.oscar-app.anime-theme,
.oscar-app.matches-theme,
.sg-app-root,
.mc-root,
.episode-details-page {
  --accent: var(--nova-purple) !important;
  background:
    radial-gradient(circle at 72% 0%, rgba(141,44,255,.18), transparent 34%),
    radial-gradient(circle at 8% 20%, rgba(26,169,255,.12), transparent 28%),
    linear-gradient(180deg, var(--nova-bg-glow) 0%, var(--nova-bg) 42%, var(--nova-bg-deep) 100%) !important;
  color: var(--nova-text) !important;
}

.oscar-main,
.sg-main-content,
.native-view { background: transparent !important; color: var(--nova-text) !important; }

/* Top bars */
.oscar-toolbar,
.oscar-toolbar.home-toolbar,
.oscar-toolbar.series-section-toolbar,
.oscar-toolbar.account-toolbar,
.sg-top-app-bar,
.search-sheet,
.mc-tabs {
  background: linear-gradient(180deg, rgba(16,21,29,.96), rgba(16,21,29,.72), rgba(16,21,29,0)) !important;
  border-color: var(--nova-line-soft) !important;
  box-shadow: none !important;
  backdrop-filter: blur(18px) !important;
}
.toolbar-title h1,
.series-section-bar h1,
.sg-bar-title,
.mc-section-title h2 { color: var(--nova-text) !important; }
.nova-header-logo,
.side-menu-brand img,
.sg-brand-logo,
.oscar-splash img { filter: drop-shadow(0 14px 34px rgba(141,44,255,.22)) !important; }

/* Navigation */
.oscar-bottom-nav,
.original-bottom-nav,
.nova-shell-nav,
.sg-bottom-nav {
  background: rgba(16,21,29,.965) !important;
  border-top: 1px solid var(--nova-line-soft) !important;
  box-shadow: 0 -18px 44px rgba(0,0,0,.36) !important;
  backdrop-filter: blur(22px) !important;
}
.oscar-bottom-nav button,
.nova-shell-nav button,
.sg-bottom-nav button { color: var(--nova-muted-2) !important; }
.oscar-bottom-nav button.active,
.nova-shell-nav button.active,
.sg-bottom-nav button.active { color: var(--nova-text) !important; }
.oscar-bottom-nav button.active .nav-icon,
.nova-shell-nav button.active > span,
.sg-bottom-nav button.active span {
  background: var(--nova-brand-gradient) !important;
  color: #fff !important;
  box-shadow: 0 8px 24px rgba(141,44,255,.36) !important;
}

/* Drawers, overlays and menus */
.side-menu,
.sg-side-drawer,
.sg-search-overlay {
  background: linear-gradient(180deg, rgba(29,36,48,.99), rgba(16,21,29,.99)) !important;
  border-color: var(--nova-line-soft) !important;
  box-shadow: -28px 0 58px rgba(0,0,0,.5) !important;
}
.side-menu-brand,
.sg-drawer-header { border-color: var(--nova-line-soft) !important; }
.side-menu button,
.sg-drawer-menu button { color: var(--nova-text-2) !important; }
.side-menu button:active,
.sg-drawer-menu button:active { background: rgba(141,44,255,.14) !important; color: #fff !important; }

/* Inputs */
.search-field,
.sg-search-input-wrapper,
.nova-search-box,
.episode-tools label,
.content-comment-composer input,
.content-reply-composer input {
  background: rgba(16,21,29,.88) !important;
  border: 1px solid var(--nova-line-soft) !important;
  border-radius: var(--nova-radius-md) !important;
  color: var(--nova-text) !important;
}
.search-field:focus-within,
.sg-search-input-wrapper:focus-within,
.nova-search-box:focus-within,
.episode-tools label:focus-within {
  border-color: rgba(23,217,208,.62) !important;
  box-shadow: 0 0 0 3px rgba(23,217,208,.08) !important;
}

/* Cards and surfaces */
.primary-action,
.home-subscribe-cta,
.category-tabs button.active,
.favorite-button.saved,
.circle-action.saved,
.content-comment-composer button,
.content-reply-composer button,
.mc-live-play,
.mc-tabs button.active::after,
.mc-section-title h2 i,
.mc-video-copy small i,
.mc-video-meta i,
.mc-team-switch button.active::after,
.mc-event-row > button,
.people-rail .crew-role,
.details-type,
.episode-item em,
.sports-provider-controls button,
.sports-provider-actions button {
  background: var(--nova-brand-gradient) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 12px 30px rgba(141,44,255,.25) !important;
}

.outline-action,
.circle-action,
.icon-button,
.category-tabs button,
.category-grid button,
.home-shortcut-tile,
.account-card,
.details-actions button,
.episode-item,
.stream-choice-card,
.download-link-card,
.download-link-main,
.episode-visual-card,
.episode-series-link,
.content-comment,
.content-comment.nested,
.mc-match-card,
.mc-video-card,
.mc-details-card,
.mc-team-switch,
.sg-account-card,
.sg-offer-card,
.sg-commercial-ad,
.nova-card,
.nova-gateway,
.nova-account-stats > div,
.nova-storage-grid > div,
.nova-settings-section {
  background: var(--nova-surface-gradient) !important;
  border-color: var(--nova-line-soft) !important;
  color: var(--nova-text) !important;
  box-shadow: var(--nova-shadow-soft) !important;
}

.poster,
.media-card-poster,
.episode-thumb,
.mc-video-thumb,
.nova-poster-wrap,
.nova-card-poster,
.sg-ad-media {
  background: rgba(16,21,29,.72) !important;
  border-color: var(--nova-line-soft) !important;
}

/* Text hierarchy */
small,
.toolbar-title small,
.side-menu-brand small,
.section-heading span,
.section-heading small,
.mc-match-score small,
.mc-video-copy span,
.mc-video-copy small,
.mc-info-row span,
.episode-card-copy small,
.download-link-copy small,
.stream-choice-card small,
.content-comment header small,
.content-comments-empty,
.nova-result-summary,
.nova-empty-state p,
.sg-account-card dt,
.sg-account-card small,
.sg-ad-copy small {
  color: var(--nova-muted) !important;
}

.section-heading h2 > i,
.nova-eyebrow::before,
.hero-dots i.active,
.oscar-loader span,
.nova-loader-track i,
.download-progress-track i {
  background: var(--nova-brand-gradient) !important;
}

/* Match Center: remove isolated green/red skin and make it Nova. */
.mc-list-hero,
.mc-detail-hero {
  background:
    radial-gradient(circle at 50% 15%, rgba(141,44,255,.26), transparent 38%),
    linear-gradient(180deg, #202936 0%, #151a23 44%, #10151d 100%) !important;
}
.mc-round-play { background: var(--nova-brand-gradient) !important; box-shadow: 0 0 0 8px rgba(141,44,255,.13) !important; }
.mc-trophy { color: var(--nova-cyan) !important; }
.mc-day-tabs button,
.mc-match-score span,
.mc-scoreboard section em,
.mc-event-row time,
.content-comment-actions button,
.content-comments-more {
  background: rgba(37,46,60,.86) !important;
  color: var(--nova-text-2) !important;
}
.mc-day-tabs button.active,
.mc-team-switch button.active { color: #fff !important; background: rgba(141,44,255,.22) !important; }
.mc-event-line { background: rgba(255,255,255,.12) !important; }
.mc-event-node { background: var(--nova-bg-deep) !important; border-color: var(--nova-surface-2) !important; }

/* Details/episodes/comments */
.episode-detail-shade,
.details-backdrop::after {
  background: linear-gradient(180deg, rgba(16,21,29,.08), rgba(16,21,29,.46) 42%, var(--nova-bg-deep) 100%) !important;
}
.details-status-badges span,
.details-engagement button,
.quality-source-note,
.episode-quality-stack span,
.download-progress-area {
  background: rgba(16,21,29,.58) !important;
  border-color: var(--nova-line-soft) !important;
  color: var(--nova-text-2) !important;
}
.details-engagement button,
.content-comment-actions .accent,
.content-comments-more { color: var(--nova-cyan) !important; }
.content-comment-avatar,
.content-comment-avatar.red { background: var(--nova-brand-gradient) !important; }
.content-comment header i { background: var(--nova-cyan) !important; }

/* Account, notifications and ads with the same system. */
.sg-account-portal,
.sg-account-hero,
.notification-panel,
.sg-commercial-ad {
  color: var(--nova-text) !important;
}
.sg-account-message.success,
.sg-permissions .on { color: #7ff1c3 !important; }
.sg-account-message.error,
.sg-permissions .off { color: #ff9aac !important; }
.sg-public-button,
.sg-ad-cta,
.notification-action,
.nova-settings-actions button {
  background: var(--nova-brand-gradient) !important;
  color: #fff !important;
  border-color: transparent !important;
}

/* Splash/loading */
.oscar-splash,
.commercial-loading-screen,
.nova-app-loader,
.nova-home-loading,
.nova-centered-loading {
  background:
    radial-gradient(circle at 50% 18%, rgba(141,44,255,.25), transparent 34%),
    linear-gradient(180deg, var(--nova-bg-glow), var(--nova-bg-deep)) !important;
  color: var(--nova-text) !important;
}
.oscar-splash strong span,
.nova-loader-brand,
.nova-eyebrow,
.nova-section-heading > button,
.sg-top-tabs button.active { color: var(--nova-cyan) !important; }

@media (max-width: 700px) {
  :root { --nova-page-pad: 15px; }
  .oscar-toolbar,
  .oscar-toolbar.home-toolbar,
  .oscar-toolbar.series-section-toolbar,
  .oscar-toolbar.account-toolbar {
    background: linear-gradient(180deg, rgba(16,21,29,.94), rgba(16,21,29,.58), transparent) !important;
  }
}
