/**
 * Table Column Widths - CSS Clamp
 * Fluid scaling between 390px and 1440px viewport
 *
 * HARD-CODED min/max values from screenshots - DO NOT CHANGE
 * Formula: clamp(min, calc(min + (max - min) * (100vw - 390px) / 1050), max)
 */

/* ===========================================
   SERIES-RESULTS TABLE
   Columns: Cover, Series Title, Publisher, Year, Type, Vol, #
   390px values: 55, 80, 0, 40, 71, 30, 30
   1440px values: 80, 450, 229, 75, 136, 83, 67
   =========================================== */
[data-table-id="series-results"] th:nth-child(1),
[data-table-id="series-results"] td:nth-child(1) {
    /* Cover: 55px (min) → 80px (max) */
    width: clamp(55px, calc(55px + 25 * (100vw - 390px) / 1050), 80px) !important;
    min-width: 55px !important;
    max-width: 80px !important;
}

[data-table-id="series-results"] th:nth-child(2),
[data-table-id="series-results"] td:nth-child(2) {
    /* Series Title: 80px (min) → 450px (max) */
    width: clamp(80px, calc(80px + 370 * (100vw - 390px) / 1050), 450px) !important;
    min-width: 80px !important;
    max-width: 450px !important;
}

[data-table-id="series-results"] th:nth-child(3),
[data-table-id="series-results"] td:nth-child(3) {
    /* Publisher: 0px (min) → 229px (max) - hidden on mobile */
    width: clamp(0px, calc(229 * (100vw - 390px) / 1050), 229px) !important;
    min-width: 0px !important;
    max-width: 229px !important;
}

[data-table-id="series-results"] th:nth-child(4),
[data-table-id="series-results"] td:nth-child(4) {
    /* Year: 40px (min) → 75px (max) */
    width: clamp(40px, calc(40px + 35 * (100vw - 390px) / 1050), 75px) !important;
    min-width: 40px !important;
    max-width: 75px !important;
}

[data-table-id="series-results"] th:nth-child(5),
[data-table-id="series-results"] td:nth-child(5) {
    /* Type: 71px (min) → 136px (max) */
    width: clamp(71px, calc(71px + 65 * (100vw - 390px) / 1050), 136px) !important;
    min-width: 71px !important;
    max-width: 136px !important;
}

[data-table-id="series-results"] th:nth-child(6),
[data-table-id="series-results"] td:nth-child(6) {
    /* Vol: 30px (min) → 83px (max) */
    width: clamp(30px, calc(30px + 53 * (100vw - 390px) / 1050), 83px) !important;
    min-width: 30px !important;
    max-width: 83px !important;
}

[data-table-id="series-results"] th:nth-child(7),
[data-table-id="series-results"] td:nth-child(7) {
    /* #: 30px (at 390px) → 67px (at 1440px) */
    width: clamp(30px, calc(30px + 37 * (100vw - 390px) / 1050), 67px) !important;
    min-width: 30px !important;
    max-width: 67px !important;
}

/* Hide Publisher column on small screens */
@media (max-width: 600px) {
    [data-table-id="series-results"] th:nth-child(3),
    [data-table-id="series-results"] td:nth-child(3) {
        display: none !important;
    }
}


/* ===========================================
   ISSUES-RESULTS TABLE
   Columns: Checkbox, Cover, #, Story, Month, Year
   390px values: 30, 50, 50, 90, 50, 40
   1440px values: 40, 75, 216, 594, 101, 94
   =========================================== */
[data-table-id="issues-results"] th:nth-child(1),
[data-table-id="issues-results"] td:nth-child(1) {
    /* Checkbox: 30px (min) → 40px (max) */
    width: clamp(30px, calc(30px + 10 * (100vw - 390px) / 1050), 40px) !important;
    min-width: 30px !important;
    max-width: 40px !important;
}

[data-table-id="issues-results"] th:nth-child(2),
[data-table-id="issues-results"] td:nth-child(2) {
    /* Cover: 50px (min) → 75px (max) */
    width: clamp(50px, calc(50px + 25 * (100vw - 390px) / 1050), 75px) !important;
    min-width: 50px !important;
    max-width: 75px !important;
}

[data-table-id="issues-results"] th:nth-child(3),
[data-table-id="issues-results"] td:nth-child(3) {
    /* #: 50px (min) → 216px (max) */
    width: clamp(50px, calc(50px + 166 * (100vw - 390px) / 1050), 216px) !important;
    min-width: 50px !important;
    max-width: 216px !important;
}

