/* ── URLang Announcements Frontend CSS ─────────────────────── */

/* Base */
.urlang-ann { box-sizing:border-box; font-family:inherit; z-index:99990; }
.urlang-ann__inner { display:flex; align-items:center; gap:14px; padding:12px 16px; flex-wrap:wrap; }
.urlang-ann__content { flex:1; min-width:0; font-size:14px; line-height:1.5; }
.urlang-ann__content p { margin:0; }
.urlang-ann__btn { display:inline-block; padding:7px 18px; border-radius:5px; font-size:13px; font-weight:600; text-decoration:none; white-space:nowrap; transition:opacity .2s; }
.urlang-ann__btn:hover { opacity:.85; }
.urlang-ann__close { background:none; border:none; cursor:pointer; font-size:20px; line-height:1; padding:4px 8px; opacity:.7; color:inherit; flex-shrink:0; }
.urlang-ann__close:hover { opacity:1; }

/* Banner (top / bottom) */
.urlang-ann--banner { position:fixed; left:0; right:0; width:100%; animation:urlang-slidein .35s ease; }
.urlang-ann--banner.urlang-ann--top    { top:32px; } /* below WP admin bar */
.urlang-ann--banner.urlang-ann--bottom { bottom:0; top:auto; }
body.admin-bar .urlang-ann--banner.urlang-ann--top { top:32px; }
@media(max-width:782px) { body.admin-bar .urlang-ann--banner.urlang-ann--top { top:46px; } }

/* Popup (modal) */
.urlang-ann--popup { position:fixed; inset:0; display:flex; align-items:center; justify-content:center; z-index:99995; }
.urlang-ann--popup::before { content:''; position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:-1; }
.urlang-ann--popup .urlang-ann__inner { max-width:520px; width:90vw; border-radius:12px; flex-direction:column; align-items:flex-start; padding:28px 28px 22px; position:relative; box-shadow:0 8px 40px rgba(0,0,0,.3); animation:urlang-popin .3s cubic-bezier(.34,1.56,.64,1); }
.urlang-ann--popup .urlang-ann__close { position:absolute; top:12px; right:12px; font-size:22px; }

/* Ticker (laufschrift) */
.urlang-ann--ticker { position:fixed; left:0; right:0; overflow:hidden; white-space:nowrap; padding:10px 0; }
.urlang-ann--ticker.urlang-ann--top    { top:32px; }
.urlang-ann--ticker.urlang-ann--bottom { bottom:0; }
.urlang-ann--ticker .urlang-ann__inner { display:inline-flex; animation:urlang-ticker 22s linear infinite; padding:0 16px; }
.urlang-ann--ticker:hover .urlang-ann__inner { animation-play-state:paused; }
.urlang-ann--ticker .urlang-ann__close { position:absolute; right:8px; top:50%; transform:translateY(-50%); }
@keyframes urlang-ticker { from{transform:translateX(100vw)} to{transform:translateX(-100%)} }

/* Toast (corner) */
.urlang-ann--toast { position:fixed; max-width:360px; border-radius:10px; box-shadow:0 4px 20px rgba(0,0,0,.2); animation:urlang-slidein-right .35s ease; }
.urlang-ann--toast.urlang-ann--top-right    { top:48px;    right:16px; }
.urlang-ann--toast.urlang-ann--bottom-right { bottom:16px; right:16px; }
.urlang-ann--toast.urlang-ann--bottom-left  { bottom:16px; left:16px; }
.urlang-ann--toast.urlang-ann--top-left     { top:48px;    left:16px; }
.urlang-ann--toast .urlang-ann__inner { flex-direction:column; align-items:flex-start; border-radius:10px; padding:16px 42px 16px 16px; }
.urlang-ann--toast .urlang-ann__close { position:absolute; top:8px; right:8px; }

/* Card (inline — via shortcode/widget) */
.urlang-ann--card { position:relative; border-radius:10px; margin:16px 0; }
.urlang-ann--card .urlang-ann__inner { border-radius:10px; }

/* Preview mode (editor) */
.urlang-ann--preview-mode { position:relative !important; inset:auto !important; animation:none !important; border-radius:6px; margin-bottom:8px; }
.urlang-ann--preview-mode::before { display:none !important; }

/* Animations */
@keyframes urlang-slidein { from{transform:translateY(-100%)} to{transform:translateY(0)} }
@keyframes urlang-slidein-right { from{transform:translateX(120%)} to{transform:translateX(0)} }
@keyframes urlang-popin { from{transform:scale(.85);opacity:0} to{transform:scale(1);opacity:1} }

/* Closing */
.urlang-ann--closing { animation:urlang-slideout .3s ease forwards !important; }
.urlang-ann--popup.urlang-ann--closing { animation:urlang-fadeout .25s ease forwards !important; }
@keyframes urlang-slideout { to{transform:translateY(-120%);opacity:0} }
@keyframes urlang-fadeout  { to{opacity:0;transform:scale(.9)} }