/* TOP SITE IPTV — SVG icon system (light theme) */
.card-icon,
.trust-icon,
.tag-icon {
  --icon-size: 26px;
  flex-shrink: 0;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  font-size: 0;
  line-height: 0;
  color: transparent;
  overflow: hidden;
}

.card-icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  margin-bottom: 1.25rem;
  background: linear-gradient(145deg, #012169 0%, #1d4ed8 52%, #c8102e 130%);
  box-shadow: 0 6px 18px rgba(1, 33, 105, 0.24);
}

.card-icon::before,
.trust-icon::before,
.tag-icon::before {
  content: "";
  width: var(--icon-size);
  height: var(--icon-size);
  background: #ffffff;
  mask: var(--icon-mask) center / contain no-repeat;
  -webkit-mask: var(--icon-mask) center / contain no-repeat;
}

.trust-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  margin: 0 auto 0.5rem;
  --icon-size: 22px;
  background: linear-gradient(145deg, #012169, #3d6fbe);
  box-shadow: 0 4px 14px rgba(1, 33, 105, 0.18);
}

.tag-icon {
  width: 18px;
  height: 18px;
  --icon-size: 14px;
  border-radius: 6px;
  background: linear-gradient(145deg, #012169, #3d6fbe);
  box-shadow: 0 2px 6px rgba(1, 33, 105, 0.15);
  vertical-align: middle;
  margin-right: 0.35rem;
}

.hero-sport-tags span {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.price-flash {
  gap: 0.35rem;
  display: inline-flex;
  align-items: center;
}
.price-flash::before {
  content: "";
  width: 14px;
  height: 14px;
  background: currentColor;
  mask: var(--icon-mask-gift) center / contain no-repeat;
  -webkit-mask: var(--icon-mask-gift) center / contain no-repeat;
  flex-shrink: 0;
}

:root {
  --icon-mask-shield: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2l8 4v6c0 5.2-3.6 9.4-8 10.4C7.6 21.4 4 17.2 4 12V6l8-4z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E");
  --icon-mask-tv: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='14' rx='2'/%3E%3Cpath d='M8 21h8M12 19v2'/%3E%3Cpath d='M7 10h4v4H7z' fill='%23000' stroke='none'/%3E%3C/svg%3E");
  --icon-mask-sport: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 3c2 3 2 15 0 18M3 12h18M5 7c4 2 10 2 14 0M5 17c4-2 10-2 14 0'/%3E%3C/svg%3E");
  --icon-mask-devices: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='14' height='12' rx='1.5'/%3E%3Crect x='16' y='8' width='6' height='10' rx='1.5'/%3E%3Cpath d='M6 20h6'/%3E%3C/svg%3E");
  --icon-mask-boxing: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10c0-2 1.5-4 5-4s5 2 5 4v2c0 3-2 5-5 5s-5-2-5-5v-2z'/%3E%3Cpath d='M9 8V6M15 8V6M8 14h8'/%3E%3C/svg%3E");
  --icon-mask-racing: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 16h14l-1.5-4.5H8L5 16z'/%3E%3Ccircle cx='7.5' cy='17.5' r='1.5'/%3E%3Ccircle cx='16.5' cy='17.5' r='1.5'/%3E%3Cpath d='M3 16h2M19 16h2M9 11V8h6v3'/%3E%3C/svg%3E");
  --icon-mask-film: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M7 5v14M17 5v14M3 10h4M17 10h4M3 14h4M17 14h4'/%3E%3C/svg%3E");
  --icon-mask-lock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 118 0v3'/%3E%3C/svg%3E");
  --icon-mask-bolt: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2L4 14h7l-1 8 9-12h-7l1-8z'/%3E%3C/svg%3E");
  --icon-mask-firestick: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='9' width='14' height='6' rx='2'/%3E%3Cpath d='M18 11v2h3l-1.5-2H18z'/%3E%3Cpath d='M12 10.5c1.2 1.5 1.2 3.5 0 5-1.2-1.5-1.2-3.5 0-5z' fill='%23000' stroke='none'/%3E%3C/svg%3E");
  --icon-mask-laptop: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='12' rx='1.5'/%3E%3Cpath d='M2 19h20'/%3E%3C/svg%3E");
  --icon-mask-phone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='7' y='2' width='10' height='20' rx='2'/%3E%3Cpath d='M11 18h2'/%3E%3C/svg%3E");
  --icon-mask-gift: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='13' rx='1'/%3E%3Cpath d='M12 8v13M3 12h18M12 8c-2 0-3-1-3-2.5S10 3 12 5c2-2 3-1.5 3-2.5S14 3 12 3'/%3E%3C/svg%3E");
  --icon-mask-star: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M12 2l2.9 6.9 7.4.6-5.6 4.9 1.7 7.2L12 18.8 7.6 21.6l1.7-7.2L3.7 9.5l7.4-.6L12 2z'/%3E%3C/svg%3E");
  --icon-mask-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
  --icon-mask-trophy: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 21h8M12 17v4M7 4h10v5a5 5 0 01-10 0V4zM5 5H3v1a3 3 0 003 3M19 5h2v1a3 3 0 01-3 3'/%3E%3C/svg%3E");
  --icon-mask-rugby: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='12' rx='9' ry='6' transform='rotate(-30 12 12)'/%3E%3Cpath d='M7 9l10 6M9 7l6 10'/%3E%3C/svg%3E");
  --icon-mask-ppv: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M10 8l6 4-6 4V8z' fill='%23000' stroke='none'/%3E%3C/svg%3E");
}

.icon-shield::before { --icon-mask: var(--icon-mask-shield); }
.icon-tv::before { --icon-mask: var(--icon-mask-tv); }
.icon-sport::before { --icon-mask: var(--icon-mask-sport); }
.icon-devices::before { --icon-mask: var(--icon-mask-devices); }
.icon-boxing::before { --icon-mask: var(--icon-mask-boxing); }
.icon-racing::before { --icon-mask: var(--icon-mask-racing); }
.icon-film::before { --icon-mask: var(--icon-mask-film); }
.icon-lock::before { --icon-mask: var(--icon-mask-lock); }
.icon-bolt::before { --icon-mask: var(--icon-mask-bolt); }
.icon-gift::before { --icon-mask: var(--icon-mask-gift); }
.icon-check::before { --icon-mask: var(--icon-mask-check); }
.icon-trophy::before { --icon-mask: var(--icon-mask-trophy); }
.icon-rugby::before { --icon-mask: var(--icon-mask-rugby); }
.icon-ppv::before { --icon-mask: var(--icon-mask-ppv); }

.trust-icon-shield::before { --icon-mask: var(--icon-mask-shield); }
.trust-icon-bolt::before { --icon-mask: var(--icon-mask-bolt); }
.trust-icon-lock::before { --icon-mask: var(--icon-mask-lock); }
.trust-icon-check::before { --icon-mask: var(--icon-mask-check); }

.tag-football::before { --icon-mask: var(--icon-mask-sport); }
.tag-trophy::before { --icon-mask: var(--icon-mask-trophy); }
.tag-boxing::before { --icon-mask: var(--icon-mask-boxing); }
.tag-racing::before { --icon-mask: var(--icon-mask-racing); }
.tag-rugby::before { --icon-mask: var(--icon-mask-rugby); }
.tag-ppv::before { --icon-mask: var(--icon-mask-ppv); }

/* Device grid — SVG injected by main.js */
.device-item .icon:empty,
.device-item .device-icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 0.75rem;
  border-radius: 14px;
  background: linear-gradient(145deg, #012169 0%, #1d4ed8 55%, #c8102e 130%);
  box-shadow: 0 6px 18px rgba(1, 33, 105, 0.22);
  display: flex;
  align-items: center;
  justify-content: center;
}
.device-item .device-icon svg {
  width: 32px;
  height: 32px;
  fill: #fff;
  color: #fff;
}
/* Fallback masks when SVG sprite does not load */
.device-item .device-icon.icon-tv:not(:has(svg))::before,
.device-item .device-icon.icon-firestick:not(:has(svg))::before,
.device-item .device-icon.icon-android:not(:has(svg))::before,
.device-item .device-icon.icon-apple:not(:has(svg))::before,
.device-item .device-icon.icon-pc:not(:has(svg))::before,
.device-item .device-icon.icon-mobile:not(:has(svg))::before {
  content: "";
  width: 32px;
  height: 32px;
  background: #fff;
  mask: var(--icon-mask-devices) center / contain no-repeat;
  -webkit-mask: var(--icon-mask-devices) center / contain no-repeat;
}
.device-item .device-icon.icon-tv:not(:has(svg))::before { --icon-mask: var(--icon-mask-tv); }
.device-item .device-icon.icon-firestick:not(:has(svg))::before { --icon-mask: var(--icon-mask-firestick); }
.device-item .device-icon.icon-android:not(:has(svg))::before { --icon-mask: var(--icon-mask-phone); }
.device-item .device-icon.icon-mobile:not(:has(svg))::before { --icon-mask: var(--icon-mask-phone); }
.device-item .device-icon.icon-apple:not(:has(svg))::before { --icon-mask: var(--icon-mask-phone); }
.device-item .device-icon.icon-pc:not(:has(svg))::before { --icon-mask: var(--icon-mask-laptop); }
.device-item .icon:empty::before {
  content: "";
  width: 28px;
  height: 28px;
  background: #fff;
  mask: var(--icon-mask-devices) center / contain no-repeat;
  -webkit-mask: var(--icon-mask-devices) center / contain no-repeat;
}

/* Contact page icons */
.contact-icon {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: linear-gradient(145deg, #012169, #3d6fbe);
  box-shadow: 0 4px 14px rgba(1, 33, 105, 0.18);
  font-size: 0;
}
.contact-icon::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: #fff;
  mask: var(--icon-mask) center / 22px 22px no-repeat;
  -webkit-mask: var(--icon-mask) center / 22px 22px no-repeat;
}
.contact-icon-wa { --icon-mask: var(--icon-mask-wa); }
.contact-icon-mail { --icon-mask: var(--icon-mask-mail); }
.contact-icon-info { --icon-mask: var(--icon-mask-check); }

:root {
  --icon-mask-wa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.435 9.884-9.884 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z'/%3E%3C/svg%3E");
  --icon-mask-mail: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='M22 6l-10 7L2 6'/%3E%3C/svg%3E");
}

/* Pricing trust row */
.pricing-trust-item .trust-icon-inline {
  width: 20px;
  height: 20px;
  border-radius: 6px;
  --icon-size: 12px;
  display: inline-flex;
  vertical-align: middle;
  margin-right: 0.35rem;
  background: linear-gradient(145deg, #012169, #3d6fbe);
}
.pricing-trust-item .trust-icon-inline::before {
  content: "";
  width: var(--icon-size);
  height: var(--icon-size);
  background: #fff;
  mask: var(--icon-mask-check) center / contain no-repeat;
  -webkit-mask: var(--icon-mask-check) center / contain no-repeat;
}

/* Stars + euro via CSS (encoding-safe) */
.review-stars:empty,
.review-stars:not(:empty) {
  font-size: 0;
  letter-spacing: 0;
  min-height: 1.1rem;
}
.review-stars::before {
  content: "★★★★★";
  font-size: 1rem;
  letter-spacing: 3px;
  color: #c8102e;
  background: none;
  -webkit-text-fill-color: #c8102e;
}
.price-currency:empty,
.price-currency {
  font-size: 0;
  line-height: 1;
  min-width: 0.85em;
  display: inline-block;
}
.price-currency::after {
  content: "€";
  font-family: "Outfit", system-ui, sans-serif;
  font-size: 1.65rem;
  font-weight: 800;
  background: linear-gradient(135deg, #012169, #c8102e);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
