/* wk-obavijesti.css - zvonce s obavijestima (uz wk-obavijesti.js).
   Izgled dolazi iz Universal Theme klasa (t-Region, t-MediaList, t-Alert, t-Button-badge);
   ovdje su samo pozicioniranje, animacije i sitne prilagodbe. */

/* zvonce: animacija kad stigne novi dokument */
.wk-ob-gumb.is-puls .t-Icon { animation: wk-ob-zvoni .9s ease-in-out 2; transform-origin: 50% 10%; }
@keyframes wk-ob-zvoni {
    0%, 100% { transform: rotate(0); }
    20% { transform: rotate(14deg); } 40% { transform: rotate(-12deg); }
    60% { transform: rotate(8deg); }  80% { transform: rotate(-4deg); }
}

/* padajuca regija ispod zvonca */
.t-Region.wk-ob-panel {
    position: fixed; z-index: 1000; width: 400px; max-width: calc(100vw - 16px); margin: 0;
    box-shadow: 0 8px 28px rgba(0, 0, 0, .18);
    opacity: 0; visibility: hidden; transform: translateY(-4px);
    transition: opacity .15s, transform .15s, visibility .15s;
}
.t-Region.wk-ob-panel.is-otvoren { opacity: 1; visibility: visible; transform: none; }
.wk-ob-panel .t-Region-body { padding: 0; max-height: 60vh; overflow-y: auto; }
.wk-ob-panel .t-Region-buttons--bottom { padding: 4px 8px; margin: 0; }
.wk-ob-panel .t-MediaList { border: 0; }
.wk-ob-panel .t-MediaList-title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wk-ob-panel .t-MediaList-body { min-width: 0; }
.wk-ob-panel .wk-ob-stavka.is-nova .t-MediaList-title { font-weight: 700; }
.wk-ob-panel .wk-ob-sve:disabled { opacity: .5; cursor: default; }

/* obavijest o novom dokumentu, dolje desno */
.wk-ob-toastovi {
    position: fixed; right: 16px; bottom: 16px; z-index: 1001;
    display: flex; flex-direction: column; gap: 8px; width: 420px; max-width: calc(100vw - 32px);
}
.t-Alert.wk-ob-toast {
    margin: 0; box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
    opacity: 0; transform: translateY(10px); transition: opacity .25s, transform .25s;
}
.t-Alert.wk-ob-toast.is-vidljiv { opacity: 1; transform: none; }
.wk-ob-toast .t-Alert-body { word-break: break-word; }
.wk-ob-toast .t-Alert-buttons { display: flex; align-items: center; gap: 4px; }

/* ---------- ISD Zahtjevi 101: raspored panela neovisan o temi aplikacije ----------
   Tema "ISD Redwood" daje Media Listi vlastite širine i margine, pa su stavke izlazile iz panela
   (rezan početak teksta, vodoravni klizač). Panel je zato fiksne širine, a stavka je flex redak koji se lomi. */
body.wk-hdr .t-Region.wk-ob-panel { width: 400px; max-width: calc(100vw - 16px); overflow: hidden; box-sizing: border-box; }
body.wk-hdr .wk-ob-panel .t-Region-bodyWrap,
body.wk-hdr .wk-ob-panel .t-Region-body { width: 100%; overflow-x: hidden; box-sizing: border-box; }
body.wk-hdr .wk-ob-panel .t-MediaList {
    display: block; width: 100%; margin: 0; padding: 0; list-style: none; column-count: auto; box-sizing: border-box;
}
body.wk-hdr .wk-ob-panel .t-MediaList-item {
    display: block; float: none; width: auto; max-width: none; margin: 0; padding: 0; flex: none;
}
body.wk-hdr .wk-ob-panel .t-MediaList-itemWrap {
    display: flex !important; align-items: flex-start; gap: 12px; width: 100%; min-width: 0; margin: 0;
    padding: 10px 16px; box-sizing: border-box; text-align: left; text-decoration: none; color: inherit;
}
body.wk-hdr .wk-ob-panel .t-MediaList-iconWrap { display: block; flex: 0 0 auto; margin: 2px 0 0; padding: 0; }
body.wk-hdr .wk-ob-panel .t-MediaList-body { flex: 1 1 auto; min-width: 0; margin: 0; padding: 0; overflow: hidden; }
body.wk-hdr .wk-ob-panel .t-MediaList-title {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    white-space: normal; overflow: hidden; text-overflow: ellipsis; overflow-wrap: anywhere; text-transform: none;
}
body.wk-hdr .wk-ob-panel .t-MediaList-desc { white-space: normal; overflow-wrap: anywhere; }
body.wk-hdr .wk-ob-panel .t-MediaList-badgeWrap { flex: 0 0 auto; align-self: center; margin: 0; }
