/* ============================================================
   BSX CAMPAIGN ROW
   Requires: bsx-design.css, bsx-base.css
   ============================================================ */

.bsx-campaign-row-link {
    display:         block;
    text-decoration: none;
    color:           var(--bsx-text);
    margin-bottom:   0.25rem;
    transition:      all var(--bsx-transition);
}

.bsx-campaign-row-link:hover .bsx-campaign-row {
    background:  var(--bsx-bg);
    box-shadow:  var(--bsx-shadow-md);
    transform:   scale(1.05);
    border-color: var(--bsx-accent-mid);
}

.bsx-campaign-row {
    width:         85%;
    border:        1px solid var(--bsx-border);
    border-radius: var(--bsx-radius-lg);
    padding:       0.25rem;
    background:    var(--bsx-bg-mid);
    transition:    all var(--bsx-transition);
}

/* Row Header */
.bsx-row-header {
    display:               grid;
    grid-template-columns: 20% 8% 12% 4% 13% 8% 6% 7% 20%;
    gap:                   0.1rem;
    margin-bottom:         0.15rem;
    align-items:           flex-end;
    padding-bottom:        0.15rem;
}

/* Row Details */
.bsx-row-details {
    display:               grid;
    grid-template-columns: 10% 10% 8% 12% 4% 13% 8% 13% 12% 10%;
    gap:                   0.1rem;
    align-items:           flex-start;
    margin-bottom:         0.15rem;
    padding-bottom:        0.15rem;
}

