/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*
    Add your custom styles here
*/
/* ---------------------------------------------------------------------------
   Mobile horizontal scroll
   The JetMenu mega panel (.jet-mega-menu-mega-container) is absolutely
   positioned and only visibility:hidden while closed, so on narrow screens its
   right edge sits ~25px past the viewport and drags the page scroll with it.
   Affects every page, header-wide.

   overflow-x: clip rather than hidden - hidden would create a scroll container
   and break position: sticky in the header. The panel itself is left alone so
   the mobile menu still opens normally.
   Added 2026-08-19.
   --------------------------------------------------------------------------- */
@media (max-width: 1024px) {
    html,
    body {
        overflow-x: clip;
    }
}

/* ---------------------------------------------------------------------------
   Elementor popups above the sticky header
   The header container carries z-index 99999 and position:fixed, while
   Elementor gives its popups/lightboxes 9999 — so the offer form ("Legg til
   tilbudforespørsel") slid under the header as soon as the page was scrolled.
   A modal should sit above page chrome, so lift the dialog rather than
   demoting the header.
   Added 2026-08-19.
   --------------------------------------------------------------------------- */
.dialog-widget.dialog-lightbox-widget,
.elementor-popup-modal,
.dialog-type-lightbox {
    z-index: 100000 !important;
}

/* ---------------------------------------------------------------------------
   Header sub-menu dropdown (Bransjeløsninger)
   JetMenu ships this panel unstyled: links at weight 800, no padding, and a
   hard white box with no radius or shadow. Bring it in line with the Produkter
   mega panel, which uses weight 500, a 20px radius and a soft shadow.
   Scoped to .jet-mega-menu-sub-menu so the mega panel is untouched.
   Added 2026-08-19.
   --------------------------------------------------------------------------- */
.jet-mega-menu-sub-menu {
    min-width: 246px;
    padding: 8px 0 !important;
    background: #ffffff !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 28px rgba(13, 21, 46, 0.16) !important;
    overflow: hidden;
}
.jet-mega-menu-sub-menu .jet-mega-menu-sub-menu__list {
    background: transparent !important;
}
.jet-mega-menu-sub-menu .jet-mega-menu-item__link {
    display: block;
    font-family: "Plus Jakarta Sans", sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    color: #1D3557 !important;
    padding: 10px 22px !important;
    white-space: nowrap;
    transition: background-color .15s ease, color .15s ease;
}
.jet-mega-menu-sub-menu .jet-mega-menu-item__inner {
    background: transparent !important;
}
.jet-mega-menu-sub-menu .jet-mega-menu-item__link:hover,
.jet-mega-menu-sub-menu .jet-mega-menu-item--hovered > .jet-mega-menu-item__inner > .jet-mega-menu-item__link,
.jet-mega-menu-sub-menu .jet-mega-menu-item--current > .jet-mega-menu-item__inner > .jet-mega-menu-item__link {
    background-color: #F4F6FA !important;
    color: #1D3557 !important;
}

/* ---------------------------------------------------------------------------
   Produkter mega menu
   Rendered by [jeva_mega_menu] (see jeva-megamenu.php), which walks the
   product_cat tree instead of the 7 hand-built icon boxes this replaced.
   Typography deliberately mirrors the old widgets so the swap is invisible:
   heads use global typography ceab577 (Plus Jakarta Sans 16/800, uppercase via
   the h3 rule) and links use b7e1814 (16/500, 24px line-height).

   Categories that have subcategories get a column each; the ones that do not
   are stacked into a single trailing column, which is how the hand-built
   version laid out Rekvisita / Reservedeler / Våre leverandører.
   Added 2026-08-21.
   --------------------------------------------------------------------------- */
.jeva-mm__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 24px;
    row-gap: 34px;
    align-items: start;
}
.jeva-mm__group {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}
.jeva-mm__group--stack {
    gap: 22px;
}

.jeva-mm .jeva-mm__head {
    display: flex;
    align-items: center;
    gap: 15px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 16px;
    font-weight: 800;
    line-height: 20px;
    text-transform: uppercase;
    color: #1D3557;
    text-decoration: none;
    transition: color .15s ease;
}
.jeva-mm__icon {
    display: flex;
    flex: 0 0 24px;
    color: #1D3557;
    transition: color .15s ease;
}
.jeva-mm__svg {
    width: 24px;
    height: 24px;
    display: block;
}
.jeva-mm .jeva-mm__head:hover,
.jeva-mm .jeva-mm__head:hover .jeva-mm__icon {
    color: #457B9D;
}

.jeva-mm__list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.jeva-mm__list li + li {
    margin-top: 8px;
}
.jeva-mm .jeva-mm__link {
    display: block;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: #1D3557;
    text-decoration: none;
    transition: color .15s ease;
}
.jeva-mm .jeva-mm__link:hover {
    color: #457B9D;
}

/* The .jeva-mm prefix on the two anchor rules above is load-bearing: the
   Elementor kit styles `.elementor-kit-4 a` at weight 800 / 20px line-height,
   which outranks a bare single class and made every sub-link render bold.
   --------------------------------------------------------------------------- */

/* The mega panel is roughly a third as wide on tablet and full width on phones,
   where JetMenu renders it inside the off-canvas drawer. */
@media (max-width: 1024px) {
    .jeva-mm__grid {
        grid-template-columns: repeat(2, 1fr);
        row-gap: 28px;
    }
}
@media (max-width: 767px) {
    .jeva-mm__grid {
        grid-template-columns: 1fr;
        row-gap: 24px;
    }
    .jeva-mm__group--stack {
        gap: 16px;
    }
}

/* ---------------------------------------------------------------------------
   Dropdown caret on top-level menu items
   The carets used to be a literal "▾" typed into the menu item titles, which
   froze those labels: a custom title stops the item following its page or term
   name, so renaming the category would have left the menu reading the old
   name. Draw them instead, and the titles go back to being automatic.

   Scoped to top-level items so sub-menu entries never sprout one, and driven
   by JetMenu's own has-children class so a caret can only appear where there
   really is something to open.
   Added 2026-08-21.
   --------------------------------------------------------------------------- */
.jet-mega-menu-item--top-level.jet-mega-menu-item-has-children
    > .jet-mega-menu-item__inner
    > .jet-mega-menu-item__link
    .jet-mega-menu-item__label::after {
    content: "";
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 7px;
    vertical-align: 2px;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid currentColor;
    transition: transform .15s ease;
}
.jet-mega-menu-item--top-level.jet-mega-menu-item-has-children.jet-mega-menu-item--hovered
    > .jet-mega-menu-item__inner
    > .jet-mega-menu-item__link
    .jet-mega-menu-item__label::after {
    transform: rotate(180deg);
}