:root {
    --icon-eye: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8"%3F><svg version="1.1" viewBox="0 0 768 768" xmlns="http://www.w3.org/2000/svg"><path d="m 384,96 c -70.14393,0 -131.29599,22.59256 -182.33594,54.14453 -42.07996,26.01598 -77.60101,58.27164 -106.208982,89.59961 -23.00798,25.15198 -41.790673,49.95258 -56.222658,70.97656 -23.167977,33.72797 -35.8398437,58.97461 -35.8398437,58.97461 -4.35199599,8.76799 -4.671995,19.29739 0,28.60938 0,0 12.6718667,25.24664 35.8398437,58.97461 14.431985,20.99198 33.214678,45.82458 56.222658,70.97656 C 124.06305,559.5838 159.5841,591.8395 201.66406,617.8555 252.70401,649.4074 313.85607,672 384,672 c 70.14393,0 131.29599,-22.5926 182.33594,-54.1445 42.07996,-26.016 77.60101,-58.2717 106.20898,-89.59964 22.97598,-25.15198 41.79067,-49.98458 56.22266,-70.97656 23.16797,-33.72797 35.83984,-58.97461 35.83984,-58.97461 4.352,-8.76799 4.672,-19.29739 0,-28.60938 0,0 -12.67187,-25.24664 -35.83984,-58.97461 C 714.33559,289.72872 695.5529,264.89612 672.54492,239.74414 643.93695,208.41617 608.4159,176.16051 566.33594,150.14453 515.29599,118.59256 454.14393,96 384,96 Z m 0,64 c 55.87194,0 105.50392,17.8882 148.67188,44.57617 35.80796,22.14398 66.84744,50.14397 92.60742,78.33594 20.60798,22.55998 37.60071,44.95927 50.7207,64.03125 10.49599,15.26398 18.30429,28.03265 23.48828,37.05664 -5.21599,8.99199 -13.02429,21.79266 -23.48828,37.05664 -13.11999,19.07198 -30.08072,41.47127 -50.7207,64.03125 -25.75998,28.19197 -56.79946,56.19196 -92.60742,78.33591 C 489.50392,590.1118 439.87194,608 384,608 328.12806,608 278.49608,590.1118 235.32812,563.4238 199.52016,541.27985 168.48068,513.27986 142.7207,485.08789 122.11272,462.52791 105.11999,440.12862 91.999998,421.05664 81.504008,405.79266 73.696458,392.99199 68.480468,384 c 5.21599,-8.99199 13.02429,-21.79266 23.48828,-37.05664 13.119992,-19.07198 30.078772,-41.47127 50.718752,-64.03125 25.75997,-28.19197 56.80141,-56.19196 92.60938,-78.33594 C 278.49683,177.8882 328.12806,160 384,160 Z m 0,96 c -35.32796,0 -67.39212,14.36793 -90.49609,37.50391 C 270.39993,316.63988 256,348.67204 256,384 c 0,35.32796 14.36793,67.39212 37.50391,90.49609 C 316.63988,497.60007 348.67204,512 384,512 c 35.32796,0 67.39212,-14.36793 90.49609,-37.50391 C 497.60007,451.36012 512,419.32796 512,384 512,348.67204 497.63207,316.60788 474.49609,293.50391 451.36012,270.39993 419.32796,256 384,256 Z m 0,64 c 17.69598,0 33.63206,7.13596 45.24805,18.75195 C 440.86404,350.36794 448,366.30402 448,384 c 0,17.69598 -7.13596,33.63206 -18.75195,45.24805 C 417.63206,440.86404 401.69598,448 384,448 366.30402,448 350.36794,440.86404 338.75195,429.24805 327.13596,417.63206 320,401.69598 320,384 c 0,-17.69598 7.13596,-33.63206 18.75195,-45.24805 C 350.36794,327.13596 366.30402,320 384,320 Z" /></svg>');
    --icon-eye-cross: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8"%3F><svg viewBox="0 0 768 768" xmlns="http://www.w3.org/2000/svg"><path d="M 31.90625 0 C 23.74579 0.020928159 15.596002 3.141958 9.3769531 9.3769531 C -3.1030344 21.888941 -3.1350344 42.143059 9.3769531 54.623047 L 146.04883 191.29688 C 90.656884 238.62483 41.440556 298.75135 3.8085938 368.86328 C -0.92740151 377.79127 -1.439417 388.6727 3.3925781 398.30469 C 3.3925781 398.30469 16.064445 423.55133 39.232422 457.2793 C 53.664407 478.27128 72.447101 503.10388 95.455078 528.25586 C 124.06305 559.58383 159.5841 591.83949 201.66406 617.85547 C 252.70401 649.40744 313.85684 672 384.38477 672 C 448.1607 671.232 512.9929 652.76885 570.46484 615.71289 L 713.37695 758.62305 C 719.61195 764.85805 727.76917 767.97908 735.92969 768 L 736.09375 768 C 744.25421 767.97907 752.404 764.85804 758.62305 758.62305 C 771.10303 746.11106 771.13503 725.85694 758.62305 713.37695 L 474.5918 429.34375 L 474.36719 429.11914 L 339.67969 294.40039 C 339.42369 294.17639 339.16811 293.88881 338.91211 293.63281 L 54.623047 9.3769531 C 48.388045 3.1419514 40.230834 0.020921554 32.070312 0 L 31.90625 0 z M 384.38477 96 C 360.89679 95.712 335.10388 98.527725 309.50391 104.51172 C 292.28792 108.54371 281.60082 125.76058 285.63281 142.97656 C 289.66481 160.19255 306.87972 170.87965 324.0957 166.84766 C 344.92768 161.98366 365.56725 159.776 383.61523 160 C 439.87118 160 489.50392 177.8882 532.67188 204.57617 C 568.47984 226.72015 599.51932 254.72014 625.2793 282.91211 C 645.88728 305.47209 662.88001 327.87138 676 346.94336 C 686.46399 362.14334 694.23908 374.91231 699.45508 383.9043 C 681.9831 414.40027 662.33653 442.17607 642.56055 465.24805 C 631.07256 478.65603 632.60764 498.8792 646.01562 510.36719 C 659.42361 521.85518 679.64873 520.3201 691.13672 506.91211 C 717.31269 476.38414 742.68743 439.32823 764.19141 399.07227 C 768.9274 390.14427 769.40742 379.29605 764.60742 369.66406 C 764.60742 369.66406 751.93555 344.41547 728.76758 310.6875 C 714.33559 289.69552 695.5529 264.86487 672.54492 239.71289 C 643.93695 208.38492 608.4159 176.1273 566.33594 150.11133 C 515.29599 118.59136 454.1447 96 384.38477 96 z M 191.48438 236.73242 L 273.15234 318.40039 C 259.26436 340.51237 252.79931 365.88813 253.69531 390.91211 C 254.84731 423.61608 268.51121 455.96727 294.36719 480.03125 C 320.22316 504.09523 353.44056 515.45669 386.14453 514.30469 C 408.28851 513.53669 430.27283 507.00764 449.63281 494.84766 L 523.93555 569.15234 C 479.83959 594.72032 431.29639 607.424 383.64844 608 C 328.16049 608 278.52733 590.1118 235.35938 563.42383 C 199.55141 541.27985 168.51193 513.27986 142.75195 485.08789 C 122.14397 462.52791 105.15124 440.12862 92.03125 421.05664 C 81.59926 405.85666 73.791417 393.1209 68.607422 384.12891 C 102.19907 325.8394 144.61823 276.02386 191.48438 236.73242 z M 320.86328 366.11133 L 320.86328 366.14453 L 401.85547 447.13672 C 396.03147 449.08872 389.95184 450.14319 383.83984 450.36719 C 367.42386 450.94319 350.87916 445.28078 337.95117 433.2168 C 325.02318 421.15281 318.20881 405.05661 317.63281 388.64062 C 317.37681 381.02463 318.43128 373.40732 320.86328 366.11133 z " /></svg>');
}

