﻿/* === CART PAGE STYLES - Product Detail ile uyumlu === */
:root {
    --corporate-primary: #42a5d9;
    --corporate-light: #e3f2fd;
    --corporate-dark: #1976d2;
    --corporate-accent: #81d4fa;
    --corporate-success: #4caf50;
    --corporate-warning: #ff9800;
    --corporate-danger: #f44336;
    --elegant-primary: #2c3e50;
    --elegant-light: #fafbfc;
    --elegant-border: #e1e8ed;
    --elegant-text: #6c757d;
    --elegant-shadow: 0 4px 20px rgba(66, 165, 217, 0.08);
    --elegant-radius: 10px;
    --elegant-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.cart-page {
    font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;
    background: #fff;
    min-height: 100vh;
    color: var(--elegant-primary);
    padding: 2rem 0;
}

.cart-header {
    margin-bottom: 3rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--elegant-border);
}

.cart-title {
    font-size: 2.2rem;
    font-weight: 300;
    color: var(--elegant-primary);
    margin: 0;
}

.cart-item-card {
    background: white;
    border: 1px solid var(--elegant-border);
    border-radius: var(--elegant-radius);
    margin-bottom: 1.5rem;
    transition: var(--elegant-transition);
    overflow: hidden;
}

    .cart-item-card:hover {
        border-color: var(--corporate-accent);
        box-shadow: var(--elegant-shadow);
        transform: translateY(-2px);
    }

.cart-item-body {
    padding: 1.5rem;
}

.cart-item-image-container {
    width: 100px;
    height: 100px;
    border-radius: var(--elegant-radius);
    overflow: hidden;
    border: 1px solid var(--elegant-border);
    background: var(--elegant-light);
    display: flex;
    align-items: center;
    justify-content: center;
}

.cart-item-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cart-item-image-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--elegant-text);
    background: linear-gradient(135deg, var(--elegant-light) 0%, #f8fdff 100%);
}

    .cart-item-image-placeholder i {
        font-size: 1.5rem;
        margin-bottom: 0.5rem;
        opacity: 0.5;
    }

.cart-item-info {
    padding-left: 1rem;
}

.cart-item-name {
    font-size: 1.1rem;
    font-weight: 400;
    color: var(--elegant-primary);
    margin-bottom: 0.5rem;
    line-height: 1.4;
}

.cart-item-price {
    font-size: 1.1rem;
    font-weight: 300;
    color: var(--corporate-primary);
}

.cart-item-total {
    font-size: 1.2rem;
    font-weight: 500;
    color: var(--corporate-primary);
}

/* Quantity Controls - Product Detail ile uyumlu */
.quantity-controls-cart {
    display: flex;
    border: 1px solid var(--elegant-border);
    border-radius: 8px;
    overflow: hidden;
    background: white;
    transition: var(--elegant-transition);
    max-width: 140px;
}

    .quantity-controls-cart:focus-within {
        border-color: var(--corporate-primary);
        box-shadow: 0 0 0 2px rgba(66, 165, 217, 0.1);
    }

.qty-btn-cart {
    border: none;
    background: white;
    padding: 0.6rem 0.8rem;
    cursor: pointer;
    transition: var(--elegant-transition);
    color: var(--elegant-primary);
}

    .qty-btn-cart:hover {
        background: var(--corporate-light);
        color: var(--corporate-primary);
    }

.qty-input-cart {
    border: none;
    width: 50px;
    text-align: center;
    font-weight: 500;
    background: white;
    color: var(--elegant-primary);
    border-left: 1px solid var(--elegant-border);
    border-right: 1px solid var(--elegant-border);
}

    .qty-input-cart:focus {
        outline: none;
    }

.remove-item-btn {
    background: none;
    border: 1px solid var(--elegant-border);
    color: var(--corporate-danger);
    cursor: pointer;
    padding: 0.75rem;
    border-radius: 8px;
    transition: var(--elegant-transition);
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .remove-item-btn:hover {
        background: var(--corporate-danger);
        color: white;
        border-color: var(--corporate-danger);
        transform: scale(1.05);
    }

/* Cart Summary - Product Detail ile uyumlu */
.cart-summary-card {
    background: var(--elegant-light);
    border: 1px solid var(--elegant-border);
    border-radius: var(--elegant-radius);
    padding: 2rem;
    transition: var(--elegant-transition);
    position: sticky;
    top: 2rem;
}

    .cart-summary-card:hover {
        border-color: var(--corporate-accent);
        box-shadow: var(--elegant-shadow);
    }

.summary-title {
    font-size: 1.3rem;
    font-weight: 400;
    color: var(--elegant-primary);
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--elegant-border);
}

.summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--elegant-border);
}

.summary-total {
    font-size: 1.4rem;
    font-weight: 300;
    color: var(--corporate-primary);
}

/* Butonlar - Product Detail ile uyumlu */
.btn-checkout {
    background: var(--corporate-primary);
    color: white;
    border: none;
    padding: 1rem 2rem;
    border-radius: 8px;
    font-weight: 500;
    cursor: pointer;
    transition: var(--elegant-transition);
    width: 100%;
    font-size: 1.1rem;
    text-decoration: none;
    display: block;
    text-align: center;
}

    .btn-checkout:hover {
        background: var(--corporate-dark);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(66, 165, 217, 0.3);
        color: white;
    }

.btn-continue-shopping {
    background: white;
    color: var(--elegant-primary);
    border: 1px solid var(--elegant-border);
    padding: 1rem 2rem;
    border-radius: 8px;
    font-weight: 500;
    cursor: pointer;
    transition: var(--elegant-transition);
    width: 100%;
    text-decoration: none;
    display: block;
    text-align: center;
    margin-top: 1rem;
}

    .btn-continue-shopping:hover {
        border-color: var(--corporate-primary);
        color: var(--corporate-primary);
        transform: translateY(-1px);
    }

/* Empty Cart */
.empty-cart {
    text-align: center;
    padding: 4rem 2rem;
    background: white;
    border-radius: var(--elegant-radius);
    border: 1px solid var(--elegant-border);
}

.empty-cart-icon {
    font-size: 4rem;
    color: var(--elegant-text);
    margin-bottom: 1.5rem;
    opacity: 0.6;
}

.empty-cart-title {
    font-size: 1.8rem;
    font-weight: 300;
    color: var(--elegant-primary);
    margin-bottom: 1rem;
}

.empty-cart-text {
    color: var(--elegant-text);
    margin-bottom: 2rem;
    font-size: 1.1rem;
    line-height: 1.6;
}

/* Security Info */
.security-info {
    text-align: center;
    padding: 1.5rem;
    background: white;
    border: 1px solid var(--elegant-border);
    border-radius: var(--elegant-radius);
    margin-top: 1.5rem;
}

.security-icon {
    font-size: 2rem;
    color: var(--corporate-success);
    margin-bottom: 1rem;
}

/* Responsive */
@media (max-width: 768px) {
    .cart-page {
        padding: 1rem 0;
    }

    .cart-title {
        font-size: 1.8rem;
    }

    .cart-item-body {
        padding: 1rem;
    }

    .cart-item-image-container {
        width: 80px;
        height: 80px;
        margin-bottom: 1rem;
    }

    .cart-item-info {
        padding-left: 0;
        margin-bottom: 1rem;
    }

    .cart-summary-card {
        padding: 1.5rem;
        margin-top: 2rem;
    }

    .summary-title {
        font-size: 1.1rem;
    }

    .quantity-controls-cart {
        max-width: 120px;
    }
}
/* === CART MODAL STYLES === */
.cart-modal-item {
    display: flex;
    align-items: center;
    padding: 1rem;
    border-bottom: 1px solid var(--elegant-border);
    gap: 1rem;
    transition: var(--elegant-transition);
}

    .cart-modal-item:hover {
        background: var(--elegant-light);
    }

    .cart-modal-item:last-child {
        border-bottom: none;
    }

.cart-modal-item-image-container {
    width: 80px;
    height: 80px;
    border-radius: var(--elegant-radius);
    overflow: hidden;
    border: 1px solid var(--elegant-border);
    background: var(--elegant-light);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.cart-modal-item-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cart-modal-item-image-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--elegant-text);
    background: linear-gradient(135deg, var(--elegant-light) 0%, #f8fdff 100%);
}

    .cart-modal-item-image-placeholder i {
        font-size: 1.2rem;
        margin-bottom: 0.25rem;
        opacity: 0.5;
    }

.cart-modal-item-info {
    flex: 1;
    min-width: 0; /* Text overflow için */
}

