/**
 * VendezVosVins Core - Styles Frontend
 */

/* ========================================
   VARIABLES CSS
   ======================================== */
:root {
    --vvv-color-maroon     : #750031;
    --vvv-color-orange     : #F39200;
    --vvv-color-white      : #FFFFFF;
    --vvv-color-gray-light : #F9F9F9;
    --vvv-color-gray       : #E0E0E0;
    --vvv-color-gray-dark  : #666666;
    --vvv-color-text       : #333333;
    --vvv-color-success    : #27AE60;
    --vvv-color-error      : #E74C3C;
    --vvv-border-radius    : 8px;
    --vvv-transition       : all 0.3s ease;
}

/* ========================================
   ANIMATIONS
   ======================================== */
@keyframes fadeIn {
    from { opacity : 0; transform : translateY(10px); }
    to { opacity : 1; transform : translateY(0); }
}

@keyframes spin {
    to { transform : rotate(360deg); }
}

@keyframes guidePulse {
    0%, 100% {
        opacity   : 1;
        transform : scale(1);
    }
    50% {
        opacity   : 0.5;
        transform : scale(1.02);
    }
}

/* ========================================
   CONTAINERS & LAYOUT
   ======================================== */
.vvv-form-wrapper {
    display        : flex;
    flex-direction : column;
    align-items    : center;
    max-width      : 1400px;
    margin         : 0 auto;
    border-radius  : var(--vvv-border-radius);
    background     : transparent;
}

.vvv-form-container {
    width     : 100%;
    max-width : 900px;
}

.vvv-form {
    width : 100%;
}

.vvv-bulk-photos-action {
    display         : flex;
    flex-wrap       : wrap;
    gap             : 16px;
    justify-content : center;
    margin-bottom   : 20px;
}

#vvv-wine-form-fields .vvv-wine-header {
    border : none !important;
}

/* ========================================
   FORMULAIRES & INPUTS
   ======================================== */
.vvv-form-group {
    margin-bottom : 20px;
}

.vvv-form-group label {
    font-size     : 14px;
    font-weight   : 600;
    color         : var(--vvv-color-text);
    display       : block;
    margin-bottom : 8px;
}

.vvv-form-group input[type="text"],
.vvv-form-group input[type="email"],
.vvv-form-group input[type="tel"],
.vvv-form-group input[type="number"],
.vvv-form-group select,
.vvv-form-group textarea {
    font-size     : 15px;
    width         : 100%;
    padding       : 12px 15px;
    transition    : var(--vvv-transition);
    border        : 1px solid var(--vvv-color-gray);
    border-radius : 6px;
}

.vvv-form-group input:focus,
.vvv-form-group select:focus,
.vvv-form-group textarea:focus {
    border-color : var(--vvv-color-maroon);
    outline      : none;
    box-shadow   : 0 0 0 3px rgba(94, 17, 47, 0.1);
}

/* Champs de message - Design personnalisé */
#vvv-message,
#vvv-excel-message {
    font-family   : 'Gotham Rounded', sans-serif;
    font-size     : 15px;
    font-weight   : 400;
    line-height   : normal;
    color         : #1A1A22;
    padding       : 13px 14px;
    border        : 1px solid #BBB0AA;
    border-radius : 10px;
    background    : transparent;
}

#vvv-message::placeholder,
#vvv-excel-message::placeholder {
    font-family : 'Gotham Rounded', sans-serif;
    font-size   : 15px;
    font-weight : 400;
    color       : #7F6B73;
}

#vvv-message:focus,
#vvv-excel-message:focus {
    border-color : #BBB0AA;
    outline      : none;
    box-shadow   : 0 0 0 3px rgba(187, 176, 170, 0.15);
}

.vvv-form-row {
    display               : grid;
    gap                   : 15px;
    grid-template-columns : repeat(2, 1fr);
}

.vvv-checkbox-label {
    font-weight : 400;
    display     : flex;
    align-items : flex-start;
    gap         : 10px;
    cursor      : pointer;
}

.vvv-checkbox-label input[type="checkbox"] {
    width      : auto;
    margin-top : 3px;
}

/* Champs de contact */
.vvv-contact-fields {
    margin-top    : 40px;
    padding       : 30px;
    border-top    : 2px solid var(--vvv-color-gray);
    border-radius : var(--vvv-border-radius);
    background    : var(--vvv-color-white);
}

.vvv-contact-fields h3 {
    font-size   : 20px;
    font-weight : 500;
    color       : #750031;
    text-align  : center;
    margin      : 0 0 25px;
    padding     : 0;
}

.vvv-contact-fields .vvv-form-group label {
    font-size     : 15px;
    font-weight   : 500;
    color         : #750031;
    margin-bottom : 8px;
}

.vvv-contact-fields .vvv-form-group input[type="text"],
.vvv-contact-fields .vvv-form-group input[type="email"],
.vvv-contact-fields .vvv-form-group input[type="tel"] {
    font-size     : 14px;
    color         : #141219;
    width         : 100%;
    height        : 50px;
    margin-bottom : 15px;
    padding       : 15px;
    transition    : border-color 0.3s ease, box-shadow 0.3s ease;
    border        : 1px solid #C0C0C0;
    border-radius : 5px;
    background    : var(--vvv-color-white);
}

.vvv-contact-fields .vvv-form-group input::placeholder {
    font-size   : 14px;
    font-weight : 400;
    color       : #848484;
}

.vvv-contact-fields .vvv-form-group input:focus {
    border-color : #750031;
    outline      : none;
    box-shadow   : 0 0 0 3px rgba(117, 0, 49, 0.1);
}

/* ========================================
   BOUTONS
   ======================================== */
.vvv-btn {
    font-size       : 16px;
    font-weight     : 600;
    text-decoration : none;
    display         : inline-flex;
    align-items     : center;
    gap             : 8px;
    padding         : 12px 24px;
    cursor          : pointer;
    transition      : var(--vvv-transition);
    border          : none;
    border-radius   : 6px;
}

.vvv-btn .dashicons {
    font-size : 18px;
}

.vvv-btn-primary {
    color      : var(--vvv-color-white);
    background : var(--vvv-color-maroon);
}

.vvv-btn-primary:hover {
    transform  : translateY(-2px);
    background : #4A0D25;
    box-shadow : 0 4px 12px rgba(94, 17, 47, 0.3);
}

.vvv-btn-secondary {
    color      : var(--vvv-color-white);
    background : var(--vvv-color-orange);
}

.vvv-btn-secondary:hover {
    transform  : translateY(-2px);
    background : #D67F00;
    box-shadow : 0 4px 12px rgba(243, 146, 0, 0.3);
}

.vvv-btn-outline {
    color      : var(--vvv-color-maroon);
    border     : 2px solid var(--vvv-color-maroon);
    background : transparent;
}

.vvv-btn-outline:hover {
    color      : var(--vvv-color-white);
    background : var(--vvv-color-maroon);
}

.vvv-btn-small {
    font-size : 14px;
    padding   : 8px 16px;
}

.vvv-btn:disabled {
    opacity : 0.6;
    cursor  : not-allowed;
}

