/*
 Theme Name:   Beacon Child Theme
 Theme URI:    https://beacon.themerex.net/
 Description:  Beacon Child Theme
 Author:       ThemeREX
 Author URI:   https://themerex.net/
 Template:     beacon
 Version:      2.0
 Tags:         flexible-header, custom-background, custom-colors, custom-header, custom-menu, featured-image-header, featured-images, full-width-template, microformats, post-formats, theme-options, threaded-comments, translation-ready
 Text Domain:  beacon
*/


/* =Theme customization starts here
------------------------------------------------------------ *
/* SUBMENU (dropdown) — make hover/active #702045 */
:root {
  /* extra help if the theme uses vars for menu accents */
  --theme-color-accent_link: #702045;
  --theme-color-accent_hover: #702045;
}

/* Text color on hover/active (desktop dropdown) */
.sc_layouts_menu_nav li li > a:hover,
.sc_layouts_menu_nav li li.sfHover > a,
.sc_layouts_menu_nav li li.current-menu-item > a,
.sc_layouts_menu_nav li li.current-menu-ancestor > a,
.scheme_dark .sc_layouts_menu_nav li li > a:hover,
.scheme_dark .sc_layouts_menu_nav li li.sfHover > a {
  color: #702045 !important;
}

/* The small gold underline/line some demos use */
.sc_layouts_menu_nav.menu_hover_line li li > a:after,
.sc_layouts_menu_nav.menu_hover_zoom_line li li > a:after,
.sc_layouts_menu_nav li li > a:after {
  background-color: #702045 !important;
  border-color: #702045 !important;   /* covers themes that use border for the line */
}

/* If the submenu items have a thin bottom border (divider), recolor it */
.sc_layouts_menu_nav li li > a {
  border-bottom-color: #702045 !important; /* harmless if none exists */
}

/* Top-level underline (for consistency) */
.sc_layouts_menu_nav.menu_hover_line > li > a:after,
.sc_layouts_menu_nav.menu_hover_zoom_line > li > a:after,
.sc_layouts_menu_nav > li > a:after {
  background-color: #702045 !important;
}

/* Mobile menu too */
.menu_mobile .menu_mobile_nav_area li > a:hover,
.menu_mobile .menu_mobile_nav_area li.current-menu-item > a {
  color: #702045 !important;
}
.menu_mobile .menu_mobile_nav_area li > a:after {
  background-color: #702045 !important;
}
/* Submenu item underline (for the line under each text in submenu) */
.sc_layouts_menu_nav li li > a:after,
.sc_layouts_menu_nav li li.sfHover > a:after,
.sc_layouts_menu_nav li li.current-menu-item > a:after {
  background-color: #702045 !important; /* Update the line color under each item */
  height: 2px !important; /* Adjust line height if needed */
}
/* SUBMENU UNDERLINE COLOR — Beacon / ThemeRex */
.sc_layouts_menu_popup .sc_layouts_menu_nav li li > a:after,
.sc_layouts_menu_popup .sc_layouts_menu_nav li li > a:before,
.sc_layouts_menu_nav.menu_hover_line li li > a:after,
.sc_layouts_menu_nav.menu_hover_zoom_line li li > a:after,
.sc_layouts_menu_nav.menu_hover_fade li li > a:after,
.sc_layouts_menu_nav.menu_hover_slide_line li li > a:after,
.scheme_dark .sc_layouts_menu_nav li li > a:after {
  background-color: #702045 !important;   /* the line color */
  border-color: #702045 !important;       /* some skins use border for the line */
}

/* If your skin draws a thin divider as a border on the link itself */
.sc_layouts_menu_popup .sc_layouts_menu_nav li li > a,
.scheme_dark .sc_layouts_menu_nav li li > a {
  border-bottom-color: #702045 !important;
}

/* Rare case: line is a child element inside <a> (ThemeRex variants) */
.sc_layouts_menu_popup .sc_layouts_menu_nav li li > a .sc_layouts_menu_item_line,
.sc_layouts_menu_nav li li > a .sc_layouts_menu_item_line {
  background-color: #702045 !important;
}
/* TOP NAV — make ALL top-level menu links white
   (normal, hover, current, sticky, dark/overlay headers) */
.sc_layouts_menu_nav > li > a,
.sc_layouts_menu_nav > li:hover > a,
.sc_layouts_menu_nav > li.sfHover > a,
.sc_layouts_menu_nav > li > a:hover,
.sc_layouts_menu_nav > li.current-menu-item > a,
.sc_layouts_menu_nav > li.current-menu-ancestor > a,
.scheme_dark .sc_layouts_menu_nav > li > a,
.scheme_dark .sc_layouts_menu_nav > li:hover > a,
.scheme_dark .sc_layouts_menu_nav > li > a:hover,
.sc_layouts_row_fixed .sc_layouts_menu_nav > li > a,
.sc_layouts_row_fixed .sc_layouts_menu_nav > li:hover > a,
.top_panel.with_bg_image .sc_layouts_menu_nav > li > a,
.header_fullwidth .sc_layouts_menu_nav > li > a {
  color: #fff !important;
}

