/*--------------------------------------------------------------
This is your custom stylesheet.

Add your own styles here to make theme updates easier.
To override any styles from other stylesheets, simply copy them into here and edit away.

Make sure to respect the media queries! Otherwise you may
accidentally add desktop styles to the mobile layout.
https://www.w3schools.com/css/css_rwd_mediaqueries.asp
--------------------------------------------------------------*/


:root {
    /* Color Scheme */
    --color-white: #ffffff;
    --color-black: rgba(0, 0, 0, 0.3);
    --color-pink: #f1195d;
    --color-deep-red: #DC4C54;
    --color-light-gray: #e5e2e1;
    --color-dark-gray: #605B58;
    --color-soft-pink: #F7F0F2;
    --color-accent: #FD81B3;
    --color-hover-background: #979492;
    --color-border: rgba(96, 91, 86, 0.3);
    --color-gray: #cbb7bf;
    --color-shadow-light: rgba(191, 187, 184, 0.6);
    --color-shadow-dark: rgba(255, 255, 255, 0.5);

    /* Box Shadows */
    --box-shadow-standard: 0px 2px 4px var(--color-black), 0px 0px 13px -3px var(--color-black), 0px -3px 0px inset var(--color-black);
    --box-shadow-inset: inset 5px 5px 5px var(--color-dark-gray), inset -2px -2px 2px var(--color-light-gray);
    --box-shadow-hover: inset 5px 5px 9px var(--color-light-gray), inset -5px -5px 9px var(--color-white);
    --box-shadow-pressed: inset 5px 5px 9px var(--color-light-gray), inset -5px -5px 9px var(--color-white);

    /* Border Radii */
    --border-radius-large: 20px;
    --border-radius-circle: 50%;
    --border-radius-pill: 85px;

    /* Padding & Margins */
    --padding-standard: 10px 25px;
    --margin-standard: 5px;
    --margin-hover: 10px;

    /* Font Weights */
    --font-weight-bold: 700;

    /* Other */
    --transition-standard: transform 0.5s;
}

/* Show or Hide Based on Log In State */
body:not(.logged-in) .show-for-logged-in,
body.logged-in .show-for-logged-out {
    display: none !important;
}

/* Buddy Boss Footer */
.footer_button a.progressally-menu-link {
    font-weight: var(--font-weight-bold);
    letter-spacing: .05em;
    padding: var(--padding-standard);
    color: var(--color-white) !important;
    border: 2px solid var(--color-accent);
    align-items: center;
    border-radius: var(--border-radius-pill);
    background: var(--color-soft-pink);
    box-shadow: 2px 2px 2px var(--color-gray), -2px -2px 2px var(--color-white);
}

.footer_button a.progressally-menu-link:hover {
    color: var(--color-white) !important;
    border-radius: var(--border-radius-pill);
    background: var(--color-hover-background);
    box-shadow: var(--box-shadow-inset);
    border: 1px solid var(--color-border);
}

/* Menu Footer */
#menu-footer-menu {
    font-weight: var(--font-weight-bold);
}

/* Responsive Design Adjustments */
@media only screen and (max-width: 600px) {
    html, body {
        overflow-x: hidden;
    }
    body {
        position: relative;
    }
}

/* Font Family */
body {
    font-family: Raleway, "fallback for Raleway";
}

@font-face {
    font-family: "fallback for open Raleway";
    src: local("Arial");
    ascent-override: 105%;
    descent-override: 35%;
    line-gap-override: 10%;
}

/* Elementor Styles */
/* Dashboard Loops */
.elementor-context-menu a:active {
    border: 1px solid red;
}

/* Color Classes */
.pink {
    color: var(--color-pink);
}

.deep-red {
    color: var(--color-deep-red);
}

/* Neumorphism */
div.loopshadow .dce-post-block {
    box-shadow: var(--box-shadow-standard);
    border-radius: var(--border-radius-large);
    margin: var(--margin-standard);
    background-color: var(--color-white);
}

div.loopshadow .dce-post-block:hover {
    border-radius: var(--border-radius-large);
    background: var(--color-soft-pink);
    box-shadow: var(--box-shadow-hover);
    margin: var(--margin-hover);
}