/* Cells */
.bsx-cell             { font-size: var(--bsx-text-md); color: var(--bsx-text); }
.bsx-corp             { font-weight: 600; font-size: var(--bsx-text-md); color: var(--bsx-text); }
.bsx-cass             { font-size: var(--bsx-text-md); color: var(--bsx-text); font-weight: 600; text-align: right; }
.bsx-region           { font-weight: 400; font-size: var(--bsx-text-sm); color: var(--bsx-text); }
.bsx-symbol           { font-size: var(--bsx-text-sm); color: var(--bsx-text); }
.bsx-current-price    { color: var(--bsx-text); font-size: var(--bsx-text-md); }
.bsx-performance      { text-align: right; }
.bsx-perf-last        { font-weight: 400; font-size: var(--bsx-text-sm); text-align: right; }
.bsx-perf-last.closed { color: #464646; }
.perf-current         { color: var(--bsx-text); }
.perf-old             { color: #e57373; }

.bsx-tenure-text {
    font-weight:  400;
    font-size:    var(--bsx-text-sm);
    color:        var(--bsx-text);
    text-align:   left;
    margin-left:  1rem;
}

.bsx-tenure {
    font-weight: 600;
    font-size:   var(--bsx-text-sm);
    color:       var(--bsx-text);
    text-align:  right;
}

.bsx-date-time-price     { font-weight: 400; font-size: var(--bsx-text-sm); color: var(--bsx-text); }
.bsx-date-time-price-old { font-weight: 400; font-size: var(--bsx-text-sm); color: var(--bsx-red); text-align: right; }
.bsx-date-time-price-r   { font-weight: 400; font-size: var(--bsx-text-sm); color: var(--bsx-text); text-align: right; }

.bsx-principle {
    font-size:       var(--bsx-text-sm);
    color:           var(--bsx-text);
    font-weight:     400;
    justify-content: flex-end;
    padding-top:     8px;
}

.bsx-rating          { display: flex; justify-content: flex-end; }
.bsx-star            { color: rgba(241, 119, 124, 0.25); font-size: 1.2rem; }

/* Logos */
.bsx-logo-cass, .bsx-logo-corp { display: flex; }
.bsx-logo-cass                 { align-items: flex-end; }
.bsx-logo-corp                 { align-items: flex-start; }
.bsx-logo-cass img,
.bsx-logo-corp img             { width: 80%; max-height: 40px; object-fit: contain; display: block; }

/* Cassandra link row */
.bsx-cassandra-link {
    display:         block;
    text-decoration: none;
    color:           var(--bsx-text);
    margin-bottom:   0.25rem;
    transition:      all var(--bsx-transition);
}

/* ── Responsive ─────────────────────────────────────────────── */

@media (max-width: 1023px) and (min-width: 768px) {
    .bsx-campaign-row    { width: 100%; }
    .bsx-cell            { font-size: var(--bsx-text-sm); }
    .bsx-corp, .bsx-cass { font-size: 0.85rem; }
    .bsx-status          { font-size: var(--bsx-text-base); }
    .bsx-type            { font-size: var(--bsx-text-base); }
    .bsx-logo-corp img,
    .bsx-logo-cass img   { max-height: 35px; }
    .bsx-perf-badge      { font-size: 0.85rem; padding: 0.2rem 0.5rem; }
}

@media (max-width: 767px) and (min-width: 568px) {
    .bsx-campaign-row { width: 100%; }
    .bsx-row-header   { grid-template-columns: 36% 10% 10% 41%; }
    .bsx-region, .bsx-symbol,
    .bsx-date-time-price,
    .bsx-date-time-price-r { display: none; }
    .bsx-row-details  { grid-template-columns: 23% 16% 8% 16% 10% 37%; }
    .bsx-principle    { display: none; }
    .bsx-cell         { font-size: var(--bsx-text-sm); }
    .bsx-corp         { font-size: 0.85rem; }
}

@media (max-width: 567px) {
    .bsx-campaign-row {
        padding: 0.5rem;
        margin:  0 2%;
        width:   96%;
    }
    .bsx-row-header {
        display:               grid;
        grid-template-columns: 35% 30% 35%;
        gap:                   0;
        align-items:           center;
    }
    .bsx-row-header .bsx-corp   { grid-column: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .bsx-row-header .bsx-tenure { grid-column: 2; text-align: center; }
    .bsx-row-header .bsx-cass   { grid-column: 3; text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .bsx-row-header .bsx-logo-corp,
    .bsx-row-header .bsx-region,
    .bsx-row-header .bsx-symbol,
    .bsx-row-header .bsx-date-time-price,
    .bsx-row-header .bsx-date-time-price-r,
    .bsx-row-header .bsx-tenure-text,
    .bsx-row-header .bsx-status,
    .bsx-row-header .bsx-performance { display: none; }
    .bsx-row-details {
        display:               grid;
        grid-template-columns: repeat(5, 20%);
        gap:                   0;
        align-items:           center;
        margin-top:            0.5rem;
    }
    .bsx-row-details .bsx-logo-corp:first-child { display: flex !important; grid-column: 1; justify-self: start; }
    .bsx-row-details .bsx-logo-cass:last-child  { display: flex !important; grid-column: 5; justify-self: end; }
    .bsx-row-details .bsx-status                { display: block !important; grid-column: 2; text-align: center; margin-left: 0; }
    .bsx-row-details .bsx-type                  { display: block !important; grid-column: 3; text-align: center; }
    .bsx-row-details .bsx-performance           { display: flex !important; grid-column: 4; justify-content: center; }
    .bsx-row-header .bsx-performance,
    .bsx-row-details .bsx-source,
    .bsx-row-details .bsx-principle,
    .bsx-row-details .bsx-date-time-price,
    .bsx-row-details .bsx-date-time-price-r,
    .bsx-row-details .bsx-date-time-price-old,
    .bsx-row-details .bsx-perf-last,
    .bsx-row-details .sl-pic,
    .bsx-row-details .bsx-perf-current { display: none; }
    .bsx-cell           { font-size: var(--bsx-text-xs); }
    .bsx-corp, .bsx-cass { font-size: 0.85rem; }
    .bsx-tenure         { font-size: var(--bsx-text-xs); }
    .bsx-status         { font-size: var(--bsx-text-base); }
    .bsx-type           { font-size: var(--bsx-text-base); }
    .bsx-logo-corp img,
    .bsx-logo-cass img  { max-height: 27px; width: 95%; }
    .bsx-perf-badge     { font-size: var(--bsx-text-xs); padding: 0.2rem; }
}

@media (max-width: 360px) {
    .bsx-campaign-row { width: 100%; }
    .bsx-corp         { font-size: 0.8rem; }
    .bsx-tenure       { font-size: 0.7rem; }
    .bsx-status,
    .bsx-type         { font-size: var(--bsx-text-md); }
    .bsx-perf-badge   { font-size: 0.7rem; padding: 0.15rem 0.3rem; }
}