/* Bouton texte avec icône */
.vvv-btn-text {
    font-size     : 14px !important;
    font-weight   : 500 !important;
    color         : var(--vvv-color-maroon) !important;
    display       : flex !important;
    align-items   : center;
    gap           : 10px;
    padding       : 12px !important;
    cursor        : pointer !important;
    transition    : var(--vvv-transition);
    border        : none !important;
    border-radius : 50px !important;
    background    : #F7F3EE !important;
}


.vvv-btn-text svg,
.vvv-btn-text img {
    width  : 18px;
    height : 18px;
}

/* Bouton icône de suppression */
.vvv-btn-icon-delete {
    display       : flex !important;
    padding       : 0 !important;
    cursor        : pointer !important;
    transition    : var(--vvv-transition);
    border        : none !important;
    border-radius : 50px !important;
    background    : #F7F3EE !important;
}


.vvv-btn-icon-delete svg,
.vvv-btn-icon-delete img {
    width  : 40px;
    height : 40px;
}

/* Actions du formulaire */
.vvv-form-actions {
    margin : 30px 0;
}

.vvv-form-submit {
    text-align      : center;
    display         : flex;
    flex-wrap       : wrap;
    justify-content : center;
    align-items     : center;
    gap             : 16px;
    margin-top      : 30px;
}

.vvv-form-submit button {
    width     : 100%;
    max-width : 480px;
}

.vvv-form-submit .vvv-btn {
    min-width : 250px;
}

/* ========================================
   SÉLECTEUR DE MÉTHODE
   ======================================== */
.vvv-method-selector {
    overflow        : hidden;
    display         : flex;
    flex-direction  : row;
    justify-content : center;
    gap             : 60px;
    width           : min(980px, 100%);
    border-radius   : 15px;
}

.vvv-method-selector-inline {
    overflow       : hidden;
    display        : flex;
    flex-direction : column;
    max-width      : 360px;
    margin         : 30px auto;
    border-radius  : 15px;
}

.vvv-method-card {
    position       : relative;
    overflow       : hidden;
    display        : flex;
    flex           : 1;
    flex-direction : column;
    align-items    : stretch;
    gap            : 0;
    min-height     : 480px;
    padding        : 0;
    cursor         : pointer;
    transition     : var(--vvv-transition);
    border         : none;
    border-bottom  : 1px solid #F3F1EC;
    border-radius  : 15px;
    background     : var(--vvv-color-white);
}

.vvv-method-card:hover {
    background : #FAFAFA;
}

.vvv-method-cartouche {
    position            : absolute;
    top                 : 0;
    right               : 0;
    left                : 0;
    height              : 270px;
    border-radius       : 15px 15px 0 0;
    background-repeat   : no-repeat;
    background-position : center top;
    background-size     : cover;
}

.vvv-method-content {
    position       : relative;
    display        : flex;
    flex-direction : column;
    align-items    : center;
    gap            : 22px;
    margin-top     : auto;
    padding        : 280px 40px 40px;

}

.vvv-method-icon {
    flex-shrink         : 0;
    width               : 25px;
    height              : 20px;
    background-repeat   : no-repeat;
    background-position : center;
    background-size     : contain;
}

.vvv-method-icon img {
    display : none;
}

.vvv-method-title {
    font-family : 'Gotham Rounded', sans-serif;
    font-size   : 21px;
    font-weight : 500;
    line-height : normal;
    color       : #750031;
    text-align  : center;
    margin      : 0;
    padding     : 0;
}

.vvv-method-btn {
    width     : 280px;
    min-width : 280px;
    max-width : 280px;
}

.vvv-method-selector-inline .vvv-method-card {
    display         : flex !important;
    flex-direction  : column;
    justify-content : center;
    align-items     : stretch;
    gap             : 15px;
    padding         : 22px 40px 30px 40px;
    border-bottom   : 1px solid #F3F1EC;
}

.vvv-method-selector-inline .vvv-method-card:first-child {
    border-top-left-radius  : 15px;
    border-top-right-radius : 15px;
}

.vvv-method-selector-inline .vvv-method-card:last-child {
    border-bottom              : none;
    border-bottom-right-radius : 15px;
    border-bottom-left-radius  : 15px;
}

.vvv-method-selector-inline .vvv-method-card .vvv-method-icon {
    margin        : auto;
    margin-bottom : -10px;

}
/* ========================================
   FORMULAIRE DE VIN
   ======================================== */
.vvv-wine-form-section {
    margin-bottom : 25px;
    padding       : 20px;
    border-radius : 8px;
    background    : #FFFFFF;
}

.vvv-wine-header {
    display         : flex;
    justify-content : space-between;
    align-items     : center;
    margin-bottom   : 20px;
    padding-bottom  : 15px;
    border-bottom   : 1px solid #E8E8E8;
}

.vvv-wine-header h3,
.vvv-wine-header h4 {
    font-family : var(--e-global-typography-primary-font-family);
    font-size   : 20px;
    font-weight : 500;
    color       : var(--vvv-color-maroon);
    margin      : 0;
}

.vvv-wine-actions {
    display     : flex;
    align-items : center;
    gap         : 10px;
}

.vvv-wine-photo-section {
    display        : flex;
    flex-direction : column;
    align-items    : stretch;
    gap            : 15px;
    margin-bottom  : 20px;
}

