/* ============================================
   RAID — стили рейдовых секций, тактик и результатов.
   Подключается после style.css.
   ============================================ */

/* ============================================
   GLOW WRAPPER — тактики (без фиксированного aspect-ratio)
   ============================================ */
.card-glow-wrapper--tactic {
    aspect-ratio: auto;
}

/* ============================================
   RESULT-BANNER — широкий баннер для карточки рейда
   ============================================ */
.card-glow-wrapper--result {
    aspect-ratio: auto;
}
.card-wrapper.test-result {
    aspect-ratio: auto !important;
    height: auto !important;
}
/* Banner: fixed height, stable proportions */
.result-banner {
    width: 100%;
    height: 230px;
    flex-shrink: 0;
    background-size: cover;
    background-position: center top;
    border-bottom: 1px solid var(--de-border);
    position: relative;
}
/* Card-inner stays content-sized; empty space below fills naturally */
.card-wrapper.test-card.test-result .card-inner {
    flex-grow: 1;
    flex-shrink: 0;
}
.result-banner::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, transparent 55%, var(--de-emerald-dark) 100%);
    pointer-events: none;
}
.result-banner--placeholder {
    background-color: var(--de-emerald-edge);
    background-image:
        repeating-linear-gradient(45deg,
            transparent, transparent 7px,
            rgba(16,185,129,0.04) 7px, rgba(16,185,129,0.04) 8px),
        repeating-linear-gradient(-45deg,
            transparent, transparent 7px,
            rgba(16,185,129,0.03) 7px, rgba(16,185,129,0.03) 8px);
    display: flex;
    align-items: center;
    justify-content: center;
}
.result-banner--placeholder span {
    font-family: 'Courier New', monospace;
    font-size: 0.6rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--de-border-bright);
    opacity: 0.5;
    user-select: none;
}

/* ============================================
   ТАКТИКИ
   ============================================ */
