/* ==========================================================================
   E-deal 2025 Design System - Alerts
   Source: Figma "Design system | E-deal 2025" section 1163:19925
   Tokens: tokens-figma.css
   ========================================================================== */

/* ── Alert / Banner - Base ────────────────────────────────────────────── */
/* Figma: Alert / Banner (1172:20176) */

.ed-alert {
  display: flex;
  align-items: center;
  width: 100%;
}

.ed-alert__content {
  display: flex;
  flex: 1 0 0;
  gap: var(--space-2);                       /* 8px */
  align-items: center;
  padding: var(--space-1) 0 var(--space-1) var(--space-4); /* 4px 0 4px 16px */
  min-height: 1px;
  min-width: 1px;
}

.ed-alert__icon-text {
  display: flex;
  flex: 1 0 0;
  gap: var(--space-2);                       /* 8px */
  align-items: center;
  min-height: 1px;
  min-width: 1px;
}

.ed-alert__icon {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  font-family: var(--font-family-icon);
  font-size: var(--icon-size-md);            /* 16px */
  font-weight: 900;                          /* FA Solid */
  text-align: center;
}

.ed-alert__text {
  font-family: var(--font-family-main);
  font-weight: var(--font-weight-medium);    /* 500 */
  font-size: var(--text-size-p1);            /* 16px */
  line-height: var(--line-height-normal);    /* 24px */
  white-space: nowrap;
}

.ed-alert__actions {
  display: flex;
  gap: var(--space-2);                       /* 8px */
  align-items: center;
  flex-shrink: 0;
}

/* Action button inside alert (tertiary style) */
.ed-alert__action-btn {
  display: flex;
  height: 38px;
  align-items: center;
  justify-content: center;
  padding: var(--space-3) var(--space-4);    /* 12px 16px */
  border-radius: var(--radius-md);
  background: transparent;
  border: none;
  font-family: var(--font-family-main);
  font-weight: var(--font-weight-medium);
  font-size: var(--text-size-p2);            /* 14px */
  line-height: var(--line-height-snug);
  color: var(--color-text);                  /* #092642 */
  cursor: pointer;
}

.ed-alert__action-btn:hover {
  background-color: rgba(0, 0, 0, 0.05);
}

/* Close button */
.ed-alert__close {
  display: flex;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  padding: var(--space-3);
  border-radius: var(--radius-md);
  background: transparent;
  border: none;
  cursor: pointer;
}

.ed-alert__close-icon {
  font-family: var(--font-family-icon);
  font-size: var(--icon-size-md);
  font-weight: 400;                          /* FA Regular */
  color: var(--color-gray-900);              /* #092642 */
}

/* ── Warning variant ──────────────────────────────────────────────────── */
/* Figma: Type=Warning (1163:19952) */

.ed-alert--warning .ed-alert__content {
  background-color: var(--color-warning-100); /* #FFF6EB */
}

.ed-alert--warning .ed-alert__icon {
  color: #A95A00;                            /* warning-700 variant */
}

.ed-alert--warning .ed-alert__text {
  color: #A95A00;
}

/* ── Error variant ────────────────────────────────────────────────────── */
/* Figma: Type=Error (1172:20175) */

.ed-alert--error .ed-alert__content {
  background-color: var(--color-error-100);  /* #FAEBEF */
}

.ed-alert--error .ed-alert__icon {
  color: var(--color-error-700);
}

.ed-alert--error .ed-alert__text {
  color: var(--color-error-700);
}

/* ── Informative variant ──────────────────────────────────────────────── */
/* Figma: Type=Informative (1172:20145) */

.ed-alert--info .ed-alert__content {
  background-color: var(--color-blue-100);   /* #F2F6FA */
}

.ed-alert--info .ed-alert__icon {
  color: var(--color-blue-700);              /* #1C72BD */
}

.ed-alert--info .ed-alert__text {
  color: var(--color-blue-700);
}

/* ── Success variant (inferred from token system) ─────────────────────── */

.ed-alert--success .ed-alert__content {
  background-color: var(--color-success-100); /* #EBF7F3 */
}

.ed-alert--success .ed-alert__icon {
  color: var(--color-success-700);           /* #178A61 */
}

.ed-alert--success .ed-alert__text {
  color: var(--color-success-700);
}