
.um .um-field .select2-container.select2-container--open .select2-dropdown .select2-results li,
.um .um-search-filter .select2-container.select2-container--open .select2-dropdown .select2-results li {
    color         : var(--e-global-color-text);
    padding       : 5px 15px 5px !important;
    transition    : background-color .25s ease-out;
    border-radius : 6px;
}

.um .um-field .select2-container.select2-container--open .select2-dropdown,
.um .um-search-filter .select2-container.select2-container--open .select2-dropdown {
    border-radius : 8px;
}

.um .um-field .select2-dropdown .select2-results li.select2-results__option.select2-results__option--highlighted,
.um .um-search-filter .select2-dropdown .select2-results li.select2-results__option.select2-results__option--highlighted {
    background-color : #F0F3F8;
}

.um .um-field .select2-dropdown .select2-results li.select2-results__option[aria-selected=true],
.um .um-search-filter .select2-dropdown .select2-results li.select2-results__option[aria-selected=true] {
    background-color : #BBB0AA;
}


.um .um-field .select2.select2-container .select2-selection .select2-selection__rendered,
.um .um-search-filter .select2.select2-container .select2-selection .select2-selection__rendered {
    padding-top : 4px;
}

.um .um-field .select2.select2-container .select2-selection .select2-selection__arrow:before,
.um .um-search-filter .select2.select2-container .select2-selection .select2-selection__arrow:before {
    font-size   : 20px !important;
    line-height : 47px;
}

.um .um-account-main {
    flex         : 1 !important;
    width        : auto !important;
    min-width    : 0;
    padding-left : 0;
}

.um .um-account-tab {
    display : none;
}

.um .um-account-tab:first-child {
    display : block;
}


.um-account-meta-img-b.uimob800-show {
    display : none !important;
}

body .um.um-account {
    display          : flex;
    justify-content  : center;
    align-items      : center;
    margin-bottom    : 0 !important;
    background-color : #F8F0E6;
}

.um-account .um-form {
    width     : 100%;
    max-width : 1330px;
    padding   : 40px 20px 60px 20px;
}

.um-clear {
    display : none;
}

.um-account .um-form form {
    display   : flex;
    gap       : 30px;
    width     : 100%;
    min-width : 0;
}

.um .um-account-side {
    position  : sticky;
    top       : 120px;
    flex      : 0 0 320px !important;
    width     : 320px !important;
    max-width : 320px !important;
}

.um .um-field {
    padding : 15px 0;
}


.site-template .um .um-field-label:not(:has(.um-tip)) {
    flex-direction : column !important;
}

.um-login .um-field {
    padding : 0 !important;
}

.um-account-meta-img {
    display : none !important;
}

.um-account-heading i {
    display : none !important;
}

.um .um-account-name {
    font-family : var(--e-global-typography-primary-font-family), Sans-serif;;
    font-size   : 18px;
    font-weight : 500;
    color       : #750031;
    text-align  : left;
    padding     : 0 !important;
}


.um .um-account-side ul {
    padding          : 20px 20px !important;
    border-radius    : 25px;
    background-color : #FFFFFF;
}

.um .um-account-side .um-account-meta {
    position       : relative;
    display        : flex;
    flex-direction : column;
    gap            : 0;
    margin-bottom  : 22px;
}

.um .um-account-side li {
    position         : relative;
    margin-bottom    : -1px !important;
    padding          : 0 !important;
    transition       : all 0.3s;
    border-radius    : 50px;
    background-color : unset;
}

.um .um-account-body .um-field:first-of-type {
    padding-top : 0 !important;
}

.um-account-side .um-account-link {
    padding : 20px 16px !important;
}

.um-account-side li a span.um-account-arrow {
    top       : 50% !important;
    right     : 16px !important;
    transform : translateY(-50%);
}

.um .um-account-side li:hover {
    background : #F8F0E6;
}

.um .um-account-side li:before {
    opacity          : 0;
    position         : absolute;
    top              : 0;
    left             : 0;
    width            : 0;
    height           : 100%;
    content          : "";
    transition       : width .35s ease-out, opacity .25s ease-out;
    border-radius    : 10px;
    background-color : var(--e-global-color-a46044a);
}

.um .um-account-side li:hover:before {
    opacity : 1;
    width   : 100%;
}

.um .um-account-side li:after {
    position         : absolute;
    top              : 0;
    left             : 50%;
    transform        : translateX(-50%);
    width            : 75%;
    height           : 1px;
    content          : "";
    border-radius    : 10px;
    background-color : var(--e-global-color-a46044a);
}

.um .um-account-side a:hover {
    background-color : unset;
}

