/*
 Theme Name:   TimesNews Child
 Theme URI:    https://profvolt.com
 Description:  Child theme for TimesNews — ProfVolt brand colours (#F0A500 gold, #1A1A2E dark)
 Author:       ProfVolt
 Template:     timesnews
 Version:      1.4.0
 Text Domain:  timesnews-child
*/

/*
 * ProfVolt Brand Colors v1.4 (approved 2026-05-28)
 * Gold: #F0A500 | Dark Navy: #1A1A2E | Gold Hover: #c8860a
 */

/* ================================================================
   1. HEADER — transparent (no navy background behind logo)
   ================================================================ */
.header-brand,
.main-header-brand,
.site-header,
#masthead {
    background-color: transparent !important;
}

/* ================================================================
   2. NAVIGATION — transparent, gold on hover/active
   ================================================================ */
.main-navigation,
#site-navigation,
.site-header-menu {
    background-color: transparent !important;
}
.main-navigation a:hover,
.main-navigation .current-menu-item > a,
.main-navigation .current-menu-ancestor > a {
    color: #F0A500 !important;
}
.main-navigation ul.sub-menu,
.main-navigation ul.children {
    background-color: #1A1A2E !important;
}
.main-navigation ul ul {
    border-top-color: #F0A500 !important;
}

/* ================================================================
   3. FLASH/GUIDES BAR — gold bg, DARK text (#1A1A2E)
   ================================================================ */
.flash-news-wrap,
.breaking-news-wrap,
.top-header,
.secondary-nav-wrap {
    background-color: transparent !important;
}
.flash-news-header {
    background-color: #F0A500 !important;
    color: #1A1A2E !important;
    font-weight: 700 !important;
}
.flash-news-title {
    color: #1A1A2E !important;
}

/* ================================================================
   4. DATE / TIME BAR
   ================================================================ */
.clock {
    background-color: #1A1A2E !important;
    color: #F0A500 !important;
}
#date { color: #F0A500 !important; }
#time {
    background-color: #F0A500 !important;
    color: #1A1A2E !important;
    font-weight: 600 !important;
}

/* ================================================================
   5. SECTION TITLE BARS (Sewing Machine, Watches, Film Camera etc.)
      NO background — dark text + gold bottom border only
   ================================================================ */
.widget-title {
    background-color: transparent !important;
    color: #1A1A2E !important;
    border-bottom: 3px solid #F0A500 !important;
    padding: 5px 0 6px !important;
}
.widget-title:after,
.widget-title:before {
    background-color: transparent !important;
    border-color: transparent !important;
}
/* Sidebar widget titles — keep gold bg for those */
.right-widget-area .widget-title,
#secondary .widget-title,
#colophon .widget-title {
    background-color: #F0A500 !important;
    color: #1A1A2E !important;
    padding: 5px 15px 6px !important;
    border-bottom: none !important;
}
.right-widget-area .widget-title:before,
#secondary .widget-title:before {
    border-color: #F0A500 transparent transparent transparent !important;
}

/* ================================================================
   6. MAIN BANNER / SLIDER — remove gold bleed on sides
   ================================================================ */
.main-banner,
.banner-wrap,
.banner-list,
.slide-content,
.slide-text-wrap,
.standard-header {
    background-color: transparent !important;
}
/* Ensure standard-header (used in some widget headers) is NOT gold */
.standard-header {
    background-color: transparent !important;
    color: #1A1A2E !important;
}

/* ================================================================
   7. BUTTONS & CTAs
   ================================================================ */
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.search-container .search-submit,
.widget_search .search-submit,
.post-page-search .search-submit,
.more-link,
a.more-link {
    background-color: #F0A500 !important;
    border-color: #F0A500 !important;
    color: #1A1A2E !important;
    font-weight: 600 !important;
}
button:hover,
input[type="submit"]:hover,
a.more-link:hover {
    background-color: #c8860a !important;
    border-color: #c8860a !important;
    color: #1A1A2E !important;
}

/* ================================================================
   8. SOCIAL, BREADCRUMBS, TAGS, PAGINATION
   ================================================================ */