.woocommerce-account.logged-in .woocommerce {
    display: grid;
    grid-column-gap: 1em;
    grid-template-columns: [full-start sidebar-start content-start] 1fr [content-end sidebar-end full-end];
}

nav.woocommerce-MyAccount-navigation {
    display: block;
    grid-column: sidebar;

    ul {
        display: flex;
        flex-flow: row wrap;
        margin: 0;
        padding: 0;
        list-style: none;
        gap: 0;

        li {
            overflow: hidden;
            flex: 1 1 12em;
            height: 0;
            transition: height 0.5s ease;

            &.is-active {
                height: 3em;

                a {
                    position: relative;

                    &:after {
                        position: absolute;
                        top: 0;
                        right: 0;
                        padding: 0.5em;
                        content: '▼';
                        color: inherit;
                    }
                }
            }
        }

        &.open li {
            height: 3em;

            li.is-active a:after {
                content: '▲';
            }
        }
    }

    a {
        display: block;
        padding: 0.5em;
        text-align: center;
        text-decoration: none;
        color: var(--colour-white);
        background-color: var(--colour-black);

        &:hover {
            color: var(--colour-secondary);
        }
    }

    .woocommerce-MyAccount-navigation-link--customer-logout,
    .woocommerce-MyAccount-navigation-link--dashboard {
        grid-column: span 2;
    }

    .woocommerce-MyAccount-navigation-link--customer-logout a {
        color: var(--colour-black);
        background-color: var(--colour-yellow);
    }

    .is-active a {
        color: var(--colour-secondary);
    }
}

