/* AP2 UI Framework - zentrale Buttons
   Nur Darstellung/Zustaende hier; Seiten-CSS darf Position, Breite, Flex/Grid und Margin festlegen. */

:where(
    button,
    .button, .fake-button, .buttonlike, .button1,
    .save-button, .report-button, .link-button,
    .delete-button, .archive-button, .restore-button,
    .finish-day-button, .auth-submit,
    .ap2-install-primary, .ap2-install-secondary
) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--button-gap);
    min-height: var(--button-min-height);
    padding: var(--button-padding-block) var(--button-padding-inline);
    box-sizing: border-box;
    border: 1px solid var(--button-border);
    border-radius: var(--button-border-radius);
    background: var(--button-background);
    color: var(--button-text);
    font: inherit;
    font-weight: 600;
    line-height: 1.15;
    text-decoration: none;
    cursor: pointer;
}

:where(button, .button, .fake-button, .buttonlike, .button1, .save-button, .report-button, .link-button):not(:disabled):not(.is-disabled):hover {
    background: var(--button-background-hover);
}

:where(.delete-button, button.danger, .danger.expense-icon-button, .category-delete-toggle) {
    color: var(--button-delete-text);
    background: var(--button-delete-background);
    border-color: var(--button-delete-border);
}
:where(.delete-button, button.danger, .danger.expense-icon-button, .category-delete-toggle):not(:disabled):hover { background: var(--button-delete-background-hover); }

.archive-button {
    color: var(--button-archive-text);
    background: var(--button-archive-background);
    border-color: var(--button-archive-border);
}
.archive-button:not(:disabled):hover { background: var(--button-archive-background-hover); }

.restore-button {
    color: var(--button-restore-text);
    background: var(--button-restore-background);
    border-color: var(--button-restore-border);
}
.restore-button:not(:disabled):hover { background: var(--button-restore-background-hover); }

:where(.secondary, .ap2-install-secondary) {
    color: var(--button-secondary-text);
    background: var(--button-secondary-background);
    border-color: var(--button-secondary-border);
}

:where(.auth-submit, .ap2-install-primary) {
    color: var(--button-primary-text);
    background: var(--button-primary-background);
    border-color: var(--button-primary-background);
}

:where(
    .icon-button, .grid-icon, .expense-icon-button, .icon-toggle,
    .popup-tool-button, .journal-day-button, .password-toggle,
    .app-account-button, .app-menu-toggle
) {
    display: inline-grid;
    place-items: center;
    width: var(--icon-button-size);
    height: var(--icon-button-size);
    min-width: var(--icon-button-size);
    min-height: var(--icon-button-size);
    padding: 0;
    border: 1px solid var(--icon-button-border);
    border-radius: var(--button-border-radius);
    background: var(--button-icon-background);
    color: var(--button-text);
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    font-size:24px !important;
}
:where(.icon-button, .grid-icon, .expense-icon-button, .icon-toggle, .popup-tool-button, .journal-day-button, .password-toggle, .app-account-button, .app-menu-toggle):not(:disabled):hover {
    background: var(--button-icon-background-hover);
}

:where(.popup-close, .popup-close-window, .popup-close-button, .app-account-close, .ap2-install-dialog-close) {
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--button-close-text);
    line-height: 1;
    cursor: pointer;
}

:where(.text-action, .journal-expense-remove-file) {
    min-height: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--button-delete-text);
    font: inherit;
    text-decoration: underline;
    cursor: pointer;
}

:where(.btn.round, .cat-control) {
    padding: 0;
    border-radius: 50%;
    color: #fff;
}
:where(.btn.red, .cat-control.stop) { background: var(--red); }
:where(.btn.green, .cat-control.start) { background: var(--green); }
.btn.blue { color: var(--blue-text); background: var(--blue); }

:where(button, .button, .fake-button, .buttonlike, .button1, .save-button, .report-button, .link-button, .delete-button, .archive-button, .restore-button, .icon-button, .grid-icon, .expense-icon-button, .icon-toggle, .popup-tool-button, .journal-day-button, .auth-submit, .ap2-install-primary, .ap2-install-secondary):disabled,
:where(.button, .fake-button, .buttonlike, .report-button, .journal-day-button).is-disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

:where(button, .button, .fake-button, .buttonlike, .button1, .save-button, .report-button, .link-button, .delete-button, .archive-button, .restore-button, .icon-button, .grid-icon, .expense-icon-button, .icon-toggle, .popup-tool-button, .journal-day-button, .auth-submit, .ap2-install-primary, .ap2-install-secondary):focus-visible {
    outline: 2px solid var(--button-focus);
    outline-offset: 2px;
}
[value=delete_entry]{font-size:24px;}