/* =====================================================
   WhatsApp SVG Icons Styling
   ===================================================== */

.wa-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1em;
  height: 1em;
  flex-shrink: 0;
}

.wa-icon svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* Composer Icons */
.wa-composer-icon {
  width: 20px;
  height: 20px;
  color: inherit;
}

.wa-composer-icon svg {
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Header Icons */
.wa-header-icon {
  width: 18px;
  height: 18px;
  color: inherit;
}

.wa-header-icon svg {
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Theme Toggle Icon */
.wa-theme-toggle-icon {
  width: 18px;
  height: 18px;
  color: inherit;
}

.wa-theme-toggle-icon svg {
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Delivery Status Icons */
.wa-delivery-icon {
  width: 12px;
  height: 12px;
  color: inherit;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.wa-delivery-icon svg {
  width: 100%;
  height: 100%;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.wa-delivery-icon.read svg {
  color: #0088CC;
}

/* Icon Animation */
@keyframes waIconSpin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.wa-icon.spinning {
  animation: waIconSpin 1s linear infinite;
}

/* Sidebar Actions Container */
.wa-sidebar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Responsive */
@media (max-width: 640px) {
  .wa-composer-icon,
  .wa-header-icon,
  .wa-theme-toggle-icon {
    width: 16px;
    height: 16px;
  }
}