/* =========================================
   MYAUBUILD — Fundamentos de interface
   Camada aditiva: tokens e primitivas comuns.
   Não substitui estilos de recursos existentes.
   ========================================= */

:root {
    --ui-content-max: 1420px;
    --ui-content-gutter: 32px;
    --ui-content-gutter-mobile: 18px;
    --ui-space-1: 4px;
    --ui-space-2: 8px;
    --ui-space-3: 12px;
    --ui-space-4: 16px;
    --ui-space-5: 24px;
    --ui-space-6: 32px;
    --ui-radius-sm: 8px;
    --ui-radius-md: 12px;
    --ui-radius-lg: 16px;
    --button-primary-bg: #E6A24C;
    --button-primary-hover: #F5B755;
    --button-primary-border: #F5B755;
    --button-primary-text: #051B32;
    --button-secondary-bg: #051B32;
    --button-secondary-hover: #18304F;
    --button-secondary-border: #3B5D88;
    --button-secondary-text: #FDF4E0;
    --button-outline: #FDF4E0;
    --button-outline-hover: #F5B755;
    --ui-focus-ring: 0 0 0 3px rgba(245, 183, 85, .24);
    --ui-surface: var(--p-card, rgba(12, 19, 31, .90));
    --ui-surface-raised: var(--p-panel, rgba(16, 25, 40, .94));
    --ui-border: var(--p-border, rgba(188, 207, 231, .16));
    --ui-text: var(--p-text, var(--site-ink, #f5f7fb));
    --ui-muted: var(--p-muted, var(--site-muted, #aeb9ca));
    --ui-accent: var(--button-primary-bg);
    --ui-success: var(--p-green, #65d99c);
    --ui-warning: var(--p-yellow, #e6c167);
    --ui-danger: var(--p-red, #ff858c);
}

/*
 * Sistema global de botões
 *
 * As famílias antigas continuam aceitas para que todas as áreas do site
 * compartilhem as mesmas três variantes sem exigir mudanças de marcação.
 * Ações semânticas (perigo, venda, gasto e sucesso) preservam suas cores.
 */
html .ui-button--primary,
html .p-button:not(.p-button--secondary):not(.p-button--outline):not(.p-button--danger):not(.p-button--expense):not(.p-button--sale):not(.p-button--link),
html .build-button:not(.build-button--secondary):not(.build-button--outline):not(.build-button--danger),
html .game-button:not(.game-button--secondary):not(.game-button--outline),
html .button-primary,
html .button:not(.button--secondary):not(.button--ghost):not(.button--outline):not(.button-secondary),
html .admin-button:not(.admin-button--secondary):not(.admin-button--outline):not(.admin-button--danger),
html .farm-library-group__button--primary,
html .site-shell-button.is-primary,
html body.site-auth form button[type="submit"] {
    border: 1px solid var(--button-primary-border);
    background: var(--button-primary-bg);
    background-image: none;
    color: var(--button-primary-text);
    filter: none;
}

html .ui-button--primary:is(:hover, :focus-visible),
html .p-button:not(.p-button--secondary):not(.p-button--outline):not(.p-button--danger):not(.p-button--expense):not(.p-button--sale):not(.p-button--link):is(:hover, :focus-visible),
html .build-button:not(.build-button--secondary):not(.build-button--outline):not(.build-button--danger):is(:hover, :focus-visible),
html .game-button:not(.game-button--secondary):not(.game-button--outline):is(:hover, :focus-visible),
html .button-primary:is(:hover, :focus-visible),
html .button:not(.button--secondary):not(.button--ghost):not(.button--outline):not(.button-secondary):is(:hover, :focus-visible),
html .admin-button:not(.admin-button--secondary):not(.admin-button--outline):not(.admin-button--danger):is(:hover, :focus-visible),
html .farm-library-group__button--primary:is(:hover, :focus-visible),
html .site-shell-button.is-primary:is(:hover, :focus-visible),
html body.site-auth form button[type="submit"]:is(:hover, :focus-visible) {
    border-color: var(--button-primary-border);
    background: var(--button-primary-hover);
    background-image: none;
    color: var(--button-primary-text);
    filter: none;
}

html .ui-button:not(.ui-button--primary):not(.ui-button--outline):not(.ui-button--danger),
html .p-button--secondary,
html .build-button--secondary,
html .game-button--secondary,
html .button--secondary,
html .button-secondary,
html .admin-button--secondary,
html .farm-library-group__button:not(.farm-library-group__button--primary) {
    border: 1px solid var(--button-secondary-border);
    background: var(--button-secondary-bg);
    background-image: none;
    color: var(--button-secondary-text);
    filter: none;
}

html .ui-button:not(.ui-button--primary):not(.ui-button--outline):not(.ui-button--danger):is(:hover, :focus-visible),
html .p-button--secondary:is(:hover, :focus-visible),
html .build-button--secondary:is(:hover, :focus-visible),
html .game-button--secondary:is(:hover, :focus-visible),
html .button--secondary:is(:hover, :focus-visible),
html .button-secondary:is(:hover, :focus-visible),
html .admin-button--secondary:is(:hover, :focus-visible),
html .farm-library-group__button:not(.farm-library-group__button--primary):is(:hover, :focus-visible) {
    border-color: var(--button-secondary-border);
    background: var(--button-secondary-hover);
    background-image: none;
    color: var(--button-secondary-text);
    filter: none;
}

html .ui-button--outline,
html .p-button--outline,
html .build-button--outline,
html .game-button--outline,
html .button--outline,
html .button--ghost,
html .admin-button--outline,
html .site-shell-button:not(.is-primary),
html .p-icon-button,
html .build-icon-button,
html .build-hero-action,
html .farm-information__actions button,
html .farm-information__pagination button,
html .farm-information__go,
html .farm-day-pagination__button,
html .farm-day-view-switch button:not(.is-active),
html .farm-productivity-time-button,
html .farm-productivity-replicate,
html .gnjoy-price-button,
html .build-guide-toolbar button,
html .build-guide-info-button,
html .visual-action-icon:not(.visual-action-icon--remove) {
    border: 1px solid var(--button-outline);
    background: transparent;
    background-image: none;
    color: var(--button-outline);
    filter: none;
}

html .ui-button--outline:is(:hover, :focus-visible),
html .p-button--outline:is(:hover, :focus-visible),
html .build-button--outline:is(:hover, :focus-visible),
html .game-button--outline:is(:hover, :focus-visible),
html .button--outline:is(:hover, :focus-visible),
html .button--ghost:is(:hover, :focus-visible),
html .admin-button--outline:is(:hover, :focus-visible),
html .site-shell-button:not(.is-primary):is(:hover, :focus-visible),
html .p-icon-button:is(:hover, :focus-visible),
html .build-icon-button:is(:hover, :focus-visible),
html .build-hero-action:is(:hover, :focus-visible),
html .farm-information__actions button:is(:hover, :focus-visible),
html .farm-information__pagination button:is(:hover, :focus-visible),
html .farm-information__go:is(:hover, :focus-visible),
html .farm-day-pagination__button:is(:hover, :focus-visible),
html .farm-day-view-switch button:not(.is-active):is(:hover, :focus-visible),
html .farm-productivity-time-button:is(:hover, :focus-visible),
html .farm-productivity-replicate:is(:hover, :focus-visible),
html .gnjoy-price-button:is(:hover, :focus-visible),
html .build-guide-toolbar button:is(:hover, :focus-visible),
html .build-guide-info-button:is(:hover, :focus-visible),
html .visual-action-icon:not(.visual-action-icon--remove):is(:hover, :focus-visible) {
    /* A paleta terciária é autoritativa mesmo quando CSS do recurso é carregado depois. */
    border-color: var(--button-outline-hover) !important;
    background: transparent !important;
    background-image: none !important;
    color: var(--button-outline-hover) !important;
    filter: none !important;
}

html :is(.ui-button, .p-button, .build-button, .game-button, .button, .button-primary, .button-secondary, .admin-button, .farm-library-group__button, .site-shell-button, .p-icon-button, .build-icon-button, .build-hero-action) {
    transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}

html :is(.ui-button, .p-button, .build-button, .game-button, .button, .button-primary, .button-secondary, .admin-button, .farm-library-group__button, .site-shell-button, .p-icon-button, .build-icon-button, .build-hero-action):focus-visible {
    outline: none;
    box-shadow: var(--ui-focus-ring);
}

html :is(.ui-button, .p-button, .build-button, .game-button, .button, .button-primary, .button-secondary, .admin-button, .farm-library-group__button, .site-shell-button, .p-icon-button, .build-icon-button, .build-hero-action):disabled,
html :is(.ui-button, .p-button, .build-button, .game-button, .button, .button-primary, .button-secondary, .admin-button, .farm-library-group__button, .site-shell-button, .p-icon-button, .build-icon-button, .build-hero-action)[aria-disabled="true"] {
    cursor: not-allowed;
    opacity: .5;
}

/* Tipografia única: botões usam peso regular em todas as três variantes. */
html button,
html input[type="button"],
html input[type="submit"],
html input[type="reset"],
html :is(.ui-button, .p-button, .build-button, .game-button, .button, .button-primary, .button-secondary, .admin-button, .farm-library-group__button, .site-shell-button, .p-icon-button, .build-icon-button, .build-hero-action, .farm-information__go, .farm-day-pagination__button, .gnjoy-price-button) {
    font-weight: 400 !important;
}

/* Container único disponível a páginas novas, sem alterar shells legados. */
.ui-container {
    width: min(var(--ui-content-max), calc(100% - (var(--ui-content-gutter) * 2)));
    margin-inline: auto;
}

/* Base acessível, aplicada somente aos novos componentes .ui-*. */
.ui-card {
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-lg);
    background: var(--ui-surface);
    color: var(--ui-text);
    box-shadow: 0 18px 48px rgba(0, 0, 0, .28);
}

.ui-card__head,
.ui-card__body,
.ui-card__footer {
    padding: var(--ui-space-5);
}

.ui-card__head { border-bottom: 1px solid var(--ui-border); }
.ui-card__footer { border-top: 1px solid var(--ui-border); }

.ui-button {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--ui-space-2);
    padding: 0 14px;
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-sm);
    background: var(--ui-surface-raised);
    color: var(--ui-text);
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
}

.ui-button--primary { border-color: transparent; background: var(--ui-accent); color: #fff; }
.ui-button--danger { color: var(--ui-danger); }
.ui-button:focus-visible,
.ui-field :is(input, select, textarea):focus-visible { outline: none; box-shadow: var(--ui-focus-ring); }
.ui-button:disabled { opacity: .5; cursor: not-allowed; }

.ui-field { display: grid; gap: 7px; color: var(--ui-muted); font-size: 12px; font-weight: 700; }
.ui-field :is(input, select, textarea) {
    width: 100%;
    min-height: 42px;
    padding: 10px 12px;
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-sm);
    background: rgba(6, 12, 21, .76);
    color: var(--ui-text);
    font: inherit;
}

.ui-dialog {
    width: min(680px, calc(100% - 28px));
    max-height: min(760px, calc(100dvh - 28px));
    margin: auto;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-lg);
    background: var(--ui-surface-raised);
    color: var(--ui-text);
}
.ui-dialog[open] {
    display: flex;
    flex-direction: column;
    overscroll-behavior: contain;
}
.ui-dialog::backdrop { background: rgba(0, 0, 0, .72); }
.ui-dialog__head,
.ui-dialog__footer { flex: 0 0 auto; padding: var(--ui-space-5); }
.ui-dialog__head { border-bottom: 1px solid var(--ui-border); }
.ui-dialog__footer { border-top: 1px solid var(--ui-border); }
.ui-dialog__body { min-height: 0; overflow: auto; padding: var(--ui-space-5); overscroll-behavior: contain; }

/* Ações de formulários longos permanecem alcançáveis sem deslocar o cabeçalho. */
.ui-dialog__body .p-form-actions {
    position: sticky;
    bottom: calc(var(--ui-space-5) * -1);
    z-index: 1;
    margin-inline: calc(var(--ui-space-5) * -1);
    margin-bottom: calc(var(--ui-space-5) * -1);
    padding: var(--ui-space-4) var(--ui-space-5);
    border-top: 1px solid var(--ui-border);
    background: var(--ui-surface-raised);
}

@media (max-width: 760px) {
    .ui-container { width: min(var(--ui-content-max), calc(100% - (var(--ui-content-gutter-mobile) * 2))); }
    .ui-card__head, .ui-card__body, .ui-card__footer,
    .ui-dialog__head, .ui-dialog__body, .ui-dialog__footer { padding: var(--ui-space-4); }
    .ui-dialog { width: min(100% - 16px, 680px); max-height: calc(100dvh - 16px); }
    .ui-dialog__body .p-form-actions {
        bottom: calc(var(--ui-space-4) * -1);
        margin-inline: calc(var(--ui-space-4) * -1);
        margin-bottom: calc(var(--ui-space-4) * -1);
        padding: var(--ui-space-3) var(--ui-space-4);
    }
}