/* =========================================
   MODO MINIMALISTA - ESTILOS INDEPENDIENTES
   ========================================= */

.mode-minimalist .menu-grid {
    display: block !important;
    width: 100% !important;
    max-width: 800px !important;
    margin: 0 auto !important;
}

.mode-minimalist .menu-item {
    background: transparent !important;
    border: none !important;
    border-left: none !important; /* Explicitly remove the accent border */
    box-shadow: none !important;
    padding: 8px 0 !important;
    margin: 0 0 5px 0 !important;
    position: relative !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important; /* Allow wrapping for edit controls */
    justify-content: center !important;
    align-items: center !important;
    gap: 0 !important;
    width: 100% !important;
    text-align: center !important;
    transition: none !important; /* No jumps in minimalist */
}

/* Force transparent mode-editing background/border */
.mode-minimalist.mode-editing .menu-item,
.mode-minimalist.mode-editing .menu-item:hover {
    background-color: transparent !important;
    border: none !important;
    border-left: none !important; /* Explicitly remove the accent border in edit mode */
    box-shadow: none !important;
}

.mode-minimalist .item-img, 
.mode-minimalist .item-desc,
.mode-minimalist .badge-wrapper,
.mode-minimalist .product-badge {
    display: none !important; 
}

.mode-minimalist [contenteditable="true"]:focus,
.mode-minimalist [contenteditable="true"]:hover {
    outline: none !important;
    border: none !important;
    background: transparent !important;
}

.mode-minimalist .item-name {
    order: 1 !important;
    display: inline-block !important; 
    font-family: 'Montserrat', 'Inter', sans-serif !important;
    font-size: 0.7rem !important; /* Refined from 0.8rem */
    font-weight: 400 !important;
    color: #ffffff !important;
    margin: 0 !important;
    padding: 0 !important;
    letter-spacing: 0.5px !important;
    white-space: nowrap !important;
}

.mode-minimalist .item-name::after {
    content: " * ";
    margin: 0 5px;
    color: var(--accent);
    font-weight: 900;
}

.mode-minimalist .item-price {
    order: 2 !important;
    display: inline-block !important; 
    font-family: 'Montserrat', 'Inter', sans-serif !important;
    font-size: 0.7rem !important; /* Refined from 0.8rem */
    font-weight: 600 !important; 
    color: #ffffff !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    width: auto !important;
    border: none !important;
    line-height: normal !important;
}

.mode-minimalist .allergen-row {
    order: 3 !important;
    display: inline-flex !important;
    vertical-align: middle !important;
    margin-left: 0 !important;
    align-items: center !important;
    transform: scale(0.85);
    transform-origin: left center;
}

.mode-minimalist .allergen-row::before {
    content: " * ";
    margin: 0 5px;
    color: var(--accent);
    font-weight: 900;
}

.mode-minimalist .allergen-add-btn {
    display: none !important;
    width: 20px !important;
    height: 20px !important;
    font-size: 10px !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(255, 255, 255, 0.1) !important;
    color: #fff !important;
    border-radius: 50% !important;
    opacity: 0.15 !important;
    transform: translateY(-2px) !important;
    transition: opacity 0.2s ease, background 0.2s ease !important;
    cursor: pointer !important;
}

.mode-minimalist.mode-editing .allergen-add-btn {
    display: inline-flex !important;
    opacity: 0.8 !important; /* Visible by default in edit mode */
}

.mode-minimalist .menu-item:hover .allergen-add-btn {
    opacity: 1 !important;
    background: #D4AF37 !important;
    color: #000 !important;
}

.mode-minimalist .item-controls-footer {
    display: flex !important; 
    justify-content: center !important;
    opacity: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    transition: opacity 0.2s ease, height 0.2s ease !important;
    margin: 0 !important;
    width: 100% !important; /* Force full width to wrap below */
    order: 10 !important;   /* Ensure it stays at the end/bottom */
}

.mode-minimalist .menu-item:hover .item-controls-footer,
.mode-minimalist.mode-editing .item-controls-footer {
    opacity: 1 !important;
    height: 35px !important; 
    margin-top: 10px !important;
}

.mode-minimalist .category-title {
    display: block !important;
    text-align: center !important;
    font-family: 'Oswald', 'Montserrat', sans-serif !important;
    font-size: 1.8rem !important;
    font-weight: 700 !important;
    color: var(--accent) !important;
    text-transform: uppercase !important;
    margin-top: 50px !important;
    margin-bottom: 25px !important;
    border: none !important;
    letter-spacing: 1px !important;
}

.mode-minimalist .decoracion-svg {
    position: absolute;
    top: 50%; 
    width: 150px;
    pointer-events: none; 
    z-index: -1; 
}

.mode-minimalist .decoracion-svg svg {
    width: 100%;
    height: auto;
    fill: #ffffff; 
    opacity: 0.8;
}

.mode-minimalist .decoracion-svg.izquierda {
    left: 0px; 
    transform: translateY(-50%) rotate(-10deg);
}

.mode-minimalist .decoracion-svg.derecha {
    right: 0px;
    transform: translateY(-50%) rotate(10deg);
}

@media (max-width: 768px) {
    .mode-minimalist .decoracion-svg {
        left: 50% !important;
        right: auto !important;
        transform: translate(-50%, -50%) !important;
        opacity: 0.05 !important;
        width: 220px;
    }
}