[data-table-id="issues-results"] th:nth-child(4),
[data-table-id="issues-results"] td:nth-child(4) {
    /* Story: 90px (min) → 594px (max) */
    width: clamp(90px, calc(90px + 504 * (100vw - 390px) / 1050), 594px) !important;
    min-width: 90px !important;
    max-width: 594px !important;
}

[data-table-id="issues-results"] th:nth-child(5),
[data-table-id="issues-results"] td:nth-child(5) {
    /* Month: 50px (min) → 101px (max) */
    width: clamp(50px, calc(50px + 51 * (100vw - 390px) / 1050), 101px) !important;
    min-width: 50px !important;
    max-width: 101px !important;
}

[data-table-id="issues-results"] th:nth-child(6),
[data-table-id="issues-results"] td:nth-child(6) {
    /* Year: 40px (min) → 94px (max) */
    width: clamp(40px, calc(40px + 54 * (100vw - 390px) / 1050), 94px) !important;
    min-width: 40px !important;
    max-width: 94px !important;
}


/* ===========================================
   VARIANTS TABLE
   Columns: Checkbox, Cover, Edition, Type, Raw, 8.0, 9.4
   390px values: 30, 36, 70, 45, 43, 43, 43
   1440px values: 40, 80, 340, 120, 180, 180, 180
   =========================================== */
[data-table-id="variants"] th:nth-child(1),
[data-table-id="variants"] td:nth-child(1),
.variants-table th:nth-child(1),
.variants-table td:nth-child(1) {
    /* Checkbox: 30px (min) → 40px (max) */
    width: clamp(30px, calc(30px + 10 * (100vw - 390px) / 1050), 40px) !important;
    min-width: 30px !important;
    max-width: 40px !important;
}

[data-table-id="variants"] th:nth-child(2),
[data-table-id="variants"] td:nth-child(2),
.variants-table th:nth-child(2),
.variants-table td:nth-child(2) {
    /* Cover: 36px (min) → 80px (max) */
    width: clamp(36px, calc(36px + 44 * (100vw - 390px) / 1050), 80px) !important;
    min-width: 36px !important;
    max-width: 80px !important;
}

[data-table-id="variants"] th:nth-child(3),
[data-table-id="variants"] td:nth-child(3),
.variants-table th:nth-child(3),
.variants-table td:nth-child(3) {
    /* Edition: 70px (min) → 340px (max) */
    width: clamp(70px, calc(70px + 270 * (100vw - 390px) / 1050), 340px) !important;
    min-width: 70px !important;
    max-width: 340px !important;
}

[data-table-id="variants"] th:nth-child(4),
[data-table-id="variants"] td:nth-child(4),
.variants-table th:nth-child(4),
.variants-table td:nth-child(4) {
    /* Type: 45px (min) → 120px (max) */
    width: clamp(45px, calc(45px + 75 * (100vw - 390px) / 1050), 120px) !important;
    min-width: 45px !important;
    max-width: 120px !important;
}

[data-table-id="variants"] th:nth-child(5),
[data-table-id="variants"] td:nth-child(5),
.variants-table th:nth-child(5),
.variants-table td:nth-child(5) {
    /* Raw: 43px (min) → 180px (max) */
    width: clamp(43px, calc(43px + 137 * (100vw - 390px) / 1050), 180px) !important;
    min-width: 43px !important;
    max-width: 180px !important;
}

[data-table-id="variants"] th:nth-child(6),
[data-table-id="variants"] td:nth-child(6),
.variants-table th:nth-child(6),
.variants-table td:nth-child(6) {
    /* 8.0: 43px (min) → 180px (max) */
    width: clamp(43px, calc(43px + 137 * (100vw - 390px) / 1050), 180px) !important;
    min-width: 43px !important;
    max-width: 180px !important;
}

[data-table-id="variants"] th:nth-child(7),
[data-table-id="variants"] td:nth-child(7),
.variants-table th:nth-child(7),
.variants-table td:nth-child(7) {
    /* 9.4: 43px (min) → 180px (max) */
    width: clamp(43px, calc(43px + 137 * (100vw - 390px) / 1050), 180px) !important;
    min-width: 43px !important;
    max-width: 180px !important;
}