.woocommerce-MyAccount-content {
    font-size: var(--font-size-r);
    margin-bottom: 1.5rem;
    padding: 0 0 1.5rem;
    background-color: var(--colour-white);
    grid-column: content;
    grid-row: span 2;
}

input, select, textarea, button, .button {
    border: none;
    border-radius: var(--border-radius);
    background-color: rgb(from var(--colour-cashmere) r g b / 0.3);
}

input[type=submit] {
    min-width: 20rem;
}

button, .button, input[type=submit] {
    background-color: var(--colour-yellow);
    padding-block: 1rem;

    &.show-password-input {
        display: inline-block;
        width: 1rem;
        margin-left: 0.5rem;
        padding: 0;
        cursor: pointer;
        vertical-align: middle;
        border: none;
        background-color: var(--colour-orange);
        mask-image: var(--icon-eye);
        mask-repeat: no-repeat;
        mask-position: center;
        mask-size: 100%;
        aspect-ratio: 1 / 1;

        &.display-password {
            mask-image: var(--icon-eye-cross);
        }
    }
}


.woocommerce-MyAccount-navigation-link--customer-logout {
    grid-column: span 2;

    a {
        color: var(--colour-black);
        background-color: var(--colour-yellow);
    }
}

a.woocommerce-MyAccount-navigation-link--customer-logout {
    grid-column: full;

    a {
        color: var(--colour-black);
        background-color: var(--colour-yellow);
    }
}

.my-customers {
    min-width: 300px;
    margin: 1em 0;
    border-radius: 0.4rem;
    background-color: var(--colour-light-grey);

    th {
        display: none;
    }

    td {
        display: block;

        &:first-child {
            padding-top: 0.5em;
        }

        &:last-child {
            padding-bottom: 0.5em;
        }

        &:before {
            font-weight: bold;
            display: inline-block;
            width: 6rem;
            content: attr(data-th) ": ";
        }

    }

    th,
    td {
        text-align: left;

        &:before {
            color: var(--colour-yellow);
        }
    }
}

.beacons .option {
    display: flex;
    margin-bottom: 1em;
    gap: 1em;
}

