/* * SON TV Redesign — Override Stylesheet * * This file overrides parent theme styles. Loaded via functions.php * at wp_enqueue_scripts priority 99 (after parent's style.php). * * Load-order verified on staging (2026-05-22): * - Our CSS loads after parent's style.php. Overrides work * without !important, simple selectors are sufficient. * - Visible page background comes from #safirPage wrapper, * not . Must target wrapper divs for background changes. */ /* ========================================================================== DESIGN TOKENS ========================================================================== */ :root { /* Colors */ --color-bg: #fafaf7; --color-bg-subtle: #fafaf7; --color-text: #1a1a1a; --color-text-secondary: #555; --color-accent: #D23433; --color-border: #e0ddd4; --color-text-muted: #888; --color-hairline: #e8e5dc; /* Typography */ --font-serif: 'Lora', Georgia, 'Times New Roman', serif; --font-sans: 'Inter', 'Helvetica Neue', Arial, sans-serif; --text-base: 17px; --text-sm: 15px; --text-xs: 13px; --leading-body: 1.65; --leading-tight: 1.25; } /* ========================================================================== BASE OVERRIDES ========================================================================== */ body { font-family: var(--font-sans); font-size: var(--text-base); line-height: var(--leading-body); color: var(--color-text); background: var(--color-bg); } #safirPage { background: var(--color-bg); } /* ========================================================================== TYPOGRAPHY — HEADINGS ========================================================================== */ h1, h2, h3, h4, h5, h6 { font-family: var(--font-serif); line-height: var(--leading-tight); color: var(--color-text); } h1 { font-size: 34px; } h2 { font-size: 28px; } h3 { font-size: 24px; } h4 { font-size: 19px; } h5 { font-size: 17px; } h6 { font-size: 15px; } /* ========================================================================== TYPOGRAPHY — LINKS ========================================================================== */ a { color: var(--color-text); transition: color 0.15s ease; } a:hover { color: var(--color-accent); } /* ========================================================================== TYPOGRAPHY — ARTICLE CONTENT ========================================================================== */ /* Article headlines — serif, prominent */ .post .title, .post .title a, .single .entry-title, .single h1.title { font-family: var(--font-serif); line-height: var(--leading-tight); color: var(--color-text); } /* Article body text — sans, readable */ .post .content, .post .content p, .single .entry-content, .single .entry-content p { font-family: var(--font-sans); font-size: var(--text-base); line-height: var(--leading-body); color: var(--color-text); } /* Article excerpt/spot text */ .post .spot, .single .spot { font-family: var(--font-sans); color: var(--color-text-secondary); } /* Metadata: dates, categories, author */ .post .meta, .post .meta a, .single .meta, .single .meta a { font-family: var(--font-sans); font-size: var(--text-sm); color: var(--color-text-secondary); } /* ========================================================================== TYPOGRAPHY — NAVIGATION & UI ========================================================================== */ /* Main menu */ #mainMenu, #mainMenu a { font-family: var(--font-sans); } /* Widget headings */ .widgetHeading, .widgetHeading a { font-family: var(--font-serif); color: var(--color-text); } /* Breadcrumbs */ .breadcrumb, .breadcrumb a { font-family: var(--font-sans); font-size: var(--text-sm); color: var(--color-text-secondary); } /* ========================================================================== FORM ELEMENTS (override parent's Roboto Condensed on forms) ========================================================================== */ #main form input[type="text"], #main form input[type="email"], #main form input[type="password"], #main form input[type="file"], #main form textarea, #main form select { font-family: var(--font-sans); } /* ========================================================================== HEADER — Moved to assets/css/header.css in Phase 3A.0. Parent elements (#topbar, #header-cont, #menuGroup, #breakingGroup etc.) are hidden via header.css. New header uses .sontv-header-* classes. ========================================================================== */ /* ========================================================================== SIDEBAR REDESIGN ========================================================================== */ /* --- Widget spacing: more breathing room between widgets --- */ .sidebarWidget { margin-top: 20px; background: var(--color-bg); } /* --- Widget headings: unify all 3 parent styles into one Bloomberg look. Parent has style1 (colored bar), style2 (gradient), style3 (underline). We flatten all three to: serif text + thin border-bottom, no icons. --- */ .widgetHeading.style1, .widgetHeading.style2, .widgetHeading.style3 { background: none; border-bottom: 1px solid var(--color-border); margin-bottom: 15px; } /* Hide sprite-based heading icons (also fixes AMP rendering) */ .widgetHeading .icon { display: none; } .widgetHeading.style1 .icon:after { display: none; } /* Heading title text */ .widgetHeading .title { font-family: var(--font-serif); font-size: 19px; font-weight: 700; color: var(--color-text); text-transform: uppercase; letter-spacing: 0.03em; padding: 0 0 8px; float: none; display: block; line-height: 1.3; } /* "Tümünü Gör" link */ .widgetHeading .allLink { font-family: var(--font-sans); font-size: var(--text-xs); color: var(--color-accent); } /* Remove style3's extra underline elements (our border-bottom replaces them) */ .widgetHeading.style3 .colorline { border-bottom: none; padding-bottom: 0; } .widgetHeading.style3 .bottomline { display: none; } /* --- Post items in sidebar: dividers between items --- */ .advancedPostsWidget1.sidebarWidget .post-container { border-bottom: 1px solid var(--color-border); padding-bottom: 10px; margin-bottom: 10px; } .advancedPostsWidget1.sidebarWidget .post-container:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; } /* --- Thumbnail: remove dated border frame --- */ .advancedPostsWidget1.sidebarWidget .post .thumb { border: none; padding: 0; margin-right: 10px; } /* --- Post headline: serif, black, red on hover --- */ .advancedPostsWidget1.sidebarWidget .post .title { font-family: var(--font-serif); font-size: 15px; font-weight: 700; line-height: var(--leading-tight); } .advancedPostsWidget1.sidebarWidget .post .title a { color: var(--color-text); } /* Parent uses !important on its hover rule, so we must match it */ .advancedPostsWidget1.sidebarWidget .post .title a:hover { color: var(--color-accent) !important; } /* --- Post excerpt: subtle, secondary --- */ .advancedPostsWidget1.sidebarWidget .post .summary { font-family: var(--font-sans); font-size: var(--text-xs); color: var(--color-text-secondary); line-height: 1.4; margin-top: 4px; } /* --- Post detail: allow long headlines to wrap instead of hard truncation. min-height keeps visual consistency for short headlines. --- */ .advancedPostsWidget1.sidebarWidget .post .detail { min-height: 60px; height: auto; } /* --- Weather widget: restrained, no background photo --- */ .weatherWidget { background: var(--color-bg-subtle); } .weatherWidget .city { font-family: var(--font-sans); font-size: 15px; font-weight: 600; } .weatherWidget .degree { font-size: 24px; } .weatherWidget .situation { font-size: 14px; color: var(--color-text-secondary); } /* --- Homepage-only: hide empty sidebar ad widgets. Scoped to body.home so article/category sidebar ads remain available for future use. --- */ body.home .adsWidget.sidebarWidget { display: none; } /* --- Sidebar section heading (aside .heading): match white theme --- */ aside .heading { background: var(--color-bg); color: var(--color-text); text-shadow: none; } /* ========================================================================== AUTHORITY BAR + HEADER SOCIAL — Moved to assets/css/header.css in Phase 3A.0. Court logos are now in .sontv-header__courts (desktop) and #mobileAuthority (hamburger). Social icons in .sontv-header__utility and .sontv-hamburger-social. ========================================================================== */ /* ========================================================================== FOOTER — Moved to assets/css/footer.css in Phase 3A. New footer uses .sontv-footer-* classes. Old parent elements (.footermenu1, .footermenu2, .bottomText, etc.) hidden via footer.css. ========================================================================== */ /* Item 4: Ensure pull-to-refresh on mobile is not blocked by any future change */ html, body { overscroll-behavior-y: auto; }