/*
Theme Name: Twenty Twenty-Five Child
Template: twentytwentyfive
Version: 1.0
*/
@import url('../twentytwentyfive/style.css');
.call-zalo-fixed {
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: row;
  gap: 20px;
  z-index: 9999;
  font-family: sans-serif;
}

.call-zalo-fixed a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-radius: 50px;
  color: #fff;
  font-size: 15px;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
  animation: pulse 1.5s infinite;
  white-space: nowrap;
}

.call-zalo-fixed .hotline {
  background-color: #e53935;
}

.call-zalo-fixed .zalo {
  background-color: #0084ff;
}

.call-zalo-fixed img {
  width: 24px;
  height: 24px;
  object-fit: contain;
}

@keyframes pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.1); }
  100% { transform: scale(1); }
}

/* Desktop: đặt bên phải */
@media (min-width: 1025px) {
  .call-zalo-fixed {
    left: auto;
    right: 20px;
    transform: none;
  }
}
/* --- CSS cho Icon SVG Inline (Giữ nguyên như cũ) --- */
.inline-svg-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: bottom;
    margin-right: 0.2em;
}

.inline-svg-icon svg {
    width: 1.2em;
    height: 1.2em;
    stroke: currentColor; 
}

/* === CÁC LỚP MÀU TÙY CHỈNH MỚI === */

/* Lớp màu xanh dương */
.icon-mau-xanh-duong svg {
    stroke: #0073e6; /* Mã màu xanh dương */
}

/* Lớp màu xanh lá cây */
.icon-mau-xanh-la svg {
    stroke: #28a745; /* Mã màu xanh lá cây */
}

/* Lớp màu vàng */
.icon-mau-vang svg {
    stroke: #fffffff; /* Mã màu vàng */
    fill: #fcc100;   /* Bạn cũng có thể thêm màu nền (fill) cho icon nếu muốn */
}

/* Lớp màu đỏ */
.icon-mau-do svg {
    stroke: #dc3545; /* Mã màu đỏ */
}

/* Bạn có thể tạo bao nhiêu lớp màu tùy thích */