/* ============================================================
   Amazon-style 3-column product page layout
   Now uses Safqa design tokens from design_system.css
   ============================================================ */

/* ---- Wrapper: 3-column grid ---- */
.ut2-amazon-layout-wrapper {
    display: grid;
    grid-template-columns: 400px 1fr 320px;
    gap: 0 var(--safqa-space-6, 24px);
    align-items: start;
    max-width: 100%;
    margin: var(--safqa-space-6, 24px) 0 0;
}

/* ---- Column 1: Images ---- */
.amazon-col-images {
    grid-column: 1;
    position: sticky;
    top: 88px;
}
.amazon-col-images .ty-product-bigpicture__img {
    border: 1px solid var(--safqa-border, #e2eaea);
    border-radius: var(--safqa-radius-md, 12px);
    overflow: hidden;
    background: var(--safqa-surface, #fff);
}

/* ---- Column 2: Details ---- */
.amazon-col-details {
    grid-column: 2;
    padding-inline-end: var(--safqa-space-3, 12px);
}

.amazon-product-title {
    font-size: var(--safqa-text-xl, 22px) !important;
    font-weight: 800 !important;
    line-height: var(--safqa-line-tight, 1.3) !important;
    color: var(--safqa-text-primary, #0d1b1e) !important;
    margin-bottom: var(--safqa-space-2, 8px) !important;
}

.amazon-brand-line {
    font-size: var(--safqa-text-sm, 13px);
    color: var(--safqa-text-secondary, #4a6060);
    margin-bottom: var(--safqa-space-2, 8px);
}
.amazon-brand-line a {
    color: var(--safqa-brand, #009598);
}
.amazon-brand-line a:hover {
    color: var(--safqa-brand-dark, #005e60);
}

.amazon-rating-row {
    display: flex;
    align-items: center;
    gap: var(--safqa-space-2, 8px);
    margin-bottom: var(--safqa-space-3, 12px);
    flex-wrap: wrap;
}

.amazon-details-divider {
    border: none;
    border-top: 1px solid var(--safqa-border, #e2eaea);
    margin: var(--safqa-space-4, 16px) 0;
}

.amazon-short-desc {
    font-size: var(--safqa-text-base, 14px);
    line-height: var(--safqa-line-base, 1.6);
    color: var(--safqa-text-secondary, #4a6060);
    margin-bottom: var(--safqa-space-4, 16px);
}
.amazon-short-desc ul,
.amazon-short-desc ol {
    padding-inline-start: 20px;
    margin: 0;
}
.amazon-short-desc li {
    margin-bottom: var(--safqa-space-1, 4px);
}

.amazon-features-list {
    margin-top: var(--safqa-space-3, 12px);
    font-size: var(--safqa-text-sm, 13px);
    color: var(--safqa-text-secondary, #4a6060);
}

/* ---- Column 3: Buy Box ---- */
.amazon-col-buybox {
    grid-column: 3;
    position: sticky;
    top: 88px;
}
.buybox-inner-card {
    border: 1px solid var(--safqa-border, #e2eaea);
    border-radius: var(--safqa-radius-md, 12px);
    padding: var(--safqa-space-5, 20px);
    background: var(--safqa-surface, #fff);
    box-shadow: var(--safqa-shadow-sm);
}
.buybox-price-wrap {
    margin-bottom: var(--safqa-space-3, 12px);
    padding-bottom: var(--safqa-space-3, 12px);
    border-bottom: 1px solid var(--safqa-border, #e2eaea);
}
.buybox-main-price .ty-price,
.buybox-main-price bdi {
    font-size: 30px !important;
    font-weight: 800 !important;
    color: var(--safqa-price, #0d1b1e) !important;
    letter-spacing: -.5px !important;
}
.buybox-stock {
    font-size: var(--safqa-text-sm, 13px);
    font-weight: 700;
    color: var(--safqa-success, #009598);
    margin-bottom: var(--safqa-space-3, 12px);
    display: flex;
    align-items: center;
    gap: 6px;
}
.buybox-stock::before {
    content: '✓';
    width: 18px;
    height: 18px;
    background: var(--safqa-success, #009598);
    color: white;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 900;
    flex-shrink: 0;
}
.buybox-points {
    font-size: var(--safqa-text-xs, 11px);
    color: var(--safqa-text-muted, #7a9494);
    margin-top: var(--safqa-space-1, 4px);
}
.buybox-qty-wrap {
    margin-bottom: var(--safqa-space-3, 12px);
}
.buybox-buttons {
    display: flex;
    flex-direction: column;
    gap: var(--safqa-space-2, 8px);
    margin-top: var(--safqa-space-4, 16px);
}
.buybox-buttons .ty-btn,
.buybox-buttons .btn,
.buybox-buttons [class*="ty-btn"] {
    width: 100% !important;
    border-radius: var(--safqa-radius-pill, 999px) !important;
    font-size: var(--safqa-text-sm, 13px) !important;
    padding: 11px 16px !important;
    text-align: center !important;
    font-weight: 700 !important;
}

/* Seller info box */
.buybox-vendor {
    margin-top: var(--safqa-space-4, 16px);
    padding-top: var(--safqa-space-4, 16px);
    border-top: 1px solid var(--safqa-border, #e2eaea);
    font-size: var(--safqa-text-xs, 11px);
    color: var(--safqa-text-muted, #7a9494);
}
.buybox-vendor a {
    color: var(--safqa-brand, #009598) !important;
    font-weight: 600;
}

/* ---- Below fold: tabs section ---- */
.amazon-tabs-section {
    grid-column: 1 / -1;
    margin-top: var(--safqa-space-8, 32px);
    padding-top: var(--safqa-space-6, 24px);
    border-top: 2px solid var(--safqa-border, #e2eaea);
}

/* ---- RTL (Arabic) ---- */
html[dir="rtl"] .ut2-amazon-layout-wrapper {
    grid-template-columns: 320px 1fr 400px;
    direction: rtl;
}
html[dir="rtl"] .amazon-col-images  { grid-column: 3; }
html[dir="rtl"] .amazon-col-details { grid-column: 2; }
html[dir="rtl"] .amazon-col-buybox  { grid-column: 1; }
html[dir="rtl"] .amazon-product-title {
    text-align: right !important;
}
html[dir="rtl"] .buybox-stock::before {
    order: 1;
}

/* ---- Tablet (≤ 1100px): 2 columns ---- */
@media (max-width: 1100px) {
    .ut2-amazon-layout-wrapper {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto;
    }
    .amazon-col-images  { grid-column: 1; grid-row: 1; position: static; }
    .amazon-col-buybox  { grid-column: 2; grid-row: 1; position: static; }
    .amazon-col-details { grid-column: 1 / -1; grid-row: 2; }
    .amazon-tabs-section { grid-column: 1 / -1; }

    html[dir="rtl"] .amazon-col-images  { grid-column: 2; }
    html[dir="rtl"] .amazon-col-buybox  { grid-column: 1; }
    html[dir="rtl"] .amazon-col-details { grid-column: 1 / -1; }
}

/* ---- Mobile (≤ 640px): 1 column ---- */
@media (max-width: 640px) {
    .ut2-amazon-layout-wrapper {
        grid-template-columns: 1fr;
        gap: var(--safqa-space-4, 16px) 0;
    }
    .amazon-col-images,
    .amazon-col-details,
    .amazon-col-buybox {
        grid-column: 1 !important;
        grid-row: auto !important;
        position: static !important;
    }
    .amazon-col-images  { order: 1; }
    .amazon-col-details { order: 2; }
    .amazon-col-buybox  { order: 3; }

    .buybox-inner-card {
        padding: var(--safqa-space-4, 16px);
    }
    .amazon-product-title {
        font-size: var(--safqa-text-lg, 18px) !important;
    }
    .buybox-main-price .ty-price,
    .buybox-main-price bdi {
        font-size: 24px !important;
    }
}
