/**
 * Dynamic Product Total - CSS v3.0.1 (Font Inherit Fix)
 * Matches Frozberries / Porto theme design
 * Uses SITE DEFAULT FONT (inherit) — no custom font set
 * Colors: #C40044, #222529
 */

.cwfd-dpt-container {
    margin: 16px 0 !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    line-height: 1.5 !important;
    box-sizing: border-box !important;
    color: #222529 !important;

    /* IMPORTANT: do NOT set font-family here */
}

.cwfd-dpt-container * {
    box-sizing: border-box !important;

    /* IMPORTANT: do NOT set font-family here */
}

/* ── Discount Table ── */
.cwfd-disc-table-wrap {
    margin-bottom: 2px !important;
}

.cwfd-disc-table {
    width: 100% !important;
    border-collapse: collapse !important;
    border-radius: 6px !important;
    overflow: hidden !important;
    font-size: 13px !important;
    border: 1px solid #e8e8e8 !important;
}

.cwfd-disc-table th {
    background: #C40044 !important;
    color: #fff !important;
    padding: 7px 14px !important;
    text-align: left !important;
    font-weight: 600 !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
}

.cwfd-disc-table td {
    padding: 7px 14px !important;
    border-bottom: 1px solid #f0f0f0 !important;
    color: #222529 !important;
    font-size: 13px !important;
}

.cwfd-disc-table tbody tr {
    background: #fff !important;
    transition: background 0.2s ease !important;
}

.cwfd-disc-table tbody tr:last-child td {
    border-bottom: none !important;
}

.cwfd-disc-table tbody tr:hover {
    background: #fef2f5 !important;
}

.cwfd-disc-table tbody tr.cwfd-disc-active {
    background: #fef2f5 !important;
    border-left: 3px solid #C40044 !important;
}

.cwfd-disc-table tbody tr.cwfd-disc-active td {
    color: #C40044 !important;
    font-weight: 600 !important;
}

/* ── Total Box ── */
.cwfd-dpt-box {
    padding: 14px 16px !important;
    border-radius: 6px !important;
    background: #fff !important;
    border: 1px solid #e8e8e8 !important;
    overflow: hidden !important;
    transition: border-color 0.2s ease !important;
}

.cwfd-dpt-box:hover {
    border-color: #C40044 !important;
}

.cwfd-dpt-container.cwfd-dpt-visible {
    animation: cwfdFadeIn 0.3s ease forwards !important;
}

