/* Visual density refinement for the map editor after screenshot review. */

/* Compact build toolbar --------------------------------------------------- */
.build-editor-page .build-editor-header-row {
    display: grid;
    grid-template-columns: minmax(190px, 0.55fr) minmax(320px, 2fr) minmax(180px, 0.65fr) minmax(520px, 1.6fr);
    gap: 10px;
    align-items: center;
    margin: 0 0 8px;
    padding: 8px 10px;
    border: 1px solid rgba(139, 155, 181, 0.28);
    border-radius: 8px;
    background: rgba(31, 38, 49, 0.9);
    box-shadow: none;
}

/* Bootstrap 3 .row adds generated table pseudo-elements. Once the row becomes
 * a CSS grid those pseudo-elements turn into real grid items and push the
 * resource controls onto a second row. The editor grid provides its own
 * layout/clearing, so suppress them here. */
.build-editor-page .build-editor-header-row::before,
.build-editor-page .build-editor-header-row::after,
.build-editor-page .build-editor-tabs-row::before,
.build-editor-page .build-editor-tabs-row::after {
    display: none;
    content: none;
}

.build-editor-page .build-editor-header-row > [class*="col-"] {
    align-self: center;
}

.build-editor-page .build-editor-map-meta {
    grid-column: 1;
    grid-row: 1;
}

.build-editor-page .build-editor-title-col {
    grid-column: 2;
    grid-row: 1;
}

.build-editor-page .build-editor-author-meta {
    grid-column: 3;
    grid-row: 1;
}

.build-editor-page .build-editor-resource-meta {
    grid-column: 4;
    grid-row: 1;
    width: 100%;
}

.build-editor-page .build-editor-map-meta h3 {
    font-size: 10px;
    line-height: 1.1;
}

.build-editor-page .build-editor-map-meta h3 > b {
    margin-top: 3px;
    font-size: 15px;
    line-height: 1.2;
}

.build-editor-page .build-editor-title-col > label,
.build-editor-page .build-editor-author-meta > label {
    margin-bottom: 3px;
    font-size: 10px;
}

.build-editor-page #buildname,
.build-editor-page #author {
    height: 32px;
    padding-top: 4px;
    padding-bottom: 4px;
    border-radius: 6px;
    font-size: 13px;
}

.build-editor-page .build-editor-resource-meta {
    display: grid;
    grid-template-columns: auto minmax(230px, 1fr) auto;
    gap: 9px;
    align-items: center;
}

.build-editor-page .build-editor-resources {
    margin: 0 !important;
    padding: 5px 8px;
    border-radius: 6px;
    font-size: 11px;
    white-space: nowrap;
}

.build-editor-page .build-editor-resources b {
    font-size: 14px;
}

.build-editor-page .build-editor-scale-tools-inline,
.build-editor-page .build-editor-arrow-tools-inline {
    flex-wrap: nowrap;
    gap: 5px;
    margin: 0;
    font-size: 11px;
    white-space: nowrap;
}

.build-editor-page .build-editor-scale-tools-inline {
    min-width: 0;
}

.build-editor-page #mapscaleadjustment {
    width: 92px;
    min-width: 72px;
}

.build-editor-page #arrowmodecolor {
    width: 108px;
    height: 28px;
}

.build-editor-page #resetmapscale,
.build-editor-page #clearfacingarrows {
    min-height: 28px;
}

