/* ===========================================
   Price Table Widget
   ===========================================
   The widget markup has always carried a .price-table class, but no rules for it
   ever shipped: the stylesheet meant to hold them
   (assets/shop/css/product-archive/styles.css) is enqueued by a function that is
   never hooked, so it does not load on any page. Rather than wake that file - and
   the two never-run scripts beside it - these rules live in their own file and are
   enqueued from the widget itself, next to the Swiper handling.

   Without them the table rendered as a browser default: no borders, no header
   band, and header cells that did not line up with the column beneath them. */

.price-table {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    margin-inline: auto;
    background: #fff;
    border: 1px solid #E8EFF6;
    border-radius: 12px;
    overflow: hidden;
    /* Fixed layout is what keeps a header cell above its own column - the auto
       algorithm was sizing thead and tbody independently. */
    table-layout: fixed;
}

.price-table th,
.price-table td {
    padding: 12px 16px;
    text-align: center;
    vertical-align: middle;
    border-bottom: 1px solid #EEF2F7;
}

.price-table thead th {
    background: #F3F6FA;
    color: #204774;
    font-weight: 700;
    font-size: 15px;
    white-space: nowrap;
    border-bottom: 2px solid #E8EFF6;
}

/* The product name is the row's label: give it the room and read it right-aligned. */
.price-table th:first-child,
.price-table td:first-child {
    text-align: right;
    width: 40%;
}

.price-table th:nth-child(2),
.price-table td:nth-child(2),
.price-table th:nth-child(3),
.price-table td:nth-child(3),
.price-table th:last-child,
.price-table td:last-child {
    width: 20%;
}

/* Tables with a single product type drop the "نوع" column; the three that
   remain split the width the type column gave up. */
.price-table--no-type th:nth-child(2),
.price-table--no-type td:nth-child(2),
.price-table--no-type th:last-child,
.price-table--no-type td:last-child {
    width: 30%;
}

.price-table td:nth-child(2) {
    /* Sizes come in two shapes and need opposite directions:
         20×1/2"        pure digits and symbols, must read left-to-right
         ۶۳ میلی‌متر     a number followed by a Persian unit, must read right-to-left
       A flat direction:ltr got the second one backwards, printing the unit ahead
       of the number. `plaintext` picks each cell's direction from its own first
       strong character, and falls back to the ltr below when a cell has none. */
    direction: ltr;
    unicode-bidi: plaintext;
}

.price-table tbody tr:nth-child(even) {
    background: #FBFCFE;
}

.price-table tbody tr:hover {
    background: #F3F6FA;
}

.price-table tbody tr:last-child td {
    border-bottom: 0;
}

.price-table .price-type-selector {
    max-width: 100%;
}

/* Rows with no price yet say so instead of showing a bare currency symbol. */
.price-table .price-on-request {
    color: #204774;
    font-weight: 700;
    white-space: nowrap;
}

@media (max-width: 640px) {
    .price-table th,
    .price-table td {
        padding: 10px 8px;
        font-size: 13px;
    }

    .price-table th:first-child,
    .price-table td:first-child {
        width: 34%;
    }
}
