/* =========================================================================
   notify.css — ნოტიფიკაციების სისტემა (Setnotif)
   პოზიციის შესაცვლელად: --nt-top / --nt-left (ცენტრიდან მარცხნივ/მარჯვნივ გასწორება)
   ========================================================================= */
#nt-root {
  --nt-top: 24px;
  --nt-width: 340px;
  position: fixed; top: var(--nt-top); left: 50%; transform: translateX(-50%);
  width: var(--nt-width); max-width: calc(100vw - 24px);
  display: flex; flex-direction: column; gap: 10px;
  z-index: 25000; pointer-events: none;
}

.nt {
  --c: #4da3ff;                                  /* აქცენტის ფერი */
  --cg: rgba(77, 163, 255, .35);                 /* მბზინავი ჩრდილი */
  position: relative; display: flex; align-items: center; gap: 12px;
  padding: 12px 16px 14px 12px; overflow: hidden;
  border-radius: 12px; border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(135deg, rgba(20,22,30,.92), rgba(12,13,18,.92));
  box-shadow: 0 10px 30px rgba(0,0,0,.45), 0 0 22px var(--cg);
  backdrop-filter: blur(6px);
  font-family: 'Noto Sans Georgian', 'Manrope', sans-serif; color: #fff;
  animation: ntIn .45s cubic-bezier(.2,1.2,.4,1) both;
}
.nt::before {                                    /* მარცხენა ფერადი ზოლი */
  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--c);
  box-shadow: 0 0 14px var(--c);
}
.nt.t1 { --c: #38d977; --cg: rgba(56, 217, 119, .32); }   /* წარმატება */
.nt.t2 { --c: #ff4d5e; --cg: rgba(255, 77, 94, .34); }    /* შეცდომა */
.nt.t2 { animation: ntIn .45s cubic-bezier(.2,1.2,.4,1) both, ntShake .45s .3s ease-in-out; }

.nt-ic {
  flex: 0 0 38px; width: 38px; height: 38px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--c) 18%, transparent);
  border: 1px solid color-mix(in srgb, var(--c) 55%, transparent);
  color: var(--c);
}
.nt-ic svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.nt.t1 .nt-ic svg path { stroke-dasharray: 26; stroke-dashoffset: 26; animation: ntDraw .5s .25s ease-out forwards; }
.nt.t0 .nt-ic { animation: ntPulse 1.6s .4s ease-in-out 2; }

.nt-body { min-width: 0; flex: 1; }
.nt-title { font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--c); }
.nt-text  { margin-top: 2px; font-size: 14px; font-weight: 600; line-height: 1.35; color: rgba(255,255,255,.94); word-wrap: break-word; }

.nt-bar { position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: var(--c); opacity: .85;
          transform-origin: left; animation: ntBar var(--dur, 5s) linear forwards; }

.nt.out { animation: ntOut .35s ease-in forwards; }

@keyframes ntIn    { from { opacity: 0; transform: translateY(-24px) scale(.94); } to { opacity: 1; transform: none; } }
@keyframes ntOut   { to { opacity: 0; transform: translateY(-16px) scale(.96); } }
@keyframes ntBar   { to { transform: scaleX(0); } }
@keyframes ntDraw  { to { stroke-dashoffset: 0; } }
@keyframes ntPulse { 50% { box-shadow: 0 0 0 7px transparent, 0 0 16px var(--cg); transform: scale(1.08); } }
@keyframes ntShake { 20%,60% { transform: translateX(-5px); } 40%,80% { transform: translateX(5px); } }
