/* ═══════════════════════════════════════════════════════
   Pokebattler Raid Research — Article Styles v1.1
   Light blue theme matching pokebattler.com
   ═══════════════════════════════════════════════════════ */

:root {
    --pb-primary: #e63946;
    --pb-accent: #457b9d;
    --pb-dark: #1d3557;
    --pb-bg: #e8f4f8;
    --pb-bg-light: #f0f7fa;
    --pb-card-bg: #fff;
    --pb-card-border: #c8dce4;
    --pb-gold: #f4a523;
    --pb-gold-empty: #ccc;
    --pb-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --pb-radius: 8px;
    --pb-text: #222;
    --pb-text-muted: #555;
}

/* ── Raid Header ── */
.pb-raid-header {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 28px 32px;
    background: linear-gradient(135deg, #d0e8f2, #e8f4f8);
    border: 1px solid var(--pb-card-border);
    border-radius: var(--pb-radius);
    margin-bottom: 28px;
}
.pb-raid-header-img {
    width: 110px;
    height: 110px;
    object-fit: contain;
    filter: drop-shadow(0 2px 6px rgba(0,0,0,.15));
}
.pb-raid-title {
    font-size: 1.7em;
    margin: 0 0 6px;
    color: var(--pb-dark) !important;
    line-height: 1.2;
}
.pb-raid-subtitle {
    font-size: 0.95em;
    margin: 0;
    color: var(--pb-text-muted);
    font-style: italic;
}

/* ── Sections ── */
.pb-raid-section {
    margin-bottom: 28px;
}
.pb-section-title {
    font-size: 1.4em;
    color: var(--pb-dark);
    border-bottom: 3px solid var(--pb-accent);
    padding-bottom: 8px;
    margin-bottom: 16px;
}

/* ── Star Ratings (actual stars) ── */
.pb-star-rating {
    display: inline-flex;
    align-items: center;
    gap: 1px;
    vertical-align: middle;
}
.pb-star-label {
    font-size: 13px;
    font-weight: 600;
    margin-right: 6px;
    color: var(--pb-text-muted);
}
.pb-star {
    font-size: 20px;
    line-height: 1;
}
.pb-star.filled {
    color: var(--pb-gold);
}
.pb-star.half {
    color: var(--pb-gold);
    opacity: 0.6;
}
.pb-star.empty {
    color: var(--pb-gold-empty);
}

/* ── Type Badges ── */
.pb-type-badge {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.3px;
    line-height: 1.5;
    white-space: nowrap;
    vertical-align: middle;
    margin: 1px 2px;
}
.pb-type-badge-sm {
    padding: 1px 7px;
    font-size: 11px;
    border-radius: 10px;
}

/* ── Raid Info Block ── */
.pb-raid-info {
    background: var(--pb-bg-light);
    border: 1px solid var(--pb-card-border);
    border-radius: var(--pb-radius);
    padding: 18px 22px;
    margin-bottom: 20px;
}
.pb-raid-info h3 {
    margin: 0 0 10px;
    color: var(--pb-dark);
}
.pb-raid-info ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.pb-raid-info li {
    padding: 3px 0;
    line-height: 1.5;
    color: var(--pb-text);
}
.pb-raid-info li.pb-indent {
    padding-left: 24px;
    color: var(--pb-text-muted);
}

/* ── Tables (shared) ── */
.pb-type-chart,
.pb-moveset-table,
.pb-defensive-table,
.pb-weather-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
    font-size: 14px;
    color: var(--pb-text);
}
.pb-type-chart th,
.pb-moveset-table th,
.pb-defensive-table th,
.pb-weather-table th {
    background: var(--pb-accent);
    color: #fff;
    padding: 10px 14px;
    text-align: left;
    font-weight: 600;
}
.pb-type-chart td,
.pb-moveset-table td,
.pb-defensive-table td,
.pb-weather-table td {
    padding: 9px 14px;
    border-bottom: 1px solid var(--pb-card-border);
    vertical-align: middle;
    background: var(--pb-card-bg);
}
.pb-type-chart tr:nth-child(even) td,
.pb-moveset-table tr:nth-child(even) td,
.pb-weather-table tr:nth-child(even) td {
    background: var(--pb-bg-light);
}

/* Type chart specifics */
.pb-type-chart .pb-chart-label {
    font-weight: 600;
    white-space: nowrap;
    min-width: 170px;
}

