/* 
Theme Name: Web Illusion Child
Description: Web Illusion Child is a child theme of Hello Elementor, created by Web Illusion.
Author: Web Illusion
Author URI: https://webillusion.gr/
Template: hello-elementor
Version: 1.0.0
Requires at least: 5.9
Requires PHP: 5.6
Text Domain: web-illusion-child
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Define Custom CSS Variables */

:root,
.web-illusion,
.web-illusion .e-con,
.web-illusion .elementor-element,
.web-illusion .elementor-element .elementor-widget-container {
    --wi-container-max-width: 1140px;
    --wi-container-padding: 15px;
    --wi-container-padding-vertical: 15px;
    --wi-container-padding-horizontal: 15px;
    --wi-table-border: 2px solid;
    --wi-button-border: 1px solid;
    --wi-button-border-width: 1px;
    --wi-button-border-style: solid;
    --wi-border-radius: 15px;
    --wi-button-min-width: 100px;
    --wi-button-padding: 13px 15px;
    --wi-button-padding-vertical: 13px;
    --wi-button-padding-horizontal: 15px;
    --wi-transition-all: all .3s;
    --wi-transition: .3s;
    --wi-title-margin-start: 1rem;
    --wi-title-margin-end: 1rem;
    --wi-heading-margin-start: 1.75rem;
    --wi-heading-margin-end: 1rem;
    --wi-paragraph-margin-start: 0.9rem;
    --wi-paragraph-margin-end: 0.9rem;
    --wi-heading-line-height: 1;
    --wi-paragraph-line-height: 1.5;
    --wi-sections-margin: 0 0 24px 0;
    --wi-sections-margin-bottom: 24px;
    --wi-container-background-color: var(--e-global-color-4450c4b);
    --wi-white-color: var(--e-global-color-df4e322);
    --wi-secondary-text-font-family: var(--e-global-typography-00a21e9-font-family), Sans-serif;
    --wi-secondary-text-font-size: var(--e-global-typography-00a21e9-font-size);
    --wi-secondary-text-font-weight: var(--e-global-typography-00a21e9-font-weight);
}

/* Add your custom styles here */

/* ---------------------------- */
/* Headings */
/* ---------------------------- */
.web-illusion h1,
.web-illusion h2,
.web-illusion h3,
.web-illusion h4,
.web-illusion h5,
.web-illusion h6 {
    padding: 0;
    margin: 0;
    line-height: var(--wi-heading-line-height);
}

/* Title for Single Post Template */
.web-illusion .web-illusion-single-post h1 {
    margin-block-start: var(--wi-title-margin-start);
    margin-block-end: var(--wi-title-margin-end);
}

/* h2-h6 Headings for Single Post Template */
.web-illusion .web-illusion-single-post h2,
.web-illusion .web-illusion-single-post h3,
.web-illusion .web-illusion-single-post h4,
.web-illusion .web-illusion-single-post h5,
.web-illusion .web-illusion-single-post h6 {
    margin-block-start: var(--wi-heading-margin-start);
    margin-block-end: var(--wi-heading-margin-end);
}

/* ---------------------------- */
/* Paragraph */
/* ---------------------------- */
.web-illusion p {
    padding: 0;
    margin: 0;
    line-height: var(--wi-paragraph-line-height);
}

/* Paragraph for Single Post Template */
.web-illusion .web-illusion-single-post p {
    margin-block-start: var(--wi-paragraph-margin-start);
    margin-block-end: var(--wi-paragraph-margin-end);
}

/* ---------------------------- */
/* Header */
/* ---------------------------- */

/* ---------------------------- */
/* Sticky Header */
/* ---------------------------- */
.web-illusion .elementor-location-header .elementor-sticky {
    opacity: 0;
    pointer-events: none;
    background-color: transparent;
    box-shadow: none;
    transition: background-color 0.3s, opacity 0.3s, box-shadow 0.3s;
}

.web-illusion .elementor-location-header .elementor-sticky--effects {
    opacity: 1;
    pointer-events: auto;
    background-color: var(--e-global-color-secondary);
    box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.5);
}

/* ---------------------------- */
/* Navigation Menu */
/* ---------------------------- */
.web-illusion .elementor-nav-menu .elementor-item {
    /* border: var(--wi-button-border-width) var(--wi-button-border-style); */
    /* border-radius: var(--wi-border-radius); */
    transition: var(--wi-transition-all);
}

.web-illusion .elementor-nav-menu--main .elementor-nav-menu,
.web-illusion .elementor-nav-menu--main .elementor-nav-menu li,
.web-illusion .elementor-nav-menu--main .elementor-nav-menu li a {
    transition: var(--wi-transition-all);
}

.web-illusion .elementor-nav-menu .elementor-item:hover {
    /* border-color: var(--e-global-color-accent); */
    color: var(--e-global-color-accent);
}

.web-illusion .elementor-nav-menu--dropdown .elementor-nav-menu .menu-item:not(:last-child) {
    margin-bottom: var(--wi-container-padding-vertical);
}

/* ---------------------------- */
/* My Account Menu Icon */
/* ---------------------------- */
.web-illusion .web-illusion-login-modal {
    display: none;
    opacity: 0;
    z-index: 200;
}

