/* =====================================================
   EMR ŞAHİN GROUP — Toast Notifications
   ===================================================== */

/* ── Container ── */
.toast-container {
  position: fixed;
  z-index: var(--z-toast);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  pointer-events: none;
  padding: var(--space-md);
}

/* Konum */
.toast-container.top-right    { top: 0; right: 0; align-items: flex-end; }
.toast-container.top-left     { top: 0; left: 0;  align-items: flex-start; }
.toast-container.top-center   { top: 0; left: 50%; transform: translateX(-50%); align-items: center; }
.toast-container.bottom-right { bottom: 0; right: 0; align-items: flex-end; flex-direction: column-reverse; }
.toast-container.bottom-left  { bottom: 0; left: 0;  align-items: flex-start; flex-direction: column-reverse; }
.toast-container.bottom-center{ bottom: 0; left: 50%; transform: translateX(-50%); align-items: center; flex-direction: column-reverse; }

/* ── Tek Toast ── */
.toast {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  box-shadow: var(--shadow-md), 0 0 0 1px rgba(255,255,255,0.03);
  min-width: 280px;
  max-width: 380px;
  pointer-events: all;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);

  /* Giriş animasyonu */
  animation: toast-in var(--transition-normal) cubic-bezier(0.34, 1.2, 0.64, 1) forwards;
}

.toast.removing {
  animation: toast-out var(--transition-normal) ease forwards;
}

/* Progress bar */
.toast::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  height: 3px;
  width: 100%;
  background: currentColor;
  opacity: 0.25;
  transform-origin: left;
  animation: toast-progress linear forwards;
}

/* ── İkon Alanı ── */
.toast-icon {
  font-size: 20px;
  flex-shrink: 0;
  margin-top: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ── İçerik ── */
.toast-content { flex: 1; min-width: 0; }

.toast-title {
  font-size: var(--font-size-sm);
  font-weight: 700;
  color: var(--color-text);
  line-height: 1.3;
  margin-bottom: 3px;
}

.toast-message {
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
  line-height: 1.5;
  word-break: break-word;
}

/* ── Kapat ── */
.toast-close {
  flex-shrink: 0;
  background: none;
  border: none;
  color: var(--color-text-muted);
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  padding: 2px;
  border-radius: var(--radius-sm);
  transition: color var(--transition-fast), background var(--transition-fast);
  opacity: 0.6;
  display: flex;
  align-items: center;
  justify-content: center;
}
.toast-close:hover {
  opacity: 1;
  background: rgba(255,255,255,0.08);
  color: var(--color-text);
}

/* ── Renk Temaları ── */
.toast-success {
  border-color: rgba(34, 197, 94, 0.25);
  background: linear-gradient(135deg,
    rgba(34,197,94,0.1),
    var(--color-surface));
}
.toast-success .toast-icon { color: #4ADE80; }
.toast-success::after { background: #4ADE80; }

.toast-error {
  border-color: rgba(239, 68, 68, 0.25);
  background: linear-gradient(135deg,
    rgba(239,68,68,0.1),
    var(--color-surface));
}
.toast-error .toast-icon { color: #F87171; }
.toast-error::after { background: #F87171; }

.toast-warning {
  border-color: rgba(245, 158, 11, 0.25);
  background: linear-gradient(135deg,
    rgba(245,158,11,0.1),
    var(--color-surface));
}
.toast-warning .toast-icon { color: #FCD34D; }
.toast-warning::after { background: #FCD34D; }

.toast-info {
  border-color: rgba(59, 130, 246, 0.25);
  background: linear-gradient(135deg,
    rgba(59,130,246,0.1),
    var(--color-surface));
}
.toast-info .toast-icon { color: #60A5FA; }
.toast-info::after { background: #60A5FA; }

.toast-default {
  border-color: rgba(108, 99, 255, 0.25);
  background: linear-gradient(135deg,
    rgba(108,99,255,0.08),
    var(--color-surface));
}
.toast-default .toast-icon { color: var(--color-primary-light); }
.toast-default::after { background: var(--color-primary-light); }

/* ── Animasyonlar ── */
@keyframes toast-in {
  from { opacity: 0; transform: translateX(40px) scale(0.92); }
  to   { opacity: 1; transform: translateX(0)    scale(1); }
}

@keyframes toast-out {
  from { opacity: 1; transform: translateX(0)    scale(1); max-height: 200px; margin-bottom: 0; }
  to   { opacity: 0; transform: translateX(40px) scale(0.92); max-height: 0; margin-bottom: -8px; padding-top: 0; padding-bottom: 0; }
}

@keyframes toast-progress {
  from { transform: scaleX(1); }
  to   { transform: scaleX(0); }
}

/* Left taraftan gelme */
.toast-container.top-left .toast,
.toast-container.bottom-left .toast {
  animation-name: toast-in-left;
}
.toast-container.top-left .toast.removing,
.toast-container.bottom-left .toast.removing {
  animation-name: toast-out-left;
}

@keyframes toast-in-left {
  from { opacity: 0; transform: translateX(-40px) scale(0.92); }
  to   { opacity: 1; transform: translateX(0) scale(1); }
}
@keyframes toast-out-left {
  from { opacity: 1; transform: translateX(0) scale(1); max-height: 200px; }
  to   { opacity: 0; transform: translateX(-40px) scale(0.92); max-height: 0; padding-top: 0; padding-bottom: 0; }
}

/* Yukarıdan gelme */
.toast-container.top-center .toast {
  animation-name: toast-in-top;
}
.toast-container.top-center .toast.removing {
  animation-name: toast-out-top;
}
@keyframes toast-in-top {
  from { opacity: 0; transform: translateY(-20px) scale(0.95); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes toast-out-top {
  from { opacity: 1; transform: translateY(0) scale(1); max-height: 200px; }
  to   { opacity: 0; transform: translateY(-20px) scale(0.95); max-height: 0; padding-top: 0; padding-bottom: 0; }
}