/* Default Styles */
.default {
    box-shadow: var(--box-shadow-standard);
    border-radius: var(--border-radius-large);
    background-color: var(--color-white);
}

.default:hover {
    border-radius: var(--border-radius-large);
    background: var(--color-soft-pink);
    box-shadow: var(--box-shadow-hover);
}

.pressed-2 {
    border-radius: var(--border-radius-large);
    background: var(--color-soft-pink);
    box-shadow: var(--box-shadow-pressed);
}

/* Default Column Styles */
.default-column {
    border-radius: var(--border-radius-large);
    background: var(--color-soft-pink);
    box-shadow: 5px 5px 4px var(--color-shadow-light), -5px -5px 4px var(--color-shadow-dark);
    margin: var(--margin-standard);
}

.default-column:hover {
    border-radius: var(--border-radius-large);
    background: var(--color-soft-pink);
    box-shadow: var(--box-shadow-hover);
    margin: var(--margin-hover);
}

/* Cogs Image Styles */
.cogs img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /* Assuming --size is previously defined, if not, it needs to be added to :root */
    height: var(--size); 
    width: var(--size);
    margin: 10px;
    background: var(--color-gray);
    box-shadow: 5px 5px 10px var(--color-shadow-light), -5px -5px 10px var(--color-shadow-dark);
    border-radius: var(--border-radius-circle);
    padding: 1px;
}

/* Dynamic Object Oriented (OO) Button Text Styles */
.dce-button-text {
    font-size: .9rem;
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
}

/* Menu Hover Effects */
.menuhover .elementor-nav-menu--main .elementor-item.elementor-item-active, 
.menuhover li:hover {
    border-radius: var(--border-radius-large);
    background: var(--color-soft-pink);
    box-shadow: var(--box-shadow-hover);
    margin: 0px;
    width: 100%;
}

.menuhover li li:hover {
    background: none;
    box-shadow: none;
}

/* Dashboard Icon Padding */
.i-icon .elementor-icon i, 
.elementor-icon svg {
    padding-top: 0px;
}

/* Information Color */
.info {
    color: var(--color-pink);
}

/* AccessAlly Objective Number Display */
div.progressally-flex-cell.objective-number {
    display: none;
}

/* Custom Tabs - Period Portal */
.featuretabs .elementor-tab-title {
    text-align: center;
    padding: 0px 10px;
    width: 100%;
}

.featuretabs .elementor-tab-title.elementor-tab-desktop-title.elementor-active div {
    box-shadow: 3px 3px 6px 0px var(--color-shadow-light) inset, -3px -3px 6px 1px var(--color-shadow-dark) inset;
    border-radius: var(--border-radius-large);
    background: var(--color-white);
    padding: 30px;
    color: var(--color-black);
}

/* Button Feature */
.buttonfeature {
    box-shadow: var(--box-shadow-standard);
    border-radius: var(--border-radius-large);
    margin-bottom: 15px;
    margin-top: 15px;
    color: var(--color-black);
    background: radial-gradient(circle, var(--color-white) 0%, var(--color-white) 100%);
    padding: 30px 10px;
}

/* Elementor Tabs Wrapper */
.featuretabs .elementor-tabs-wrapper {
    display: flex;
    justify-content: center;
}

/* Elementor Tab Title for Mobile */
.featuretabmobile .elementor-tab-title {
    text-align: center;
    padding: 10px 10px;
}

/* Visual Standards Button */
.vsbutton .elementor-button-text {
    padding: 10px;
}

.vsbutton .elementor-button-icon {
    font-size: 2.6rem;
}

/* Period Pillars List */
div div.pillars .elementor-tab-title {
    border-radius: var(--border-radius-large);
    box-shadow: 0px 2px 8px 0px var(--color-shadow-light);
    text-align: left;
}

