/* CHECKOUT COMBO DISPLAY FIX - High Priority Styles */
/* Add this to the END of app-checkout.css or create as separate file */

/* Ensure combo sections are visible when not hidden */
#combo-savings:not(.hidden),
#combo-breakdown:not(.hidden) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Force combo breakdown to show */
.combo-breakdown {
    margin: 1rem 0;
    padding: 1rem;
    background-color: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
}

.combo-breakdown:not(.hidden) {
    display: block !important;
}

/* Combo line item styling with high specificity */
.cart-item.combo-line-item {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%) !important;
    color: white !important;
    border: 2px solid #28a745 !important;
    border-radius: 12px !important;
    padding: 15px !important;
    margin: 10px 0 !important;
    font-weight: bold !important;
}

.combo-line-item .combo-item-name {
    font-size: 16px !important;
    font-weight: bold !important;
}

.combo-line-item .combo-price-display {
    font-size: 18px !important;
    font-weight: bold !important;
    color: #fff !important;
}

.combo-line-item .combo-regular-price {
    font-size: 14px !important;
    opacity: 0.9 !important;
}

.combo-line-item .combo-regular-price .strikethrough {
    text-decoration: line-through !important;
}

.combo-line-item .combo-savings-badge {
    background-color: rgba(255,255,255,0.2) !important;
    color: white !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    font-size: 12px !important;
    margin-top: 5px !important;
    display: inline-block !important;
}

/* Combo breakdown items */
.cart-item.combo-breakdown-item {
    background-color: #f8f9fa !important;
    border-left: 4px solid #28a745 !important;
    padding: 8px 12px !important;
    margin: 5px 0 !important;
    font-size: 14px !important;
}

.combo-breakdown-item .breakdown-item-name {
    color: #495057 !important;
}

.combo-breakdown-item .combo-item-badge {
    background-color: #28a745 !important;
    color: white !important;
    padding: 2px 6px !important;
    border-radius: 3px !important;
    font-size: 10px !important;
    margin-left: 8px !important;
}

/* Strikethrough for breakdown item prices */
.combo-breakdown-item .breakdown-item-price .strikethrough {
    text-decoration: line-through !important;
    color: #6c757d !important;
}

/* Subtotal positioning fix */
.cart-subtotal {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 10px 0 !important;
    margin: 10px 0 !important;
    border-top: 1px solid #dee2e6 !important;
    font-weight: bold !important;
    order: 1 !important; /* Ensure subtotal appears after cart items */
}

/* Cart total positioning */
.cart-total {
    order: 3 !important; /* Ensure total appears after combo items */
}

/* Combo items positioning */
.combo-line-item {
    order: 2 !important; /* Ensure combo appears between subtotal and total */
}

.combo-breakdown-item {
    order: 2 !important; /* Ensure combo breakdown appears with combo items */
}

/* Combo savings line */
.combo-savings .savings-line {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 8px 0 !important;
    color: #28a745 !important;
    font-weight: bold !important;
}

.combo-savings .savings-amount {
    color: #28a745 !important;
    font-weight: bold !important;
    font-size: 16px !important;
}

/* Cart total fix */
.cart-total {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 15px 0 !important;
    margin-top: 15px !important;
    border-top: 2px solid #343a40 !important;
    font-size: 18px !important;
    font-weight: bold !important;
}

/* Weekly menu status styling - REMOVED to prevent color conflicts
   Let app-checkout.css handle the proper green theme styling */

/* Add proper spacing for Weekly Menu Rights section */
.weekly-menu-header h4 {
    letter-spacing: 0.5px !important;
    word-spacing: 2px !important;
}

.weekly-menu-info {
    margin-top: 12px !important;
    line-height: 1.5 !important;
}

/* Cart total fix */
.cart-total {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 15px 0 !important;
    margin-top: 15px !important;
    border-top: 2px solid #343a40 !important;
    font-size: 18px !important;
    font-weight: bold !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Ensure order summary is visible and uses flexbox for proper ordering */
#order-summary {
    display: flex !important;
    flex-direction: column !important;
    visibility: visible !important;
}

#order-summary .cart-items {
    display: block !important;
    margin-bottom: 1rem !important;
    order: 0 !important; /* Cart items appear first */
}

/* Emergency visibility fix */
#order-summary * {
    visibility: visible !important;
}

/* Debug helper - remove after fixing */
.debug-combo {
    border: 2px dashed red !important;
    background-color: yellow !important;
    padding: 10px !important;
    margin: 10px 0 !important;
}

.debug-combo::before {
    content: "DEBUG: This element should show combo content" !important;
    font-weight: bold !important;
    color: red !important;
    display: block !important;
    margin-bottom: 10px !important;
}