/* Keep the hover/active UNDERLINE accent for top-level items */
.sc_layouts_menu_nav.menu_hover_line > li > a:after,
.sc_layouts_menu_nav.menu_hover_zoom_line > li > a:after,
.sc_layouts_menu_nav > li > a:after {
  background-color: #702045 !important;
}

/* Mobile menu too */
.menu_mobile .menu_mobile_nav_area li > a,
.menu_mobile .menu_mobile_nav_area li.current-menu-item > a,
.menu_mobile .menu_mobile_nav_area li > a:hover {
  color: #fff !important;
}
/* Remove the big title + paragraph in the mobile off-canvas menu */
.menu_mobile .menu_mobile_title,
.menu_mobile .menu_mobile_description,
.menu_mobile .sc_layouts_title,
.menu_mobile .sc_layouts_title_caption,
.menu_mobile .sc_layouts_title_description,
.menu_mobile .sc_layouts_panel_title,
.menu_mobile .sc_layouts_panel_description {
  display: none !important;
}

/* Pull content up a bit since we removed the header text */
.menu_mobile .menu_mobile_content { padding-top: 12px !important; }
/* Base color for links in the mobile menu */
.menu_mobile .menu_mobile_nav_area li > a { 
  color: #ffffff !important;
}

/* Hover / focus / open / current states = maroon */
.menu_mobile .menu_mobile_nav_area li > a:hover,
.menu_mobile .menu_mobile_nav_area li > a:focus,
.menu_mobile .menu_mobile_nav_area li.open > a,
.menu_mobile .menu_mobile_nav_area li.current-menu-item > a,
.menu_mobile .menu_mobile_nav_area li.current-menu-ancestor > a {
  color: #702045 !important;
}

/* Apply to nested submenu links too */
.menu_mobile .menu_mobile_nav_area li li > a {
  color: #ffffff !important;
}
.menu_mobile .menu_mobile_nav_area li li > a:hover,
.menu_mobile .menu_mobile_nav_area li li > a:focus,
.menu_mobile .menu_mobile_nav_area li li.open > a,
.menu_mobile .menu_mobile_nav_area li li.current-menu-item > a,
.menu_mobile .menu_mobile_nav_area li li.current-menu-ancestor > a {
  color: #702045 !important;
}

/* Underline effect like desktop (short line that appears on hover/focus/current) */
.menu_mobile .menu_mobile_nav_area li > a::after {
  content: "";
  display: block;
  width: 0;
  height: 2px;
  background: #702045;
  transition: width .2s ease;
  margin-top: 6px;
}
.menu_mobile .menu_mobile_nav_area li > a:hover::after,
.menu_mobile .menu_mobile_nav_area li > a:focus::after,
.menu_mobile .menu_mobile_nav_area li.open > a::after,
.menu_mobile .menu_mobile_nav_area li.current-menu-item > a::after,
.menu_mobile .menu_mobile_nav_area li.current-menu-ancestor > a::after {
  width: 28px;   /* adjust length if you want a longer line */
}

/* Do the same for submenu items */
.menu_mobile .menu_mobile_nav_area li li > a::after {
  content: "";
  display: block;
  width: 0;
  height: 2px;
  background: #702045;
  transition: width .2s ease;
  margin-top: 6px;
}
.menu_mobile .menu_mobile_nav_area li li > a:hover::after,
.menu_mobile .menu_mobile_nav_area li li > a:focus::after,
.menu_mobile .menu_mobile_nav_area li li.open > a::after,
.menu_mobile .menu_mobile_nav_area li li.current-menu-item > a::after,
.menu_mobile .menu_mobile_nav_area li li.current-menu-ancestor > a::after {
  width: 24px;
}
/* Hide logo inside ThemeRex fullscreen search overlay */
.search_style_fullscreen .search_header .logo_wrap,
.search_style_fullscreen .search_header .sc_layouts_logo,
.search_style_fullscreen .search_header .logo,
.search_style_fullscreen .search_header .logo_image,
.search_style_fullscreen .search_header .logo_text {
  display: none !important;
}

/* Tidy spacing after removing the logo */
.search_style_fullscreen .search_header {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}
.search_modern .search_header .logo_wrap,
.search_style_expand .search_header .logo_wrap { display: none !important; }
/* Remove logo block inside this popup */
#elementor-popup-modal-12345 .sc_layouts_logo,
#elementor-popup-modal-12345 .logo_wrap,
#elementor-popup-modal-12345 .elementor-widget-image,
#elementor-popup-modal-12345 .elementor-widget-site-logo {
  display: none !important;
}

/* Optional: pull the search field up a bit */
#elementor-popup-modal-12345 .elementor-widget-search-form { margin-top: 0 !important; }
.elementor-popup-modal .sc_layouts_logo,
.elementor-popup-modal .logo_wrap,
.elementor-popup-modal .elementor-widget-image,
.elementor-popup-modal .elementor-widget-site-logo {
  display: none !important;
}