.acf-gallery {
    position: relative;
    display: grid;
    height: auto !important;
    border: 1px solid #F1F1F1;
    grid-auto-flow: row;

    .ui-resizable-handle {
        position: absolute;
        display: none !important;
    }

    .acf-gallery-main {
        position: relative;
        display: grid;
        height: auto !important;
        grid-template-rows: 1fr auto;
        grid-row: 1;
        grid-column: 1;
    }

    .acf-gallery-attachments {
        position: relative;
        display: grid;
        align-self: flex-start;
        justify-content: space-around;
        max-height: 60vh;
        margin: 0.4rem;
        cursor: move;
        grid-template-columns: repeat(auto-fill, 6rem);
        grid-gap: 0.4rem;
    }

    .acf-gallery-attachment {
        position: relative;
        float: none;
        width: 6rem !important;
        height: 6rem !important;
        transition: all 0.6s ease;

        img {
            position: absolute;
            width: 100%;
            height: 100%;
            padding: 0.3em;
            object-fit: contain;
        }

        .actions {
            display: none;
        }

        &:hover > .actions {
            position: absolute;
            top: 0.5rem;
            right: 0.5rem;
            display: block;
        }

        .margin {
            display: grid;
            height: 100%;
            border: 1px solid #C7C7C7;
            background: #F1F1F1;
        }

        .thumbnail {
            display: grid;
        }
    }

    .acf-gallery-side {
        position: relative;
        z-index: 2;
        display: none;
        visibility: hidden;
        overflow: hidden;
        width: auto !important;
        max-height: 0;
        padding: 0.5rem;
        transition: width 1s ease-in-out, max-height 1s ease-in-out, visibility 1s ease-in-out;
        background: #F1F1F1;
        grid-row: 1;
        grid-column: 1;

        .form-table > tbody > .acf-field {
            > .acf-label,
            > .acf-input {
                padding: 0.2em;
            }

            > .acf-label {
                width: 5em;
            }
        }

        .acf-gallery-side-inner {
            position: relative;
            right: 0;
            display: grid;
            width: auto !important;
            height: 100%;
        }

        .acf-gallery-side-info {
            display: grid;
            grid-template-columns: [full-start col1-start] 5em [col1-end col2-start] 1fr [col2-end full-end];
            grid-gap: 0.5em;

            img {
                grid-column: col1;
                grid-row: span 4;
            }
        }

        .acf-gallery-side-info > p {
            font-size: 1rem;
            line-height: 1.2em;
            margin: 0;
            word-break: break-all;
            grid-column: col2;
        }
    }

    &.-open .acf-gallery-side {
        display: block !important;
        visibility: visible;
        overflow: unset;
        max-height: 100em;
    }

    .acf-gallery-side-data {
        position: relative;
    }

    .acf-gallery-toolbar {
        position: relative;
        align-self: flex-end;
        margin: 0 0.5rem;

        .acf-hl {
            display: grid;
            align-items: center;
            grid-auto-flow: column;
            grid-gap: 0.5rem;

            &::before,
            &::after {
                display: none;
            }
        }
    }

    .acf-gallery-sort {
        display: block;
        max-width: 10em;
        margin-left: auto !important;
    }
}

.acf-field.section-heading .acf-label {
    font-size: 1.2rem;
    margin: 0.5rem 0;
    padding: 0.5rem;
    background-color: #F1F1F1;
}

.acf-repeater {
    label {
        font-weight: bold;
    }

    .description {
        font-size: 0.8em;
    }

    .acf-row-handle {
        position: relative;
        width: 16px;
        text-align: center !important;
        vertical-align: middle !important;

        &.remove {
            border-left-color: #DFDFDF;
            background: #F9F9F9;
        }

        .acf-icon {
            position: absolute;
            top: 0;
            display: none;
            margin: -8px 0 0 -2px;

            &.-minus {
                top: 50%;
            }
        }
    }

    .acf-row {
        &:hover, &.-hover {
            .acf-row-handle .acf-icon:not(.show-on-shift) {
                display: block;
            }
        }

        &.-collapsed .acf-field:not(.-collapsed-target) {
            display: none;
        }

    }

    .acf-clone {
        display: none;
    }
}

.acf-keydown-shift {
    .show-on-shift {
        display: block !important;
    }

    .hide-on-shift {
        display: none !important;
    }
}

.acf-field-m-status {
    .acf-switch {
        color: var(--colour-white);
        background-color: var(--colour-cancel);

        &.-on {
            border-color: var(--colour-turquoise);
            background-color: var(--colour-turquoise);
        }
    }
}

.market-attending {
    display: grid;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #9f9f9f;
    grid-template-columns: [date-start market-start] 1fr [date-end market-end action-start] 4.5em [action-end];
    grid-auto-flow: dense;
    grid-column-gap: 0.2em;

    .name {
        grid-column: market;
    }

    .date {
        grid-column: date;
    }

    .button {
        grid-row: span 2;
        grid-column: action;
    }
}

