.mls-panel {
    display: grid;
    gap: 24px;
}

.mls-grid {
    display: grid;
    gap: 24px;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.mls-card {
    border: 1px solid #d9d4cc;
    border-radius: 16px;
    padding: 24px;
    background: linear-gradient(180deg, #fffdf8 0%, #f7f2e8 100%);
    box-shadow: 0 12px 30px rgba(72, 51, 29, 0.08);
}

.mls-card h2 {
    margin-top: 0;
    margin-bottom: 16px;
}

.mls-form p {
    margin-bottom: 16px;
}

.mls-form-help {
    margin-top: -6px;
    color: #6a6258;
    font-size: 0.95rem;
}

.mls-disabled-control {
    display: block;
    cursor: not-allowed;
}

.mls-disabled-control .button[disabled],
.mls-disabled-control input[disabled],
.mls-disabled-control textarea[disabled] {
    cursor: not-allowed;
}

.mls-honeypot {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.mls-form label,
.mls-fieldset legend {
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
}

.mls-form input[type="text"],
.mls-form input[type="email"],
.mls-form input[type="password"],
.mls-form input[type="number"],
.mls-form input[type="time"],
.mls-form input[type="file"],
.mls-form textarea,
.mls-form select {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #c7b8a3;
    border-radius: 10px;
    background: #ffffff;
    box-sizing: border-box;
}

.mls-fieldset {
    border: 1px solid #ddd2c2;
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 16px;
}

.mls-checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.mls-inline-fields {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.mls-table {
    width: 100%;
    border-collapse: collapse;
}

.mls-table th,
.mls-table td {
    padding: 12px;
    border-bottom: 1px solid #e2d9ca;
    text-align: left;
}

.mls-aviso {
    border-radius: 12px;
    padding: 12px 16px;
    margin-bottom: 16px;
}

.mls-aviso p {
    margin: 0;
}

.mls-aviso-success {
    background: #e8f7ec;
    color: #205b33;
}

.mls-aviso-error {
    background: #fdecec;
    color: #8d2323;
}

.mls-aviso-alerta {
    background: #fff3d9;
    color: #7b4d00;
}

.mls-whatsapp-wrap {
    margin-top: 18px;
}

.mls-featured-badge-wrap,
.mls-share-button-wrap {
    margin: 14px 0 0;
}

.mls-featured-badge {
    display: inline-flex;
    align-items: center;
    padding: 6px 12px;
    border-radius: 999px;
    background: #f2c14e;
    color: #4b3300;
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.mls-featured-badge--loop {
    position: absolute;
    top: 14px;
    left: 14px;
    z-index: 2;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    position: relative;
}

.mls-share-button.button.alt {
    background: #2a6fdb;
    border-color: #2a6fdb;
}

.mls-payment-box {
    margin-top: 22px;
    border: 1px solid #ddd2c2;
    border-radius: 16px;
    padding: 20px;
    background: linear-gradient(180deg, #fffefb 0%, #f6f1e7 100%);
    box-shadow: 0 12px 24px rgba(72, 51, 29, 0.06);
}

.mls-payment-box__title {
    margin: 0 0 8px;
    font-size: 1.2rem;
}

.mls-payment-box__note,
.mls-payment-box__vendor,
.mls-payment-box__empty {
    margin: 0 0 16px;
    color: #5d564d;
}

.mls-payment-buttons {
    margin-top: 10px;
}

.mls-payment-buttons .mls-btn {
    display: block;
    width: 100%;
    margin-bottom: 12px;
}

.mls-payment-buttons .mls-btn:last-child {
    margin-bottom: 0;
}

.mls-payment-list {
    display: grid;
    gap: 12px;
    margin-bottom: 18px;
}

.mls-payment-row {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: center;
    padding: 12px 14px;
    border: 1px solid #e2d9ca;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.72);
}

.mls-payment-label {
    font-weight: 600;
    color: #4a4137;
}

.mls-payment-value-group {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}

.mls-payment-value {
    word-break: break-word;
    text-align: right;
    color: #2f2a24;
}

.mls-payment-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}

.mls-payment-button.button.alt {
    background: #0d6cbb;
    border-color: #0d6cbb;
}

.mls-copy-button.button {
    min-width: 86px;
    border-color: #cabaa2;
    background: #fff8ec;
}

.mls-whatsapp-button.button.alt {
    background: #1f8f4c;
    border-color: #1f8f4c;
}

.mls-image-preview-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
    gap: 12px;
    margin: 12px 0 18px;
}

.mls-image-preview-item {
    display: grid;
    gap: 8px;
    justify-items: center;
    padding: 12px;
    border: 1px solid #e2d9ca;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.72);
    text-align: center;
    color: #5d564d;
    font-size: 0.9rem;
}

.mls-image-preview-item img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 10px;
}

.mls-food-info-box {
    margin-top: 22px;
    border: 1px solid #ddd2c2;
    border-radius: 16px;
    padding: 20px;
    background: linear-gradient(180deg, #fffdf8 0%, #f5efe1 100%);
    box-shadow: 0 12px 24px rgba(72, 51, 29, 0.06);
}

.mls-food-info-box__title {
    margin: 0 0 12px;
    font-size: 1.2rem;
}

.mls-food-info-list {
    display: grid;
    gap: 10px;
}

.mls-food-info-list p {
    margin: 0;
    color: #4f473d;
}

.mls-checkout-note {
    font-size: 0.95rem;
    color: #5a5147;
}

.mls-cart-checkout-block {
    margin-top: 16px;
}

.mls-disabled-checkout-button.button.alt {
    width: 100%;
    background: #b9b1a3;
    border-color: #b9b1a3;
    color: #ffffff;
    cursor: not-allowed;
    opacity: 1;
}

.mls-disabled-checkout-button.button.alt[disabled] {
    background: #b9b1a3;
    border-color: #b9b1a3;
    color: #ffffff;
}

.mls-cart-checkout-message {
    margin: 12px 0 0;
    color: #5d564d;
    font-size: 0.95rem;
}

.mls-cart-item-link {
    margin: 10px 0 0;
}

.mls-view-product-button.button {
    border-color: #cabaa2;
    background: #fff8ec;
}

.mls-order-detail__header {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 20px;
}

.mls-order-detail__meta {
    margin: 0;
    color: #5d564d;
}

.mls-order-detail__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 20px;
    margin-bottom: 24px;
}

.mls-order-detail__total {
    margin-top: 18px;
    font-size: 1rem;
}

.mls-order-status-box {
    margin-bottom: 24px;
    padding: 18px;
    border: 1px solid #ddd2c2;
    border-radius: 14px;
    background: #fffaf1;
}

.mls-order-status-box h3 {
    margin-top: 0;
}

.mls-order-status-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

@media (max-width: 767px) {
    .mls-card {
        padding: 18px;
    }

    .mls-order-detail__header {
        flex-direction: column;
    }

    .mls-order-status-actions {
        flex-direction: column;
    }

    .mls-payment-row,
    .mls-payment-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .mls-payment-value-group {
        justify-content: flex-start;
    }

    .mls-payment-value {
        text-align: left;
    }

    .mls-table,
    .mls-table thead,
    .mls-table tbody,
    .mls-table th,
    .mls-table td,
    .mls-table tr {
        display: block;
    }

    .mls-table thead {
        display: none;
    }

    .mls-table tr {
        padding: 12px 0;
        border-bottom: 1px solid #e2d9ca;
    }

    .mls-table td {
        padding: 8px 0;
        border: 0;
    }
}