/* Main build/wave tabs ---------------------------------------------------- */
.build-editor-page .build-editor-tabs-row {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.build-editor-page .build-editor-tabs {
    width: max-content;
    max-width: 100%;
    min-height: 38px;
    padding: 3px;
    border-radius: 8px;
    background: rgba(30, 37, 48, 0.82);
}

.build-editor-page .build-editor-tabs > li > a {
    min-height: 30px;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 12px;
    line-height: 18px;
}

/* Map: no decorative AI-style heading block ------------------------------ */
.build-editor-page .map-stage-card {
    border-radius: 8px;
}

/* Primary actions --------------------------------------------------------- */
.build-editor-page .build-editor-actions {
    margin: 0 0 9px;
    padding: 6px;
    border-radius: 8px;
    box-shadow: 0 6px 14px rgba(7, 12, 22, 0.12);
}

.build-editor-page .build-editor-actions-primary .btn {
    min-height: 36px;
    font-size: 12px;
}

/* Tower / build detail switcher ------------------------------------------ */
.build-editor-page .build-sidebar-tabs-shell {
    overflow: visible;
    border: 1px solid rgba(139, 155, 181, 0.3);
    border-radius: 8px;
    background: rgba(34, 42, 54, 0.8);
    box-shadow: 0 7px 18px rgba(7, 12, 22, 0.13);
}

.build-editor-page .build-sidebar-tabs {
    display: flex;
    margin: 0;
    padding: 4px;
    border: 0;
    border-bottom: 1px solid rgba(139, 155, 181, 0.24);
    border-radius: 7px 7px 0 0;
    background: rgba(27, 34, 45, 0.76);
}

.build-editor-page .build-sidebar-tabs > li {
    float: none;
    flex: 1 1 50%;
    margin: 0;
}

.build-editor-page .build-sidebar-tabs > li > a,
.build-editor-page .build-sidebar-tabs > li > a:hover,
.build-editor-page .build-sidebar-tabs > li > a:focus {
    margin: 0;
    padding: 8px 11px;
    border: 0 !important;
    border-radius: 6px;
    background: transparent;
    color: #aebbd0;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
}

.build-editor-page .build-sidebar-tabs > li > a .fa {
    margin-right: 5px;
    opacity: 0.8;
}

.build-editor-page .build-sidebar-tabs > li.active > a,
.build-editor-page .build-sidebar-tabs > li.active > a:hover,
.build-editor-page .build-sidebar-tabs > li.active > a:focus {
    background: rgba(61, 130, 246, 0.2);
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(91, 153, 255, 0.32);
}

.build-editor-page .build-sidebar-tab-content {
    padding: 8px;
}

.build-editor-page .build-sidebar-tower-pane.defense-library-section {
    margin: 0;
}

.build-editor-page .build-sidebar-details-pane .build-details-panel {
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.build-editor-page .build-sidebar-details-pane .build-details-panel > .panel-heading {
    display: none;
}

.build-editor-page .build-sidebar-details-pane .build-details-panel > .panel-body {
    padding: 4px 2px 2px;
}

/* Hero cards -------------------------------------------------------------- */
.build-editor-page .hero-pool-grid {
    gap: 8px;
}

.build-editor-page .hero-pool-grid .panel.hero-pool-card {
    border-radius: 8px;
    box-shadow: 0 5px 12px rgba(7, 12, 22, 0.12);
}

.build-editor-page .hero-pool-grid .panel.hero-pool-card > .panel-heading.hero-pool-card-header {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 50px;
    padding: 8px;
    border-radius: 7px 7px 0 0;
}

.build-editor-page .hero-pool-heading-row {
    flex: 1 1 auto;
    min-width: 0;
    gap: 6px;
}

.build-editor-page .hero-pool-name {
    font-size: 14px;
}

.build-editor-page .hero-pool-visibility-toggle {
    flex: 0 0 auto;
    gap: 5px;
    min-height: 30px;
    padding: 4px 8px;
    font-size: 11px;
}

.build-editor-page .hero-pool-visibility-toggle input {
    width: 15px;
    height: 15px;
}

.build-editor-page .hero-pool-layer-controls {
    flex: 0 0 auto;
    width: auto;
    margin: 0;
}

.build-editor-page .hero-pool-layer-controls > .btn {
    flex: 0 0 auto;
    min-height: 32px;
    padding: 5px 9px;
    font-size: 11px;
    line-height: 20px;
}

.build-editor-page .hero-pool-grid .hero-pool-item .panel.hero-pool-card > .panel-body.hero-pool-card-body {
    gap: 5px;
    min-height: 54px;
    padding: 8px;
}

/* Bootstrap's panel-body clearfix pseudo-elements become flex/grid children
 * in the redesigned defense rows. Besides being useless here, the extra gap
 * around them can be exactly what pushes the last real tower onto a new row. */
.build-editor-page .hero-pool-card-body::before,
.build-editor-page .hero-pool-card-body::after {
    display: none;
    content: none;
}

/* Keep normal tower previews at their established size, but trim the empty
 * tile padding around them. */
.build-editor-page .hero-pool-card-body > .defense-placeholder,
.build-editor-page .hero-pool-card-body > .beam-picker {
    min-width: 39px;
    min-height: 39px;
    padding: 2px;
    border-radius: 7px;
    background: rgba(16, 22, 31, 0.16);
}

/* Six-defense cards are common (Huntress and Series-EV included). Make them
 * a deterministic single-row grid so a slightly wider trap or beam trigger
 * cannot create a pointless one-item second line. */
.build-editor-page .hero-pool-count-6 .hero-pool-card-body {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    align-items: center;
    column-gap: 2px;
    row-gap: 4px;
}

.build-editor-page .hero-pool-count-6 .hero-pool-card-body > .defense-placeholder,
.build-editor-page .hero-pool-count-6 .hero-pool-card-body > .beam-picker {
    width: 100%;
    min-width: 0;
    justify-self: stretch;
}

/* Seven and eight-defense heroes otherwise tend to leave a single orphan on
 * a second line. Give those pools a balanced 4+3 / 4+4 grid. */
.build-editor-page .hero-pool-count-7 .hero-pool-card-body,
.build-editor-page .hero-pool-count-8 .hero-pool-card-body {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(39px, 1fr));
    align-items: center;
    column-gap: 5px;
    row-gap: 5px;
}

.build-editor-page .hero-pool-count-7 .hero-pool-card-body > .defense-placeholder,
.build-editor-page .hero-pool-count-7 .hero-pool-card-body > .beam-picker,
.build-editor-page .hero-pool-count-8 .hero-pool-card-body > .defense-placeholder,
.build-editor-page .hero-pool-count-8 .hero-pool-card-body > .beam-picker {
    width: 100%;
}

.build-editor-page .build-details-panel label,
.build-editor-page .build-details-panel caption {
    font-size: 12px;
}

.build-editor-page .build-economy-label {
    font-size: 11px;
}

/* Full HD is intentionally compact. On wide 4K layouts the details pane has
 * enough room to use desktop-sized form text and targets without reducing the
 * map or tower density. */
@media (min-width: 2200px) {
    .build-editor-page .build-sidebar-details-pane .build-details-panel > .panel-body {
        padding: 10px 8px 8px;
    }

    .build-editor-page .required-heroes-title {
        margin-bottom: 9px;
        font-size: 14px;
    }

    .build-editor-page .required-heroes-add-button {
        min-height: 36px;
        font-size: 12px;
    }

    .build-editor-page .build-details-panel .form-group {
        margin-bottom: 12px;
    }

    .build-editor-page .build-details-panel label,
    .build-editor-page .build-details-panel caption {
        font-size: 13px;
        line-height: 1.4;
    }

    .build-editor-page .build-details-panel .form-control {
        height: 38px;
        padding: 7px 10px;
        font-size: 13px;
    }

    .build-editor-page .build-details-panel .checkbox,
    .build-editor-page .build-details-panel .radio-inline {
        margin-top: 6px;
        margin-bottom: 6px;
        line-height: 20px;
    }

    .build-editor-page .build-details-panel input[type="checkbox"],
    .build-editor-page .build-details-panel input[type="radio"] {
        width: 15px;
        height: 15px;
    }

    .build-editor-page .build-economy-stat {
        padding: 11px 12px;
    }

    .build-editor-page .build-economy-label {
        font-size: 12px;
    }

    .build-editor-page .build-economy-value {
        font-size: 18px;
    }
}

@media (min-width: 1200px) and (max-width: 2199px) {
    .build-editor-page .build-editor-resource-meta {
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas:
            "resources scale"
            "resources arrow";
        column-gap: 8px;
        row-gap: 3px;
    }

    .build-editor-page .build-editor-resources {
        grid-area: resources;
        align-self: stretch;
        align-items: center;
        justify-content: center;
    }

    .build-editor-page .build-editor-scale-tools-inline {
        grid-area: scale;
    }

    .build-editor-page .build-editor-arrow-tools-inline {
        grid-area: arrow;
    }
}

@media (max-width: 1599px) {
    .build-editor-page .build-editor-header-row {
        grid-template-columns: minmax(170px, 0.55fr) minmax(260px, 1.5fr) minmax(160px, 0.65fr) minmax(480px, 1.55fr);
        gap: 8px;
    }

    .build-editor-page .build-editor-scale-tools-inline,
    .build-editor-page .build-editor-arrow-tools-inline {
        font-size: 10px;
    }
}

@media (max-width: 1199px) {
    .build-editor-page .build-editor-header-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: end;
    }

    .build-editor-page .build-editor-map-meta,
    .build-editor-page .build-editor-title-col,
    .build-editor-page .build-editor-author-meta,
    .build-editor-page .build-editor-resource-meta {
        grid-column: auto;
        grid-row: auto;
    }

    .build-editor-page .build-editor-resource-meta {
        display: flex;
        grid-column: 1 / -1;
        flex-wrap: wrap;
    }
}

@media (max-width: 767px) {
    .build-editor-page .build-editor-header-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .build-editor-page .build-editor-resource-meta {
        grid-column: auto;
        align-items: flex-start;
        flex-direction: column;
    }

    .build-editor-page .build-editor-scale-tools-inline,
    .build-editor-page .build-editor-arrow-tools-inline {
        flex-wrap: wrap;
        white-space: normal;
    }
}