.vvv-ai-hint {
    display      : inline-flex;
    align-items  : center;
    gap          : 5px;
    margin-top   : 8px;
    padding      : 5px 11px;
    background   : linear-gradient(135deg, #fff8f0, #fff0f5);
    border       : 1px solid rgba(117, 0, 49, 0.18);
    border-radius: 20px;
    color        : #750031;
    font-size    : 11px;
    font-weight  : 500;
    line-height  : 1.4;
}

.vvv-ai-hint-star {
    flex-shrink  : 0;
    color        : var(--e-global-color-accent);
    font-size    : 10px;
    line-height  : 1;
}

/* ========================================
   FILEPOND CUSTOMIZATION
   ======================================== */

/* Conteneur principal FilePond */
.filepond--root {
    font-family : 'Gotham Rounded', sans-serif;
    max-width   : 100%;
}

.filepond--drop-label {
    display         : flex;
    justify-content : center;
    align-items     : center;
    height          : 130px;
    min-height      : 130px;
}

.filepond--drop-label.filepond--drop-label label {
    color : #1A1A22 !important;
}

/* Panel de drop (zone avec bordure pointillée) */
.filepond--panel-root {
    border        : 2px dashed #D0CED6;
    border-radius : 6px;
    background    : var(--vvv-color-white);
}

.filepond--panel-root:hover {
    border-color : var(--vvv-color-maroon);
    background   : #FAFAFA;
}

/* Texte de la zone de drop */
.filepond--drop-label label {
    font-size   : 15px;
    font-weight : 400;
    line-height : 22px;
    color       : #1A1A22;
    text-align  : center;
    gap         : 8px;
    max-width   : 240px;
    margin      : 0 auto;
    cursor      : pointer;
}

/* Icône SVG au-dessus du texte */
.filepond--drop-label label::before {
    position            : relative;
    left                : 50%;
    transform           : translateX(-50%);
    display             : block;
    width               : 20px;
    height              : 23px;
    margin-bottom       : 5px;
    content             : '';
    background-image    : url('../img/file-upload.svg');
    background-repeat   : no-repeat;
    background-position : center;
    background-size     : contain;
}

/* Style du lien "Cliquez-ici" */
.vvv-upload-link {
    font-weight              : 500;
    text-decoration          : underline;
    text-decoration-skip-ink : none;
    text-underline-position  : from-font;
    text-decoration-style    : solid;
}

/* Preview de l'image - Fix fond noir */
.filepond--root .filepond--item-panel {
    background-color: #F7F3EE !important;
}

.filepond--root .filepond--image-preview-wrapper,
.filepond--root .filepond--image-preview,
.filepond--root .filepond--image-clip,
.filepond--root .filepond--image-canvas-wrapper,
.filepond--root .filepond--image-bitmap {
    background-color: #F7F3EE !important;
}

/* Overlay de la preview - rendre transparent pour voir le fond */
.filepond--root .filepond--image-preview-overlay,
.filepond--root .filepond--image-preview-overlay-idle,
.filepond--root .filepond--image-preview-overlay-success,
.filepond--root .filepond--image-preview-overlay-failure {
    color: transparent !important;
}

/* File wrapper et file info */
.filepond--root .filepond--file-wrapper {
    background-color: #F7F3EE !important;
}

.filepond--root .filepond--file {
    background-color: #F7F3EE !important;
}

/* Titre et infos du fichier */
.filepond--root .filepond--file-info-main,
.filepond--root .filepond--file-info-sub {
    color: #750031 !important;
}

/* Bouton de suppression (croix) */
.filepond--root .filepond--file-action-button {
    background-color: #F7F3EE !important;
    border-radius: 50% !important;
    cursor: pointer;
}

.filepond--root .filepond--file-action-button svg {
    fill: #750031 !important;
}

/* Item avec fichier */
.filepond--item {
    width : 100%;
}

/* Bouton de suppression */
.filepond--file-action-button {
    cursor : pointer;
}

.filepond--file-action-button:hover {
    box-shadow : 0 0 0 0.125em rgba(117, 0, 49, 0.3);
}

.filepond--file-action-button[data-align*="bottom"][data-align*="center"] {
    background-color : var(--vvv-color-maroon);
}

/* État de chargement */
.filepond--file-status {
    font-size : 13px;
    color     : var(--vvv-color-gray-dark);
}

/* Progress bar */
.filepond--file-status-main {
    color : var(--vvv-color-text);
}

/* Adapter la largeur sur mobile et desktop */
.vvv-wine-photo-mobile .filepond--root {
    max-width : 100%;
}

.vvv-wine-photo-desktop .filepond--root {
    max-width : 100%;
}

/* ========================================
   FILEPOND EXCEL - Design personnalisé
   ======================================== */
.vvv-filepond-excel.filepond--root {
    text-align : left !important;
}

.vvv-filepond-excel.filepond--root .filepond--list {
    text-align      : left !important;
    justify-content : flex-start !important;
}

.vvv-filepond-excel.filepond--root .filepond--item {
    text-align : left !important;
    width      : 100% !important;
}

.vvv-filepond-excel.filepond--root .filepond--item .filepond--file {
    text-align      : left !important;
    display         : flex !important;
    justify-content : space-between !important;
    align-items     : center !important;
    width           : 100% !important;
    padding         : 12px 8px !important;
    border-radius   : 6px !important;
    background      : #F48B00 !important;
}

.vvv-filepond-excel.filepond--root .filepond--item .filepond--file-info {
    color           : var(--vvv-color-white) !important;
    text-align      : left !important;
    position        : relative !important;
    left            : 0 !important;
    transform       : translate3d(0px, 0px, 0px) !important;
    display         : flex !important;
    flex            : 1 !important;
    flex-direction  : column !important;
    justify-content : flex-start !important;
    align-items     : flex-start !important;
    padding-left    : 16px !important;
}

.vvv-filepond-excel.filepond--root .filepond--item .filepond--file-info-main {
    font-weight : 400 !important;
    color       : var(--vvv-color-white) !important;
    text-align  : left !important;
}

.vvv-filepond-excel.filepond--root .filepond--item .filepond--file-info-sub {
    font-weight : 400 !important;
    color       : var(--vvv-color-white) !important;
    text-align  : left !important;
    opacity     : 0.8 !important;
}

.vvv-filepond-excel.filepond--root .filepond--file-action-button {
    color            : var(--vvv-color-white) !important;
    position         : static !important;
    flex-shrink      : 0 !important;
    margin-right     : 10px !important;
    background-color : transparent !important;
}

.vvv-filepond-excel.filepond--root .filepond--file-action-button[style*="visibility: hidden"],
.vvv-filepond-excel.filepond--root .filepond--file-action-button[disabled] {
    display : none !important;
}

.vvv-filepond-excel.filepond--root .filepond--file-action-button:hover {
    background-color : rgba(255, 255, 255, 0.2) !important;
    box-shadow       : 0 0 0 0.125em rgba(255, 255, 255, 0.3) !important;
}

.vvv-filepond-excel.filepond--root .filepond--file-action-button svg {
    fill : var(--vvv-color-white) !important;
}

.vvv-filepond-excel.filepond--root .filepond--action-remove-item {
    background-color : transparent !important;
}

.vvv-filepond-excel.filepond--root .filepond--file-status {
    color     : var(--vvv-color-white) !important;
    position  : relative !important;
    left      : 0 !important;
    transform : translate3d(0px, 0px, 0px) !important;
}

.vvv-filepond-excel.filepond--root .filepond--file-status-main {
    color : var(--vvv-color-white) !important;
}

.vvv-filepond-excel.filepond--root .filepond--file-wrapper {
    text-align    : left !important;
    display       : flex !important;
    align-items   : center !important;
    width         : 100% !important;
    border-radius : 6px !important;
}

.vvv-filepond-excel.filepond--root .filepond--item-panel {
    text-align    : left !important;
    border-radius : 6px !important;
    background    : #F48B00 !important;
}

.vvv-filepond-excel.filepond--root .filepond--processing-complete-indicator,
.vvv-filepond-excel.filepond--root .filepond--progress-indicator {
    display : none !important;
}

.vvv-form-section-title {
    font-size   : 15px;
    font-weight : 500;
    color       : var(--vvv-color-maroon);
    margin      : 25px 0 15px;
    padding-top : 20px;
    border-top  : 1px solid #E8E8E8;
}

.vvv-form-group .vvv-niveau-help-link {
    font-size       : 14px !important;
    font-weight     : 500 !important;
    color           : #000000 !important;
    text-align      : right;
    text-decoration : underline;
    display         : flex !important;
    justify-content : flex-end;
    width           : 100%;
    margin-top      : 8px;
}

.vvv-form-group .vvv-niveau-help-link:hover {
    color : var(--vvv-color-maroon);
}

/* ========================================
   LISTE DES VINS
   ======================================== */
.vvv-wines-list {
    display        : flex;
    flex-direction : column;
    gap            : 15px;
    margin-bottom  : 30px;
}

.vvv-wine-list-item {
    display        : flex;
    flex-direction : column;
    gap            : 10px;
    padding        : 20px 60px;
    border-radius  : 15px;
    background     : var(--vvv-color-white);
}

.vvv-wine-list-header {
    display         : flex;
    justify-content : space-between;
    align-items     : center;
    width           : 100%;
}

.vvv-wine-list-title {
    font-family : 'Gotham Rounded', sans-serif;
    font-size   : 20px;
    font-weight : 500;
    line-height : normal;
    color       : #750031;
    margin      : 0;
    padding     : 0;
}

.vvv-wine-title-separator {
    color : #750031;
}

.vvv-wine-appellation-text {
    color : #750031;
}

/* Boutons d'action dans la liste des vins (même style que .vvv-btn-text et .vvv-btn-icon-delete) */
.vvv-btn-action {
    display       : flex !important;
    align-items   : center;
    cursor        : pointer !important;
    transition    : var(--vvv-transition);
    border        : none !important;
    border-radius : 50px !important;
    background    : #F7F3EE !important;
}

.vvv-btn-duplicate {
    font-size   : 14px !important;
    font-weight : 500 !important;
    color       : var(--vvv-color-maroon) !important;
    gap         : 10px;
    padding     : 12px !important;
}

.vvv-btn-duplicate img {
    width  : 18px;
    height : 18px;
}

.vvv-btn-icon {
    padding : 0 !important;
}

.vvv-btn-icon img,
.vvv-btn-icon svg {
    width  : 40px;
    height : 40px;
}

.vvv-wine-list-separator {
    width      : 100%;
    height     : 1px;
    background : #EDE9E3;
}

.vvv-wine-list-summary {
    display : flex;
}

.vvv-wine-list-details {
    font-family : 'Gotham Rounded', sans-serif;
    font-size   : 13px;
    font-weight : 500;
    line-height : 28px;
    color       : #3C322F;
}

/* Bouton Ajouter un vin */
.vvv-add-wine-btn-container {
    text-align : center;
    margin     : 30px 0;
}

.vvv-add-wine-btn {
    min-width : 250px;
}

/* ========================================
   INTERFACE EXCEL
   ======================================== */
.vvv-excel-wrapper {
    max-width : 900px;
    margin    : 0 auto;
}

.vvv-excel-container {
    margin        : 0 auto;
    padding       : 40px 60px;
    border-radius : 15px;
    background    : var(--vvv-color-white);
}

.vvv-excel-message-group {
    max-width  : 900px;
    margin     : 30px auto 0;
    padding    : 0;
    background : transparent;
}

.vvv-excel-title {
    font-family   : 'Gotham Rounded', sans-serif;
    font-size     : 20px;
    font-weight   : 500;
    line-height   : normal;
    color         : #750031;
    text-align    : left;
    margin-bottom : 20px;
}

.vvv-excel-subtitle {
    font-family   : 'Gotham Rounded', sans-serif;
    font-size     : 15px;
    font-weight   : 500;
    line-height   : normal;
    color         : #750031;
    margin-top    : 20px;
    margin-bottom : 6px;
}

.vvv-excel-info {
    text-align    : left;
    margin-bottom : 20px;
}

.vvv-excel-info p {
    font-family   : 'Gotham Rounded', sans-serif;
    font-size     : 15px;
    font-weight   : 400;
    line-height   : 20px;
    color         : #67565D;
    margin-bottom : 0;
}

.vvv-link-download {
    font-family              : 'Gotham Rounded', sans-serif;
    font-size                : 15px;
    font-weight              : 500;
    line-height              : 26px;
    color                    : #750031;
    text-decoration          : underline;
    display                  : inline-block;
    text-decoration-skip-ink : none;
    text-underline-position  : from-font;
    text-decoration-style    : solid;
}

.vvv-link-download:hover {
    color : var(--vvv-color-orange);
}

.vvv-excel-upload-zone,
.vvv-excel-photos-zone {
    display        : flex;
    flex-direction : column;
    align-items    : center;
    gap            : 20px;
    padding        : 40px 20px;
    cursor         : pointer;
    transition     : var(--vvv-transition);
    border         : 2px dashed #D0D0D0;
    border-radius  : 8px;
    background     : #FAFAFA;
}

.vvv-excel-upload-zone:hover,
.vvv-excel-photos-zone:hover {
    border-color : var(--vvv-color-maroon);
    background   : #F5F5F5;
}

.vvv-excel-upload-icon,
.vvv-excel-photos-icon {
    width  : 50px;
    height : 50px;
}

.vvv-excel-upload-icon svg,
.vvv-excel-photos-icon svg {
    width  : 100%;
    height : 100%;
}

.vvv-excel-upload-text,
.vvv-excel-photos-text {
    font-size   : 14px;
    line-height : 1.5;
    color       : var(--vvv-color-gray-dark);
    text-align  : center;
    margin      : 0;
}

.vvv-excel-upload-text strong,
.vvv-excel-photos-text strong {
    color : var(--vvv-color-maroon);
}

/* ========================================
   MODAL CAMÉRA
   ======================================== */
.vvv-camera-modal {
    position        : fixed;
    top             : 0;
    right           : 0;
    bottom          : 0;
    left            : 0;
    z-index         : 99999;
    display         : flex;
    justify-content : center;
    align-items     : stretch;
    background      : rgba(0, 0, 0, 0.95);
}

.vvv-camera-container {
    position       : relative;
    overflow-x     : hidden;
    overflow-y     : auto;
    display        : flex;
    flex-direction : column;
    align-items    : center;
    gap            : 14px;
    box-sizing     : border-box;
    width          : 100%;
    height         : 100%;
    padding        : 24px 20px 28px;
    background     : white;
}

.vvv-camera-close {
    position        : static !important;
    z-index         : 100 !important;
    display         : flex !important;
    justify-content : center !important;
    align-items     : center !important;
    align-self      : flex-end;
    width           : 38px !important;
    height          : 38px !important;
    margin          : 0 !important;
    padding         : 0 !important;
    cursor          : pointer !important;
    transition      : var(--vvv-transition) !important;
    border          : none !important;
    background      : transparent !important;
}

.vvv-camera-close:hover {
    opacity : 0.7;
}

.vvv-camera-close svg {
    width  : 38px;
    height : 38px;
}

.vvv-camera-close svg circle {
    fill : #F9F6F3;
}

.vvv-camera-icon {
    display         : flex;
    justify-content : center;
    align-items     : center;
}

.vvv-camera-title {
    font-family : 'Gotham Rounded', sans-serif;
    font-size   : 21px;
    font-weight : 500;
    color       : #750031;
    text-align  : center;
    width       : 100%;
    max-width   : 320px;
    margin      : 0;
    padding     : 0 12px;
}

.vvv-camera-viewport {
    position        : relative;
    overflow        : hidden;
    display         : flex;
    justify-content : center;
    align-items     : center;
    width           : 88vw;
    max-width       : 320px;
    height          : clamp(220px, 48vh, 430px);
    border-radius   : 7px;
}

#vvv-camera-video {
    width      : 100%;
    height     : 100%;
    object-fit : cover;
}

