/* ========================================================= MUVI / GARNET — CUSTOM OVERRIDES (CLEAN MASTER v2.1) (Your current file + additions; NO functionality removed.) ========================================================= */ /* ========================= Core variables ========================= */ :root{ --brand: #3fb499; /* Used by header shrink block */ --logo-h-normal: 62px; --logo-h-shrink: 40px; /* Used by avatar/pagination/site-wide accent blocks */ --icr-brand:#3fb499; --icr-accent: #3FB499; --icr-accent-hover: #359F87; /* Muvi “primary” variables used across templates */ --iq-primary: var(--icr-accent) !important; --iq-primary-hover: var(--icr-accent-hover) !important; --iq-primary-dark: var(--icr-accent-hover) !important; } /* ===== FREE badge ===== */ .free, .free-label, .free-tag, .freeContent-tag, [class*="free"], [class*="Free"]{ background-color: var(--brand) !important; border-color: var(--brand) !important; color: #fff !important; } .free span, .free-label span, .free-tag span, .freeContent-tag span, [class*="free"] span, [class*="Free"] span{ color: #fff !important; } /* ===== PLAY / PLAY ALL buttons ===== */ .play-now, .play-all, .btn-primary, .muvi-btn, a.callByAjax.ctaBtnwatch, a[class*="play"], button[class*="play"], a[class*="Play"], button[class*="Play"]{ background-color: var(--brand) !important; background-image: none !important; border-color: var(--brand) !important; color: #fff !important; text-decoration: none !important; } .play-now *, .play-all *, .btn-primary *, .muvi-btn *, a.callByAjax.ctaBtnwatch *{ color: #fff !important; } .play-now:hover, .play-all:hover, .btn-primary:hover, .muvi-btn:hover, a.callByAjax.ctaBtnwatch:hover, .play-now:focus, .play-all:focus, .btn-primary:focus, .muvi-btn:focus, a.callByAjax.ctaBtnwatch:focus{ background-color: var(--brand) !important; border-color: var(--brand) !important; color: #fff !important; } /* ===== SEE ALL (text white -> brand on hover) + arrow brand ===== */ /* Arrow: only when inside a LINK () */ a svg path[fill="#bf000a"], a svg path[stroke="#bf000a"], a svg path[fill="#BF000A"], a svg path[stroke="#BF000A"]{ fill: var(--brand) !important; stroke: var(--brand) !important; } /* Text for links that contain that hard-coded arrow (modern browsers) */ a:has(svg path[fill="#bf000a"]), a:has(svg path[stroke="#bf000a"]), a:has(svg path[fill="#BF000A"]), a:has(svg path[stroke="#BF000A"]){ color: #fff !important; text-decoration: none !important; } a:has(svg path[fill="#bf000a"]):hover, a:has(svg path[stroke="#bf000a"]):hover, a:has(svg path[fill="#BF000A"]):hover, a:has(svg path[stroke="#BF000A"]):hover{ color: var(--brand) !important; } /* Fallback if :has() is not supported + for classed See All wrappers */ .seeAll a, .see-all a, .viewAll a, .view-all a, a.seeAll, a.see-all, a.viewAll, a.view-all{ color: #fff !important; text-decoration: none !important; } .seeAll a:hover, .see-all a:hover, .viewAll a:hover, .view-all a:hover, a.seeAll:hover, a.see-all:hover, a.viewAll:hover, a.view-all:hover{ color: var(--brand) !important; } /* ===== NAV active item ===== */ a.nav-link.activeClass{ color: var(--brand) !important; border-bottom-color: var(--brand) !important; box-shadow: inset 0 -2px 0 var(--brand) !important; } a.nav-link.activeClass::after{ background-color: var(--brand) !important; border-color: var(--brand) !important; } /* ===== NAV dropdown caret (submenuOpen) ===== */ svg.submenuOpen path, svg.submenuOpen path[stroke]{ stroke: var(--brand) !important; } /* ===== TOP NAV dropdown (e.g., Podcasts) ===== */ a.nav-link.menuSubmenu{ color: #fff !important; } a.nav-link.menuSubmenu:hover, a.nav-link.menuSubmenu:focus{ color: var(--brand) !important; border-bottom-color: transparent !important; box-shadow: none !important; } li.show > a.nav-link.menuSubmenu, li.open > a.nav-link.menuSubmenu, .dropdown.show > a.nav-link.menuSubmenu{ color: var(--brand) !important; border-bottom-color: var(--brand) !important; box-shadow: inset 0 -2px 0 var(--brand) !important; } li.show > a.nav-link.menuSubmenu::after, li.open > a.nav-link.menuSubmenu::after, .dropdown.show > a.nav-link.menuSubmenu::after{ background-color: var(--brand) !important; border-color: var(--brand) !important; } /* ===== DETAIL PAGE HERO (NO STRETCH / NO SQUISH) ===== */ .details-banner, .contentDetails .banner, .content-detail .banner{ position: relative !important; overflow: hidden !important; aspect-ratio: 21 / 9 !important; min-height: 280px !important; max-height: 560px !important; height: auto !important; background-repeat: no-repeat !important; background-position: center center !important; background-size: cover !important; } .details-banner img, .details-banner video, .contentDetails .banner img, .contentDetails .banner video, .content-detail .banner img, .content-detail .banner video{ position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center center !important; display: block !important; } @media (max-width: 1100px){ .details-banner, .contentDetails .banner, .content-detail .banner{ aspect-ratio: 16 / 9 !important; min-height: 260px !important; max-height: 520px !important; background-position: center top !important; } .details-banner img, .details-banner video, .contentDetails .banner img, .contentDetails .banner video, .content-detail .banner img, .content-detail .banner video{ object-position: center top !important; } } @media (max-width: 768px){ .details-banner, .contentDetails .banner, .content-detail .banner{ aspect-ratio: 4 / 3 !important; min-height: 240px !important; max-height: 420px !important; } } /* ========================================================= SEE ALL — ARROW TURNED RED AGAIN (STRONG OVERRIDE v3.1) FIXED: removed global a:hover svg path (too broad) ========================================================= */ /* If your See All wrapper uses any of these common classes */ .seeAll svg, .seeAll svg *, .see-all svg, .see-all svg *, .viewAll svg, .viewAll svg *, .view-all svg, .view-all svg *, a.seeAll svg, a.seeAll svg *, a.see-all svg, a.see-all svg *, a.viewAll svg, a.viewAll svg *, a.view-all svg, a.view-all svg *{ fill: var(--brand) !important; stroke: var(--brand) !important; } /* If the arrow is hard-coded red */ .seeAll a svg path[fill="#bf000a"], .seeAll a svg path[stroke="#bf000a"], .see-all a svg path[fill="#bf000a"], .see-all a svg path[stroke="#bf000a"], .viewAll a svg path[fill="#bf000a"], .viewAll a svg path[stroke="#bf000a"], .view-all a svg path[fill="#bf000a"], .view-all a svg path[stroke="#bf000a"], .seeAll a svg path[fill="#BF000A"], .seeAll a svg path[stroke="#BF000A"], .see-all a svg path[fill="#BF000A"], .see-all a svg path[stroke="#BF000A"], .viewAll a svg path[fill="#BF000A"], .viewAll a svg path[stroke="#BF000A"], .view-all a svg path[fill="#BF000A"], .view-all a svg path[stroke="#BF000A"]{ fill: var(--brand) !important; stroke: var(--brand) !important; } /* Scoped hover override ONLY for See All / View All */ .seeAll a:hover svg path, .seeAll a:focus svg path, .see-all a:hover svg path, .see-all a:focus svg path, .viewAll a:hover svg path, .viewAll a:focus svg path, .view-all a:hover svg path, .view-all a:focus svg path, a.seeAll:hover svg path, a.seeAll:focus svg path, a.see-all:hover svg path, a.see-all:focus svg path, a.viewAll:hover svg path, a.viewAll:focus svg path, a.view-all:hover svg path, a.view-all:focus svg path{ fill: var(--brand) !important; stroke: var(--brand) !important; } /* If the SVG uses currentColor, make sure the arrow still stays brand */ .seeAll a svg, .seeAll a svg *, .see-all a svg, .see-all a svg *, .viewAll a svg, .viewAll a svg *, .view-all a svg, .view-all a svg *{ color: var(--brand) !important; fill: var(--brand) !important; stroke: var(--brand) !important; } /* ========================================================= HEADER SHRINK FIX — LOGO STAYS INSIDE COLLAPSED HEADER ========================================================= */ header, .navbar, .site-header, .header, .vd_header, .vdHeader, #header{ transition: padding 160ms ease, height 160ms ease, min-height 160ms ease; } /* Default logo sizing (pre-scroll) */ header img, header .logo img, header .navbar-brand img, header a.navbar-brand img, header a.logo img, #header img, #header .logo img, .navbar-brand img{ height: var(--logo-h-normal) !important; width: auto !important; max-height: var(--logo-h-normal) !important; object-fit: contain !important; display: block !important; } /* Keep logo from overflowing its container */ header .logo, header .navbar-brand, #header .logo, #header .navbar-brand, .navbar-brand{ display: flex !important; align-items: center !important; overflow: hidden !important; } /* Shrunk header states */ header.sticky img, header.is-sticky img, header.header-sticky img, header.shrink img, header.small-header img, header.fixed img, header.sticky .navbar-brand img, header.is-sticky .navbar-brand img, header.header-sticky .navbar-brand img, header.shrink .navbar-brand img, header.small-header .navbar-brand img, header.fixed .navbar-brand img, .navbar.fixed-top img, .navbar.sticky-top img, .navbar.is-sticky img, .navbar.shrink img, .navbar.small-header img, body.scrolled header img, body.sticky header img, body.header-fixed header img, html.scrolled header img{ height: var(--logo-h-shrink) !important; max-height: var(--logo-h-shrink) !important; } /* Safety: ensure centering in shrink states */ header.sticky, header.is-sticky, header.header-sticky, header.shrink, header.small-header, .navbar.fixed-top, .navbar.sticky-top, body.scrolled header{ display: flex; align-items: center; } /* ========================================================= OTHER RED BUTTONS (DETAIL / POST-HOME PAGES) ========================================================= */ .btn-danger, .btn-red, .btn-theme, .theme-btn, .redBtn, a.btn-danger, button.btn-danger, a.btn-red, button.btn-red{ background-color: var(--brand) !important; border-color: var(--brand) !important; background-image: none !important; color: #fff !important; text-decoration: none !important; } .btn-danger:hover, .btn-red:hover, .btn-theme:hover, .theme-btn:hover, .redBtn:hover, .btn-danger:focus, .btn-red:focus, .btn-theme:focus, .theme-btn:focus, .redBtn:focus{ background-color: var(--brand) !important; border-color: var(--brand) !important; color: #fff !important; } /* If Muvi sets the red via inline styles or hard-coded values */ button[style*="#bf000a"], a[style*="#bf000a"], button[style*="#BF000A"], a[style*="#BF000A"], button[style*="rgb(191, 0, 10)"], a[style*="rgb(191, 0, 10)"]{ background-color: var(--brand) !important; border-color: var(--brand) !important; background-image: none !important; color: #fff !important; } /* Catch inline background/border set to theme red */ *[style*="background:#bf000a"], *[style*="background: #bf000a"], *[style*="background-color:#bf000a"], *[style*="background-color: #bf000a"], *[style*="background:#BF000A"], *[style*="background: #BF000A"], *[style*="background-color:#BF000A"], *[style*="background-color: #BF000A"], *[style*="border-color:#bf000a"], *[style*="border-color: #bf000a"], *[style*="border-color:#BF000A"], *[style*="border-color: #BF000A"]{ background-color: var(--brand) !important; border-color: var(--brand) !important; } /* If the red is applied to pseudo elements */ .btn-danger::before, .btn-danger::after, .btn-red::before, .btn-red::after, .btn-theme::before, .btn-theme::after, .theme-btn::before, .theme-btn::after{ background-color: var(--brand) !important; border-color: var(--brand) !important; } /* ========================================================= BUTTONS: Force ALL primary/action buttons to brand color ========================================================= */ a.button, a.button.watch-now, a.button.watch-now:link, a.button.watch-now:visited{ background-color: var(--brand) !important; border-color: var(--brand) !important; background-image: none !important; color: #fff !important; text-decoration: none !important; } a[vd-node="dynButton"], a[vd-node="button"], a[vd-node="dynButton"]:link, a[vd-node="button"]:link, a[vd-node="dynButton"]:visited, a[vd-node="button"]:visited{ background-color: var(--brand) !important; border-color: var(--brand) !important; background-image: none !important; color: #fff !important; text-decoration: none !important; display: inline-flex; align-items: center; gap: 10px; } a.button i, a[vd-node="dynButton"] i, a[vd-node="button"] i{ color: #fff !important; } a.button:hover, a.button:focus, a.button:active, a[vd-node="dynButton"]:hover, a[vd-node="dynButton"]:focus, a[vd-node="dynButton"]:active, a[vd-node="button"]:hover, a[vd-node="button"]:focus, a[vd-node="button"]:active{ background-color: var(--brand) !important; border-color: var(--brand) !important; color: #fff !important; text-decoration: none !important; } a.button::before, a.button::after, a[vd-node="dynButton"]::before, a[vd-node="dynButton"]::after, a[vd-node="button"]::before, a[vd-node="button"]::after{ background-color: var(--brand) !important; border-color: var(--brand) !important; } /* ========================================================= Tooltips + "Add to Favorites" visual replacement ========================================================= */ .tooltip .tooltip-inner{ background-color: var(--brand) !important; color: #fff !important; } /* Bootstrap 4 arrows */ .bs-tooltip-top .arrow::before, .bs-tooltip-bottom .arrow::before, .bs-tooltip-left .arrow::before, .bs-tooltip-right .arrow::before, .tooltip.bs-tooltip-top .arrow::before, .tooltip.bs-tooltip-bottom .arrow::before, .tooltip.bs-tooltip-left .arrow::before, .tooltip.bs-tooltip-right .arrow::before{ border-top-color: var(--brand) !important; border-bottom-color: var(--brand) !important; border-left-color: var(--brand) !important; border-right-color: var(--brand) !important; } /* Bootstrap 5 arrow */ .tooltip .tooltip-arrow::before{ border-top-color: var(--brand) !important; border-bottom-color: var(--brand) !important; border-left-color: var(--brand) !important; border-right-color: var(--brand) !important; } /* Simple tooltip container fallback */ .add-to-favourite, .add-to-favorite, .favourite-tooltip, .favorite-tooltip, [class*="favour"] .tooltip-inner, [class*="favor"] .tooltip-inner{ background-color: var(--brand) !important; color: #fff !important; } /* Popover fallback */ .popover, .popover .popover-body, .popover .popover-header{ border-color: var(--brand) !important; } .popover .popover-header{ background-color: var(--brand) !important; color: #fff !important; } .popover .popover-body{ background-color: var(--brand) !important; color: #fff !important; } .popover .arrow::before, .popover .arrow::after{ border-top-color: var(--brand) !important; border-bottom-color: var(--brand) !important; border-left-color: var(--brand) !important; border-right-color: var(--brand) !important; } /* Visual text replace */ .tooltip .tooltip-inner{ font-size: 0 !important; line-height: 0 !important; } .tooltip .tooltip-inner::before{ content: "Add to Favorites"; font-size: 14px; line-height: 1.2; color: #fff; display: inline-block; } /* ========================================================= Header Avatar Fix (top-right) ========================================================= */ #navbar, header#navbar{ line-height: normal; } #navbar .profileImages, #navbar img.profileImages, #navbar img[alt="Profile Image"], #navbar .mpmb-profile-img{ width: 68px !important; height: 68px !important; min-width: 68px !important; min-height: 68px !important; max-width: 68px !important; max-height: 68px !important; border-radius: 50% !important; } /* Remove legacy ring */ #navbar img.profileImages{ outline: none !important; box-shadow: none !important; background-color: transparent !important; } /* Wrapper nukes */ #navbar .profileImg, #navbar .profile-img, #navbar .profile-img-wrapper, #navbar .profileImage, #navbar .profile-image, #navbar .userProfile, #navbar .user-profile, #navbar .userprofile, #navbar .profileDropdown, #navbar .profile-dropdown{ border: none !important; background: transparent !important; box-shadow: none !important; outline: none !important; } /* Ensure clean fill */ #navbar img.profileImages, #navbar img[alt="Profile Image"], #navbar .mpmb-profile-img{ display: block !important; object-fit: cover !important; object-position: center center !important; margin: 0 !important; padding: 0 !important; background: transparent !important; border: 3px solid var(--icr-brand) !important; box-sizing: border-box !important; position: relative !important; top: 0 !important; transform: none !important; vertical-align: middle !important; } /* Center if inside a link/button */ #navbar a, #navbar button{ align-items: center; } /* Chrome :has() wrapper cleanup */ #navbar a:has(img.profileImages), #navbar button:has(img.profileImages), #navbar div:has(img.profileImages), #navbar span:has(img.profileImages){ border: none !important; outline: none !important; box-shadow: none !important; background: transparent !important; } #navbar a:has(img.profileImages)::before, #navbar a:has(img.profileImages)::after, #navbar button:has(img.profileImages)::before, #navbar button:has(img.profileImages)::after, #navbar div:has(img.profileImages)::before, #navbar div:has(img.profileImages)::after, #navbar span:has(img.profileImages)::before, #navbar span:has(img.profileImages)::after{ content: none !important; border: none !important; outline: none !important; box-shadow: none !important; background: transparent !important; } /* ========================================================= Banner / Carousel pagination dots -> green ========================================================= */ .carousel-indicators li, .carousel-indicators [data-bs-target], .carousel-indicators button{ background-color: var(--icr-accent) !important; border-color: var(--icr-accent) !important; } .carousel-indicators .active, .carousel-indicators li.active, .carousel-indicators button.active{ background-color: #fff !important; border-color: #fff !important; } .owl-dots .owl-dot span{ background: var(--icr-accent) !important; } .owl-dots .owl-dot.active span, .owl-dots .owl-dot:hover span{ background: #fff !important; } .slick-dots li button:before{ color: var(--icr-accent) !important; opacity: 1 !important; } .slick-dots li.slick-active button:before{ color: #fff !important; } .swiper-pagination-bullet{ background: var(--icr-accent) !important; opacity: 1 !important; } .swiper-pagination-bullet-active{ background: #fff !important; } .tns-nav > button{ background: var(--icr-accent) !important; } .tns-nav > button.tns-nav-active{ background: #fff !important; } .glide__bullet{ background-color: var(--icr-accent) !important; border-color: var(--icr-accent) !important; } .glide__bullet--active{ background-color: #fff !important; border-color: #fff !important; } /* ========================================================= SITE-WIDE ACCENT OVERRIDE (force green, kill Muvi red) ========================================================= */ button.btn-hover, a.btn-hover, .btn.btn-hover, button.btn-primary, a.btn-primary, .btn.btn-primary, button.primary-button, a.primary-button{ background: var(--iq-primary-hover) !important; border-color: var(--iq-primary-hover) !important; color:#fff !important; background-image:none !important; } .btn-hover:before{ background: var(--iq-primary) !important; border-color: var(--iq-primary) !important; } button.btn-hover:hover, a.btn-hover:hover, .btn.btn-hover:hover, button.btn-primary:hover, a.btn-primary:hover, .btn.btn-primary:hover, button.primary-button:hover, a.primary-button:hover{ background: var(--iq-primary-dark) !important; border-color: var(--iq-primary-dark) !important; color:#fff !important; } .text-primary{ color: var(--icr-accent) !important; } .border-primary{ border-color: var(--icr-accent) !important; } .bg-primary{ background-color: var(--icr-accent) !important; } /* Profile/settings left-nav */ .m-profile .widget-area .widget ul li a, .widget-area .widget ul li a{ text-decoration: none !important; } .m-profile .widget-area .widget ul li a.active, .widget-area .widget ul li a.active{ color: var(--icr-accent) !important; border-bottom: 1px solid var(--icr-accent) !important; text-decoration: none !important; } /* ========================================================= Category “See All” page tile sizing (#see-allCategory) ========================================================= */ #see-allCategory #categoryContentList{ display:flex !important; flex-wrap:wrap !important; align-items:flex-start !important; gap: 22px 18px !important; margin-left: 0 !important; margin-right: 0 !important; } #see-allCategory #categoryContentList > div{ padding-left: 0 !important; padding-right: 0 !important; } #see-allCategory .see-all .item{ margin-left: 0 !important; margin-bottom: 0 !important; height: auto !important; border-radius: 12px; overflow: hidden; } #see-allCategory .see-all .item .picture{ width: 100%; aspect-ratio: 2 / 3; height: auto !important; border-radius: 12px; overflow: hidden; } #see-allCategory .see-all .item .picture img{ width: 100% !important; height: 100% !important; object-fit: cover !important; border-radius: 12px !important; display:block; } @media (min-width: 992px){ #see-allCategory #categoryContentList > div{ flex: 0 0 220px !important; max-width: 220px !important; } } @media (min-width: 1400px){ #see-allCategory #categoryContentList > div{ flex: 0 0 240px !important; max-width: 240px !important; } } @media (min-width: 768px) and (max-width: 991.98px){ #see-allCategory #categoryContentList > div{ flex: 0 0 200px !important; max-width: 200px !important; } } @media (max-width: 767.98px){ #see-allCategory #categoryContentList{ gap: 14px 12px !important; } #see-allCategory #categoryContentList > div{ flex: 0 0 calc(50% - 6px) !important; max-width: calc(50% - 6px) !important; } } /* ========================================================= HEADER + PROFILE MENU HOVER COLORS (green) ========================================================= */ #navbar .header .navbar-nav .nav-link:hover, #navbar .header .navbar-nav .nav-link:focus, #navbar .phoenix-nav-dropdown .btn-navigation:hover a.nav-link, #navbar .phoenix-nav-dropdown .btn-navigation:hover button, #navbar .phoenix-nav-dropdown .btn-navigation.show .dropdown-toggle:focus{ color: var(--brand) !important; } #navbar .garnetMenu .gmItems a:hover, #navbar .garnetMenu .gmItems a:focus{ background: linear-gradient(270deg, rgba(255,255,255,0), rgba(63,180,153,0.30)) !important; border-left: 2px solid var(--brand) !important; color: #000 !important; } #navbar .garnet-nav-dropdown .garnetMenu .gmItems a:hover, #navbar .garnet-nav-dropdown .garnetMenu .gmItems a:focus{ color: var(--brand) !important; } /* ========================================================= TILE TITLE HOVER + FAVORITES HEART OVERRIDES (restored) ========================================================= */ .tiles:hover .data span, .tiles:hover .data a:hover span, .tiles:hover .data .content-name-div a:hover span{ color: var(--brand) !important; } /* Any FontAwesome heart icons */ i.fa-heart, i[class*="fa-heart"], .fa-heart{ color: var(--brand) !important; } /* Muvi favourite button */ .like-heart .ulike_btn, .product-like-option .ulike_btn, .addto-favorites .ulike_btn, .fav-heart-btn, .fav-heart-btn i{ color: var(--brand) !important; background-image: none !important; position: relative; } /* Outline heart default */ .like-heart .ulike_btn::before, .product-like-option .ulike_btn::before, .addto-favorites .ulike_btn::before{ content: "\f08a" !important; /* fa-heart-o (FA 4.7) */ font-family: FontAwesome !important; font-size: 18px; line-height: 1; color: var(--brand) !important; } /* Solid heart when liked */ .like-heart .ulike_is_liked .ulike_btn::before, .like-heart .ulike_btn.liked::before, .like-heart .ulike_btn.like-image::before, .product-like-option .ulike_is_liked .ulike_btn::before, .product-like-option .ulike_btn.liked::before, .product-like-option .ulike_btn.like-image::before, .addto-favorites .ulike_is_liked .ulike_btn::before, .addto-favorites .ulike_btn.liked::before, .addto-favorites .ulike_btn.like-image::before{ content: "\f004" !important; /* fa-heart (FA 4.7) */ } /* Inline-selected hearts hard-coded to #f4181c -> brand */ a.addto-favorites svg path[style*="fill:#f4181c"], a.addto-favorites svg path[style*="fill: #f4181c"], a.addto-favorites svg path[style*="fill:#F4181C"], a.addto-favorites svg path[style*="fill: #F4181C"], a.svg-stroke svg path[style*="fill:#f4181c"], a.svg-stroke svg path[style*="fill: #f4181c"], a.svg-stroke svg path[style*="fill:#F4181C"], a.svg-stroke svg path[style*="fill: #F4181C"]{ fill: var(--brand) !important; stroke: var(--brand) !important; } /* Hover state */ .ctaBtnadd:hover svg path{ stroke: var(--brand) !important; fill: var(--brand) !important; fill-opacity: 1 !important; } /* Selected/favorited state (solid fill) */ a.ctaBtnadd.addto-favorites[style*="background"] svg path, a.svg-stroke[style*="background"] svg path{ stroke: var(--brand) !important; fill: var(--brand) !important; fill-opacity: 1 !important; } /* ========================================================= Empty state ("Missing Links") sizing + spacing (restored) ========================================================= */ .icr-empty-state{ padding: 28px 12px; } .icr-empty-state img[src*="no-result.gif"]{ display: block; width: 100%; max-width: 660px !important; height: auto !important; margin: 0 auto 14px; } .icr-empty-state h2{ margin: 0 auto; max-width: 980px; padding: 0 10px; line-height: 1.25; word-break: break-word; } /* Category pages: center the empty state and allow larger art */ body.icr-page-category .icr-empty-state{ min-height: calc(100vh - 220px); display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 40px 16px; } body.icr-page-category .icr-empty-state img[src*="no-result.gif"]{ max-width: 860px !important; margin-bottom: 18px; } body.icr-page-category .icr-empty-state h2{ text-align: center; } /* ========================================================= Home hero audio/mute button hidden (restored) (JS tags .icr-hide-hero-audio + adds body classes) ========================================================= */ body.icr-page-home .icr-hide-hero-audio, body.icr-page-posthome .icr-hide-hero-audio{ display: none !important; visibility: hidden !important; pointer-events: none !important; } /* ========================================================= FOOTER SOCIAL HOVER (bulletproof) - Works whether footer is