.cart-page { padding: 30px 0 100px; }
.cart-page-title {
    font-weight: 300; letter-spacing: 0.12em; text-transform: uppercase;
    color: #333; margin-bottom: 24px; font-size: clamp(1.5rem, 4vw, 2.2rem);
    text-align: center;
}
.cart-section-card {
    background: white; border: 1px solid var(--border-color);
    border-radius: 25px; padding: 24px; position: relative;
}
.cart-section-title {
    font-weight: 700; font-size: 1.1rem; color: #333;
    letter-spacing: 0.06em; margin-bottom: 20px;
    display: flex; align-items: center; gap: 10px;
}
.cart-section-title i { color: var(--button-color); font-size: 1.3rem; }

.cart-empty-box {
    text-align: center; padding: 60px 20px;
}
.cart-empty-box .empty-icon {
    font-size: 4rem; color: #ddd; margin-bottom: 20px;
}
.cart-empty-box h3 {
    font-weight: 500; color: #333; margin-bottom: 10px; font-size: 1.4rem;
}
.cart-empty-box p { color: #999; margin-bottom: 24px; }

.cart-back-btn {
    display: inline-flex; align-items: center; gap: 8px;
    background-color: var(--button-color); color: white; border: none;
    padding: 12px 28px; border-radius: 20px; font-weight: 600;
    font-size: 0.95rem; letter-spacing: 0.04em;
    text-decoration: none; transition: background-color 0.3s, transform 0.2s;
}
.cart-back-btn:hover { background-color: #d34495; color: white; transform: scale(1.03); }

.cart-actions-row {
    display: flex; justify-content: space-between; align-items: center;
    margin-top: 24px; gap: 12px; flex-wrap: wrap;
}
.cart-action-link {
    display: inline-flex; align-items: center; gap: 6px;
    color: var(--button-color); font-weight: 600; font-size: 0.9rem;
    text-decoration: none; transition: color 0.2s;
}
.cart-action-link:hover { color: #d34495; }
.cart-clear-btn {
    background: none; border: 1px solid #dc3545; color: #dc3545;
    padding: 8px 20px; border-radius: 0.375rem; font-weight: 600;
    font-size: 0.85rem; cursor: pointer; transition: all 0.2s;
}
.cart-clear-btn:hover { background-color: #dc3545; color: white; }

.order-summary-card {
    background: white; border: 1px solid var(--border-color);
    border-radius: 25px; overflow: hidden;
}
.order-summary-header {
    background: linear-gradient(135deg, var(--button-color), #ffb8c6);
    color: white; padding: 18px 24px;
    font-weight: 700; font-size: 1.1rem; letter-spacing: 0.06em;
    display: flex; align-items: center; gap: 10px;
}
.order-summary-body { padding: 24px; }

.checkout-btn-main {
    display: block; width: 100%; text-align: center;
    background-color: var(--button-color); color: white; border: none;
    padding: 14px; border-radius: 12px; font-weight: 700;
    font-size: 1rem; letter-spacing: 0.06em;
    text-decoration: none; transition: background-color 0.3s, transform 0.2s;
    margin-top: 16px;
}
.checkout-btn-main:hover { background-color: #d34495; color: white; transform: scale(1.02); }

.checkout-btn-outline {
    display: block; width: 100%; text-align: center;
    background: transparent; color: var(--button-color);
    border: 2px solid var(--button-color); padding: 12px;
    border-radius: 12px; font-weight: 700; font-size: 0.95rem;
    letter-spacing: 0.04em; text-decoration: none;
    transition: all 0.3s;
}
.checkout-btn-outline:hover { background-color: var(--button-color); color: white; }

.checkout-btn-secondary {
    display: block; width: 100%; text-align: center;
    background: transparent; color: #666;
    border: 1px solid #dee2e6; padding: 10px;
    border-radius: 12px; font-weight: 600; font-size: 0.85rem;
    cursor: pointer; transition: all 0.2s; margin-top: 8px;
}
.checkout-btn-secondary:hover { border-color: #999; color: #333; }

.or-divider {
    text-align: center; color: #999; font-size: 0.85rem;
    margin: 12px 0; position: relative;
}
.or-divider::before, .or-divider::after {
    content: ''; position: absolute; top: 50%;
    width: calc(50% - 20px); height: 1px; background: #eee;
}
.or-divider::before { left: 0; }
.or-divider::after { right: 0; }

.summary-benefits {
    margin-top: 20px; padding-top: 16px; border-top: 1px solid #eee;
}
.summary-benefit-item {
    display: flex; align-items: center; gap: 8px;
    font-size: 0.8rem; color: #999; margin-bottom: 8px;
}
.summary-benefit-item:last-child { margin-bottom: 0; }
.summary-benefit-item i { color: #00cc55; font-size: 1rem; }

.guest-info-box {
    background: #f8f9fa; border: 1px solid #e9ecef;
    border-radius: 12px; padding: 14px; margin-top: 14px;
    font-size: 0.82rem; color: #666;
}
.guest-info-box strong { color: #333; }

.roulette-wrapper { overflow-x: hidden; cursor: grab; }
.roulette-hint { margin-top: 12px; }
.cart-item .col-2 .bg-light { display: flex; align-items: center; justify-content: center; }
.cart-item .col-2 .bg-light img { width: 70px; height: 70px; object-fit: cover; }

@media (max-width: 991px) {
    .cart-page { padding: 16px 0 80px; }
    .cart-section-card { padding: 18px; border-radius: 20px; }
    .order-summary-card { margin-top: 20px; }
}
@media (max-width: 767.98px) {
    .cart-section-card { padding: 14px !important; border-radius: 16px !important; }
    .order-summary-body { padding: 14px !important; }
    .cart-page-title { margin-bottom: 16px !important; font-size: 1.3rem !important; }
    .cart-item .row { --bs-gutter-x: 0.5rem !important; }
    .cart-item .col-2 { flex: 0 0 auto !important; width: 55px !important; }
    .cart-item .col-2 .bg-light { padding: 4px !important; display: flex; align-items: center; justify-content: center; }
    .cart-item .col-2 .bg-light img { width: 50px !important; height: 50px !important; }
    .cart-item .col-6 { flex: 1 1 0 !important; width: auto !important; min-width: 0 !important; overflow: hidden !important; }
    .cart-item .col-6 h6, .cart-item .col-6 .fw-bold { font-size: 0.82rem !important; }
    .cart-item .col-6 .text-muted { font-size: 0.72rem !important; }
    .cart-item .col-4 { flex: 0 0 auto !important; width: auto !important; text-align: right !important; }
    .cart-item .col-4 .fw-bold { font-size: 0.9rem !important; }
    .cart-item .col-4 .btn { font-size: 0.72rem !important; padding: 2px 6px !important; }
    .acc-control-group { height: 28px !important; }
    .acc-btn { width: 30px !important; font-size: 14px !important; }
    .acc-input-red { font-size: 12px !important; padding: 2px 4px !important; width: 38px !important; }
    .cart-actions-row { gap: 8px !important; }
    .cart-action-link, .cart-clear-btn { font-size: 0.78rem !important; padding: 6px 14px !important; }
    .order-summary-header { font-size: 0.95rem !important; padding: 14px 18px !important; }
    .order-summary-body { padding: 14px !important; }
    #order-summary .d-flex { font-size: 0.82rem !important; }
    #order-summary .fs-4 { font-size: 1rem !important; }
    .summary-benefit-item { font-size: 0.72rem !important; padding: 4px 0 !important; }
    .roulette-card { width: 140px !important; }
    .roulette-card img { height: 100px !important; }
    .roulette-card .fw-bold { font-size: 0.75rem !important; }
    .roulette-card .acc-price { font-size: 0.85rem !important; }
}