#vvv-camera-canvas {
    display : none;
}

.vvv-camera-overlay {
    position        : absolute;
    top             : 0;
    right           : 0;
    bottom          : 0;
    left            : 0;
    display         : flex;
    justify-content : center;
    align-items     : center;
    pointer-events  : none;
}

.vvv-bottle-guide {
    position      : relative;
    width         : 36%;
    max-width     : 140px;
    height        : 78%;
    max-height    : 360px;
    border        : 3px solid #F48B00;
    border-radius : 15px;
    background    : transparent;
    box-shadow    : 0 0 0 9999px rgba(0, 0, 0, 0.5);
}

.vvv-bottle-guide::after {
    position      : absolute;
    top           : -3px;
    right         : -3px;
    bottom        : -3px;
    left          : -3px;
    content       : '';
    animation     : guidePulse 2s ease-in-out infinite;
    border        : 3px solid #F48B00;
    border-radius : 15px;
}

.vvv-camera-instructions {
    font-family    : 'Gotham Rounded', sans-serif;
    font-size      : 15px;
    font-weight    : 400;
    line-height    : 20px;
    color          : #7F6B73;
    text-align     : center;
    width          : 100%;
    max-width      : 360px;
    margin         : auto 0 0;
    padding        : 0 20px;
    pointer-events : none;
    background     : transparent;
}