.card-wrapper.test-card.test-tactic { aspect-ratio: auto; }
.card-wrapper.test-card.test-tactic {
    background: radial-gradient(ellipse at center, #1a0f2a 0%, #0a0518 100%);
    border-color: rgba(139,92,246,0.25);
    min-height: 100px;
}
.card-wrapper.test-card.test-tactic .card-title {
    color: var(--de-purple-mid);
    text-shadow: 0 0 8px var(--de-purple-glow);
}
.card-wrapper.test-card.test-tactic::before {
    background: linear-gradient(90deg, transparent, rgba(139,92,246,0.35), transparent);
}
@media (hover: hover) {
    .card-glow-wrapper--tactic:has(.card-wrapper:not(.locked):not(.selected)):hover {
        filter:
            drop-shadow(0 0 6px rgba(139,92,246,0.7))
            drop-shadow(0 0 14px rgba(139,92,246,0.35));
    }
}
.card-wrapper[data-card-id^="tactic_"] .card-image,
.card-wrapper.test-tactic .card-image { display: none !important; }

/* ============================================
   ТЕХНИЧКА РЕЙДА
   ============================================ */
.raid-tech-block {
    display: flex; flex-direction: column; gap: 2px;
    padding: 7px 14px; margin: 6px auto 0;
    width: fit-content;
    border: 1px dashed var(--de-gold); border-radius: 2px;
    background: rgba(0,0,0,0.35);
    font-size: 0.8rem;
}
.raid-tech-block:empty { display: none; }

.rtrow {
    display: grid;
    grid-template-columns: 56px auto 56px auto;
    column-gap: 8px;
    align-items: baseline;
}
.rtrow-итог {
    grid-template-columns: 56px auto;
    border-top: 1px solid rgba(255,255,255,0.08);
    margin-top: 2px; padding-top: 2px;
}
.rtl { color: var(--de-text); opacity: 0.55; font-size: 0.75rem; }
.rtv { color: var(--de-bone); font-weight: bold; text-align: right; }
.rtv-pos { color: #6ee7b7; font-weight: bold; font-size: 1rem; text-align: right; }
.rtv-neg { color: #fca5a5; font-weight: bold; font-size: 1rem; text-align: right; }

.raid-events-block {
    display: flex; flex-direction: column; gap: 2px;
    padding: 4px 14px; margin: 0 auto 4px;
    max-width: 300px;
    font-size: 0.76rem; color: var(--de-text);
}
.raid-events-block:empty { display: none; }
.raid-event-line { padding: 1px 0; opacity: 0.85; }

.farseer-reroll-btn {
    margin-top: 7px; width: 100%;
    padding: 5px 8px;
    background: rgba(100, 60, 160, 0.35);
    border: 1px solid #7c3aed;
    border-radius: 3px;
    color: #c4b5fd;
    font-size: 0.75rem; cursor: pointer;
    transition: background 0.2s;
}
.farseer-reroll-btn:hover { background: rgba(100, 60, 160, 0.65); }

/* ============================================
   ЦЕНА / КОНЦОВКИ
   ============================================ */
.card-wrapper[data-card-id^="world_"] .card-points,
.card-wrapper[data-card-id^="tactic_"] .card-points,
.card-wrapper[data-card-id^="ending_"] .card-points { display: none !important; }

.card-wrapper.ending-crit_fail  .card-title { color: var(--de-red); text-shadow: 0 0 8px rgba(239,68,68,0.5); }
.card-wrapper.ending-fail       .card-title { color: #d97757; text-shadow: 0 0 6px rgba(217,119,87,0.4); }
.card-wrapper.ending-success    .card-title { color: var(--de-toxic); }
.card-wrapper.ending-crit_success .card-title { color: #c084fc; text-shadow: 0 0 10px var(--de-purple-glow); }

/* ============================================
   ЛЕЙАУТ РЕЙДОВ
   ============================================ */
[data-section-id^="raid_world_"] .card-grid {
    display: grid !important;
    grid-template-columns: minmax(0,1.2fr) minmax(0,1.2fr) minmax(0,1.6fr) minmax(0,1.6fr) !important;
    grid-auto-rows: min-content !important;
    row-gap: 0 !important;
    column-gap: 20px !important;
    align-items: start;
    max-width: 1100px !important;
    justify-content: start !important;
}
[data-section-id^="raid_world_"] .card-glow-wrapper {
    flex: unset !important;
    width: auto !important;
}

[data-section-id^="raid_world_"] .card-glow-wrapper { margin-bottom: 20px; }

[data-section-id^="raid_world_"] .card-glow-wrapper:has([data-card-id^="world_"]) {
    grid-column: 1 / span 2 !important;
    grid-row: 1 / span 99 !important;
    aspect-ratio: 2 / 3 !important;
    align-self: start !important;
}
 
.card-wrapper[data-card-id^="world_"] .card-image {
    aspect-ratio: auto !important;
    height: 55%;
    min-height: 0;
}

[data-section-id^="raid_world_"] .card-glow-wrapper:has([data-card-id^="tactic_"]) {
    grid-column: auto !important;
    aspect-ratio: auto !important;
    align-self: stretch !important;
}
.card-wrapper[data-card-id^="tactic_"] {
    height: 100% !important;
}

/* POST-RAID: использованная тактика — шапка результата, cols 3-4, row 1 */
[data-section-id^="raid_world_"] .card-glow-wrapper[data-raid-used="true"] {
    display: block !important;
    grid-column: 3 / span 2 !important;
    grid-row: 1 !important;
    aspect-ratio: auto !important;
    align-self: stretch !important;
    margin-bottom: 6px !important;
}
[data-section-id^="raid_world_"] .card-glow-wrapper[data-raid-used="true"] .hidden-card {
    display: flex !important;
}

[data-section-id^="raid_world_"] .card-glow-wrapper:has([data-card-id^="ending_"]) {
    grid-column: 3 / span 2 !important;
    grid-row: 2 / span 99 !important;
    aspect-ratio: auto !important;
    align-self: start !important; /* Карточка прижмется наверх под тактику */
    height: auto !important;      /* Высота строго по контенту */
}

@media (max-width: 900px) {
    [data-section-id^="raid_world_"] .card-grid {
        grid-template-columns: 1fr !important;
        max-width: 100% !important;
    }
    [data-section-id^="raid_world_"] .card-glow-wrapper {
        grid-column: 1 !important;
        grid-row: auto !important;
    }
    [data-section-id^="raid_world_"] .card-glow-wrapper:has([data-card-id^="world_"]),
    [data-section-id^="raid_world_"] .card-glow-wrapper:has([data-card-id^="ending_"]) {
        aspect-ratio: auto;
    }

    .card-wrapper[data-card-id^="world_"] .card-image {
        aspect-ratio: 16 / 10 !important; height: auto !important;
    }
    .result-banner {
        height: 160px;
    }
}