/**
 * MXI Quote — Public Styles
 *
 * Minimal styles for notices and quote UI components.
 * Most styling comes from the theme (mxi3) — this just covers
 * the plugin-specific elements.
 */

/* ── Notices ── */
.mxi-notice {
    padding: 12px 16px;
    margin: 10px 0;
    border-radius: 4px;
    font-size: 14px;
}
.mxi-notice--success {
    background-color: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}
.mxi-notice--error {
    background-color: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}
.mxi-notice--info {
    background-color: #d1ecf1;
    color: #0c5460;
    border: 1px solid #bee5eb;
}

/* ── Mini Quote ── */
.wc-quote-li {
    position: relative;
}
.wc-quote-li .totalitems {
    font-size: 12px;
}
.mini-quote-dropdown {
    display: none;
    position: absolute;
    right: 0;
    top: 100%;
    background: #fff;
    border: 1px solid #ddd;
    padding: 15px;
    min-width: 300px;
    z-index: 9999;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.wc-quote-li:hover .mini-quote-dropdown {
    display: block;
}
.wc-quote-mini-cart {
    list-style: none;
    padding: 0;
    margin: 0;
}
.wc-quote-mini-cart-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
    border-bottom: 1px solid #eee;
    position: relative;
}
.wc-quote-mini-cart-item img {
    width: 50px;
    height: auto;
}
.wc-quote-mini-cart-item .wc-quote-remove-header {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    color: #cc0000;
    text-decoration: none;
    cursor: pointer;
}
.wc-quote-mini-cart__empty-message {
    color: #666;
    font-style: italic;
}

/* ── Quote Table ── */
.wc-quote-form__contents .product-remove a {
    color: #cc0000;
    font-size: 18px;
    text-decoration: none;
}
.wc-quote-form__contents .product-thumbnail img {
    width: 80px;
    height: auto;
}

/* ── Loading state ── */
.loading {
    opacity: 0.6;
    pointer-events: none;
}

/* ── Price display ── */
.mxi-price {
    font-weight: 600;
}

/* ═══════════════════════════════════════════════
   My Quotes — List (customer-facing)
   ═══════════════════════════════════════════════ */
.mxi-my-quotes { margin: 20px 0; }
.mxi-quotes-table { width: 100%; border-collapse: collapse; }
.mxi-quotes-table th,
.mxi-quotes-table td { padding: 12px 15px; text-align: left; border-bottom: 1px solid #eee; }
.mxi-quotes-table thead th { font-weight: 600; background: #f8f8f8; border-bottom: 2px solid #ddd; }
.mxi-quotes-table tbody tr:hover { background: #fafafa; }
.mxi-quotes-table a { text-decoration: none; }
.mxi-btn-view,
.mxi-btn-download { margin-right: 5px; font-size: 13px !important; }
.mxi-my-quotes--empty { padding: 30px 0; }

/* ═══════════════════════════════════════════════
   My Quote — Detail View (customer-facing)
   ═══════════════════════════════════════════════ */
.mxi-quote-details { margin: 20px 0; }
.mxi-back-link { font-size: 14px; color: #555; text-decoration: none; }
.mxi-back-link:hover { color: #000; }

.mxi-quote-summary { width: 100%; margin-bottom: 30px; border-collapse: collapse; }
.mxi-quote-summary th,
.mxi-quote-summary td { padding: 10px 15px; border-bottom: 1px solid #eee; }
.mxi-quote-summary th { font-weight: 600; width: 200px; background: #f8f8f8; }

.mxi-quote-items { width: 100%; border-collapse: collapse; margin-bottom: 30px; }
.mxi-quote-items th,
.mxi-quote-items td { padding: 12px 15px; text-align: left; border-bottom: 1px solid #eee; }
.mxi-quote-items thead th { font-weight: 600; background: #f8f8f8; border-bottom: 2px solid #ddd; }
.mxi-quote-items .product-thumbnail img { width: 60px; height: auto; border-radius: 3px; }
.mxi-item-sku { font-size: 12px; color: #888; margin-top: 4px; }
.mxi-variation-meta { margin: 6px 0 0; font-size: 12px; }
.mxi-variation-meta dt { display: inline; font-weight: 600; }
.mxi-variation-meta dd { display: inline; margin: 0 10px 0 0; }

.mxi-quote-totals { max-width: 400px; margin-left: auto; }
.mxi-quote-totals h2 { font-size: 18px; margin-bottom: 10px; }
.mxi-quote-totals table { width: 100%; border-collapse: collapse; }
.mxi-quote-totals th,
.mxi-quote-totals td { padding: 10px 15px; border-bottom: 1px solid #eee; }
.mxi-quote-totals th { font-weight: 600; text-align: left; }
.mxi-quote-totals td { text-align: right; }
.mxi-quote-totals .order-total td { font-size: 1.1em; }

/* ═══════════════════════════════════════════════
   Add-to-Quote Button (product pages)
   ═══════════════════════════════════════════════ */
.mxi-add-to-quote-wrap {
    display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
    margin: 15px 0;
}
.mxi-quantity { display: inline-flex; align-items: center; }
.mxi-qty-input {
    width: 60px; padding: 6px 8px; text-align: center;
    border: 1px solid #ccc; border-radius: 3px; font-size: 14px;
}
.mxi-quote-btn {
    display: inline-block; padding: 10px 20px;
    border: none; border-radius: 3px; cursor: pointer;
    font-size: 14px; font-weight: 600; text-decoration: none;
    transition: opacity 0.2s;
}
.mxi-quote-btn:hover { opacity: 0.85; }
.mxi-quote-btn.loading { opacity: 0.5; pointer-events: none; }

/* Variation selectors */
.mxi-variation-selectors { width: 100%; margin-bottom: 10px; }
.mxi-variation-row { margin-bottom: 8px; }
.mxi-variation-row label { display: block; font-weight: 600; margin-bottom: 3px; font-size: 13px; }
.mxi-variation-select {
    width: 100%; max-width: 300px; padding: 6px 8px;
    border: 1px solid #ccc; border-radius: 3px; font-size: 14px;
}

/* ═══════════════════════════════════════════════
   Responsive tweaks
   ═══════════════════════════════════════════════ */
@media screen and (max-width: 600px) {
    .mxi-quotes-table thead { display: none; }
    .mxi-quotes-table tr { display: block; margin-bottom: 15px; border: 1px solid #eee; border-radius: 4px; }
    .mxi-quotes-table td { display: block; text-align: right; padding: 8px 12px; border-bottom: 1px solid #f0f0f0; }
    .mxi-quotes-table td::before {
        content: attr(data-title);
        float: left; font-weight: 600;
    }

    .mxi-quote-items thead { display: none; }
    .mxi-quote-items tr { display: block; margin-bottom: 15px; border: 1px solid #eee; border-radius: 4px; }
    .mxi-quote-items td { display: block; text-align: right; padding: 8px 12px; border-bottom: 1px solid #f0f0f0; }
    .mxi-quote-items td::before {
        content: attr(data-title);
        float: left; font-weight: 600;
    }
    .mxi-quote-items .product-thumbnail { text-align: center; }

    .mxi-quote-totals { max-width: 100%; }
}