.um-account-side li a span.um-account-icon {
    display         : flex;
    justify-content : center;
    align-items     : center;
    padding         : 0 15px 0 0 !important;
}

.um .um-account-side li a span.um-account-title {
    font-family  : var(--e-global-typography-primary-font-family);
    font-size    : 15px;
    font-weight  : 400;
    color        : #750031;
    padding-left : 5px;
}

.um .um-account-side li a span.um-account-icon,
.um .um-account-side li a.current span.um-account-icon,
.um .um-account-side li a.current:hover span.um-account-icon {
    border : none;
}

.um-account-arrow i {
    color : var(--e-global-color-accent);
}

.um .um-account-tab .um-account-body {
    padding       : 30px 35px;
    border-radius : 10px;
    background    : #FFFFFF;
}

.um .um-account-main div.um-account-heading {
    font-family   : var(--e-global-typography-primary-font-family), Sans-serif;
    font-size     : 28px;
    font-weight   : 500;
    font-style    : normal;
    line-height   : normal;
    color         : #750031;
    margin-bottom : 15px !important;
}


.um p.um-notice.success {
    font-family    : var(--e-global-typography-primary-font-family), Sans-serif;
    font-weight    : 500;
    line-height    : 178%;
    color          : #750031;
    letter-spacing : -0.56px;
    border-radius  : 8px;
    background     : var(--e-global-color-d645804);
}

.um .um-field-error {
    font-family    : var(--e-global-typography-primary-font-family), Sans-serif;
    font-weight    : 500;
    line-height    : 178%;
    letter-spacing : -0.56px;
    border-radius  : 8px;
}

/*RESPONSIVE*/

.um .um-form .um-account-main {
    max-width : unset;
}

/* Désactiver les anciens breakpoints uimob */
.uimob340-show,
.uimob500-show {
    display : none !important;
}

.uimob340-hide,
.uimob500-hide {
    display : block !important;
}
/*phone*/
@media (max-width : 767px) {

    .um-account .um-form {
        padding : 25px 15px;
    }

    .um .um-account-side {
        position : relative;
        top      : 0;
    }

    .um .um-account-main {
        padding-left : 0;
    }

    .um .um-account-tab .um-account-body {
        padding       : 20px 15px;
        border-radius : 10px;
    }

    .um .um-account-main div.um-account-heading {
        font-size     : 22px;
        margin-bottom : 10px !important;
    }

    .um .um-account-name {
        font-size : 16px;
    }

    .um .um-account-side ul {
        padding : 15px !important;
    }

    .um-account-side .um-account-link {
        padding : 15px 12px !important;
    }

    .um .um-account-side li a span.um-account-title {
        font-size : 14px;
    }

    .picker__box, .picker__nav--next:hover, .picker__nav--prev:hover, .um .um-field-group-head, .um .um-members-pagi span.current, .um .um-members-pagi span.current:hover, .um .um-profile-nav-item.active a, .um .um-profile-nav-item.active a:hover, .um-modal-btn, .um-modal-btn.disabled, .um-modal-btn.disabled:hover, .um-modal-header, .upload, div.uimob800 .um-account-side li a.current, div.uimob800 .um-account-side li a.current:hover {
        background : unset !important;
    }
}

/*tablet*/
@media (min-width : 768px) and (max-width : 1024px) {

    .um-account .um-form {
        padding : 30px 15px 50px 15px;
    }

    .um .um-account-side {
        position : relative;
        top      : 0;
    }


    .um .um-account-tab .um-account-body {
        padding : 25px 20px;
    }

    .um .um-account-main div.um-account-heading {
        font-size : 24px;
    }

    .um .um-account-side ul {
        padding : 18px !important;
    }

    .um-account-side .um-account-link {
        padding : 18px 14px !important;
    }
}