/* Slide In Down Animation */
.web-illusion .web-illusion-login-modal.slide-in-down {
    animation-name: web-illusion-slide-in-down;
    animation-duration: 0.3s;
    animation-fill-mode: forwards;
}

/* Slide Out Up Animation */
.web-illusion .web-illusion-login-modal.slide-out-up {
    animation-name: web-illusion-slide-out-up;
    animation-duration: 0.3s;
    animation-fill-mode: forwards;
}

/* Keyframes for Slide In Down */
@keyframes web-illusion-slide-in-down {
    from {
        transform: translate3d(0, -100%, 0);
        opacity: 0;
    }

    to {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

/* Keyframes for Slide Out Up */
@keyframes web-illusion-slide-out-up {
    from {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }

    to {
        transform: translate3d(0, -100%, 0);
        opacity: 0;
    }
}

/* Logged In User */

/* Hide the text label */
.web-illusion.logged-in .web-illusion-my-account-menu .elementor-nav-menu .elementor-item .menu-text {
    display: none;
}

.web-illusion.logged-in .web-illusion-my-account-menu .elementor-nav-menu .elementor-item .sub-arrow {
    display: none;
}

.web-illusion.logged-in .web-illusion-my-account-menu ul.elementor-nav-menu .menu-item .elementor-item {
    padding: var(--wi-button-padding-vertical);
}

/* Insert SVG icon and set initial color */
.web-illusion.logged-in .web-illusion-my-account-menu ul.elementor-nav-menu .menu-item .elementor-item::before {
    content: '';
    display: inline-block;
    width: 17px;
    height: 17px;
    background-color: var(--wi-white-color);
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M224 256c70.7 0 128-57.3 128-128S294.7 0 224 0 96 57.3 96 128s57.3 128 128 128zm89.6 32h-16.7c-22.2 10.2-46.9 16-72.9 16s-50.6-5.8-72.9-16h-16.7C60.2 288 0 348.2 0 422.4V464c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48v-41.6c0-74.2-60.2-134.4-134.4-134.4z"/></svg>') no-repeat center;
    mask-size: contain;
    -webkit-mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center;
    vertical-align: middle;
    opacity: 1;
    position: relative;
    transition: var(--wi-transition-all);
}

/* Change color on hover/active */
.web-illusion.logged-in .web-illusion-my-account-menu ul.elementor-nav-menu .menu-item .elementor-item:hover::before,
.web-illusion.logged-in .web-illusion-my-account-menu ul.elementor-nav-menu .menu-item .elementor-item.highlighted::before,
.web-illusion.logged-in .web-illusion-my-account-menu ul.elementor-nav-menu .menu-item .elementor-item:active::before,
.web-illusion.logged-in .web-illusion-my-account-menu ul.elementor-nav-menu .menu-item .elementor-item-active::before {
    background-color: var(--e-global-color-accent);
}

/* Dropdown */
.web-illusion.logged-in .web-illusion-my-account-menu .elementor-nav-menu .menu-item .elementor-nav-menu--dropdown {
    left: 50% !important;
    transform: translateX(-50%);
}

/* ---------------------------- */
/* Search Widget */
/* ---------------------------- */
.web-illusion .elementor-widget-search .elementor-widget-container .e-search .e-search-input,
.web-illusion .elementor-widget-search.e-focus .elementor-widget-container .e-search .e-search-input {
    border-radius: var(--wi-border-radius) 0 0 var(--wi-border-radius);
    color: var(--wi-white-color);
}

/* ---------------------------- */
/* Posts Archive Pagination */
/* ---------------------------- */
.web-illusion .elementor-pagination .page-numbers {
    display: inline-block;
    padding: var(--wi-button-padding-vertical);
    margin: 0;
    border: var(--wi-button-border-width) var(--wi-button-border-style) var(--e-global-color-primary);
    border-radius: var(--wi-border-radius);
    transition: var(--wi-transition-all);
}

.web-illusion .elementor-pagination .page-numbers:hover,
.web-illusion .elementor-pagination .page-numbers:focus,
.web-illusion .elementor-pagination .page-numbers.current {
    border-color: var(--e-global-color-accent);
}

/* ---------------------------- */
/* Forms */
/* ---------------------------- */
/* Replace the error icon font with an inline SVG */
.web-illusion .elementor-form .elementor-message-danger::before {
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: var(--e-global-color-accent);
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 352 512"><path d=\"M242.7 256l100.1-100.1c12.3-12.3 12.3-32.2 0-44.5l-22.2-22.2c-12.3-12.3-32.2-12.3-44.5 0L176 189.3 75.9 89.2c-12.3-12.3-32.2-12.3-44.5 0L9.2 111.5c-12.3 12.3-12.3 32.2 0 44.5L109.3 256 9.2 356.1c-12.3 12.3-12.3 32.2 0 44.5l22.2 22.2c12.3 12.3 32.2 12.3 44.5 0L176 322.7l100.1 100.1c12.3 12.3 32.2 12.3 44.5 0l22.2-22.2c12.3-12.3 12.3-32.2 0-44.5L242.7 256z\"/></svg>') no-repeat center;
    mask-size: contain;
    -webkit-mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    vertical-align: middle;
    background-position: 50%;
}

/* Acceptance field text */
.web-illusion .elementor-form .elementor-field-type-acceptance .elementor-field-subgroup .elementor-field-option label {
    color: var(--e-global-color-text);
}