/* ===========================================
   COLLECTION TABLE
   Columns: Checkbox, Cover, Title, Variant, Grade, Value, Change, Costs, Current ROI, Potential ROI, Status
   390px values: 30, 30, 76, 50, 30, 28, 28, 28, 28, 0, 28
   1440px values: 35, 90, 165, 140, 79, 115, 101, 108, 101, 108, 124
   =========================================== */
[data-table-id="collection"] th:nth-child(1),
[data-table-id="collection"] td:nth-child(1),
.collection-table:not(.totals-table) th:nth-child(1),
.collection-table:not(.totals-table) td:nth-child(1) {
    /* Checkbox: 30px (min) → 35px (max) */
    width: clamp(30px, calc(30px + 5 * (100vw - 390px) / 1050), 35px) !important;
    min-width: 30px !important;
    max-width: 35px !important;
}

[data-table-id="collection"] th:nth-child(2),
[data-table-id="collection"] td:nth-child(2),
.collection-table:not(.totals-table) th:nth-child(2),
.collection-table:not(.totals-table) td:nth-child(2) {
    /* Cover: 30px (min) → 90px (max) */
    width: clamp(30px, calc(30px + 60 * (100vw - 390px) / 1050), 90px) !important;
    min-width: 30px !important;
    max-width: 90px !important;
}

[data-table-id="collection"] th:nth-child(3),
[data-table-id="collection"] td:nth-child(3),
.collection-table:not(.totals-table) th:nth-child(3),
.collection-table:not(.totals-table) td:nth-child(3) {
    /* Title: 76px (min) → 165px (max) */
    width: clamp(76px, calc(76px + 89 * (100vw - 390px) / 1050), 165px) !important;
    min-width: 76px !important;
    max-width: 165px !important;
}

[data-table-id="collection"] th:nth-child(4),
[data-table-id="collection"] td:nth-child(4),
.collection-table:not(.totals-table) th:nth-child(4),
.collection-table:not(.totals-table) td:nth-child(4) {
    /* Variant: 50px (min) → 140px (max) */
    width: clamp(50px, calc(50px + 90 * (100vw - 390px) / 1050), 140px) !important;
    min-width: 50px !important;
    max-width: 140px !important;
}

[data-table-id="collection"] th:nth-child(5),
[data-table-id="collection"] td:nth-child(5),
.collection-table:not(.totals-table) th:nth-child(5),
.collection-table:not(.totals-table) td:nth-child(5) {
    /* Grade: 30px (min) → 79px (max) */
    width: clamp(30px, calc(30px + 49 * (100vw - 390px) / 1050), 79px) !important;
    min-width: 30px !important;
    max-width: 79px !important;
}

[data-table-id="collection"] th:nth-child(6),
[data-table-id="collection"] td:nth-child(6),
.collection-table:not(.totals-table) th:nth-child(6),
.collection-table:not(.totals-table) td:nth-child(6) {
    /* Value: 28px (min) → 115px (max) */
    width: clamp(28px, calc(28px + 87 * (100vw - 390px) / 1050), 115px) !important;
    min-width: 28px !important;
    max-width: 115px !important;
}

[data-table-id="collection"] th:nth-child(7),
[data-table-id="collection"] td:nth-child(7),
.collection-table:not(.totals-table) th:nth-child(7),
.collection-table:not(.totals-table) td:nth-child(7) {
    /* Change: 28px (min) → 101px (max) */
    width: clamp(28px, calc(28px + 73 * (100vw - 390px) / 1050), 101px) !important;
    min-width: 28px !important;
    max-width: 101px !important;
}

[data-table-id="collection"] th:nth-child(8),
[data-table-id="collection"] td:nth-child(8),
.collection-table:not(.totals-table) th:nth-child(8),
.collection-table:not(.totals-table) td:nth-child(8) {
    /* Costs: 28px (min) → 108px (max) */
    width: clamp(28px, calc(28px + 80 * (100vw - 390px) / 1050), 108px) !important;
    min-width: 28px !important;
    max-width: 108px !important;
}

[data-table-id="collection"] th:nth-child(9),
[data-table-id="collection"] td:nth-child(9),
.collection-table:not(.totals-table) th:nth-child(9),
.collection-table:not(.totals-table) td:nth-child(9) {
    /* Current ROI: 28px (min) → 101px (max) */
    width: clamp(28px, calc(28px + 73 * (100vw - 390px) / 1050), 101px) !important;
    min-width: 28px !important;
    max-width: 101px !important;
}

