/*
Theme Name:  Hello Elementor Child
Template: 	 hello-elementor
Theme URI:	 https://wordpress.org/themes/hello-elementor/
Author:		 Atlas - TravelNet Solutions
Author URI:	 https://tnsinc.com/
Version:	 1.0.0
License:	 GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags:    	 opensource     
Text Domain: helloelementorchild
*/

:root {
  --aw-blue: #034D79;
  --aw-cream-footer: #FFFAF2;
  --aw-cream-news: #FEF5DF;
  --aw-text-dark: #4D3F3D;
  --aw-text-muted: #706462;
  --aw-border: #D8CFC4;
  --aw-font-serif: 'Trirong', Georgia, serif;
  --aw-font-sans: 'Lato', Arial, sans-serif;
}

/* =========================================================================
   HEADER
   ========================================================================= */


.desk-header .elementor-nav-menu:after {
  display: none !important;
}

.aw-site-header {
  transition: box-shadow .25s ease, background-color .25s ease;
}

.aw-header-top-row .elementor-column {
  display: flex;
  align-items: center;
}

/* Logo */
.aw-header-top-row .elementor-widget-theme-site-logo img {
  max-width: 230px;
  height: auto;
  transition: max-width .25s ease;
}

/* Mob off-canvas */
body .menu-off-canvas {
  width: 100% !important;
}
body .icon-mob-menu svg {
  height: 32px !important;
  width: 32px !important;
  font-size: 32px !important;
}
body .menu-off-canvas ul.elementor-nav-menu li.menu-item ul.sub-menu {
  position: relative !important;
  margin: 0 !important
}
body .menu-off-canvas ul.elementor-nav-menu li.menu-item ul.sub-menu li a {
  font-size: 18px !important;
}

/* Book Now button */
.aw-btn-book-now .elementor-button {
  transition: background-color .2s ease, color .2s ease;
}

.aw-btn-book-now .elementor-button:hover,
.aw-btn-book-now .elementor-button:focus {
  background-color: #ffffff !important;
  color: var(--aw-blue) !important;
}

/* Primary nav row */
.aw-header-nav-row {
  position: relative;
}

/* .aw-primary-nav {
  width: 100%;
} */

.aw-primary-nav .elementor-nav-menu {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  list-style: none;
}

.aw-primary-nav .elementor-nav-menu>li>a,
.aw-primary-nav .elementor-nav-menu .elementor-item {
  color: var(--aw-blue);
  font-family: var(--aw-font-serif);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 2px;
  padding: 0 !important;
  position: relative;
  text-decoration: none;
}

.aw-primary-nav .elementor-nav-menu>li>ul.sub-menu {
  padding: 16px 40px;
}

.aw-primary-nav .elementor-nav-menu>li>a:hover,
.aw-primary-nav .elementor-nav-menu .elementor-item:hover,
.aw-primary-nav .elementor-nav-menu .elementor-item.elementor-item-active {
  color: var(--aw-blue);
}

.aw-primary-nav .elementor-nav-menu>li>a::after,
.aw-primary-nav .elementor-nav-menu .elementor-item::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0px;
  height: 2px;
  background: var(--aw-blue);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .2s ease;
}

.aw-primary-nav .elementor-nav-menu>li:hover>a::after,
.aw-primary-nav .elementor-nav-menu .elementor-item:hover::after {
  transform: scaleX(1);
}

/* Dropdown submenus (Resort / Rooms & Suites) — the live site shows
   these as a full-width horizontal bar directly under the main nav
   row (not a small vertical card). Getting an element to truly span
   edge-to-edge here turned out to need JS (see
   aston-whaler-header-footer.js → initFullWidthDropdowns): one of
   Elementor's own wrapper elements is a position:fixed row that is
   itself shifted with a CSS transform for its own centering, which
   silently hijacks a plain CSS "left:0;width:100%" on any fixed/
   absolute child placed inside it. The JS measures the real on-screen
   result with getBoundingClientRect() and corrects for that offset,
   so it keeps working regardless of exactly how Elementor nests things.
   This CSS only handles the *appearance* — position/left/top are set
   inline by the script, and visibility is toggled via ".aw-open". */
.aw-primary-nav .elementor-nav-menu>li>ul.sub-menu {
  /* position/left/top/width are set inline by the JS on open */
  margin: 0;
  min-width: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 8px 44px;
  padding: 16px 40px;
  background-color: #ffffff;
/*   box-shadow: 0 10px 24px rgba(0, 0, 0, .15); */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s ease, visibility .18s;
  z-index: 20;
}

.aw-primary-nav .elementor-nav-menu>li>ul.sub-menu.aw-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.aw-primary-nav .elementor-nav-menu ul.sub-menu li {
  list-style: none;
}

