/* 
Theme Name: AIF
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.2
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
*/

/* WP OVERRIDE */
.wp-block-image, .wp-block-embed, .wp-block-table {margin-left: 0; margin-right: 0;}
.wp-block-table.is-style-stripes {border-bottom: none;}
.wp-block-table table td, .wp-block-table table th {padding: 5px;}
blockquote.wp-embedded-content {margin: 0;}
p.wp-block-paragraph a {font-weight: 700; color: var(--e-global-color-5114562); text-decoration: underline;}
.rightpane-item p a {font-weight: 700; color: var(--e-global-color-5114562); text-decoration: underline;}

:root :where(.wp-element-button, .wp-block-button__link) {
    background: var(--e-global-color-accent);
    border-radius: 250px;
    font: normal normal 900 18px/18px Sofia Sans;
    letter-spacing: 0px;
    color: #fff!important;
    padding: 10px 20px;
    transition: all 0.3s ease;
    text-align: center;
    margin-left: 10px!important;
}
:root :where(.wp-element-button, .wp-block-button__link):hover {
    transform: scale(1.05);
}


/* Mobile Nav */
#app-btn {display: inline-block;}
#app-btn button {position: relative; top: 0; right: 0; border: none; background-color: transparent;}
#app-btn svg {fill: #333;}

/* Stänger av dropdown från huvudmenyn */
.sub-menu.elementor-nav-menu--dropdown {
    display: none!important;
}

/* Container som skapar den blå listen */
.rr-subnav-container {
    background: #7FB8D4 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    width: 100%;
}

/* Listan nollställs och görs till en flexbox */
.rr-subnav-list {
    list-style: none;
    margin: 0;
    padding: 0 10px;
    display: flex;
    flex-wrap: wrap; /* Tillåt radbrytning på små skärmar */
    justify-content: flex-start;
}

/* Varje menyval */
.rr-subnav-item {
    margin: 0;
    padding: 0;
}

/* Länken i menyn */
.rr-subnav-item a {
    display: block;
    padding: 15px 20px;
    color: #ffffff!important;
    text-decoration: none;
    font-weight: 900; /* Fet stil som på bilden */
    font-size: 20px;
    position: relative;
    transition: background 0.3s ease;
    
}

/* Den vita linjen för aktiv sida (indikatorn) */
.rr-subnav-item.current-menu-item a::after, .rr-subnav-item a:hover::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 15px;  /* Indrag så den inte nuddar kanten */
    right: 15px;
    height: 4px; /* Tjockleken på linjen */
    background-color: #ffffff;
}

@media (max-width: 1200px) {
    .rr-subnav-item a {
        padding: 12px 15px;
        color: #ffffff!important;
        text-decoration: none;
        font-weight: 900; /* Fet stil som på bilden */
        font-size: 16px;
        position: relative;
        transition: background 0.3s ease;
        
    }
}

/* Högerpanel */
.rightpane-item {
    background-color: #ffffff;
    padding: 45px;
    margin-bottom: 20px;
    border-radius: 20px;
}

.rightpane-item--image img {
    margin-bottom: 30px;
    border-radius: 20px!important;
}

/* Hero Buttons */
.hero-buttons {
    display: flex;
    gap: 50px;
    margin-top: 30px;
}

.hero-buttons .hero-button {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 50px #00000080;
    border-radius: 250px;
    font: normal normal 900 30px/33px Sofia Sans;
    letter-spacing: 0px;
    color: var( --e-global-color-5114562 );
    padding: 20px 50px;
    transition: all 0.3s ease;
    text-align: center;

}
.hero-buttons .hero-button:hover {
    /* background: #2F6C9F 0% 0% no-repeat padding-box;
    color: #FFFFFF; */
    transform: scale(1.05);
}

/* Mobilanpassning (Skärmar under 768px) */
@media (max-width: 768px) {
    .hero-buttons {
        gap: 12px; /* Mycket mindre mellanrum på mobil */
        margin-top: 20px;
        justify-content: center;
        flex-wrap: wrap; /* Tvingar dem att ligga bredvid varandra */
        padding: 0 15px;   /* Säkerhetsmarginal på sidorna */
    }

    .hero-buttons .hero-button {
        font-size: 16px;    /* Drastiskt minskad font för läsbarhet på mobil */
        line-height: 18px;
        padding: 12px 20px; /* Mindre padding så de inte tar upp hela bredden */
        flex: 1;            /* Gör att knapparna blir lika stora (valfritt) */
        min-width: fit-content;
        box-shadow: 0px 3px 20px #00000050; /* Något mjukare skugga på liten skärm */
    }
}

/* Grundläge - helt orört */
#smart-header {
    width: 100%;
    z-index: 9999;
    /* Ingen transition här för att undvika glitch vid start */
}

/* Fixerat läge - aktiveras efter 160px */
#smart-header.is-sticky {
    position: fixed;
    top: 0;
    left: 0;
    /* Tvinga den att vara utanför skärmen direkt utan animation */
    transform: translateY(-100%) !important;
    transition: none !important; 
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

/* Denna klass tillåter animation - läggs till efter en kort delay i JS */
#smart-header.is-animated {
    transition: transform 0.3s ease-in-out !important;
}

/* Visningsläge - när vi faktiskt scrollar uppåt */
#smart-header.is-sticky.is-visible {
    transform: translateY(0) !important;
}

/* Filuppladdningsfält */
/* Targetar alla filuppladdnings-inputs */
.elementor-field-type-upload input[type="file"] {
  /* Behållaren */
  border: 1px solid #ccc;
  background-color: white;
  color: #4a72a1;      /* Färg på texten "Ingen fil vald" */
  font-style: italic;  /* Kursiv text som i bilden */
  cursor: pointer;
  outline: none;
  font-family: sans-serif;
  padding: 0;          /* Viktigt för att knappen ska sitta dikt an kanten */
  border-radius: 25px!important;
}

/* Själva knappen (den blå delen) */
.elementor-field-type-upload input[type="file"]::file-selector-button {
  background-color: #4a72a1; /* Den blå färgen från bilden */
  color: white;
  border: none;
  border-radius: 25px 0 0 25px; /* Rundar bara vänstersidan */
  padding: 10px 20px;
  margin-right: 15px;
  cursor: pointer;
  font-style: normal;  /* Gör texten i knappen rak (ej kursiv) */
  transition: background-color 0.2s;
}

/* Hover-effekt för knappen */
.elementor-field-type-upload input[type="file"]::file-selector-button:hover {
  background-color: #3b5b82;
}