/**
Theme Name: Astra Child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/

/* iPad PORTRAIT: stop site title ("Släkten Heilborn") flashing as vertical letters */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
  and (orientation: portrait) {

  /* The site title text */
  .site-title,
  .site-title a {
    white-space: nowrap !important;
  }

  /* Prevent the branding area from collapsing to a tiny width */
  .site-branding,
  .ast-site-identity,
  .ast-site-title-wrap {
    flex: 0 0 auto !important;
    min-width: max-content !important;
  }
}

@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
  and (orientation: portrait) {

  .main-header-bar,
  .ast-primary-header-bar,
  .site-branding,
  .ast-site-identity {
    transition: none !important;
  }
}




/* =====================================================
   iPad PORTRAIT – prevent header snapping flush-left
   ===================================================== */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
  and (orientation: portrait) {

  /* Lock the header container width immediately */
  .ast-primary-header-bar,
  .main-header-bar {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Force consistent inner padding so it never renders at 0px */
  .ast-primary-header-bar .ast-container,
  .main-header-bar .ast-container {
    padding-left: 16px !important;
    padding-right: 16px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  /* Stop Astra transitions from exaggerating the shift */
  .ast-primary-header-bar,
  .main-header-bar,
  .ast-container {
    transition: none !important;
  }
}

/* iPad portrait: hide unstable areas during reload to prevent left/right + up/down jitter */
html.ipad-preload-hide .ast-site-header,
html.ipad-preload-hide .entry-header {
  visibility: hidden !important;
}





/* 1) Make the off-canvas content area stand out */
.ast-mobile-popup-content,
.ast-mobile-popup-inner,
.ast-builder-menu-mobile {
  background: #ffffff !important;
  box-shadow: 0 0 30px rgba(0,0,0,.35) !important;
  border-left: 1px solid rgba(0,0,0,.15) !important;
}

/* 2) Make the overlay darker (background behind the menu) */
.ast-mobile-popup-overlay {
  background: rgba(0,0,0,.65) !important;
}

/* 3) Clear separators + better contrast for items */
.ast-builder-menu-mobile .menu-item > a {
  background: #ffffff !important;
  color: #111 !important;
  border-bottom: 1px solid rgba(0,0,0,.10) !important;
  font-weight: 600 !important;
}

/* 4) Slight background for submenu area so it looks nested */
.ast-builder-menu-mobile .sub-menu {
  background: rgba(0,0,0,.03) !important;
  padding-left: 14px !important;
}

/* 5) Make dropdown arrows/toggles more visible */
.ast-builder-menu-mobile .ast-menu-toggle {
!   background: rgba(0,0,0,.08) !important;
  border-radius: 6px !important;
}

/* Hide Astra header button for logged-in users */
.logged-in .ast-header-button-1,
.logged-in .ast-header-button-2,
.logged-in .ast-header-button,
.logged-in .ast-builder-button-wrap,
.logged-in .ast-builder-button {
  display: none !important;
}

/* =========================================================
   DESKTOP: 3rd-level submenu UNDER 2nd level (stacked)
   - slightly indented to the right
   - visually distinct
   - FIX: removes hover gap between 2nd and 3rd level
   ========================================================= */
@media (min-width: 922px) {

  /* Prevent clipping */
  .ast-primary-header-bar,
  .main-header-menu,
  .main-header-menu ul {
    overflow: visible !important;
  }

  /* Make 2nd-level <li> the positioning anchor */
  .main-header-menu ul.sub-menu > li.menu-item-has-children {
    position: relative !important;
  }

  /* ✅ Invisible hover bridge to prevent menu closing on mouse move */
  .main-header-menu ul.sub-menu > li.menu-item-has-children::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 10px; /* adjust 6–14px if needed */
  }

  /* FORCE Astra flyout (left:100%) to STOP for 3rd level */
  .main-header-menu ul.sub-menu ul.sub-menu {
    position: absolute !important;
    top: 100% !important;      /* under the 2nd-level item */
    left: 12px !important;     /* slight indent to the right */
    right: auto !important;

    /* cancel Astra flyout transforms/offsets */
    transform: none !important;

    /* sizing so it doesn't stretch across the whole dropdown */
    width: auto !important;
    min-width: 220px !important;
    max-width: 320px !important;

    /* ❌ DO NOT use margin-top here (it creates a hover gap) */
    margin-top: 0 !important;

    /* ✅ Keep the same visual spacing without breaking hover */
    padding-top: 6px !important;
    padding-bottom: 6px !important;

    z-index: 9999 !important;

    /* distinct appearance */
    background: #fff !important;
    border-left: 3px solid #1e73be !important;
    border-radius: 6px !important;
    box-shadow: 0 10px 26px rgba(0,0,0,0.14) !important;
  }

  /* Link spacing for 3rd level only */
  .main-header-menu ul.sub-menu ul.sub-menu > li > a {
    padding: 10px 16px !important;
    white-space: nowrap !important;
  }

  .main-header-menu ul.sub-menu ul.sub-menu > li > a:hover {
    background: rgba(30,115,190,0.08) !important;
  }
}


/* =========================================================
   MOBILE: make 3rd-level menu clearly different from 2nd-level
   ========================================================= */
@media (max-width: 921px) {

  /* 2nd level: modest indent */
  .ast-header-break-point .main-header-menu > li > ul.sub-menu > li {
    padding-left: 12px !important;
  }

  /* 3rd level: more indent + shaded "child" panel */
  .ast-header-break-point .main-header-menu ul.sub-menu ul.sub-menu > li {
    padding-left: 24px !important;                 /* extra indent */
    background: rgba(30,115,190,0.06) !important;  /* light blue tint */
    border-left: 3px solid rgba(30,115,190,0.45) !important;
  }

  /* Make the link inherit the background so it looks like one row */
  .ast-header-break-point .main-header-menu ul.sub-menu ul.sub-menu > li > a {
    background: transparent !important;
    font-weight: 500 !important;
  }

  /* Optional: slightly smaller text for 3rd level */
  .ast-header-break-point .main-header-menu ul.sub-menu ul.sub-menu > li > a,
  .ast-header-break-point .main-header-menu ul.sub-menu ul.sub-menu > li > .menu-link {
    font-size: 0.95em !important;
  }
}

/* TABLET SAFETY (iPad range): keep menus usable in both modes */
@media (min-width: 768px) and (max-width: 1024px) {

  /* If tablet is using desktop dropdowns, prevent clipping */
  .ast-primary-header-bar,
  .main-header-menu,
  .main-header-menu ul {
    overflow: visible !important;
  }

  /* If tablet is using mobile off-canvas, keep 3rd level readable */
  .ast-header-break-point .main-header-menu ul.sub-menu ul.sub-menu > li {
    padding-left: 24px !important;
    background: rgba(30,115,190,0.06) !important;
    border-left: 3px solid rgba(30,115,190,0.45) !important;
  }
}

/* =========================================
   Astra mobile off-canvas menu – recommended
   ========================================= */

.ast-header-break-point .main-header-menu {
  text-align: left !important;
}

.ast-header-break-point .main-header-menu li a {
  text-align: left !important;
  justify-content: flex-start !important;
  padding-left: 16px !important;
}

/* Keep submenu arrows on the right */
.ast-header-break-point .main-header-menu .menu-item-has-children > .ast-menu-toggle {
  margin-left: auto !important;
}

/* Indentation for hierarchy */
.ast-header-break-point .main-header-menu ul.sub-menu li a {
  padding-left: 32px !important;
}

.ast-header-break-point .main-header-menu ul.sub-menu ul.sub-menu li a {
  padding-left: 48px !important;
}

/* Ultimate Member – dölj endast "Logga in"-knappen på registreringsformulär 84 */
.um.um-register.um-84 a.um-button.um-alt {
  display: none !important;
}

/* Astra search results: hide author but keep date */
/* Astra: hide author only on search results */
.search .entry-meta a[rel="author"],
.search .entry-meta .ast-author {
  display: none !important;
}

/* If a "/" separator remains, remove the pseudo separator before the date */
.search .entry-meta .ast-date::before {
  content: "" !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Desktop open */
li.for-members-toggle.focus > ul.sub-menu {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Desktop open */
li.for-members-toggle.focus > ul.sub-menu {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Mobile fallback open */
li.for-members-toggle.ast-submenu-expanded > ul.sub-menu {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-height: none !important;
}



/* Astra mobile submenu force-open */
li.for-members-toggle.ast-submenu-expanded > ul.sub-menu {
  display: block !important;
  max-height: none !important;
  visibility: visible !important;
}

/* Astra: force this Columns block to behave like normal content (not wide/full) */
.ast-container .entry-content > .wp-block-columns.portrait-columns{
  max-width: var(--ast-content-width, 1200px) !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* If Gutenberg added wide/full classes, neutralize them for this block */
.ast-container .entry-content > .wp-block-columns.portrait-columns.alignwide,
.ast-container .entry-content > .wp-block-columns.portrait-columns.alignfull{
  max-width: var(--ast-content-width, 1200px) !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* Your borders */
.wp-block-columns.portrait-columns > .wp-block-column{
  border: 1px solid #2f3e4e;
  padding: 1rem;
}
/* ===== Equal-height portrait frames (all devices) ===== */
.portrait-columns figure.wp-block-image {
  height: 550px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

/* Fit image inside frame without distortion */
.portrait-columns figure.wp-block-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

/* ===== Mobile phones: natural height ===== */
@media (max-width: 700px) {
  .portrait-columns figure.wp-block-image {
    height: auto;
  }

  .portrait-columns figure.wp-block-image img {
    height: auto;
    width: 100%;
  }
}

/* iPad LANDSCAPE ONLY (uses device-width, works across iPad models) */

@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1366px)
  and (orientation: landscape)
  and (-webkit-min-device-pixel-ratio: 1) {


  /* 1) Header rows: remove min-height + reduce padding */
  body .ast-primary-header-bar,
  body .main-header-bar {
    min-height: 0 !important;
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }

  /* 2) Wrappers can add extra vertical space */
  body .ast-primary-header-bar-wrap,
  body .main-header-bar-wrap {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* 3) Site identity / logo area sometimes adds spacing */
  body .site-branding,
  body .ast-site-identity,
  body .ast-site-title-wrap {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.2 !important;
  }

  /* 4) Menu items can increase header height */
  body .main-header-menu > li > a,
  body .ast-header-button-1 a,
  body .ast-header-button-2 a {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
    line-height: 1.2 !important;
  }

  /* 5) Reduce space ABOVE the page title/content below header */
  body .ast-single-page-header,
  body .ast-single-post-header,
  body .entry-header {
    padding-top: 8px !important;
    margin-top: 0 !important;
  }
}

/* Tablets & phones only: increase space between menu and page title */
@media (hover: none) and (pointer: coarse) {

  /* Page title/header area */
  .ast-single-page-header,
  .ast-single-post-header,
  .entry-header {
    padding-top: 1.5em !important;   /* increase space above title */
  }
}
/* iPad LANDSCAPE only: add space between header/menu and page title */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1366px)
  and (orientation: landscape) {

  /* Add space above the page title */
  body h1.entry-title,
  body .entry-header .entry-title,
  body .ast-page-builder-template h1,
  body .ast-single-post-order .entry-title {
    margin-top: 12px !important;   /* increase/decrease this */
  }

  /* If the theme uses a header wrapper instead of margins */
  body .entry-header,
  body .ast-single-page-header,
  body .ast-single-post-header {
    padding-top: 12px !important;  /* same value for consistency */
  }
}