.vvv-camera-controls {
    display         : flex;
    justify-content : flex-end;
    align-items     : center;
    align-self      : flex-end;
}

.vvv-camera-btn {
    cursor     : pointer;
    transition : var(--vvv-transition);
    border     : none;
    background : transparent;
}

.vvv-camera-btn:hover:not(:disabled) {
    transform : scale(1.05);
    filter    : brightness(1.1);
}

.vvv-camera-btn:disabled {
    opacity : 0.5;
    cursor  : not-allowed;
}

.vvv-camera-btn.capture {
    display         : inline-flex;
    flex-shrink     : 0;
    justify-content : center;
    align-items     : center;
    gap             : 12px;
    height          : 70px;
    padding         : 13px 9px;
    border          : none;
    border-radius   : 60px;
    background      : linear-gradient(92deg, #F48B00 2.29%, #F26F04 58.84%, #F48B00 99.51%);
}

.vvv-camera-btn.capture svg {
    flex-shrink : 0;
    width       : 51px;
    height      : 51px;
}

/* ========================================
   MODALS & NOTIFICATIONS
   ======================================== */
.vvv-modal {
    position        : fixed;
    top             : 0;
    right           : 0;
    bottom          : 0;
    left            : 0;
    z-index         : 9999;
    display         : flex;
    justify-content : center;
    align-items     : center;
}

.vvv-modal-overlay {
    position   : absolute;
    top        : 0;
    right      : 0;
    bottom     : 0;
    left       : 0;
    z-index    : 0;
    background : rgba(0, 0, 0, 0.7);
}

.vvv-modal-content {
    position      : relative;
    z-index       : 1;
    overflow-y    : auto;
    max-width     : 600px;
    max-height    : 90vh;
    padding       : 30px;
    border-radius : var(--vvv-border-radius);
    background    : var(--vvv-color-white);
}

.vvv-modal-content .vvv-modal-close {
    position      : absolute;
    top           : 15px;
    right         : 15px;
    width         : 36px;
    height        : 36px;
    cursor        : pointer;
    transition    : var(--vvv-transition);
    border        : none;
    border-radius : 50%;
    background    : var(--vvv-color-gray);
}

.vvv-modal-content .vvv-modal-close span {
    font-size : 24px;
    position  : absolute;
    top       : 42%;
    left      : 52%;
    transform : translate(-50%, -50%);
}

.vvv-modal-close:hover {
    color      : var(--vvv-color-white);
    background : var(--vvv-color-maroon);
}

.vvv-modal-content h3 {
    color         : var(--vvv-color-maroon);
    margin-bottom : 20px;
}

/* Notices */
.vvv-form-notice {
    font-size     : 14px;
    margin-top    : 15px;
    padding       : 15px 20px;
    border-radius : 6px;
}

.vvv-form-notice.success {
    color      : #155724;
    border     : 1px solid #C3E6CB;
    background : #D4EDDA;
}

.vvv-form-notice.error {
    color      : #721C24;
    border     : 1px solid #F5C6CB;
    background : #F8D7DA;
}

/* Champs en erreur */
.vvv-form-group input.error,
.vvv-form-group select.error,
.vvv-form-group textarea.error {
    border-color : var(--vvv-color-error) !important;
    box-shadow   : 0 0 0 3px rgba(231, 76, 60, 0.1);
}

.vvv-form-group input.error:focus,
.vvv-form-group select.error:focus,
.vvv-form-group textarea.error:focus {
    border-color : var(--vvv-color-error) !important;
    box-shadow   : 0 0 0 3px rgba(231, 76, 60, 0.2);
}

.vvv-appellation-field {
    position : relative;
}

.vvv-appellation-field::after {
    position          : absolute;
    top               : 50%;
    right             : 15px;
    width             : 12px;
    height            : 8px;
    transform         : translateY(-50%);
    content           : '';
    pointer-events    : none;
    background-image  : url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEyIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xIDFMNiA2TDExIDEiIHN0cm9rZT0iIzc1MDAzMSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==");
    background-repeat : no-repeat;
    background-size   : contain;
}

.vvv-appellation-field .vvv-wine-appellation {
    padding-right : 42px;
}

.vvv-appellation-menu {
    position      : absolute;
    top           : calc(100% + 8px);
    right         : 0;
    left          : 0;
    z-index       : 40;
    overflow-y    : auto;
    display       : none;
    grid-template-columns : 1fr;
    align-content : start;
    gap           : 10px;
    max-height    : 260px;
    padding       : 12px;
    border        : 1px solid #E8E8E8;
    border-radius : 15px;
    background    : #FFFFFF;
    box-shadow    : 0 4px 12px rgba(0, 0, 0, 0.1);
}

.vvv-appellation-field.is-open .vvv-appellation-menu {
    display : grid;
}

.vvv-appellation-option {
    font-family : "Gotham Rounded", sans-serif;
    font-size   : 15px;
    font-weight : 500;
    color       : #3C322F;
    text-align  : left;
    display     : flex;
    align-items : center;
    width       : 100%;
    min-height  : 52px;
    padding     : 12px 16px;
    cursor      : pointer;
    transition  : var(--vvv-transition);
    border      : 1px solid #EDE9E3;
    border-radius : 12px;
    background  : #FFFFFF;
}

.vvv-appellation-option:hover,
.vvv-appellation-option.is-active {
    color        : #FFFFFF !important;
    border-color : #750031 !important;
    background   : #750031 !important;
}

/* Message de succès */
.vvv-success-message {
    text-align : center;
    padding    : 60px 40px;
}

.vvv-success-icon {
    display         : flex;
    justify-content : center;
    align-items     : center;
    width           : 80px;
    height          : 80px;
    margin          : 0 auto 30px;
    border-radius   : 50%;
    background      : var(--vvv-color-success);
}

.vvv-success-icon .dashicons {
    font-size : 48px;
    color     : var(--vvv-color-white);
    width     : 48px;
    height    : 48px;
}

.vvv-success-message h2 {
    color         : var(--vvv-color-success);
    margin-bottom : 15px;
}

.vvv-success-message p {
    font-size   : 16px;
    line-height : 1.6;
    color       : var(--vvv-color-gray-dark);
}

/* Loading spinner */
.vvv-loading {
    display          : inline-block;
    width            : 20px;
    height           : 20px;
    animation        : spin 0.6s linear infinite;
    border           : 3px solid rgba(255, 255, 255, 0.3);
    border-top-color : var(--vvv-color-white);
    border-radius    : 50%;
}

/* AI Loading indicator */
.vvv-ai-loading {
    position      : relative;
    overflow      : hidden;
    display       : flex;
    align-items   : center;
    gap           : 0;
    width         : 100%;
    max-width     : 320px;
    height        : 160px;
    margin        : 0 auto 20px;
    animation     : fadeIn 0.3s ease;
    border-radius : 15px;
    background    : linear-gradient(105deg, rgba(247, 244, 239, 1) 6.5%, rgba(241, 231, 218, 1) 43%, rgba(247, 243, 238, 1) 85%);
}

.vvv-ai-loading-image {
    position      : relative;
    overflow      : hidden;
    flex-shrink   : 0;
    width         : 120px;
    height        : 120px;
    margin        : 20px;
    border-radius : 10px;
    background    : #F5F5F5;
}

.vvv-ai-loading-image img {
    width      : 100%;
    height     : 100%;
    object-fit : cover;
}

/* Effet de scan/shimmer sur l'image */
.vvv-ai-loading-image::after {
    position   : absolute;
    top        : 0;
    left       : -100%;
    width      : 100%;
    height     : 100%;
    content    : '';
    animation  : shimmer 1.5s infinite;
    background : linear-gradient(133deg, rgba(255, 255, 255, 0) 3%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0) 95%);
}