[data-table-id="collection"] th:nth-child(10),
[data-table-id="collection"] td:nth-child(10),
.collection-table:not(.totals-table) th:nth-child(10),
.collection-table:not(.totals-table) td:nth-child(10) {
    /* Potential ROI: 0px (min) → 108px (max) - hidden on mobile */
    width: clamp(0px, calc(108 * (100vw - 390px) / 1050), 108px) !important;
    min-width: 0px !important;
    max-width: 108px !important;
}

[data-table-id="collection"] th:nth-child(11),
[data-table-id="collection"] td:nth-child(11),
.collection-table:not(.totals-table) th:nth-child(11),
.collection-table:not(.totals-table) td:nth-child(11) {
    /* Status: 28px (min) → 124px (max) */
    width: clamp(28px, calc(28px + 96 * (100vw - 390px) / 1050), 124px) !important;
    min-width: 28px !important;
    max-width: 124px !important;
}

/* Hide Potential ROI column on small screens */
@media (max-width: 500px) {
    [data-table-id="collection"] th:nth-child(10),
    [data-table-id="collection"] td:nth-child(10),
    .collection-table:not(.totals-table) th:nth-child(10),
    .collection-table:not(.totals-table) td:nth-child(10) {
        display: none !important;
    }
}


/* ===========================================
   TOTALS TABLE - Match collection table column widths
   =========================================== */
.totals-table th:nth-child(1),
.totals-table td:nth-child(1) {
    width: clamp(30px, calc(30px + 5 * (100vw - 390px) / 1050), 35px) !important;
    min-width: 30px !important;
    max-width: 35px !important;
}

.totals-table th:nth-child(2),
.totals-table td:nth-child(2) {
    width: clamp(30px, calc(30px + 60 * (100vw - 390px) / 1050), 90px) !important;
    min-width: 30px !important;
    max-width: 90px !important;
}

.totals-table th:nth-child(3),
.totals-table td:nth-child(3) {
    width: clamp(76px, calc(76px + 89 * (100vw - 390px) / 1050), 165px) !important;
    min-width: 76px !important;
    max-width: 165px !important;
}

.totals-table th:nth-child(4),
.totals-table td:nth-child(4) {
    width: clamp(50px, calc(50px + 90 * (100vw - 390px) / 1050), 140px) !important;
    min-width: 50px !important;
    max-width: 140px !important;
}

.totals-table th:nth-child(5),
.totals-table td:nth-child(5) {
    width: clamp(30px, calc(30px + 49 * (100vw - 390px) / 1050), 79px) !important;
    min-width: 30px !important;
    max-width: 79px !important;
}

.totals-table th:nth-child(6),
.totals-table td:nth-child(6) {
    width: clamp(28px, calc(28px + 87 * (100vw - 390px) / 1050), 115px) !important;
    min-width: 28px !important;
    max-width: 115px !important;
}

.totals-table th:nth-child(7),
.totals-table td:nth-child(7) {
    /* Change: 28px (min) → 101px (max) */
    width: clamp(28px, calc(28px + 73 * (100vw - 390px) / 1050), 101px) !important;
    min-width: 28px !important;
    max-width: 101px !important;
}

.totals-table th:nth-child(8),
.totals-table td:nth-child(8) {
    /* Costs: 28px (min) → 108px (max) */
    width: clamp(28px, calc(28px + 80 * (100vw - 390px) / 1050), 108px) !important;
    min-width: 28px !important;
    max-width: 108px !important;
}

.totals-table th:nth-child(9),
.totals-table td:nth-child(9) {
    /* Current ROI: 28px (min) → 101px (max) */
    width: clamp(28px, calc(28px + 73 * (100vw - 390px) / 1050), 101px) !important;
    min-width: 28px !important;
    max-width: 101px !important;
}

.totals-table th:nth-child(10),
.totals-table td:nth-child(10) {
    /* Potential ROI: 0px (min) → 108px (max) */
    width: clamp(0px, calc(108 * (100vw - 390px) / 1050), 108px) !important;
    min-width: 0px !important;
    max-width: 108px !important;
}

.totals-table th:nth-child(11),
.totals-table td:nth-child(11) {
    /* Status: 28px (min) → 124px (max) */
    width: clamp(28px, calc(28px + 96 * (100vw - 390px) / 1050), 124px) !important;
    min-width: 28px !important;
    max-width: 124px !important;
}