/* Background Cover for General Use */
.backgroundcover {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

/* Symptoms Page Toggle */
.symptomtoggle .elementor-tab-title {
    border-radius: var(--border-radius-large);
    box-shadow: 0px 0px 22px -9px var(--color-black);
}

.symptomtoggle i {
    padding-top: 5px;
}

/* Next Steps Tab */
.nextstepstab .elementor-tab-title {
    padding: 0px;
    text-align: center;
}

/* Protocols, Resources, and Products Hover Effects */
.protocols, .resources, .products {
    width: 250px;
    height: 240px;
    background-position: bottom;
    display: inline-block;
}

.protocols:hover {
    background: url("/wp-content/uploads/2023/02/1-min-2.png") no-repeat;
}

.resources:hover {
    background: url("/wp-content/uploads/2023/02/3-min-3.png") no-repeat;
}

.products:hover {
    background: url("/wp-content/uploads/2023/02/5-min-3.png") no-repeat;
}

/* List Alignment Top */
.listaligntop .elementor-icon-list-items .elementor-icon-list-item {
    position: relative;
}

.listaligntop .elementor-icon-list-items .elementor-icon-list-icon {
    position: absolute;
    top: 6px;
    left: 0;
}

.listaligntop .elementor-icon-list-items .elementor-icon-list-text {
    margin-left: 27px;
}

/* AccessAlly Icon Image Hover Effect */
img.accessally-icon-img {
    transition: var(--transition-standard);
}

img.accessally-icon-img:hover {
    transform: scale(0.9);
}

/* Dashboard Slider Styles */
.swiper-slide.dce-dualcarousel-item.no-transition.swiper-slide-visible.swiper-slide-next.swiper-slide-thumb-active,
.swiper-slide.dce-dualcarousel-item.no-transition.swiper-slide-visible.swiper-slide-active.swiper-slide-thumb-active {
    background-color: var(--color-white);
}

.sliderbottom .swiper-slide:last-child {
    margin-bottom: 25px;
}

.swiper-slide.dce-dualcarousel-item {
    padding: 20px;
}

.dce-thumbnail-image {
    max-width: 100%;
    max-height: 100%;
    display: block;
    margin: auto;
}

/* Slider Margin Adjustments */
.slidermargin .dce-post-item .dce-post-block,
.slidermargin .dce-post-item .dce-post-block:hover {
    margin-right: 25px;
}

/* Tabs Enhancement */
.classictabs .e-n-tab-title.e-normal.e-active {
    z-index: 5;
    margin-bottom: -2px;
}

.classictabs .elementor-element.elementor-element-5d557a1.e-con-full.e-con.e-active {
    z-index: 1;
}

/* Search Views Grid */
@media only screen and (min-width: 800px) {
    .views-results {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Favorites Block */
.favorites .dce-post-block {
    background-color: var(--color-white);
}

/* Loop Repeater Adjustments for Responsive Design */
@media screen and (max-width: 1430px) and (min-width: 450px) {
    .loop_repeater .swiper-wrapper {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr);
    }
    
    .loop_repeater .swiper-wrapper div {
        background-color: var(--color-white) !important;
        grid-row: 1;
    }
}

/* New Search Pages Styling */
.searchable_pages .dce-page-numbers li a {
    width: 150px;
}

.searchable_pages ul {
    margin: 0;
}

.favorites .dce-page-numbers li a {
    width: 150px;
}

/* Locked Notice on Pillar Sales Pages */
.locked-notice {
    display: flex;
    flex-direction: column;
    border-left: 10px solid var(--color-accent);
    border-radius: var(--border-radius-large) var(--border-radius-large) var(--border-radius-large) 0;
    box-shadow: 0px 0px 34px 0px var(--color-black);
    margin-top: 20px;
    padding: 20px;
}

/* Pillars Tablet Adaptation */
@media only screen and (max-width: 801px) {
    .stacked div {
        display: flex;
        flex-direction: column !important;
        width: 100%;
        align-items: center !important;
    }
}

@media only screen and (min-width: 802px) {
    .stacked img {
        display: none;
    }
}

/* Highlight Sales Page Text - Pink */
.highlight {
    background: transparent;
    background: linear-gradient(180deg, transparent 61%, var(--color-soft-pink) 61%);
    padding: 0px 10px;
}

/* Motion Sales Page Hero Graphic Animations */
@keyframes float {
    0% {
        transform: translatey(0px);
    }
    50% {
        transform: translatey(-20px);
    }
    100% {
        transform: translatey(0px);
    }
}

.float {
    animation: float 8s ease-in-out infinite;
}

.float2 {
    animation: float 7.5s ease-in-out infinite alternate;
}