.social-links-menu li a:hover,
.menu-social-links-container ul > li a:hover {
    background-color: #F0A500 !important;
    color: #1A1A2E !important;
}
.menu-social-links-container ul > li a:before {
    color: #F0A500 !important;
}
.timesnews-breadcrumb .current,
.timesnews-breadcrumb a { color: #F0A500 !important; }
.timesnews-tag a:hover,
.tags-links a:hover {
    background-color: #F0A500 !important;
    border-color: #F0A500 !important;
    color: #1A1A2E !important;
}
.pagination .nav-links .page-numbers.current,
.pagination .nav-links .page-numbers:hover,
.posts-navigation .nav-links a,
.post-navigation .nav-links a {
    color: #F0A500 !important;
}
.pagination .nav-links .page-numbers.current {
    background-color: #F0A500 !important;
    color: #1A1A2E !important;
}
blockquote { border-left-color: #F0A500 !important; }
.sticky-name,
.sticky-post {
    background-color: #F0A500 !important;
    color: #1A1A2E !important;
}

/* ================================================================
   9. BACK TO TOP BUTTON
   ================================================================ */
.back-to-top {
    background-color: #F0A500 !important;
    color: #1A1A2E !important;
}
.back-to-top:hover {
    background-color: #c8860a !important;
    color: #1A1A2E !important;
}

/* ================================================================
   10. MOBILE MENU TOGGLE
   ================================================================ */
.menu-toggle {
    background-color: #F0A500 !important;
    color: #1A1A2E !important;
    border-color: #F0A500 !important;
}
@media only screen and (max-width: 1024px) {
    .main-header > .navigation-top:before,
    .main-navigation ul > li:hover > .dropdown-toggle,
    .main-navigation ul > li.current-menu-item .dropdown-toggle,
    .main-navigation ul > li.current-menu-ancestor .dropdown-toggle {
        background-color: #F0A500 !important;
        color: #1A1A2E !important;
    }
    .main-navigation ul li:hover > a,
    .main-navigation ul li.current-menu-item > a,
    .main-navigation ul li.current_page_item > a,
    .main-navigation ul li.current-menu-ancestor > a {
        color: #F0A500 !important;
    }
}

/* ================================================================
   11. POST TITLE HOVER
   ================================================================ */
.entry-title a:hover,
h2.entry-title a:hover,
h3.entry-title a:hover {
    color: #F0A500 !important;
}

/* ================================================================
   12. FOOTER — dark navy, gold links, ProfVolt credit only
   ================================================================ */
#colophon,
.site-footer,
.copyright-area,
.footer-sidebar {
    background-color: #1A1A2E !important;
    color: #ffffff !important;
}
#colophon a,
.site-footer a {
    color: #F0A500 !important;
}
#colophon a:hover,
.site-footer a:hover {
    color: #c8860a !important;
}
/* Hide WordPress/theme credit, show only ProfVolt line */
.copyright-area .site-info {
    font-size: 0 !important;
}
.copyright-area .site-info .profvolt-footer-credit {
    font-size: 14px !important;
    color: #F0A500 !important;
    display: block !important;
}
.copyright-area .site-info > *:not(.profvolt-footer-credit) {
    display: none !important;
}

/* ================================================================
   13. HIDE AUTHOR BYLINE
   ================================================================ */
.author.vcard {
    display: none !important;
}

/* ================================================================
   14. AZ-DATE (secondary nav date badge)
   ================================================================ */
.az-date {
    background-color: #F0A500 !important;
    color: #1A1A2E !important;
}

/* ================================================================
   15. CATEGORY LINKS (post meta)
   ================================================================ */
.az-post-meta .cat-links a {
    border-color: #F0A500 !important;
    color: #F0A500 !important;
}

/* ── Slider prev/next arrows — must stay transparent ────── */
.slick-arrow,
.slick-prev,
.slick-next,
.slick-arrow:hover,
.slick-arrow:focus,
.slick-prev:hover,
.slick-next:hover {
    background-color: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

/* ================================================================
   16. ACCESSIBILITY — Contrast fixes (Lighthouse)
   ================================================================ */

/* Fix: site-description #999 fails contrast on light bg — change to #555 (7:1 ratio) */
.site-description {
    color: #555555 !important;
}

/* Fix: date/meta text #999 fails contrast — change to #666 (5.7:1 ratio on white) */
.posted-on a,
.comments-link a,
.entry-date,
.entry-meta a,
.widget-latest-posts .entry-header .entry-meta .posted-on a,
time.entry-date {
    color: #666666 !important;
}

/* Fix: nav HOME link on transparent header — ensure readable contrast */
.main-navigation .nav-menu > li > a,
.main-navigation .menu > li > a {
    color: #1A1A2E !important;
}

/* ================================================================
   17. ACCESSIBILITY — Touch targets (Lighthouse)
   ================================================================ */

/* Fix: Slick slider dots — minimum 44x44px touch target */
.slick-dots li button {
    width: 44px !important;
    height: 44px !important;
    padding: 10px !important;
}

.slick-dots li {
    width: 44px !important;
    height: 44px !important;
    margin: 0 2px !important;
}

/* Fix: Slick next/prev buttons — ensure minimum touch size */
.slick-prev,
.slick-next {
    width: 44px !important;
    height: 44px !important;
}