/* PADCORE — اطلاعیه‌های سمتِ کاربر: کادرِ زیرِ هدر، بالنِ پایین، دکمهٔ گوشه، پنجرهٔ میانی.
   رنگِ هر اطلاعیه فقط از --ann-color (رنگِ سبک)؛ بقیه از توکن‌ها تا تمِ تیره هم درست باشد. */

.ann-stack { --ann-color: var(--primary); }
.ann-stack[hidden], .ann-stack .ann-banner[hidden], .ann-nav[hidden], .ann-modal[hidden] { display: none !important; }

.ann-stack .ann-banner {
    display: flex; align-items: flex-start; gap: var(--space-3);
    margin: 0; padding: var(--space-3) var(--space-4);
    border: 1px solid color-mix(in srgb, var(--ann-color) 24%, transparent);
    border-inline-start: 4px solid var(--ann-color);
    border-radius: var(--radius-lg);
    background: color-mix(in srgb, var(--ann-color) 7%, var(--card));
    color: var(--foreground);
    font-size: var(--text-body);
    line-height: 1.7;
    animation: ann-in var(--duration-base, .2s) var(--ease-out, ease-out);
}
@keyframes ann-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

.ann-stack .ann-ic {
    flex: none; display: grid; place-items: center;
    inline-size: 34px; block-size: 34px; border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--ann-color) 14%, var(--card));
    color: var(--ann-color);
}
.ann-stack .ann-svg { inline-size: 18px; block-size: 18px; flex: none; }
.ann-stack .ann-content { flex: 1; min-inline-size: 0; }
.ann-stack .ann-title { display: block; font-weight: 800; font-size: var(--text-body); }
.ann-stack .ann-body { display: block; margin-block-start: 2px; color: var(--muted-foreground); font-size: var(--text-label); opacity: 1; }

.ann-stack .ann-img { display: block; margin-block-start: var(--space-2); border-radius: var(--radius-md); overflow: hidden; line-height: 0; }
.ann-stack .ann-img img { inline-size: 100%; max-block-size: 220px; object-fit: cover; }
.ann-stack a.ann-img:hover img { opacity: .92; }

