/* Extraído de index.html (bloque de estilo #10) */
            #modal-vendedor-dia {
                display: none;
                align-items: center;
                justify-content: center;
            }

            .mvd-backdrop {
                position: absolute;
                inset: 0;
                background: rgba(15, 23, 42, 0.52);
                backdrop-filter: blur(7px);
                -webkit-backdrop-filter: blur(7px);
                opacity: 0;
                transition: opacity 0.35s ease;
            }

            #modal-vendedor-dia.mvd-open .mvd-backdrop {
                opacity: 1;
            }

            .mvd-container {
                position: relative;
                z-index: 1;
                background: white;
                border-radius: 28px;
                width: 100%;
                max-width: 430px;
                overflow: hidden;
                box-shadow: 0 30px 70px -15px rgba(0, 0, 0, 0.38), 0 8px 24px -8px rgba(0, 0, 0, 0.14);
                transform: scale(0.84) translateY(28px);
                opacity: 0;
                transition: transform 0.42s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.3s ease;
            }

            #modal-vendedor-dia.mvd-open .mvd-container {
                transform: scale(1) translateY(0);
                opacity: 1;
            }

            #modal-vendedor-dia.mvd-closing .mvd-container {
                transform: scale(0.9) translateY(14px);
                opacity: 0;
                transition: transform 0.28s ease, opacity 0.22s ease;
            }

            .mvd-header {
                background: linear-gradient(135deg, var(--primary, #3b82f6) 0%, #6366f1 100%);
                padding: 28px 24px 22px;
                color: white;
                text-align: center;
                position: relative;
                overflow: hidden;
            }

            .mvd-header::before {
                content: '';
                position: absolute;
                width: 220px;
                height: 220px;
                background: rgba(255, 255, 255, 0.07);
                border-radius: 50%;
                top: -90px;
                right: -50px;
            }

            .mvd-header::after {
                content: '';
                position: absolute;
                width: 160px;
                height: 160px;
                background: rgba(255, 255, 255, 0.05);
                border-radius: 50%;
                bottom: -70px;
                left: -30px;
            }

            .mvd-header-icon {
                width: 64px;
                height: 64px;
                background: rgba(255, 255, 255, 0.18);
                border-radius: 20px;
                display: flex;
                align-items: center;
                justify-content: center;
                margin: 0 auto 14px;
                position: relative;
                z-index: 1;
                box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
            }

            .mvd-header-icon .material-symbols-outlined {
                font-size: 2rem;
                color: white;
            }

            .mvd-header h2 {
                font-size: 1.5rem;
                font-weight: 900;
                margin: 0 0 6px;
                position: relative;
                z-index: 1;
                letter-spacing: -0.02em;
            }

            .mvd-header h2 span {
                background: rgba(255, 255, 255, 0.22);
                padding: 2px 10px;
                border-radius: 8px;
            }

            #mvd-fecha {
                font-size: 0.82rem;
                font-weight: 600;
                opacity: 0.82;
                position: relative;
                z-index: 1;
                text-transform: capitalize;
            }

            #mvd-list {
                padding: 12px 14px;
                max-height: 340px;
                overflow-y: auto;
                display: flex;
                flex-direction: column;
                gap: 7px;
            }

            .mvd-card-vendor {
                display: flex;
                align-items: center;
                gap: 14px;
                padding: 13px 16px;
                border: 1.5px solid #f1f5f9;
                border-radius: 16px;
                background: #fafbfc;
                cursor: pointer;
                transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
                width: 100%;
                text-align: left;
                position: relative;
                overflow: hidden;
            }

            .mvd-card-vendor:hover {
                border-color: var(--primary, #3b82f6);
                background: color-mix(in srgb, var(--primary, #3b82f6) 5%, white);
                transform: translateY(-2px);
                box-shadow: 0 6px 18px rgba(0, 0, 0, 0.09);
            }

            .mvd-card-vendor:hover .mvd-chevron {
                color: var(--primary, #3b82f6);
                transform: translateX(4px);
            }

            .mvd-card-vendor.mvd-card-selected {
                border-color: #10b981 !important;
                background: #ecfdf5 !important;
                animation: mvdCardSelect 0.38s ease;
            }

            .mvd-card-vendor.mvd-card-selected .mvd-chevron {
                color: #10b981 !important;
            }

            @keyframes mvdCardSelect {
                0% {
                    transform: scale(1);
                }

                35% {
                    transform: scale(1.03);
                }

                65% {
                    transform: scale(0.98);
                }

                100% {
                    transform: scale(1);
                }
            }

            .mvd-avatar {
                width: 46px;
                height: 46px;
                border-radius: 14px;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 1rem;
                font-weight: 800;
                flex-shrink: 0;
                letter-spacing: 0.5px;
            }

            .mvd-name {
                flex: 1;
                font-size: 0.95rem;
                font-weight: 700;
                color: #1e293b;
            }

            .mvd-chevron {
                font-size: 1.3rem;
                color: #cbd5e1;
                transition: all 0.2s;
                flex-shrink: 0;
            }

            .mvd-footer {
                padding: 10px 16px 18px;
                display: flex;
                justify-content: center;
                border-top: 1px solid #f1f5f9;
            }

            .mvd-skip {
                background: none;
                border: none;
                font-size: 0.82rem;
                color: #94a3b8;
                cursor: pointer;
                padding: 8px 18px;
                border-radius: 10px;
                font-weight: 600;
                transition: all 0.2s;
            }

            .mvd-skip:hover {
                background: #f8fafc;
                color: #64748b;
            }

            .mvd-empty {
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 8px;
                padding: 32px 16px;
                color: #94a3b8;
                text-align: center;
            }

            .mvd-empty .material-symbols-outlined {
                font-size: 3rem;
                opacity: 0.35;
            }

            .mvd-empty p {
                font-size: 0.9rem;
                font-weight: 600;
                margin: 0;
                color: #94a3b8;
            }

            .mvd-empty-btn {
                background: var(--primary, #3b82f6);
                color: white;
                border: none;
                padding: 8px 22px;
                border-radius: 100px;
                font-weight: 700;
                cursor: pointer;
                margin-top: 4px;
                font-size: 0.88rem;
                transition: all 0.2s;
            }

            .mvd-empty-btn:hover {
                transform: translateY(-1px);
                opacity: 0.9;
            }