/*mobile and tablet*/
@media (max-width : 1024px) {

    body .um.um-account {
        width : 100%;
    }

    .um-form {
        flex-direction : column;
    }

    .um-account .um-form form {
        flex-direction : column;
    }

    .um .um-account-main {
        padding-top  : 20px;
        padding-left : 0;
    }

    .um .um-account-side {
        position   : relative !important;
        top        : 0 !important;
        flex       : 0 0 100% !important;
        width      : 100% !important;
        max-width  : 100% !important;
        max-height : 450px;
    }

    .um .um-account-main {
        flex      : 0 0 100% !important;
        width     : 100% !important;
        max-width : 100% !important;
    }

    .um .um-account-side .um-account-meta {
        margin-bottom : 15px;
    }

    .um .um-field {
        padding : 12px 0;
    }

    /* Table responsive - Vue en cartes pour mobile et tablette */
    .vvv-table-wrapper {
        overflow      : visible;
        border-radius : 0;
        background    : transparent;
        box-shadow    : none;
    }

    .vvv-table-header {
        display : none !important;
    }

    .vvv-table-body {
        display        : flex;
        flex-direction : column;
        gap            : 16px;
        background     : transparent;
    }

    .vvv-table-row {
        overflow       : hidden;
        display        : flex;
        flex-direction : column;
        gap            : 0;
        min-width      : auto;
        height         : auto;
        margin-bottom  : 0;
        padding        : 0;
        border         : none;
        border-radius  : 12px;
        background     : #FFFFFF;
        box-shadow     : 0 2px 8px rgba(0, 0, 0, 0.08);
    }

    .vvv-table-row:hover {
        background-color : #FFFFFF;
    }

    .vvv-td {
        text-align      : left !important;
        display         : flex;
        flex            : none !important;
        justify-content : flex-start;
        align-items     : center;
        gap             : 8px;
        width           : 100% !important;
        min-width       : 0;
        padding         : 12px 16px !important;
        border-bottom   : 1px solid #F5F2EE;
    }

    .vvv-td:last-child {
        border-bottom : none;
    }

    .vvv-td-label {
        font-size      : 11px;
        font-weight    : 600;
        color          : #750031;
        letter-spacing : 0.5px;
        text-transform : uppercase;
        display        : inline-block;
        flex-shrink    : 0;
        margin-right   : 8px;
    }

    .vvv-td-value {
        display : inline;
    }

    .vvv-td-reference {
        font-size       : 16px;
        font-weight     : 600;
        color           : #750031;
        justify-content : space-between;
        align-items     : center;
        order           : -2;
        padding         : 16px !important;
        border-bottom   : none;
        background      : #F8F0E6;
    }

    .vvv-td-reference::before {
        display : none;
    }

    .vvv-td-date,
    .vvv-td-bottles,
    .vvv-td-status,
    .vvv-td-estimation {
        font-size   : 14px;
        font-weight : 500;
    }

    .vvv-td-status {
        align-items : center;
        gap         : 8px;
    }

    .vvv-td-status .vvv-badge {
        width     : auto;
        min-width : 80px;
    }

    .vvv-td-estimation {
        align-items : center;
    }

    .vvv-td-validation {
        padding    : 16px !important;
        border-top : 1px solid #F5F2EE;
        background : #FAFAFA;
    }

    .vvv-td-validation::before {
        display : none;
    }

    .vvv-td-validation .vvv-btn-pill {
        font-size : 15px;
        width     : 100%;
        height    : 42px;
    }

    .vvv-td-actions {
        position        : absolute;
        top             : 26px;
        right           : 30px !important;
        justify-content : flex-end !important;
        gap             : 12px;
        order           : -1;
        width           : auto !important;
        padding         : 0 !important;
        border          : none;
        background      : transparent;
    }

    .vvv-td-actions::before {
        display : none;
    }

    .vvv-table-row {
        position : relative;
    }

    .vvv-btn-icon {
        width         : 32px !important;
        height        : 32px !important;
        border-radius : 8px;
        background    : rgba(255, 255, 255, 0.9) !important;
        box-shadow    : 0 1px 3px rgba(0, 0, 0, 0.1);
    }

    .vvv-btn-icon:hover {
        background : rgba(255, 255, 255, 1) !important;
    }

    .vvv-btn-icon img,
    .vvv-btn-icon svg {
        width  : 18px !important;
        height : 18px !important;
    }

    .vvv-dropdown-menu {
        right : 0;
        left  : auto;
    }

    /* Details row mobile */
    .vvv-details-row {
        margin-top    : -8px;
        margin-bottom : 8px;
        border-radius : 12px;
        box-shadow    : 0 2px 8px rgba(0, 0, 0, 0.08);
    }

    .vvv-wines-grid {
        grid-template-columns : 1fr;
    }

    .vvv-wine-card {
        display        : flex;
        flex-direction : row;
        align-items    : flex-start;
        gap            : 12px;
    }

    .vvv-wine-photo {
        flex-shrink : 0;
        width       : 80px;
        height      : 80px;
    }

    .vvv-wine-info {
        flex : 1;
    }
}

/*desktop*/
@media (min-width : 1025px) {
    .vvv-td-label {
        display : none;
    }
}

/*laptop 1*/
@media (min-width : 1025px) and (max-width : 1439px) {

}

/*laptop 2*/
@media (min-width : 1440px) and (max-width : 1700px) {

}

/*RESPONSIVE*/