.cart-modal-item-name {
    font-weight: 500;
    color: var(--elegant-primary);
    margin-bottom: 0.5rem;
    line-height: 1.3;
    font-size: 0.95rem;
}

.cart-modal-item-price {
    color: var(--corporate-primary);
    font-weight: 500;
    font-size: 1rem;
}

.cart-modal-item-quantity {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-right: 1rem;
}

.cart-modal-quantity-btn {
    width: 32px;
    height: 32px;
    border: 1px solid var(--elegant-border);
    background: white;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--elegant-transition);
    color: var(--elegant-primary);
}

    .cart-modal-quantity-btn:hover {
        background: var(--corporate-light);
        border-color: var(--corporate-primary);
        color: var(--corporate-primary);
    }

.cart-modal-quantity-input {
    width: 50px;
    text-align: center;
    border: 1px solid var(--elegant-border);
    border-radius: 6px;
    padding: 0.4rem;
    font-weight: 500;
    background: white;
    color: var(--elegant-primary);
}

    .cart-modal-quantity-input:focus {
        outline: none;
        border-color: var(--corporate-primary);
        box-shadow: 0 0 0 2px rgba(66, 165, 217, 0.1);
    }

.cart-modal-remove-btn {
    color: var(--corporate-danger);
    background: none;
    border: 1px solid var(--elegant-border);
    width: 40px;
    height: 40px;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--elegant-transition);
    flex-shrink: 0;
}

    .cart-modal-remove-btn:hover {
        background: var(--corporate-danger);
        color: white;
        border-color: var(--corporate-danger);
        transform: scale(1.05);
    }

.cart-modal-summary {
    padding: 1.5rem;
    border-top: 2px solid var(--elegant-border);
    background: var(--elegant-light);
    margin-top: 1rem;
    border-radius: 0 0 var(--elegant-radius) var(--elegant-radius);
}

.cart-modal-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1.3rem;
    font-weight: 500;
    color: var(--corporate-primary);
    margin-bottom: 1rem;
}

.cart-modal-actions {
    display: flex;
    gap: 1rem;
}

    .cart-modal-actions .btn {
        flex: 1;
        padding: 0.75rem 1.5rem;
        font-weight: 500;
    }

/* Modal header ve footer stilleri */
#cartModal .modal-header {
    background: var(--elegant-light);
    border-bottom: 1px solid var(--elegant-border);
    padding: 1.25rem 1.5rem;
}

#cartModal .modal-title {
    font-weight: 400;
    color: var(--elegant-primary);
    font-size: 1.3rem;
}

#cartModal .modal-body {
    padding: 0;
    max-height: 60vh;
    overflow-y: auto;
}

#cartModal .modal-footer {
    background: var(--elegant-light);
    border-top: 1px solid var(--elegant-border);
    padding: 1rem 1.5rem;
}

/* Boş sepet stilleri */
.cart-modal-empty {
    text-align: center;
    padding: 3rem 2rem;
    color: var(--elegant-text);
}

    .cart-modal-empty i {
        font-size: 4rem;
        margin-bottom: 1rem;
        opacity: 0.5;
    }

    .cart-modal-empty p {
        font-size: 1.1rem;
        margin-bottom: 1.5rem;
    }

/* Responsive */
@media (max-width: 768px) {
    .cart-modal-item {
        flex-wrap: wrap;
        gap: 0.75rem;
    }

    .cart-modal-item-image-container {
        width: 60px;
        height: 60px;
    }

    .cart-modal-item-info {
        flex: 1;
        min-width: 150px;
    }

    .cart-modal-item-quantity {
        margin-right: 0;
    }

    .cart-modal-actions {
        flex-direction: column;
    }

    #cartModal .modal-dialog {
        margin: 0.5rem;
    }
}

/* Loading state */
.cart-modal-loading {
    text-align: center;
    padding: 2rem;
    color: var(--elegant-text);
}

    .cart-modal-loading i {
        font-size: 2rem;
        margin-bottom: 1rem;
        opacity: 0.7;
    }
#cartModal {
    z-index: 1055; /* Higher than lightbox */
}

#lightboxOverlay {
    z-index: 1050; /* Lower than cart modal */
}

/* Prevent any click-through when cart modal is open */
.modal.show {
    pointer-events: auto;
}