@keyframes cwfdFadeIn {
    0% {
        opacity: 0;
        transform: translateY(6px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.cwfd-dpt-main {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
}

.cwfd-dpt-left {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-shrink: 0 !important;
}

.cwfd-dpt-cart-icon {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    border-radius: 6px !important;
    background: #C40044 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.cwfd-dpt-cart-icon svg {
    width: 16px !important;
    height: 16px !important;
}

.cwfd-dpt-labels {
    display: flex !important;
    flex-direction: column !important;
}

.cwfd-dpt-total-label {
    font-weight: 600 !important;
    font-size: 14px !important;
    color: #222529 !important;
    line-height: 1.3 !important;
}

.cwfd-dpt-qty-breakdown {
    font-size: 12px !important;
    color: #696969 !important;
    font-weight: 400 !important;
    line-height: 1.3 !important;
}

.cwfd-dpt-right {
    text-align: right !important;
    flex-shrink: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    gap: 3px !important;
}

.cwfd-dpt-total-value {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #C40044 !important;
    letter-spacing: -0.01em !important;
    white-space: nowrap !important;
    display: inline-block !important;
}

.cwfd-dpt-total-value.cwfd-bounce {
    animation: cwfdBounce 0.3s ease !important;
}

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

    40% {
        transform: scale(1.08);
    }

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

/* Discount Badge */
.cwfd-dpt-discount-badge {
    display: inline-block !important;
    background: #C40044 !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
    letter-spacing: 0.02em !important;
    text-transform: uppercase !important;
}

/* Unit Price */
.cwfd-dpt-unit {
    margin-top: 8px !important;
    padding-top: 8px !important;
    border-top: 1px solid #f0f0f0 !important;
    font-size: 12px !important;
    color: #696969 !important;
    font-weight: 400 !important;
}

.cwfd-dpt-unit strong {
    color: #222529 !important;
    font-weight: 600 !important;
}

.cwfd-dpt-unit del {
    color: #999 !important;
    text-decoration: line-through !important;
    margin-right: 4px !important;
}

/* Savings */
.cwfd-dpt-savings {
    margin-top: 8px !important;
    padding: 6px 12px !important;
    background: #f0faf4 !important;
    border: 1px solid #d4edda !important;
    border-radius: 4px !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 12px !important;
    color: #28a745 !important;
    font-weight: 500 !important;
}

.cwfd-dpt-savings-emoji {
    font-size: 14px !important;
    flex-shrink: 0 !important;
}

.cwfd-dpt-savings-amount {
    font-weight: 700 !important;
    font-size: 13px !important;
    color: #28a745 !important;
}

.cwfd-dpt-savings.cwfd-pulse {
    animation: cwfdPulse 0.3s ease !important;
}

@keyframes cwfdPulse {

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

    50% {
        transform: scale(1.01);
    }
}

/* ── Quick Checkout ── */
.cwfd-qc-btn {
    display: block !important;
    width: 100% !important;
    padding: 12px 18px !important;
    background: linear-gradient(90deg, #E23C4A 0%, #B72F3B 100%) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-align: center !important;
    outline: none !important;
    line-height: 1.4 !important;
}

.cwfd-qc-btn:hover {
    filter: brightness(1.08) !important;
    transform: translateY(-1px) !important;
}

.cwfd-qc-btn:active {
    transform: translateY(0) !important;
}

.cwfd-qc-btn.cwfd-loading {
    opacity: 0.7 !important;
    pointer-events: none !important;
}

.cwfd-qc-btn.cwfd-loading::after {
    content: '' !important;
    display: inline-block !important;
    width: 16px !important;
    height: 16px !important;
    border: 2px solid rgba(255, 255, 255, 0.3) !important;
    border-top-color: #fff !important;
    border-radius: 50% !important;
    animation: cwfdSpin 0.5s linear infinite !important;
    margin-left: 8px !important;
    vertical-align: middle !important;
}

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

/* Continue Shopping */
.cwfd-continue-btn {
    display: block !important;
    width: 100% !important;
    padding: 10px 18px !important;
    background: #fff !important;
    color: #222529 !important;
    border: 1px solid #ddd !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-align: center !important;
    outline: none !important;
}

.cwfd-continue-btn:hover {
    border-color: #C40044 !important;
    color: #C40044 !important;
}

/* ── Tablet ── */
@media(min-width:768px) and (max-width:1023px) {
    .cwfd-dpt-total-value {
        font-size: 22px !important;
    }

    .cwfd-dpt-cart-icon {
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
    }
}

/* ── Mobile ── */
@media(max-width:767px) {
    .cwfd-dpt-container {
        margin: 12px 0 !important;
        gap: 6px !important;
    }

    .cwfd-dpt-box {
        padding: 12px 14px !important;
    }

    .cwfd-dpt-cart-icon {
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
    }

    .cwfd-dpt-cart-icon svg {
        width: 14px !important;
        height: 14px !important;
    }

    .cwfd-dpt-total-label {
        font-size: 13px !important;
    }

    .cwfd-dpt-total-value {
        font-size: 20px !important;
    }

    .cwfd-qc-btn {
        padding: 11px 16px !important;
        font-size: 13px !important;
    }

    .cwfd-continue-btn {
        padding: 9px 16px !important;
        font-size: 12px !important;
    }

    .cwfd-disc-table th,
    .cwfd-disc-table td {
        padding: 6px 10px !important;
        font-size: 12px !important;
    }
}

@media(max-width:400px) {
    .cwfd-dpt-total-value {
        font-size: 18px !important;
    }

    .cwfd-dpt-cart-icon {
        width: 26px !important;
        height: 26px !important;
        min-width: 26px !important;
    }

    .cwfd-qc-btn {
        padding: 10px 14px !important;
        font-size: 12px !important;
    }
}

@media(prefers-reduced-motion:reduce) {

    .cwfd-dpt-container,
    .cwfd-dpt-total-value,
    .cwfd-dpt-savings,
    .cwfd-qc-btn,
    .cwfd-continue-btn,
    .cwfd-dpt-discount-badge {
        animation: none !important;
        transition: none !important;
    }
}

@media print {

    .cwfd-qc-btn,
    .cwfd-continue-btn {
        display: none !important;
    }

    .cwfd-dpt-box {
        border: 1px solid #ddd !important;
    }
}

/* =========================================================
   FONT FIX (MUST BE AT THE VERY END)
   Forces this widget to use the site's default font
   ========================================================= */
html body #main .cwfd-dpt-container,
html body #main .cwfd-dpt-container *{
  font-family: inherit !important;
}