/* ==========================================================================
   PRODUCT SUMMARY COMPONENT
   ========================================================================== */

.product-summary { 
    flex: 1; 
    min-width: 0; 
    width: 100%; 
    padding-top: 50px; 
}

/* 1. Danh mục sản phẩm */
.product-summary__categories { 
    color: var(--text-grey); 
    margin-bottom: 15px; 
    display: flex; 
    flex-wrap: wrap; 
    align-items: center; 
    gap: 8px; 
}



/* 2. Tên sản phẩm */
.product-summary__title { 
    color: var(--text-title); 
    margin-bottom: 15px; 
    font-family: var(--font-serif);
    font-size: 28px;
    line-height: 1.3;
}

/* 3. Phân cách */
.product-summary__divider { 
    border: none;
    border-top: 1px solid var(--color-border); 
    margin: 20px 0; 
}        

/* 4. Mô tả ngắn */
.product-summary__desc { 
    color: var(--text-dark); 
    opacity: 0.85;
    margin-bottom: 25px; 
    line-height: 1.6;
}        

/* 5. Giá tiền */
.product-summary__price .price, 
.product-summary__price .amount,
.product-summary__price .price-contact { 
    font-family: var(--font-serif); 
    font-weight: 500; 
    font-size: 32px; 
    color: var(--text-dark); 
    display: block; 
    margin-bottom: 20px; 
}

/* 6. Form Mua hàng & Khung hành động */
.product-summary__action { 
    width: 100%; 
}

.product-summary__action form.cart { 
    display: flex; 
    flex-wrap: wrap; 
    align-items: center; 
    gap: 15px; 
    margin: 0; 
    width: 100%;
}        

/* HÀNG 1: Ô chọn số lượng chiếm 100% dòng trên */
.product-summary__action div.quantity { 
    width: 100%; 
    display: flex; 
    align-items: center; 
    justify-content: flex-start; 
    margin: 0 0 15px 0; 
    flex-shrink: 0; 
}

.product-summary__action div.quantity input.qty, 
.product-summary__qty-btn { 
    font-family: var(--font-sans); 
    font-weight: 500; 
    font-size: 14px; 
    height: 38px; 
    box-sizing: border-box; 
    border-radius: 0; 
}

.product-summary__action div.quantity input.qty { 
    width: 38px; 
    background: var(--midori-accent); 
    color: var(--text-white); 
    border: none; 
    text-align: center; 
    padding: 0; 
    margin: 0; 
}

.product-summary__qty-btn { 
    width: 32px; 
    background: var(--text-white); 
    border: 1px solid var(--text-grey); 
    color: var(--text-dark); 
    cursor: pointer; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    padding: 0; 
    line-height: 1; 
}

.product-summary__qty-btn:hover { 
    background-color: var(--midori-primary); 
}

/* HÀNG 2: Nút Mua hàng & Nút Zalo song song 50% */
.product-summary__action button.single_add_to_cart_button { 
    font-family: var(--font-sans); 
    font-weight: 500; 
    font-size: 14px; 
    flex: 1 1 calc(50% - 8px); 
    height: 48px; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    box-sizing: border-box; 
    background-color: var(--midori-accent); 
    color: var(--text-white); 
    border-radius: 0; 
    padding: 0 15px; 
    border: 1px solid var(--midori-accent); 
    cursor: pointer; 
    text-transform: uppercase; 
    transition: var(--transition-base);
}

.product-summary__action button.single_add_to_cart_button:hover {
    background-color: var(--midori-accent-dark);
    border-color: var(--midori-accent-dark);
}

.product-summary__zalo-btn,
.product-summary__action .esight-zalo-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    border: 1px solid var(--midori-accent);
    color: var(--midori-accent);
    padding: 0 25px;
    height: 48px;
    border-radius: 0; 
    background-color: #ffffff;
    text-decoration: none;
    font-weight: 500;
    font-family: var(--font-sans);
    transition: var(--transition-base);
    cursor: pointer;
    box-sizing: border-box;
    flex: 1 1 calc(50% - 8px); 
    min-width: 150px;
}

.product-summary__zalo-btn:hover,
.product-summary__action .esight-zalo-btn:hover {
    background-color: var(--midori-primary);
    border-color: var(--midori-accent-dark);
    color: var(--midori-accent-dark);
}

.product-summary__zalo-btn img,
.product-summary__action .esight-zalo-btn img {
    width: 28px;
    height: auto;
    margin: 0;
    image-rendering: -webkit-optimize-contrast;
}