/* Componente comum ao site e aos painéis. Herda fonte e cores de cada superfície. */
.appnotify {
    margin-block: 16px;
    padding: 20px;
    border: 1px solid var(--ui-line-2, var(--line, #e2e2e2));
    border-radius: var(--ui-radius, 12px);
    background: var(--ui-surface, var(--surface, #fff));
    color: var(--ui-ink, var(--ink, #303030));
}
.appnotify .appnotify__title { margin: 0 0 8px; font-size: 1rem; line-height: 1.4; font-weight: 700; }
.appnotify p { margin: 0 0 12px; font-size: 0.9375rem; line-height: 1.5; }
.appnotify .appnotify__status { color: var(--ui-ink-2, var(--ink-2, #555)); }
.appnotify__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.appnotify__button {
    appearance: none; min-height: 44px; padding: 10px 16px; margin: 0;
    display: inline-flex; align-items: center; justify-content: center; text-decoration: none;
    border: 1px solid #303030; border-radius: 8px;
    background: #303030; color: #fff; font: inherit; font-weight: 600;
    line-height: 1.4; cursor: pointer; text-align: center;
}
.appnotify__button--secondary { background: transparent; color: inherit; border-color: var(--ui-line-2, var(--line, #ababab)); }
.appnotify__button:focus-visible { outline: 2px solid #ababab; outline-offset: 3px; }
.appnotify__button:disabled { opacity: .6; cursor: default; }
.appnotify [hidden], .appnotify[hidden] { display: none !important; }
.appnotify .appnotify__status:empty { display: none; }
.appnotify__news { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--ui-line-2, var(--line, #e2e2e2)); scroll-margin-top: 100px; }
.appnotify__followed { margin: 0 0 16px; padding: 0; list-style: none; }
.appnotify__followed-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; padding-block: 16px; border-bottom: 1px solid var(--ui-line-2, var(--line, #e2e2e2)); }
.appnotify__followed-info { flex: 1 1 180px; min-width: 0; overflow-wrap: anywhere; }
.appnotify__followed-info strong { display: block; font-size: 1rem; line-height: 1.5; }
.appnotify .appnotify__followed-info p { margin-block: 6px 0; }
.appnotify-invite-wrap { margin-block: 24px; }
/* O acesso às preferências continua disponível após dispensar o convite. */
.appnotify-invite-wrap > [data-notify-manage] { margin-bottom: 12px; }
.appnotify--invite { margin: 0; }
.appnotify--invite .appnotify__title { max-width: 65ch; }
.appnotify--invite p { max-width: 75ch; }
.appnotify__button:not(:disabled):hover { background: #454545; border-color: #454545; color: #fff; }
.appnotify__button--secondary:not(:disabled):hover { background: var(--ui-surface-2, var(--surface-2, #222)); color: var(--ui-ink, var(--ink, #fff)); border-color: var(--ui-ink-2, var(--ink-2, #ababab)); }
@media (max-width: 480px) {
    .appnotify { padding: 16px; }
    .appnotify p, .appnotify__button { font-size: 16px; }
    .appnotify__actions > .appnotify__button { width: 100%; }
    .appnotify__followed-row > .appnotify__button { width: 100%; }
    .appnotify-invite-wrap { margin-block: 16px; }
}
