/* Acessibilidade: tamanho do texto (TextSize, --text-scale) e sinais que não dependem só de cor. */

/* ===== Tamanho do texto: só os blocos de leitura crescem (o HUD e os botões do jogo ficam como estão) ===== */
.tut-text,
.book-title,
.book-text,
.page-text,
.question-text,
.option-text,
.central-alert-message,
.mission-details-text,
.build-info-desc,
.build-info-stats,
.nh-list,
.swal2-html-container {
    zoom: var(--text-scale, 1);
}

/* Menu inicial e tela de pausa (incl. Configurações, notificações, pesquisa): crescem inteiros, na hora em que o
   tamanho muda. A altura máxima é dividida pela escala para o painel continuar cabendo na tela (e rolar). */
#main-menu .menu-col,
#profile-screen .profile-form-container,
#pause-overlay .overlay-content {
    zoom: var(--text-scale, 1);
}

#pause-overlay .overlay-content {
    max-height: calc((100vh - 32px) / var(--text-scale, 1));
    overflow-y: auto;
}

/* Balão do Paulo e toasts: tamanho da fonte em vez de zoom (o zoom deixava o modal "instável" a cada quadro do
   retrato animado e tirava os toasts do canto por meio pixel) */
html .decision-speech { /* html: vence o css/event-decision.css, carregado depois */
    font-size: calc(1rem * var(--text-scale, 1));
}

html .toast {
    font-size: calc(0.95rem * var(--text-scale, 1));
}

/* ===== Números do topo: além da cor, um selo com símbolo (! atenção, ✕ crítico) no canto da pílula ===== */
.resource-item:has(.resource-value.warning),
.resource-item:has(.resource-value.critical) {
    position: relative;
}

.resource-item:has(.resource-value.warning)::after,
.resource-item:has(.resource-value.critical)::after {
    position: absolute;
    top: -6px;
    right: -4px;
    width: 20px;
    height: 20px;
    border: 2px solid #000;
    border-radius: 50%;
    font: 800 12px/16px system-ui, sans-serif;
    text-align: center;
    text-shadow: none;
    pointer-events: none;
    z-index: 2;
}

.resource-item:has(.resource-value.warning)::after {
    content: '!';
    background: #FFD60A;
    color: #000;
}

.resource-item:has(.resource-value.critical)::after {
    content: '✕';
    background: #FF1744;
    color: #fff;
}

/* ===== Rótulo de lugar da obra (BuildingFeedback.updatePlacementLabel): texto + borda com padrão ===== */
#placement-label {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 90;
    max-width: 280px;
    padding: 0.3rem 0.6rem;
    border: 2px solid #000;
    border-radius: 10px;
    background: #fff;
    color: #1b1b1b;
    font-weight: 800;
    font-size: 0.85rem;
    line-height: 1.25;
    pointer-events: none;
    box-shadow: 0 3px 0 rgba(0, 0, 0, 0.35);
    zoom: var(--text-scale, 1);
}

#placement-label[hidden] {
    display: none;
}

#placement-label[data-state="ok"] {
    border-left: 8px solid #00B866;
}

#placement-label[data-state="trees"] {
    border-left: 8px dashed #FF8C00;
}

#placement-label[data-state="bad"] {
    border-left: 8px double #FF1744;
    background: #FFEBEE;
}

@media (hover: none) {
    /* Toque: o dedo cobre o ponto; o rótulo fica no alto, centralizado */
    #placement-label {
        transform: none !important;
        top: 70px;
        left: 50%;
        translate: -50% 0;
    }
}

/* ===== Painéis de recurso (fundo claro): cores legíveis e padronizadas — verde = bom, vermelho = ruim ===== */
.resource-details-panel h4 { color: #1b5e20; }
.resource-details-panel h5 { color: #5b2a86; }
.resource-details-panel .stat-label { color: #3a3a3a; }
.resource-details-panel .stat-value { color: #0d47a1; }
.resource-details-panel .stat-value.positive,
.resource-details-panel .building-production,
.resource-details-panel .factor-good b,
.resource-details-panel .factor-good .factor-detail { color: #1b7a34; }
.resource-details-panel .stat-value.negative,
.resource-details-panel .building-consumption,
.resource-details-panel .building-cost,
.resource-details-panel .factor-bad b,
.resource-details-panel .factor-bad .factor-detail { color: #c62828; }
.resource-details-panel .stat-value.warn,
.resource-details-panel .factor-ok .factor-detail { color: #a35a00; }
.resource-details-panel .building-storage,
.resource-details-panel .building-bonus { color: #0d47a1; }
.resource-details-panel .stat-note { color: #333; opacity: 1; }
.resource-details-panel .no-sources { color: #555; }
.resource-details-panel .renewable-indicator { font-weight: 700; }
.resource-details-panel .renewable-indicator.is-renewable { color: #1b7a34; }
.resource-details-panel .renewable-indicator.is-fossil { color: #8d4a00; }
.resource-details-panel .growth-factors li { display: flex; justify-content: space-between; gap: 0.5rem; flex-wrap: wrap; }
.resource-details-panel .factor-detail { font-size: 0.85em; font-weight: 700; }
.resource-details-panel .building-name {
    color: #1f2937;
    text-shadow: none;
    -webkit-text-stroke: 0;
    font-weight: 700;
}