@keyframes shimmer {
    0% {
        left : -100%;
    }
    100% {
        left : 100%;
    }
}

.vvv-ai-loading-content {
    display         : flex;
    flex            : 1;
    flex-direction  : column;
    justify-content : center;
    align-items     : center;
    padding-right   : 20px;
}

.vvv-ai-loading-icon {
    width         : 21px;
    height        : 21px;
    margin-bottom : 8px;
}

.vvv-ai-loading-icon svg {
    width  : 100%;
    height : 100%;
}

.vvv-ai-loading-text {
    font-family : 'Gotham Rounded', sans-serif;
    font-size   : 15px;
    font-weight : 500;
    line-height : 1.4;
    color       : #750031;
    text-align  : center;
}

/* Mobile responsive */
@media (max-width : 380px) {
    .vvv-ai-loading {
        max-width : 100%;
        height    : auto;
        padding   : 15px;
    }

    .vvv-ai-loading-image {
        width  : 80px;
        height : 80px;
        margin : 0 15px 0 0;
    }
}

/* Section Notice (inline dans le formulaire) */
.vvv-section-notice {
    display       : flex;
    align-items   : center;
    gap           : 12px;
    margin-bottom : 20px;
    padding       : 15px 20px;
    animation     : fadeIn 0.3s ease;
    border-radius : 10px;
}