/* Moveset table - highlight best row */
.pb-moveset-table tbody tr:first-child td {
    background: #e1f0e1;
    font-weight: 600;
}
.pb-eff-top { color: #2e7d32; }
.pb-eff-high { color: #558b2f; }

/* Defensive table */
.pb-defensive-table th { text-align: center; }
.pb-defensive-table th:first-child { text-align: left; }
.pb-defensive-table td { text-align: center; }
.pb-defensive-table td:first-child { text-align: left; }
.pb-def-pokemon-img {
    width: 48px;
    height: 48px;
    object-fit: contain;
}
.pb-def-cell { font-size: 18px; }
.pb-grade-resist2 { color: #1565c0; }
.pb-grade-resist { color: #42a5f5; }
.pb-grade-neutral { color: #9e9e9e; }
.pb-grade-weak { color: #e53935; }
.pb-grade-weak2 { color: #b71c1c; }

/* Weather table */
.pb-weather-cell { white-space: nowrap; }

/* ── Move List (boss moves) ── */
.pb-move-list {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.pb-move-list li {
    background: var(--pb-card-bg);
    border: 1px solid var(--pb-card-border);
    border-radius: 20px;
    padding: 5px 14px;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

/* ── Pokemon Counter Card ── */
.pb-pokemon-counter {
    background: var(--pb-card-bg);
    border: 1px solid var(--pb-card-border);
    border-radius: var(--pb-radius);
    padding: 18px 20px;
    margin-bottom: 16px;
    border-left: 5px solid var(--pb-accent);
}
.pb-pokemon-counter:hover {
    box-shadow: 0 3px 12px rgba(0,0,0,.07);
}
.pb-counter-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 12px;
}
.pb-counter-img {
    width: 72px;
    height: 72px;
    object-fit: contain;
}
.pb-counter-name {
    margin: 0 0 3px;
    font-size: 1.25em;
    color: var(--pb-dark);
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.pb-counter-moveset {
    font-size: 0.9em;
    color: var(--pb-text-muted);
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

/* ── Tier Badges ── */
.pb-tier-badge {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
    color: #fff;
    vertical-align: middle;
}
.pb-tier-sssplus, .pb-tier-sss\+ { background: #ff4444; }
.pb-tier-sss { background: #e63946; }
.pb-tier-ss { background: #e85d04; }
.pb-tier-s { background: #f77f00; }
.pb-tier-aplus, .pb-tier-a\+ { background: #f4a523; color: #333 !important; }
.pb-tier-a { background: #90be6d; color: #333 !important; }
.pb-tier-bplus { background: #43aa8b; }
.pb-tier-b { background: #577590; }

/* Tier-colored left borders on counter cards */
.pb-pokemon-counter.pb-tier-sssplus { border-left-color: #ff4444; }
.pb-pokemon-counter.pb-tier-sss { border-left-color: #e63946; }
.pb-pokemon-counter.pb-tier-ss { border-left-color: #e85d04; }
.pb-pokemon-counter.pb-tier-s { border-left-color: #f77f00; }
.pb-pokemon-counter.pb-tier-aplus { border-left-color: #f4a523; }
.pb-pokemon-counter.pb-tier-a { border-left-color: #90be6d; }

/* ── Counter Stats ── */
.pb-counter-stats {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: 6px;
}
.pb-counter-stat {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
}
.pb-stat-label {
    font-weight: 600;
    color: var(--pb-text-muted);
    min-width: 65px;
}
.pb-counter-note {
    margin-top: 8px;
    padding: 6px 12px;
    background: #fff8e1;
    border-radius: 6px;
    font-size: 12px;
    color: #795548;
    border-left: 3px solid var(--pb-gold);
}

/* ── Honorable Mentions Grid (rows with images) ── */
.pb-honorable-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 10px;
    margin: 16px 0 24px;
}
.pb-honorable-card {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--pb-card-bg);
    border: 1px solid var(--pb-card-border);
    border-radius: var(--pb-radius);
    padding: 8px 12px;
}
.pb-honorable-card:hover {
    background: var(--pb-bg-light);
}
.pb-honorable-img {
    width: 40px;
    height: 40px;
    object-fit: contain;
    flex-shrink: 0;
}
.pb-honorable-info {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}
.pb-honorable-name {
    font-size: 13px;
    font-weight: 600;
    color: var(--pb-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Also Noteworthy ── */
.pb-also-noteworthy {
    background: var(--pb-bg-light);
    border-left: 4px solid var(--pb-accent);
    padding: 10px 14px;
    border-radius: 0 var(--pb-radius) var(--pb-radius) 0;
    margin: 14px 0;
    font-size: 13px;
    color: var(--pb-text);
}

/* ── Visual Guide ── */
.pb-visual-guide {
    text-align: center;
    margin: 20px 0;
}
.pb-visual-guide img {
    max-width: 100%;
    height: auto;
    border-radius: var(--pb-radius);
    box-shadow: 0 2px 10px rgba(0,0,0,.08);
}

/* ── Responsive ── */
@media (max-width: 768px) {
    .pb-raid-header {
        flex-direction: column;
        text-align: center;
        padding: 18px;
    }
    .pb-raid-title { font-size: 1.3em; }
    .pb-counter-header {
        flex-direction: column;
        text-align: center;
    }
    .pb-counter-stats { grid-template-columns: 1fr; }
    .pb-counter-name { justify-content: center; }
    .pb-move-list { justify-content: center; }
    .pb-type-chart .pb-chart-label { min-width: auto; }
    .pb-honorable-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
}