/**
 * Material Symbols Outlined — load font via includes/head_material_icons.php
 * Consistent icon sizing for VLRS UI
 */
.material-symbols-outlined {
  font-family: "Material Symbols Outlined";
  font-weight: normal;
  font-style: normal;
  font-size: 1.35rem;
  line-height: 1;
  display: inline-block;
  vertical-align: middle;
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
  -webkit-font-smoothing: antialiased;
  user-select: none;
}

.rs-ico-sm.material-symbols-outlined {
  font-size: 1.1rem;
}

.rs-ico-lg.material-symbols-outlined {
  font-size: 1.75rem;
}

/* Feature / card icon rings (landing) — expects rs-design-tokens :root */
.rs-feature-icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3.25rem;
  height: 3.25rem;
  border-radius: var(--rs-radius, 16px);
  background: linear-gradient(145deg, var(--rs-orange-soft, #fff7ed) 0%, var(--rs-orange-mid, #ffedd5) 100%);
  border: 1px solid var(--rs-orange-border, #fed7aa);
  color: var(--rs-orange, #ea580c);
  margin-bottom: 14px;
  box-shadow: var(--rs-shadow-sm, 0 2px 8px rgba(12, 10, 9, 0.06));
}

.rs-feature-icon-wrap .material-symbols-outlined {
  font-size: 1.5rem;
}

/* Buttons with leading icon */
.rs-btn-main,
.rs-btn-secondary {
  gap: 10px;
}

.rs-btn-main .material-symbols-outlined,
.rs-btn-secondary .material-symbols-outlined {
  font-size: 1.25rem;
}

/* Section title with optional icon */
.rs-section-title-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}

.rs-section-title-row .material-symbols-outlined {
  color: var(--rs-orange, #ea580c);
  font-size: 1.5rem;
}

/* Pills with leading dot icon */
.rs-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.rs-pill .material-symbols-outlined {
  font-size: 1rem;
  opacity: 0.85;
}