.vvv-section-notice-error {
    color      : #C0392B;
    border     : 1px solid #E74C3C;
    background : linear-gradient(105deg, #FDF2F2 0%, #FDEAEA 50%, #FDF2F2 100%);
}

.vvv-section-notice-success {
    color      : #1E8449;
    border     : 1px solid #27AE60;
    background : linear-gradient(105deg, #E8F5E9 0%, #E0F2E1 50%, #E8F5E9 100%);
}

.vvv-section-notice-icon {
    display     : flex;
    flex-shrink : 0;
    align-items : center;
}

.vvv-section-notice-icon svg {
    width  : 20px;
    height : 20px;
}

.vvv-section-notice-text {
    font-family : 'Gotham Rounded', sans-serif;
    font-size   : 14px;
    font-weight : 500;
    line-height : 1.4;
}

/* ========================================
   DASHBOARD
   ======================================== */
.vvv-dashboard-table {
    width           : 100%;
    margin-top      : 20px;
    border-collapse : collapse;
}

.vvv-dashboard-table th,
.vvv-dashboard-table td {
    text-align    : left;
    padding       : 12px 15px;
    border-bottom : 1px solid var(--vvv-color-gray);
}

.vvv-dashboard-table th {
    font-weight : 600;
    color       : var(--vvv-color-maroon);
    background  : var(--vvv-color-gray-light);
}

.vvv-dashboard-table tr:hover {
    background : var(--vvv-color-gray-light);
}

.vvv-status-badge {
    font-size     : 12px;
    font-weight   : 600;
    color         : var(--vvv-color-white);
    display       : inline-block;
    padding       : 4px 12px;
    border-radius : 12px;
}

.vvv-status-badge.brouillon {
    background : #95A5A6;
}

.vvv-status-badge.en_attente {
    background : #F39C12;
}

.vvv-status-badge.estimee {
    background : #3498DB;
}

.vvv-status-badge.validee {
    background : #27AE60;
}

.vvv-status-badge.expediee {
    background : #9B59B6;
}

.vvv-dashboard-actions {
    display : flex;
    gap     : 8px;
}

.vvv-dashboard-actions .vvv-btn-small {
    font-size : 13px;
    padding   : 6px 12px;
}

/* ========================================
   RESPONSIVE
   ======================================== */

/* Desktop : Masquer method-selector-inline, afficher le bouton */
@media (min-width : 769px) {
    .vvv-method-selector-inline {
        display : none !important;
    }
}

/* Mobile */
@media (max-width : 768px) {
    .vvv-form-wrapper {
        padding : 0;
    }

    .vvv-form-row {
        gap                   : 0;
        grid-template-columns : 1fr;
    }

    /* Liste des vins : adapter le padding */
    .vvv-wine-list-item {
        padding : 20px 15px;
    }

    .vvv-wine-list-header {
        flex-wrap : wrap;
        gap       : 15px;
    }

    .vvv-wine-list-title {
        font-size : 18px;
        flex      : 1 1 100%;
    }

    .vvv-wine-list-item .vvv-wine-actions {
        justify-content : flex-end;
        width           : 100%;
    }

    /* Sélecteur de méthode */
    .vvv-method-selector,
    .vvv-method-selector-inline {
        flex-direction : column;
        gap            : 1px;
        width          : 100%;
        max-width      : 100%;
    }

    .vvv-method-card {
        min-height    : auto;
        border-radius : 0;
    }

    .vvv-method-cartouche {
        display : none;
    }

    .vvv-method-content {
        padding : 30px 15px;
    }

    .vvv-method-card:first-child {
        border-top-left-radius  : 15px;
        border-top-right-radius : 15px;
    }

    .vvv-method-card:last-child {
        border-bottom              : none;
        border-bottom-right-radius : 15px;
        border-bottom-left-radius  : 15px;
    }

    .vvv-method-btn {
        width     : calc(100% - 40px);
        max-width : 280px;
    }

    /* Formulaire de vin */
    .vvv-wine-form-section {
        padding : 20px 15px;
    }

    .vvv-wine-header {
        flex-wrap : nowrap;
    }

    .vvv-wine-header h3 {
        font-size : 18px;
    }

    .vvv-wine-actions {
        flex-shrink : 0;
    }

    /* Excel */
    .vvv-excel-wrapper {
        padding : 15px;
    }

    .vvv-excel-container {
        padding : 25px 20px 25px 20px;
    }

    .vvv-excel-message-group {
        padding : 0 15px;
    }

    .vvv-excel-title {
        font-size : 20px;
    }

    /* Dashboard */
    .vvv-dashboard-table {
        font-size : 14px;
    }

    .vvv-dashboard-table th,
    .vvv-dashboard-table td {
        padding : 8px 10px;
    }

    /* Caméra */
    .vvv-camera-instructions {
        font-size : 13px;
        padding   : 12px 20px;
    }

    .vvv-camera-btn.capture {
        height  : 60px;
        padding : 10px 8px;
    }

    .vvv-camera-btn.capture svg {
        width  : 44px;
        height : 44px;
    }
}

/* Masquer le scan sur desktop (sauf en mode test) */
@media (min-width : 769px) {
    body:not(.vvv-camera-test-mode) .vvv-method-scan {
        display : none;
    }

    body:not(.vvv-camera-test-mode) .vvv-method-selector-inline .vvv-method-scan {
        display : none;
    }

    body.vvv-no-camera-desktop .vvv-open-camera-btn {
        display : none;
    }

    body.vvv-no-camera-desktop .vvv-photo-btn {
        flex : 1 1 100%;
    }

    /* Gestion de l'affichage des sections photo mobile/desktop */
    .vvv-wine-photo-mobile {
        display : none;
    }

    .vvv-wine-photo-desktop {
        display     : flex;
        align-items : stretch;
    }
}

/* Sur mobile, afficher la section mobile et masquer la desktop */
@media (max-width : 768px) {
    .vvv-wine-photo-mobile {
        display : flex;
    }

    .vvv-wine-photo-desktop {
        display : none;
    }
}

/* ========================================
   DASHBOARD REDESIGNED (Figma)
   ======================================== */
.vvv-dashboard.vvv-redesigned {
    padding : 20px 0;
}

.vvv-dashboard.vvv-redesigned .vvv-dashboard-header {
    display         : flex;
    justify-content : space-between;
    align-items     : center;
    margin-bottom   : 30px;
}

.vvv-dashboard.vvv-redesigned .vvv-dashboard-header h2 {
    font-size   : 24px;
    font-weight : 600;
    color       : var(--vvv-color-maroon);
    margin      : 0;
}

.vvv-table-responsive {
    overflow-x : auto;
}

/* Table redesignée */
.vvv-dashboard-table.vvv-redesigned {
    font-size       : 14px;
    width           : 100%;
    margin-top      : 0;
    border-spacing  : 0;
    border-collapse : separate;
    border          : none;
    border-radius   : 10px;
    background      : #FFFFFF;
    box-shadow      : 0 0 0 1px #F5F2EE;
}

.vvv-dashboard-table.vvv-redesigned thead th {
    font-family    : 'Gotham Rounded', sans-serif;
    font-size      : 14px;
    font-weight    : 500;
    color          : #750031;
    text-align     : left;
    letter-spacing : 0;
    text-transform : none;
    padding        : 10px 12px;
    border-bottom  : 1px solid #F5F2EE;
    background     : #F8F0E6;
}

.vvv-dashboard-table.vvv-redesigned thead th:nth-child(4),
.vvv-dashboard-table.vvv-redesigned thead th:nth-child(6),
.vvv-dashboard-table.vvv-redesigned thead th:nth-child(7) {
    text-align : center;
}

.vvv-dashboard-table.vvv-redesigned thead th:first-child {
    border-top-left-radius : 10px;
}

.vvv-dashboard-table.vvv-redesigned thead th:last-child {
    border-top-right-radius : 10px;
}

.vvv-dashboard-table.vvv-redesigned tbody td {
    vertical-align : middle;
    padding        : 18px 12px;
    border-bottom  : 1px solid #F5F2EE;
}

.vvv-dashboard-table.vvv-redesigned tbody tr:last-child td {
    border-bottom : none;
}

.vvv-dashboard-table.vvv-redesigned tbody tr:hover {
    background : #FAFAFA;
}

.vvv-dashboard-table.vvv-redesigned .vvv-col-reference strong {
    font-family : 'Gotham Rounded', sans-serif;
    font-size   : 14px;
    font-weight : 400;
    color       : #5F6D7B;
}

.vvv-dashboard-table.vvv-redesigned .vvv-col-date {
    font-family : 'Gotham Rounded', sans-serif;
    font-size   : 14px;
    font-weight : 400;
    color       : #5F6D7B;
}

.vvv-dashboard-table.vvv-redesigned .vvv-col-bottles {
    font-family : 'Gotham Rounded', sans-serif;
    font-size   : 14px;
    font-weight : 500;
    color       : #202B36;
    text-align  : left;
}

.vvv-dashboard-table.vvv-redesigned .vvv-col-status {
    text-align : center;
}

.vvv-dashboard-table.vvv-redesigned .vvv-col-estimation {
    text-align : left;
}

.vvv-dashboard-table.vvv-redesigned .vvv-col-validation {
    text-align : center;
}

.vvv-dashboard-table.vvv-redesigned .vvv-col-actions {
    text-align : center;
}

/* Status badges - Couleurs Figma */
.vvv-status-badge-new {
    font-family   : 'Gotham Rounded', sans-serif;
    font-size     : 13px;
    font-weight   : 500;
    white-space   : nowrap;
    display       : inline-block;
    padding       : 5px 7px;
    border-radius : 4px;
}

.vvv-status-badge-new.vvv-status-brouillon {
    color      : #666666;
    background : #E0E0E0;
}

.vvv-status-badge-new.vvv-status-en_attente {
    color      : #DD8108;
    background : #F8F0E6;
}

.vvv-status-badge-new.vvv-status-estimee {
    color      : #3179A6;
    background : #D4E8F6;
}

.vvv-status-badge-new.vvv-status-validee,
.vvv-status-badge-new.vvv-status-expediee {
    color      : #31A666;
    background : #D4F6E4;
}

/* Estimation value */
.vvv-estimation-value {
    font-family : 'Gotham Rounded', sans-serif;
    font-size   : 14px;
    font-weight : 500;
    color       : #202B36;
}

.vvv-no-estimation {
    font-family    : 'Jost', sans-serif;
    font-size      : 14px;
    font-weight    : 500;
    color          : #202B36;
    letter-spacing : 0.7px;
}

/* Mode badges */
.vvv-mode-badge {
    font-size     : 11px;
    font-weight   : 500;
    display       : inline-block;
    padding       : 4px 10px;
    border-radius : 4px;
}

.vvv-mode-badge.vvv-mode-excel {
    color      : #217346;
    background : #E8F5E9;
}

.vvv-mode-badge.vvv-mode-form {
    color      : #5E112F;
    background : #F8E8EE;
}

/* Actions wrapper */
.vvv-actions-wrapper {
    display     : flex;
    align-items : center;
    gap         : 8px;
}

/* Bouton Valider (orange) */
.vvv-btn-validate {
    font-family   : 'Gotham Rounded', sans-serif;
    font-size     : 14px;
    font-weight   : 500;
    color         : var(--vvv-color-white);
    padding       : 8px 32px;
    cursor        : pointer;
    transition    : var(--vvv-transition);
    border        : none;
    border-radius : 48px;
    background    : #F48B00;
}

.vvv-btn-validate:hover {
    opacity : 0.9;
}

.vvv-btn-validate:disabled {
    opacity : 0.3;
    cursor  : not-allowed;
}

/* Bouton Validée (vert) */
.vvv-btn-validated {
    font-family   : 'Gotham Rounded', sans-serif;
    font-size     : 14px;
    font-weight   : 500;
    color         : var(--vvv-color-white);
    display       : inline-flex;
    align-items   : center;
    gap           : 6px;
    padding       : 8px 32px;
    border-radius : 48px;
    background    : #20B15A;
}

.vvv-btn-validated svg {
    width  : 16px;
    height : 16px;
}

/* Boutons icône (oeil, 3 points) */
.vvv-col-actions .vvv-btn-icon {
    color           : #666666;
    display         : flex;
    justify-content : center;
    align-items     : center;
    width           : 36px;
    height          : 36px;
    padding         : 0;
    cursor          : pointer;
    transition      : var(--vvv-transition);
    border          : none;
    border-radius   : 6px;
    background      : transparent;
}

.vvv-col-actions .vvv-btn-icon:hover {
    color      : var(--vvv-color-maroon);
    background : #F5F5F5;
}

.vvv-col-actions .vvv-btn-icon svg {
    width  : 20px;
    height : 20px;
}

/* Dropdown menu 3 points */
.vvv-dropdown-menu {
    position : relative;
}

.vvv-dropdown-content {
    opacity       : 0;
    position      : absolute;
    top           : 100%;
    right         : 0;
    z-index       : 100;
    visibility    : hidden;
    overflow      : hidden;
    min-width     : 160px;
    margin-top    : 4px;
    transition    : opacity 0.2s, visibility 0.2s;
    border        : 1px solid #E8E8E8;
    border-radius : 8px;
    background    : var(--vvv-color-white);
    box-shadow    : 0 4px 12px rgba(0, 0, 0, 0.1);
}

.vvv-dropdown-menu.open .vvv-dropdown-content {
    opacity    : 1;
    visibility : visible;
}

.vvv-dropdown-toggle {
    color      : #666666 !important;
    background : transparent !important;
}

.vvv-dropdown-item {
    font-size       : 14px;
    color           : #333333;
    text-decoration : none;
    display         : flex;
    align-items     : center;
    gap             : 10px;
    padding         : 10px 16px;
    transition      : background 0.15s;
}

.vvv-dropdown-item:hover {
    color      : var(--vvv-color-maroon);
    background : #F9F9F9;
}

.vvv-dropdown-item svg {
    flex-shrink : 0;
    width       : 16px;
    height      : 16px;
}

.vvv-dropdown-item-danger {
    color : #E74C3C;
}

.vvv-dropdown-item-danger:hover {
    color      : #C0392B;
    background : #FDF2F2;
}

/* Ligne de détails */
.vvv-details-row td {
    padding    : 0 !important;
    background : #FAFAFA;
}

.vvv-demande-details {
    padding       : 20px 24px;
    border-top    : 1px solid #E8E8E8;
    border-bottom : 1px solid #E8E8E8;
}

.vvv-demande-details h4 {
    font-size   : 16px;
    font-weight : 600;
    color       : var(--vvv-color-maroon);
    margin      : 0 0 20px;
}

/* Grille des vins (cards) */
.vvv-wines-grid {
    display               : grid;
    gap                   : 16px;
    grid-template-columns : repeat(auto-fill, minmax(280px, 1fr));
}

.vvv-wine-card {
    display       : flex;
    gap           : 12px;
    padding       : 12px;
    border        : 1px solid #E8E8E8;
    border-radius : 8px;
    background    : var(--vvv-color-white);
}

.vvv-wine-card .vvv-wine-photo {
    overflow      : hidden;
    flex-shrink   : 0;
    width         : 60px;
    height        : 80px;
    border-radius : 4px;
    background    : #F5F5F5;
}

.vvv-wine-card .vvv-wine-photo img {
    width      : 100%;
    height     : 100%;
    object-fit : cover;
}

.vvv-wine-card .vvv-wine-info {
    display        : flex;
    flex           : 1;
    flex-direction : column;
    gap            : 4px;
}

.vvv-wine-card .vvv-wine-number {
    font-size     : 11px;
    font-weight   : 600;
    color         : #999999;
    margin-bottom : 2px;
}

.vvv-wine-card .vvv-wine-appellation {
    font-size   : 14px;
    font-weight : 600;
    color       : var(--vvv-color-maroon);
}

.vvv-wine-card .vvv-wine-domaine {
    font-size : 13px;
    color     : #666666;
}

.vvv-wine-card .vvv-wine-meta {
    font-size  : 12px;
    color      : #999999;
    display    : flex;
    flex-wrap  : wrap;
    gap        : 8px;
    margin-top : auto;
}

.vvv-wine-card .vvv-wine-meta span {
    display : inline-block;
}

.vvv-wine-card .vvv-wine-qty {
    font-weight : 600;
    color       : var(--vvv-color-orange);
}

.vvv-no-wines {
    font-size  : 14px;
    color      : #999999;
    text-align : center;
    padding    : 20px;
}

/* Modal de suppression */
#vvv-delete-modal .vvv-modal-content {
    text-align : center;
    max-width  : 400px;
}

#vvv-delete-modal .vvv-modal-content h3 {
    font-size     : 18px;
    color         : #333333;
    margin-bottom : 10px;
}