.woocommerce-edit-market {
    .eo-venue-map {
        display: block;
        width: 100%;
        height: 20rem;
    }

    .variations {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
        grid-auto-flow: dense;
        column-gap: 1em;
    }

    label {
        order: -1;
    }

    .variation-option {
        display: none;


        + label {
            font-weight: bold;
            margin: 0.4rem 0;
            padding: 0.5rem;
            cursor: pointer;
            background: var(--colour-secondary);

            + .variation-detail {
                display: none;
                grid-column: 1 / -1;
            }
        }

        &:checked + label {
            background: var(--colour-turquoise);


            + .variation-detail {
                display: block;
            }
        }
    }

    .variation-detail > .price {
        font-size: 1.5rem;
        font-weight: bold;
        display: block;
        max-width: max-content;
        margin: 1rem auto;
    }
}

.stallsvisited {
    display: flex;
    flex-flow: row wrap;
    gap: 1rem;

    a {
        display: grid;
        overflow: hidden;
        flex: 0 0 clamp(15rem, 25%, 20rem);
        text-decoration: none;
        border-radius: 0.2rem;
        background-color: var(--colour-light-grey);
        box-shadow: var(--colour-medium-grey) 2px 2px;
        grid-template-areas: "image title" "image info";
        grid-template-columns: 1fr 2fr;

        img {
            height: 100%;
            margin: 0;
            padding: 0;
            aspect-ratio: 1 / 1;
            grid-area: image;
        }

        .title {
            font-size: 1rem;
            font-weight: bold;
            align-self: flex-start;
            margin: 0.2rem;
            grid-area: title;
        }

        .scandate {
            align-self: flex-end;
            grid-area: info;
        }
    }
}

.woocommerce {

    th {
        text-align: left;
        vertical-align: top;
    }

    .optional {
        display: none;
    }

    a {
        &.button {
            max-width: 10em;
            margin: 0.5em 0;
            text-align: center;
            text-decoration: none;

            &:hover {
                color: var(--colour-dark-grey);
            }

            &:active,
            &:focus {
                color: var(--colour-dark-grey);
                outline: thin dotted var(--colour-light-grey);
            }

            &:visited {
                color: var(--colour-black);
            }
        }

        &.single_add_to_cart_button {
            margin: 0.5em auto;
        }
    }
}

.wc-item-meta {
    margin: 0;
    margin-left: 1em;
    padding: 0;
    list-style: none;

    li {
        display: flex;
    }

    p {
        flex: 1 1 70%;
        margin: 0;
    }

    strong {
        flex: 1 1 20%;
    }
}

.acf-field-md-add-dates-group .acf-fields {
    display: flex;
    align-items: flex-end;
    flex-flow: row wrap;

    .acf-field {
        flex: 1 1 auto;
        border: 0;
    }
}


.shop_table {
    tr {
        display: flex;
        flex-flow: row wrap;
        width: 100%;
    }

    .order-actions {
        display: flex;
        align-self: flex-start;
        justify-content: flex-end;
        margin: 0;
        padding: 0;
        gap: 0.5rem;
    }

    td, th {
        flex: 1 1 auto;
        width: 10rem;
    }

    a.woocommerce-button {
        margin: 0;
    }

    tbody {
        display: flex;
        flex-flow: column;
        gap: 0.5rem;
    }
}

@media screen and (min-width: 1050px) {
    .acf-gallery {
        min-height: 40rem;
        grid-auto-flow: column;
        grid-template-columns: 1fr min-content;

        .acf-gallery-main {
            grid-row: unset;
            grid-column: unset;
        }

        .acf-gallery-attachments {
            grid-template-columns: repeat(auto-fill, 12rem);
        }
    }

    .-open .acf-gallery .acf-gallery-attachments {
        grid-template-columns: repeat(auto-fill, 8rem);
    }

    .acf-gallery .acf-gallery-attachment {
        width: 12rem !important;
        height: 12rem !important;
    }

    .-open .acf-gallery .acf-gallery-attachment {
        width: 8rem !important;
        height: 8rem !important;
    }

    .acf-gallery .acf-gallery-side {
        width: 0 !important;
        max-height: unset;
        grid-row: unset;
        grid-column: unset;
    }

    .acf-gallery.-open .acf-gallery-side {
        width: auto !important;
        width: 24em !important;
    }


    nav.woocommerce-MyAccount-navigation ul {
        gap: 1em;


        li {
            overflow: hidden;
            height: auto;

            &.is-active {
                height: auto;

                a:after {
                    display: none;
                }
            }
        }

        &.open li {
            height: auto;
        }
    }

}