.aw-primary-nav .elementor-nav-menu ul.sub-menu a {
  display: block;
  padding: 4px 0;
  color: #ffffff;
  font-family: var(--aw-font-serif);
  font-size: 17px;
  font-weight: 500;
  letter-spacing: .3px;
  white-space: nowrap;
  text-decoration: none;
}

.aw-primary-nav .elementor-nav-menu ul.sub-menu a:hover {
  text-decoration: underline;
}

/* Remove Elementor's default dropdown caret/arrow — not present in the
   original design. */
.aw-primary-nav .sub-arrow {
  display: none !important;
}

/* On mobile the menu collapses into Elementor's own vertical
   accordion list (".elementor-nav-menu--dropdown", styled below,
   which reuses the same "ul.sub-menu" markup for its nested items).
   The JS above only binds hover/focus handlers that a touch tap
   won't normally trigger, but as a safety net this also makes sure
   the full-width bar behavior never applies in mobile-accordion
   mode, without ever touching the mobile accordion's own sub-menus. */
@media (max-width: 1024px) {
  .aw-primary-nav .elementor-nav-menu:not(.elementor-nav-menu--dropdown)>li>ul.sub-menu {
    display: none !important;
  }
}

/* Mobile hamburger / dropdown toggle */
.aw-primary-nav .elementor-menu-toggle {
  color: var(--aw-blue);
  font-size: 28px;
}

.aw-primary-nav .elementor-nav-menu--dropdown {
  background: #ffffff;
}

.aw-primary-nav .elementor-nav-menu--dropdown .elementor-item {
  padding: 14px 24px;
  border-bottom: 1px solid #EFEAE2;
}

/* Responsive: tablet / mobile — collapse to hamburger to match the
   original site's 768px breakpoint */

@media (max-width: 1080px) {
  .aw-primary-nav ul.elementor-nav-menu li.menu-item a.elementor-item {
    font-size: 16px;
  }
}
@media (max-width: 1024px) {
  .aw-header-top-row {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  .aw-header-nav-row {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}

@media (max-width: 767px) {
  .aw-header-top-row .elementor-widget-theme-site-logo img {
    max-width: 170px;
  }

  .aw-btn-book-now .elementor-button {
    padding: 12px 18px !important;
    font-size: 11px !important;
  }
}

/* =========================================================================
   FOOTER
   ========================================================================= */

/* Newsletter band */
.aw-footer-newsletter h2 {
  font-family: var(--aw-font-serif);
  font-weight: 300;
}

.aw-footer-newsletter .elementor-button {
  transition: background-color .2s ease, color .2s ease;
}

.aw-footer-newsletter .elementor-button:hover,
.aw-footer-newsletter .elementor-button:focus {
  background-color: #ffffff !important;
  color: var(--aw-blue) !important;
}

@media (max-width: 767px) {
  .aw-footer-newsletter h2 {
    font-size: 34px !important;
  }
}

/* Main info band */
.aw-footer-main a {
  color: var(--aw-blue);
  text-decoration: underline;
}

.aw-footer-main a:hover {
  color: var(--aw-text-dark);
}

.aw-footer-main .elementor-column {
  display: flex;
  flex-direction: column;
}

@media (max-width: 1024px) {
  .aw-footer-main .elementor-column {
    width: 50% !important;
    margin-bottom: 32px;
  }
}

@media (max-width: 600px) {
  .aw-footer-main .elementor-column {
    width: 100% !important;
    text-align: center;
  }

  .aw-footer-main .elementor-widget-image {
    margin: 0 auto 20px;
  }
}

/* Legal / copyright bar */
.aw-footer-legal {
  font-family: var(--aw-font-sans);
}

.aw-legal-links {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 18px;
  justify-content: center;
  margin: 0;
}

.aw-legal-links a {
  color: var(--aw-blue);
  text-decoration: underline;
  white-space: nowrap;
}

.aw-legal-links a:hover {
  color: var(--aw-text-dark);
}

.aw-footer-legal .elementor-widget-social-icons a {
  color: var(--aw-text-dark) !important;
  background-color: transparent !important;
  border: 1px solid var(--aw-text-dark);
  transition: background-color .2s ease, color .2s ease;
}

.aw-footer-legal .elementor-widget-social-icons a:hover {
  background-color: var(--aw-blue) !important;
  border-color: var(--aw-blue);
  color: #ffffff !important;
}

@media (max-width: 767px) {
  .aw-footer-legal .elementor-column {
    width: 100% !important;
    text-align: center !important;
    justify-content: center !important;
    margin-bottom: 14px;
  }

  .aw-footer-legal .elementor-widget-social-icons .elementor-social-icons-wrapper {
    justify-content: center !important;
  }
}
