/* ==========================================
   Hub Buttons — Estilos e Variantes
   Tokens: var(--hub-*) como fonte da verdade
   ========================================== */

/* --- .hub-button (Canônico) --- */
.hub-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: var(--hub-control-height, 38px);
    padding: 0 var(--hub-space-4);
    border-radius: var(--hub-radius);
    cursor: pointer;
    box-sizing: border-box;
    border-width: 1px;
    border-style: solid;
    border-color: rgba(var(--hub-primary-rgb), 0.72);
    background: var(--hub-primary);
    color: var(--hub-text-on-primary);
    box-shadow: none;
    font-family: var(--hub-font);
    font-size: var(--hub-text-label);
    font-weight: var(--hub-weight-semibold);
    transition: var(--hub-transition-base), transform 0.1s ease;
}
.hub-button:hover {
    background: var(--hub-primary-hover);
    border-color: var(--hub-primary-hover);
    box-shadow: none;
}
.hub-button:focus-visible {
    outline: none;
    box-shadow: var(--hub-shadow-focus);
}
.hub-button:active {
    transform: scale(0.97);
}

/* --- .hub-button--ghost (Canônico) --- */
.hub-button--ghost {
    border-color: var(--hub-border);
    background: var(--hub-white-alpha-2);
    color: var(--hub-text-muted);
}
.hub-button--ghost:hover {
    border-color: rgba(var(--hub-primary-rgb), 0.48);
    background: rgba(var(--hub-primary-rgb), 0.08);
    color: var(--hub-text);
}

/* --- .hub-button-row .is-active (Grupo Segmentado) --- */
.hub-button-row .hub-button.is-active,
.hub-button-row .hub-button.is-active:hover {
    border-color: rgba(var(--hub-primary-rgb), 0.72);
    background: rgba(var(--hub-primary-rgb), 0.88);
    color: var(--hub-text-on-primary);
}

/* --- .hub-danger-action (Ações Destrutivas) --- */
.hub-danger-action,
.hub-button.hub-danger-action {
    border-color: rgba(var(--hub-danger-rgb), 0.34);
    color: var(--hub-text-on-danger);
}
.hub-danger-action:hover,
.hub-button.hub-danger-action:hover,
.hub-modal__footer .hub-button.is-danger {
    border-color: rgba(var(--hub-danger-rgb), 0.72);
    background: rgba(var(--hub-danger-rgb), 0.18);
    color: var(--hub-text);
}
.hub-modal__footer .hub-button.is-danger:hover {
    background: rgba(var(--hub-danger-rgb), 0.28);
}

/* Danger na faixa de ações da ficha de unidade: repouso discreto, perigo no hover */
.hub-unit-drawer__actions button.hub-danger-action {
    border-color: var(--hub-border);
    background: var(--hub-white-alpha-2);
    color: var(--hub-text-muted);
}
.hub-unit-drawer__actions button.hub-danger-action:hover {
    border-color: var(--hub-danger);
    background: rgba(var(--hub-danger-rgb), 0.18);
    color: var(--hub-text);
}

/* --- .hub-button--compact --- */
.hub-button--compact {
    padding: var(--hub-space-1) var(--hub-space-2);
    font-size: var(--hub-text-label);
    height: auto;
    border-radius: var(--hub-radius);
}

/* --- .hub-button--whatsapp --- */
.hub-button--whatsapp {
    background: #25D366;
    border-color: #25D366;
    color: var(--hub-text);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.hub-button--whatsapp:hover {
    background: #20ba56;
    border-color: #20ba56;
}

/* --- Anchor Button --- */
a.hub-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

/* --- Disabled Buttons --- */
.hub-button:disabled,
.hub-button--ghost:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}
.hub-button:disabled:hover,
.hub-button--ghost:disabled:hover {
    background: inherit;
    border-color: inherit;
    color: inherit;
    box-shadow: none;
}