.ann-stack .ann-acts { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-block-start: var(--space-2); }
.ann-stack .ann-btn {
    display: inline-flex; align-items: center; gap: 4px;
    min-block-size: 32px; padding: 0 var(--space-3);
    border: 1px solid transparent; border-radius: var(--radius-md);
    font: inherit; font-size: var(--text-label); font-weight: 700;
    text-decoration: none; cursor: pointer;
}
.ann-stack .ann-btn .ann-svg { inline-size: 13px; block-size: 13px; }
.ann-stack .ann-btn--p { background: var(--ann-color); color: #fff; }
.ann-stack .ann-btn--p:hover { filter: brightness(.94); }
.ann-stack .ann-btn--s { background: var(--card); color: var(--ann-color); border-color: color-mix(in srgb, var(--ann-color) 32%, transparent); }
.ann-stack .ann-btn--s:hover { background: color-mix(in srgb, var(--ann-color) 8%, var(--card)); }
.ann-stack .ann-btn--l { background: none; color: var(--ann-color); padding-inline: var(--space-1); }
.ann-stack .ann-btn--l:hover { text-decoration: underline; }

.ann-stack .ann-tools { flex: none; display: flex; align-items: center; gap: 2px; color: var(--muted-foreground); }
.ann-stack .ann-nav { display: inline-flex; align-items: center; gap: 2px; }
.ann-stack .ann-count { font-size: var(--text-caption); font-weight: 700; padding: 0 2px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ann-stack .ann-tools button {
    display: grid; place-items: center; inline-size: 30px; block-size: 30px;
    padding: 0; border: 0; border-radius: var(--radius-sm);
    background: none; color: inherit; cursor: pointer; opacity: 1; font-size: inherit;
}
.ann-stack .ann-tools button:hover:not(:disabled) { background: var(--state-hover, rgba(0, 0, 0, .06)); color: var(--foreground); }
.ann-stack .ann-tools button:disabled { opacity: .35; cursor: default; }
.ann-stack .ann-tools button:focus-visible, .ann-stack .ann-btn:focus-visible, .ann-fab-btn:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; }
.ann-stack .ann-tools .ann-svg { inline-size: 16px; block-size: 16px; }

/* ── کادرِ زیرِ هدر ── */
.ann-stack--bar { padding: var(--space-3) var(--space-4) 0; }
.ann-stack--bar + * { margin-block-start: 0; }

/* ── بالنِ پایینِ صفحه ── */
.ann-stack--balloon {
    position: fixed; z-index: var(--z-toast, 1200);
    inset-inline: var(--space-4); inset-block-end: calc(var(--space-4) + env(safe-area-inset-bottom, 0px));
    max-inline-size: 560px; margin-inline: auto;
}
body:has(.bottom-nav) .ann-stack--balloon { inset-block-end: calc(80px + env(safe-area-inset-bottom, 0px)); }
.ann-stack--balloon .ann-banner,
.ann-stack--fab .ann-banner,
.ann-stack--modal .ann-banner { background: var(--card); box-shadow: var(--shadow-lg); }
.ann-stack--balloon .ann-banner { animation-name: ann-up; }
@keyframes ann-up { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

/* ── دکمهٔ گوشه ── */
.ann-fab {
    position: fixed; z-index: var(--z-toast, 1200);
    inset-inline-end: var(--space-4); inset-block-end: calc(var(--space-4) + env(safe-area-inset-bottom, 0px));
    display: flex; flex-direction: column; align-items: flex-end; gap: var(--space-2);
}
body:has(.bottom-nav) .ann-fab { inset-block-end: calc(80px + env(safe-area-inset-bottom, 0px)); }
.ann-stack--fab { inline-size: min(340px, calc(100vw - 2 * var(--space-4))); }
.ann-fab-btn {
    position: relative; display: grid; place-items: center;
    inline-size: 50px; block-size: 50px; padding: 0; border: 0; border-radius: 50%;
    background: var(--primary); color: var(--primary-foreground);
    box-shadow: var(--shadow-lg); cursor: pointer;
}
.ann-fab-btn .ann-svg { inline-size: 22px; block-size: 22px; }
.ann-fab-count {
    position: absolute; inset-block-start: -3px; inset-inline-end: -3px;
    min-inline-size: 20px; block-size: 20px; padding: 0 5px; border-radius: 10px;
    border: 2px solid var(--card); background: var(--destructive); color: #fff;
    font-size: 11px; font-weight: 800; line-height: 16px;
}
.ann-fab .is-open .ann-fab-count { display: none; }
.ann-fab-card { display: flex; flex-direction: column; align-items: flex-end; gap: var(--space-2); }
/* حالتِ «آیکن و عنوان»: فقط آیکن + عنوان؛ کلیک = رفتن به لینک. */
.ann-fab-link {
    display: inline-flex; align-items: center; gap: var(--space-2);
    max-inline-size: min(280px, calc(100vw - 2 * var(--space-4))); block-size: 44px; padding-inline: 6px 14px;
    border-radius: var(--radius-pill, 999px); background: var(--card); color: var(--foreground);
    border: 1px solid color-mix(in srgb, var(--ann-color, var(--primary)) 35%, var(--border));
    box-shadow: var(--shadow-lg); text-decoration: none; font-size: 13px; font-weight: 700;
}
.ann-fab-link span:last-child { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ann-fab-link:hover { border-color: var(--ann-color, var(--primary)); }
.ann-fab-link:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; }
.ann-fab-link-ic { inline-size: 32px; block-size: 32px; flex-shrink: 0; border-radius: 50%; object-fit: cover; display: grid; place-items: center; background: var(--ann-color, var(--primary)); color: #fff; }
.ann-fab-link-ic .ann-svg { inline-size: 18px; block-size: 18px; }
/* پشته‌ی دکمه‌های گوشه (بالا→پایین): اطلاعیه، ویرایشِ صفحه، گزارش — روی هم نمی‌افتند. */
body:has(.sf-fab) .ann-fab { inset-block-end: calc(var(--fab-b, 16px) + 54px); }
body:has(#adminBar) .ann-fab { inset-block-end: calc(var(--fab-b, 16px) + 58px); }
body:has(#adminBar):has(.sf-fab) .ann-fab { inset-block-end: calc(var(--fab-b, 16px) + 112px); }

/* ── پنجرهٔ میانی ── */
.ann-modal {
    position: fixed; inset: 0; z-index: var(--z-modal, 1300);
    display: grid; place-items: center; padding: var(--space-4);
    background: color-mix(in srgb, var(--n-900, #0c1b30) 45%, transparent);
    animation: ann-fade var(--duration-base, .2s) ease-out;
}
@keyframes ann-fade { from { opacity: 0; } to { opacity: 1; } }
.ann-stack--modal { inline-size: min(460px, 100%); }
.ann-stack--modal .ann-banner { flex-wrap: wrap; padding: var(--space-5); border-inline-start-width: 1px; border-block-start: 4px solid var(--ann-color); }
.ann-stack--modal .ann-img img { max-block-size: 260px; }
html.ann-modal-open { overflow: hidden; }

@media (max-width: 600px) {
    .ann-stack--bar { padding-inline: var(--space-3); }
    .ann-stack .ann-banner { padding: var(--space-3); gap: var(--space-2); }
    .ann-stack .ann-ic { inline-size: 30px; block-size: 30px; }
}
@media (prefers-reduced-motion: reduce) {
    .ann-stack .ann-banner, .ann-modal { animation: none; }
}