/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

 /* Mobile Dasboard Menu */
 .woocommerce-MyAccount-navigation:not(.gca-mobile-my-account-menu) {
    display: none;
 }
 @media screen and (min-width: 768px) {
    .woocommerce-account.logged-in .woocommerce-MyAccount-content {
        width: 75%;
    }
    .woocommerce-account.logged-in .account-navigation-wrap {
        width: 25%;
    }
    .woocommerce-MyAccount-navigation.gca-mobile-my-account-menu {
        display: none;
    }
    .woocommerce-MyAccount-navigation:not(.gca-mobile-my-account-menu) {
        display:block;
    }
}

/* My Account : Logged In View */
.woocommerce-page.woocommerce-account .gca-memberships {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    margin-bottom: 1rem;
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership {
    background: var(--global-palette4);
    border-radius: 10px;
    padding: 1rem;
    color: var(--global-palette9);
    flex-basis: 380px;
    display: flex;
    flex-direction: column;
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership.active {
    background: var(--global-palette1);
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership img {
    width: 30px;
    height: auto;
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership span.label {
    text-transform: uppercase;
    display: block;
    font-size: var(--global-kb-font-size-xsm);
    font-weight: bold;
} 
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership > div {
    display: flex;
    gap: 10px;
    font-size: var(--global-kb-font-size-md);
    font-weight: bold;
    padding-bottom: 0.3rem;
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership > div .plan-name {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership > p {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: baseline;
    margin: 0 5px;
    padding: 10px 0;
    border-top: 1px solid rgb(255 255 255 / 20%);
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership > p span.label {
    flex-basis: 7rem;
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership .action {
    flex-grow: 1;
    display: block;
    align-content: end;
    margin-top: 1rem;
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership a.button {
    width: 100%;
    text-align: center;
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership a.button:not(:hover) {
    background-color: var(--global-palette6);
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership .value.icon::before {
    width: 1rem;
    height: 1rem;
    display: inline-block;
    content: '';
    mask-size: cover;
    margin-right: 0.4rem;
    background: var(--global-palette9);
    mask: url(../svg/tick.svg) no-repeat 50% 50%;
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership .value.icon.cancelled::before {
    mask: url(../svg/no-entry.svg) no-repeat 50% 50%;
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership .value.icon.warning::before {
    mask: url(../svg/warning.svg) no-repeat 50% 50%;
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership .view::after {
    width: 1rem;
    height: 1rem;
    display: inline-block;
    content: '';
    mask-size: cover;
    padding-left: 30px;
    background: var(--global-palette9);
    mask: url(../svg/eye.svg) no-repeat 50% 50%;
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership a.view {
    color: var(--global-palette9);
    display: flex;
    align-items: center;
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership a.view:hover {
    color: color-mix( in HSL, var(--global-palette2) 30%, #ffff00 70%);
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership a.view:hover::after {
    background: color-mix( in HSL, var(--global-palette2) 30%, #ffff00 70%);
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership .value.icon.tick {
    display: flex;
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership .action-button {
    color: var(--global-palette9);
    text-transform: uppercase;
    font-size: var(--global-kb-font-size-xsm);
    font-weight: bold;
    flex-grow: 1;
    text-align: right;
    display: flex;
    align-items: center;
    transition: all 0.2s ease;
    justify-content:flex-end;
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership .action-button::after {
    width: 1rem;
    height: 1rem;
    display: inline-block;
    content: '';
    margin-left: 0.4rem;
    background: var(--global-palette9);
    mask: url(../svg/arrow-right.svg) no-repeat 50% 50%;
    transition: all 0.2s ease;
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership .action-button:hover {
    margin-left: 0.2rem;
    color: color-mix( in HSL, var(--global-palette2) 30%, #ffff00 70%);
}
.woocommerce-page.woocommerce-account .gca-memberships .gca-membership .action-button:hover::after {
    margin-left: 0.6rem;
    background: color-mix( in HSL, var(--global-palette2) 30%, #ffff00 70%);
}

/* Menu Icons */
.woocommerce-account li.woocommerce-MyAccount-navigation-link.menu-item a {
    display: flex;
    align-items: center;
}
.woocommerce-account li.woocommerce-MyAccount-navigation-link.menu-item a::before {
    width: 1.4rem;
    height: 1.4rem;
    display: inline-block;
    content: '';
    margin-right: 0.4rem;
    background: var(--global-palette6);
    mask: url(../svg/controls.svg) no-repeat 50% 50%;
    transition: all 0.2s ease;
}
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--orders.menu-item a::before { mask: url(../svg/shopping-trolley.svg) no-repeat 50% 50%; }
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--teams.menu-item a::before { mask: url(../svg/team.svg) no-repeat 50% 50%; }
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--subscriptions.menu-item a::before { mask: url(../svg/subscriptions.svg) no-repeat 50% 50%; }
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--downloads.menu-item a::before { mask: url(../svg/cloud-download.svg) no-repeat 50% 50%; }
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--gca-newsletter.menu-item a::before { mask: url(../svg/newspaper.svg) no-repeat 50% 50%; }
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--gca-jobs.menu-item a::before { mask: url(../svg/job.svg) no-repeat 50% 50%; }
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--gca-adverts.menu-item a::before { mask: url(../svg/announcement.svg) no-repeat 50% 50%; }
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--edit-address.menu-item a::before { mask: url(../svg/location.svg) no-repeat 50% 50%; }
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--payment-methods.menu-item a::before { mask: url(../svg/credit-card.svg) no-repeat 50% 50%; }
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--edit-account.menu-item a::before { mask: url(../svg/lock.svg) no-repeat 50% 50%; }
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--customer-logout.menu-item a::before { mask: url(../svg/logout.svg) no-repeat 50% 50%; }
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--gca-directory.menu-item a::before { mask: url(../svg/directory.svg) no-repeat 50% 50%; }
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--back-to-teams.menu-item a::before { mask: url(../svg/arrow-left.svg) no-repeat 50% 50%; }
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--members.menu-item a::before { mask: url(../svg/team.svg) no-repeat 50% 50%; }
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--add-member.menu-item a::before { mask: url(../svg/add-user.svg) no-repeat 50% 50%; }
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--settings.menu-item a::before { mask: url(../svg/gear.svg) no-repeat 50% 50%; }
.woocommerce-account li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--members-area.menu-item a::before { mask: url(../svg/membership.svg) no-repeat 50% 50%; }

/* Mobile Navigation Links */
.woocommerce-MyAccount-navigation.gca-mobile-my-account-menu ul {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
.woocommerce-MyAccount-navigation.gca-mobile-my-account-menu ul li {
    flex-basis: 14rem;
    flex-grow: 1;
    border: 1px solid var(--global-palette5);
    border-radius: 5px;
    box-shadow: 2px 2px 3px 0px var(--global-palette5);
}
.woocommerce-MyAccount-navigation.gca-mobile-my-account-menu details summary {
    margin-bottom: 20px;
    border-bottom: 2px solid var(--global-palette1);
}

/* Directory Listing Endpoint */
.woocommerce-account .gca-dashboard-sections .gca-plan-name {
    text-transform: uppercase;
    font-weight: bold;
    margin-bottom: 1rem;
}
.woocommerce-account .gca-dashboard-sections .gca-plan-name,
.woocommerce-account .gca-dashboard-sections .gca-plan-name a.view {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
}
.woocommerce-account .gca-dashboard-sections .gca-plan-name a.view::before {
    width: 1rem;
    height: 1rem;
    display: inline-block;
    content: '';
    mask-size: cover;
    padding-left: 30px;
    background: var(--global-palette1);
    mask: url(../svg/eye.svg) no-repeat 50% 50%;
}
.woocommerce-account .gca-dashboard-sections .gca-plan-name a.view:hover::before {
    background: var(--global-palette2);
}
.woocommerce-account .gca-dashboard-sections form.profile_status_form {
    margin: 1rem 0;
}
.woocommerce-account .gca-dashboard-sections form.profile_status_form,
.woocommerce-account .gca-dashboard-sections form.profile_status_form .acf-field.acf-field-true-false {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    gap: 20px;
    align-items: center;
}
.woocommerce-account .gca-dashboard-sections form.profile_status_form .acf-field.acf-field-true-false .acf-label {
    margin-bottom: 0;
}
.woocommerce-account .gca-dashboard-sections form.profile_status_form .acf-hidden:has(input#_acf_changed[value="0"]) ~ .acf-form-submit {
    /* display:none; */
}
.woocommerce-account .gca-dashboard-sections form.profile_status_form .acf-form-submit input.gca-confirm-button {
    font-weight: bold;
    text-transform: uppercase;
    padding: 5px 10px;
    line-height: 1;
    background-color: var(--global-palette2);
}
.woocommerce-account .gca-dashboard-sections form.profile_status_form .acf-form-submit input.gca-confirm-button:hover {
    background-color: var(--global-palette1);
}

/* Dashboard sections using Detail-Summary */
.woocommerce-account .gca-dashboard-sections {
    padding: 1rem;
    border: 2px solid var(--global-palette5);
    border-radius: 10px;
    margin-bottom: 1rem;
}

.woocommerce-account .gca-dashboard-sections details {
    background: var(--global-palette8);
    border-radius: 10px;
    padding: 1rem;
    margin-bottom: 1rem;
}

.woocommerce-account .gca-dashboard-sections summary {
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}
.woocommerce-account .gca-dashboard-sections summary::after {
    width: 1rem;
    height: 1rem;
    display: inline-block;
    content: '';
    mask-size: cover;
    padding-left: 30px;
    background: var(--global-palette1);
    mask: url(../svg/edit.svg) no-repeat 50% 50%;
}
.woocommerce-account .gca-dashboard-sections details[open] summary::after {
    background: var(--global-palette9);
    mask: url(../svg/close.svg) no-repeat 50% 50%;
}

/* A bit of subtle animation */
.woocommerce-account .gca-dashboard-sections details .details-section {
    opacity: 0;
  }
.woocommerce-account .gca-dashboard-sections details[open] .details-section {
    animation: fadeIn .5s ease-out forwards;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.woocommerce-account .gca-dashboard-sections details[open] {
    margin-bottom: 1.5rem;
}
.woocommerce-account .gca-dashboard-sections details[open] summary {
    margin: -1rem -1rem 0;
    padding: 1rem;
    border-radius: 10px 10px 0 0;
    background: color-mix( in HSL, var(--global-palette8) 50%, #000 50%);
    color: var(--global-palette9);
    font-weight: bold;
}
.woocommerce-account .gca-dashboard-sections details .acf-field.two-columns .acf-taxonomy-field .categorychecklist-holder {
    max-height: unset;
}
@media screen and (min-width: 480px) {
    .woocommerce-account .gca-dashboard-sections details .acf-field.two-columns ul {
        columns: 2;
    }    
}

.woocommerce .membership-actions.order-actions a {
    margin:0 5px 5px 0;
}