#vvv-delete-modal .vvv-modal-content p {
    font-size     : 14px;
    color         : #666666;
    margin-bottom : 25px;
}

.vvv-modal-actions {
    display         : flex;
    justify-content : center;
    gap             : 12px;
}

.vvv-btn-danger {
    color      : var(--vvv-color-white);
    background : #E74C3C;
}

.vvv-btn-danger:hover {
    background : #C0392B;
}

/* Loading draft */
.vvv-loading-draft {
    color           : #666666;
    display         : flex;
    justify-content : center;
    align-items     : center;
    gap             : 12px;
    padding         : 40px;
}

/* Empty state */
.vvv-empty-state {
    text-align : center;
    padding    : 60px 20px;
}

.vvv-empty-state h3 {
    font-size : 20px;
    color     : var(--vvv-color-maroon);
    margin    : 20px 0 10px;
}

.vvv-empty-state p {
    color         : #666666;
    margin-bottom : 25px;
}

/* Responsive dashboard */
@media (max-width : 768px) {
    .vvv-dashboard.vvv-redesigned .vvv-dashboard-header {
        text-align     : center;
        flex-direction : column;
        gap            : 15px;
    }

    .vvv-dashboard-table.vvv-redesigned {
        font-size : 13px;
    }

    .vvv-dashboard-table.vvv-redesigned thead th,
    .vvv-dashboard-table.vvv-redesigned tbody td {
        padding : 10px 8px;
    }

    /* Masquer certaines colonnes sur mobile */
    .vvv-dashboard-table.vvv-redesigned .vvv-col-validation,
    .vvv-dashboard-table.vvv-redesigned th:nth-child(6) {
        display : none;
    }

    .vvv-actions-wrapper {
        flex-wrap : wrap;
        gap       : 4px;
    }

    .vvv-btn-validate,
    .vvv-btn-validated {
        font-size : 12px;
        padding   : 6px 10px;
    }

    .vvv-wines-grid {
        grid-template-columns : 1fr;
    }

    .vvv-demande-details {
        padding : 15px;
    }
}
