/* ==========================================================================
   Irroba v2 — camada nova do tema
   Tudo aqui usa o prefixo "ir-" para não colidir com o style.css antigo.
   As páginas são migradas uma a uma; ao final, o CSS antigo é removido.
   ========================================================================== */

:root {
  /* Marca */
  --ir-red: #E30005;          /* botões, ícones, início do degradê */
  --ir-red-text: #B30004;     /* texto e links em vermelho (7.2:1 no branco) */
  --ir-carmine: #9E0004;
  --ir-wine: #2A0A0E;
  --ir-red-50: #FDECEB;
  --ir-red-100: #FBD6D4;
  --ir-red-200: #F5C6C4;
  --ir-gradient: linear-gradient(135deg, var(--ir-red) 0%, var(--ir-carmine) 45%, var(--ir-wine) 100%);

  /* Neutros */
  --ir-ink: #16161D;          /* títulos (18:1) */
  --ir-ink-2: #4A4A57;        /* texto secundário (8.7:1) */
  --ir-line: #E6E6EA;
  --ir-bg: #F5F5F7;
  --ir-surface: #FFFFFF;

  /* Tipografia */
  --ir-font-heading: "Montserrat", system-ui, sans-serif;
  --ir-font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Forma e profundidade */
  --ir-radius: 12px;
  --ir-radius-lg: 20px;
  --ir-shadow-sm: 0 1px 2px rgba(20, 20, 30, .06), 0 6px 18px rgba(20, 20, 30, .07);
  --ir-shadow-red: 0 2px 4px rgba(227, 0, 5, .06), 0 12px 28px rgba(227, 0, 5, .12);
  --ir-shadow-search: 0 12px 32px rgba(0, 0, 0, .28);

  /* Layout */
  --ir-container: 1200px;
  --ir-gutter: clamp(16px, 4vw, 32px);
  --ir-ease: .18s ease;
}

/* ---------------------------------------------------------------- utilidades */
.ir-sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0);
  white-space: nowrap; border: 0;
}

.ir-container {
  width: 100%;
  max-width: var(--ir-container);
  margin: 0 auto;
  padding: 0 var(--ir-gutter);
  box-sizing: border-box;
}

.ir-page,
.ir-page *,
.ir-footer,
.ir-footer * {
  box-sizing: border-box;
}

.ir-page :focus-visible,
.ir-footer :focus-visible {
  outline: 3px solid var(--ir-ink);
  outline-offset: 3px;
  border-radius: 6px;
}

.ir-on-dark :focus-visible {
  outline-color: #fff;
}

/* ------------------------------------------------------------------ página
   Páginas migradas são detectadas por body:has(.ir-page), sem depender de
   classes colocadas por script (evita o cabeçalho antigo "piscar"). */
body:has(.ir-page) {
  background: var(--ir-bg);
}

body:has(.ir-page) .global-header {
  display: none !important;
}

.ir-page {
  font-family: var(--ir-font-body);
  font-size: 16px;
  line-height: 1.6;
  color: var(--ir-ink);
  background: var(--ir-bg);
  -webkit-font-smoothing: antialiased;
}

/* O style.css antigo aplica fonte e margens em h1–h6 por seletor de elemento
   (Helvetica, normalize); esta regra precisa de especificidade maior para vencer. */
.ir-page :is(h1, h2, h3) {
  font-family: var(--ir-font-heading);
  margin: 0;
}

/* Resets com :where() têm especificidade zero: não sobrepõem os componentes abaixo. */
:where(.ir-page) :where(h1, h2, h3) {
  color: inherit;
  letter-spacing: -0.01em;
}

:where(.ir-page) p {
  margin: 0;
}

:where(.ir-page, .ir-footer) ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* ---------------------------------------------------------------- botões */
.ir-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 20px;
  border-radius: 999px;
  border: 1.5px solid transparent;
  font: 600 15px/1.2 var(--ir-font-body);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--ir-ease), color var(--ir-ease), border-color var(--ir-ease), box-shadow var(--ir-ease);
}

.ir-btn,
.ir-btn:visited,
.ir-btn:hover,
.ir-btn:focus {
  text-decoration: none;
}

.ir-btn--primary,
.ir-btn--primary:visited {
  background: var(--ir-red);
  color: #fff;
}

.ir-btn--primary:hover {
  background: #C40004;
  color: #fff;
}

.ir-btn--light,
.ir-btn--light:visited {
  background: #fff;
  color: var(--ir-red-text);
}

.ir-btn--light:hover {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

/* --------------------------------------------------------------- cabeçalho */
.ir-top {
  background: var(--ir-gradient);
  color: #fff;
}

.ir-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 76px;
}

.ir-header__logo {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

.ir-header__logo img {
  display: block;
  width: 110px;
  height: auto;
}

/* ------------------------------------------------------------------- hero */
.ir-hero {
  padding: clamp(24px, 5vw, 48px) 0 clamp(120px, 14vw, 150px);
}

.ir-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, .65fr);
  gap: 32px;
  align-items: center;
}

.ir-hero__title {
  font-size: clamp(30px, 4.4vw, 44px);
  font-weight: 700;
  line-height: 1.1;
  color: #fff;
}

.ir-hero__lead {
  margin-top: 12px;
  max-width: 520px;
  font-size: 17px;
  color: #fff;
}

.ir-hero__art {
  display: flex;
  justify-content: flex-end;
}

.ir-hero__art img {
  display: block;
  width: 100%;
  max-width: 320px;
  height: auto;
}

/* ------------------------------------------------------------------ busca */
.ir-search {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 28px;
  max-width: 600px;
  padding: 6px 6px 6px 16px;
  background: #fff;
  border-radius: 14px;
  box-shadow: var(--ir-shadow-search);
  position: relative;
}

.ir-search:focus-within {
  box-shadow: var(--ir-shadow-search), 0 0 0 3px #fff, 0 0 0 6px var(--ir-ink);
}

.ir-search__icon {
  flex: none;
  width: 20px;
  height: 20px;
  color: var(--ir-ink-2);
}

.ir-page .ir-search__input {
  flex: 1;
  min-width: 0;
  min-height: 44px;
  padding: 0 4px;
  border: 0;
  outline: 0;
  background: transparent;
  box-shadow: none;
  font: 400 16px var(--ir-font-body);
  color: var(--ir-ink);
  -webkit-appearance: none;
  appearance: none;
}

.ir-page .ir-search__input::placeholder {
  color: #6E6E7A; /* 4.9:1 no branco */
  opacity: 1;
}

.ir-page .ir-search__input:focus-visible {
  outline: 0; /* o anel fica no formulário inteiro (:focus-within) */
}

.ir-search__input::-webkit-search-cancel-button {
  display: none;
}

.ir-search__btn {
  flex: none;
  border-radius: 10px;
  padding: 10px 22px;
}

/* botão "limpar" criado pelo script.js do tema */
.ir-search .clear-button {
  display: none;
  flex: none;
  order: 2;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ir-ink-2);
  cursor: pointer;
}

.ir-search.search-has-value .clear-button {
  display: inline-flex;
}

.ir-search .clear-button:hover {
  background: var(--ir-bg);
}

.ir-search__btn {
  order: 3;
}

/* ---------------------------------------------------------------- atalhos */
.ir-quick {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  margin-top: 18px;
  font-size: 14px;
}

.ir-quick__label {
  color: #fff;
  font-weight: 500;
}

.ir-quick ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ir-quick a,
.ir-quick a:visited {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 6px 14px;
  border-radius: 999px;
  /* fundo vinho translúcido: branco sobre ele fica ≥ 7:1 em todo o degradê */
  background: rgba(42, 10, 14, .3);
  border: 1px solid rgba(255, 255, 255, .3);
  color: #fff;
  text-decoration: none;
  transition: background-color var(--ir-ease), border-color var(--ir-ease);
}

.ir-quick a:hover {
  background: rgba(42, 10, 14, .5);
  border-color: rgba(255, 255, 255, .6);
  color: #fff;
  text-decoration: none;
}

/* ---------------------------------------------------------------- seções */
.ir-section {
  padding: 56px 0 0;
}

.ir-section__head {
  margin-bottom: 20px;
}

.ir-section__title {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.25;
}

.ir-section__desc {
  margin-top: 4px;
  color: var(--ir-ink-2);
}

/* --------------------------------------------------------------- módulos */
.ir-modules {
  margin-top: calc(-1 * clamp(96px, 11vw, 116px));
  padding-top: 0;
}

.ir-modules .ir-section__title,
.ir-modules .ir-section__desc {
  color: #fff;
}

.ir-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.ir-mod,
.ir-mod:visited {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 20px;
  background: var(--ir-surface);
  border: 1px solid transparent;
  border-radius: var(--ir-radius);
  box-shadow: var(--ir-shadow-sm);
  color: var(--ir-ink);
  text-decoration: none;
  transition: transform var(--ir-ease), box-shadow var(--ir-ease), border-color var(--ir-ease), background-color var(--ir-ease);
}

.ir-mod:hover {
  transform: translateY(-3px);
  border-color: var(--ir-red-200);
  background: #FFFAFA;
  box-shadow: var(--ir-shadow-red);
  color: var(--ir-ink);
  text-decoration: none;
}

.ir-mod__icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin-bottom: 14px;
  border-radius: 12px;
  background: var(--ir-red-50);
  transition: background-color var(--ir-ease);
}

.ir-mod:hover .ir-mod__icon {
  background: var(--ir-red-100);
}

.ir-mod__icon img {
  display: block;
  width: 26px;
  height: 26px;
}

/* módulo novo sem ícone mapeado: mostra um marcador neutro */
.ir-mod__icon:not(:has(img))::before {
  content: "";
  width: 14px;
  height: 14px;
  border-radius: 4px;
  background: var(--ir-red);
}

.ir-mod__title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.35;
}

.ir-mod__arrow {
  flex: none;
  color: var(--ir-red-text);
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity var(--ir-ease), transform var(--ir-ease);
}

.ir-mod:hover .ir-mod__arrow,
.ir-mod:focus-visible .ir-mod__arrow {
  opacity: 1;
  transform: none;
}

.ir-mod__desc {
  margin-top: 6px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ir-ink-2);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ------------------------------------------------ destaques + recentes */
.ir-duo {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
  gap: 0 24px;
}

.ir-panel {
  background: var(--ir-surface);
  border-radius: var(--ir-radius);
  box-shadow: var(--ir-shadow-sm);
  padding: 4px 20px;
}

.ir-list li + li {
  border-top: 1px solid var(--ir-line);
}

.ir-list__link,
.ir-list__link:visited {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 52px;
  padding: 12px 0;
  color: var(--ir-ink);
  font-weight: 500;
  text-decoration: none;
}

.ir-list__link::after {
  content: "→";
  color: var(--ir-red-text);
  flex: none;
}

.ir-list__link:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Marcação gerada pelo helper {{recent_activity}} do Zendesk.
   O style.css antigo força essas propriedades com !important; por isso,
   só aqui (e sempre limitado a .ir-recent) usamos !important também. */
.ir-recent .recent-activity {
  background: var(--ir-surface);
  border-radius: var(--ir-radius);
  box-shadow: var(--ir-shadow-sm);
  padding: 4px 20px !important;
  margin: 0 !important;
}

.ir-recent .recent-activity-header {
  display: none !important; /* o título da seção já é o h2 da página */
}

.ir-recent .recent-activity-list {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ir-recent .recent-activity-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start;
  gap: 4px;
  margin: 0 !important;
  padding: 14px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ir-line) !important;
}

.ir-recent .recent-activity-item h3,
.ir-recent .recent-activity-item-parent,
.ir-recent .recent-activity-item-parent:visited {
  order: 1 !important;
  display: block !important;
  margin: 0 !important;
  font: 500 13px/24px var(--ir-font-body) !important; /* alvo de toque ≥ 24px (WCAG 2.2) */
  letter-spacing: 0;
  color: var(--ir-ink-2) !important;
  text-decoration: none !important;
}

.ir-recent .recent-activity-item-parent:hover {
  color: var(--ir-ink) !important;
  text-decoration: underline !important;
}

.ir-recent .recent-activity-item-link,
.ir-recent .recent-activity-item-link:visited {
  order: 2 !important;
  display: block !important;
  margin: 0 !important;
  font: 600 16px/1.5 var(--ir-font-body) !important;
  color: var(--ir-ink) !important;
  text-decoration: none !important;
}

.ir-recent .recent-activity-item-link:hover {
  color: var(--ir-red-text) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

.ir-recent .recent-activity-item-meta {
  order: 3 !important;
  align-self: flex-start !important;
  display: block !important;
  margin: 2px 0 0 !important;
  font-size: 13px !important;
  color: var(--ir-ink-2) !important;
}

.ir-recent .recent-activity-item-time {
  color: var(--ir-ink-2) !important;
}

.ir-recent .recent-activity-item-comment {
  display: none !important;
}

.ir-recent .recent-activity-controls {
  display: block !important;
  margin: 0 !important;
  padding: 8px 0 !important;
  text-align: left !important;
}

.ir-recent .recent-activity-controls a,
.ir-recent .recent-activity-controls a:visited {
  display: inline-flex !important;
  align-items: center;
  min-height: 44px;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  color: var(--ir-red-text) !important;
  font: 600 15px var(--ir-font-body) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
  text-transform: none !important;
}

/* ------------------------------------------------ topo das páginas internas */
.ir-inner-top {
  background: var(--ir-gradient);
  color: #fff;
  padding-bottom: 72px;
}

.ir-inner-nav {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 72px;
}

.ir-inner-nav .ir-header__logo img {
  width: 104px;
}

.ir-inner-nav .ir-btn {
  margin-left: auto;
}

.ir-mini-search {
  flex: 1;
  max-width: 520px;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 6px 0 12px;
  background: #fff;
  border-radius: 12px;
}

.ir-mini-search:focus-within {
  box-shadow: 0 0 0 3px var(--ir-wine), 0 0 0 5px #fff;
}

.ir-page .ir-mini-search input {
  flex: 1;
  min-width: 0;
  min-height: 42px;
  padding: 0;
  border: 0;
  outline: 0;
  background: none;
  box-shadow: none;
  font: 400 15px var(--ir-font-body);
  color: var(--ir-ink);
  -webkit-appearance: none;
  appearance: none;
}

.ir-page .ir-mini-search input::placeholder {
  color: #6E6E7A;
  opacity: 1;
}

.ir-page .ir-mini-search input:focus-visible {
  outline: 0;
}

.ir-mini-search input::-webkit-search-cancel-button {
  display: none;
}

.ir-mini-search .clear-button {
  display: none;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ir-ink-2);
  cursor: pointer;
}

.ir-mini-search.search-has-value .clear-button {
  display: inline-flex;
}

/* breadcrumb */
.ir-crumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 6px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
  font-size: 14px;
}

.ir-crumbs li + li::before {
  content: "›";
  margin-right: 6px;
  opacity: .85;
}

.ir-crumbs a,
.ir-crumbs a:visited {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ir-crumbs a:hover {
  color: #fff;
  text-decoration-thickness: 2px;
}

.ir-crumbs [aria-current] {
  color: #fff;
  font-weight: 600;
}

/* cabeçalho do módulo */
.ir-cat-head {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-top: 22px;
}

.ir-cat-head:focus {
  outline: 0;
}

.ir-cat-head__icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 60px;
  height: 60px;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .2);
}

.ir-cat-head__icon img {
  display: block;
  width: 34px;
  height: 34px;
}

.ir-cat-head__icon:not(:has(img))::before {
  content: "";
  width: 18px;
  height: 18px;
  border-radius: 5px;
  background: var(--ir-red);
}

.ir-cat-head__title {
  font-size: clamp(26px, 3.4vw, 36px);
  font-weight: 700;
  line-height: 1.15;
  color: #fff;
}

.ir-cat-head__desc {
  margin-top: 6px;
  max-width: 680px;
  font-size: 16px;
  color: #fff;
}

.ir-cat-head__meta {
  margin-top: 4px;
  font-size: 14px;
  color: #fff;
}

.ir-cat-head__meta:empty {
  display: none;
}

.ir-inner-body {
  margin-top: -44px;
}

/* --------------------------------------------- índice lateral + seções */
.ir-toc-layout {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

/* com menos de 3 seções o índice não ajuda: some e a lista ocupa a largura */
.ir-toc-layout:not(:has(.ir-seclist > section:nth-of-type(3))) {
  grid-template-columns: minmax(0, 1fr);
  max-width: 820px;
}

.ir-toc-layout:not(:has(.ir-seclist > section:nth-of-type(3))) :is(.ir-toc, .ir-toc-mobile) {
  display: none;
}

.ir-toc {
  position: sticky;
  top: 24px;
  max-height: calc(100vh - 48px);
  overflow: auto;
  padding: 16px 12px;
  background: var(--ir-surface);
  border-radius: var(--ir-radius);
  box-shadow: var(--ir-shadow-sm);
}

.ir-toc__title {
  margin: 0 8px 8px;
  font: 600 12px var(--ir-font-body);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ir-ink-2);
}

.ir-toc a,
.ir-toc a:visited {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 40px;
  padding: 6px 10px;
  border-radius: 8px;
  color: var(--ir-ink);
  font-size: 14px;
  line-height: 1.35;
  text-decoration: none;
}

.ir-toc a:hover {
  background: var(--ir-bg);
  color: var(--ir-ink);
  text-decoration: none;
}

.ir-toc a[aria-current="true"] {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
  font-weight: 600;
}

.ir-toc__count {
  flex: none;
  font-size: 12px;
  font-weight: 400;
  color: var(--ir-ink-2);
}

.ir-toc-mobile {
  display: none;
}

.ir-seclist {
  background: var(--ir-surface);
  border-radius: var(--ir-radius);
  box-shadow: var(--ir-shadow-sm);
}

.ir-seclist > section {
  padding: 22px 26px 12px;
  scroll-margin-top: 24px;
}

.ir-seclist > section + section {
  border-top: 1px solid var(--ir-line);
}

.ir-sec__title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--ir-ink);
}

.ir-sec__count {
  flex: none;
  font: 500 13px var(--ir-font-body);
  color: var(--ir-ink-2);
}

.ir-links {
  margin-top: 10px;
}

.ir-links li + li {
  border-top: 1px solid var(--ir-line);
}

.ir-links a,
.ir-links a:visited {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 44px;
  padding: 8px 0;
  color: var(--ir-ink);
  font-size: 15px;
  text-decoration: none;
}

.ir-links a::after {
  content: "→";
  flex: none;
  color: var(--ir-red-text);
  opacity: 0;
  transition: opacity var(--ir-ease);
}

.ir-links a:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ir-links a:hover::after,
.ir-links a:focus-visible::after {
  opacity: 1;
}

.ir-links__star {
  flex: none;
  width: 14px;
  height: 14px;
  margin-left: 6px;
  color: var(--ir-red);
  vertical-align: -1px;
}

.ir-more,
.ir-more:visited {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-top: 4px;
  color: var(--ir-red-text);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ir-more:hover {
  color: var(--ir-red-text);
  text-decoration-thickness: 2px;
}

.ir-empty {
  margin-top: 8px;
  color: var(--ir-ink-2);
}

@media (max-width: 900px) {
  .ir-toc-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .ir-toc {
    display: none;
  }

  .ir-toc-mobile {
    display: block;
    margin-bottom: 16px;
    background: var(--ir-surface);
    border-radius: var(--ir-radius);
    box-shadow: var(--ir-shadow-sm);
  }

  .ir-toc-mobile summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 52px;
    padding: 0 16px;
    font-weight: 600;
    cursor: pointer;
    list-style: none;
  }

  .ir-toc-mobile summary::-webkit-details-marker {
    display: none;
  }

  .ir-toc-mobile summary::after {
    content: "";
    width: 9px;
    height: 9px;
    margin-top: -4px;
    border-right: 2px solid var(--ir-red-text);
    border-bottom: 2px solid var(--ir-red-text);
    transform: rotate(45deg);
    transition: transform var(--ir-ease);
  }

  .ir-toc-mobile[open] summary::after {
    margin-top: 4px;
    transform: rotate(-135deg);
  }

  .ir-toc-mobile ul {
    padding: 0 8px 8px;
  }

  .ir-toc-mobile a,
  .ir-toc-mobile a:visited {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    min-height: 44px;
    align-items: center;
    padding: 6px 8px;
    border-radius: 8px;
    color: var(--ir-ink);
    text-decoration: none;
    font-size: 15px;
  }
}

@media (max-width: 640px) {
  .ir-inner-nav {
    flex-wrap: wrap;
    gap: 10px;
    padding: 12px 0;
  }

  .ir-inner-nav .ir-btn {
    min-height: 40px;
    padding: 8px 14px;
    font-size: 14px;
  }

  .ir-mini-search {
    order: 3;
    flex-basis: 100%;
    max-width: none;
  }

  .ir-cat-head {
    align-items: flex-start;
    gap: 14px;
  }

  .ir-cat-head__icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
  }

  .ir-cat-head__icon img {
    width: 26px;
    height: 26px;
  }

  .ir-seclist > section {
    padding: 18px 18px 8px;
  }
}

/* ---------------------------------------------------------- página de seção */
.ir-cat-head__eyebrow,
.ir-cat-head__eyebrow:visited {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  margin-bottom: 2px;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ir-cat-head__eyebrow:hover {
  color: #fff;
  text-decoration-thickness: 2px;
}

/* barra lateral opcional: só vira duas colunas quando a navegação é carregada */
.ir-side-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.ir-side-layout:has(> .ir-toc:not([hidden])) {
  grid-template-columns: 260px minmax(0, 1fr);
}

.ir-toc[hidden],
.ir-toc-mobile[hidden] {
  display: none !important;
}

.ir-toc a[aria-current="page"] {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
  font-weight: 600;
}

.ir-subsecs {
  margin-bottom: 24px;
}

.ir-subsecs .ir-section__title {
  margin-bottom: 12px;
}

.ir-subsecs .ir-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* helper {{pagination}} do Zendesk: o style.css antigo força várias
   propriedades com !important, por isso elas são repetidas aqui */
.ir-pager .pagination {
  display: block !important;
  width: auto !important;
  margin: 24px 0 0 !important;
}

.ir-pager .pagination-list {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}

.ir-pager li {
  display: block !important;
  margin: 0 !important;
}

.ir-pager li::before,
.ir-pager li::after,
.ir-pager a::before,
.ir-pager a::after {
  display: none !important;
}

.ir-pager a,
.ir-pager a:visited {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 44px;
  padding: 0 18px !important;
  margin: 0 !important;
  border: 1px solid var(--ir-line) !important;
  border-radius: 999px !important;
  background: var(--ir-surface) !important;
  color: var(--ir-ink) !important;
  font: 600 14px var(--ir-font-body) !important;
  text-decoration: none !important;
  box-shadow: var(--ir-shadow-sm);
  transition: background-color var(--ir-ease), border-color var(--ir-ease), color var(--ir-ease);
}

.ir-pager a:hover {
  border-color: var(--ir-red-200) !important;
  background: var(--ir-red-50) !important;
  color: var(--ir-red-text) !important;
}

.ir-pager span {
  display: inline !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  color: inherit !important;
  font: inherit !important;
}

.ir-pager a:hover span {
  background: none !important;
  color: inherit !important;
}

/* o style.css antigo esconde "Primeiro"/"Último" e deixa só « e »;
   aqui o texto fica visível, como em "Anterior"/"Próximo" */
.ir-pager .pagination-first-text,
.ir-pager .pagination-last-text {
  position: static !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .ir-side-layout:has(> .ir-toc:not([hidden])) {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 640px) {
  .ir-subsecs .ir-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* --------------------------------------------------------- página de artigo */
.ir-art-head {
  max-width: 860px;
  margin-top: 22px;
}

.ir-art-head:focus {
  outline: 0;
}

.ir-art-head__title {
  font-size: clamp(26px, 3.4vw, 38px);
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
}

.ir-art-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 14px;
  margin-top: 10px !important;
  font-size: 14px;
  color: #fff;
}

.ir-art-meta > span:not([hidden]) + span:not([hidden])::before {
  content: "·";
  margin-right: 14px;
}

.ir-art-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 28px;
  align-items: start;
}

.ir-art-card {
  padding: clamp(22px, 4vw, 48px);
  background: var(--ir-surface);
  border-radius: var(--ir-radius);
  box-shadow: var(--ir-shadow-sm);
}

/* corpo do artigo: conteúdo vem do editor do Zendesk, com estilos inline;
   por isso algumas regras usam !important para padronizar a leitura */
.ir-article {
  max-width: 72ch;
  font-size: 17px;
  line-height: 1.75;
  color: var(--ir-ink);
  overflow-wrap: anywhere;
}

.ir-page .ir-article p {
  margin: 0 0 1.1em;
}

/* texto justificado atrapalha a leitura (WCAG 1.4.8): vira alinhado à esquerda */
.ir-article p,
.ir-article li,
.ir-article [class*="wysiwyg-text-align-justify"] {
  text-align: left !important;
}

.ir-article [class*="wysiwyg-text-align-center"] {
  text-align: center !important;
}

.ir-page .ir-article h2 {
  margin: 2em 0 .7em !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid var(--ir-line) !important;
  font: 700 23px/1.3 var(--ir-font-heading) !important;
  scroll-margin-top: 24px;
}

.ir-page .ir-article h3 {
  margin: 1.7em 0 .5em !important;
  font: 700 19px/1.35 var(--ir-font-heading) !important;
  scroll-margin-top: 24px;
}

.ir-page .ir-article h4 {
  margin: 1.5em 0 .4em;
  font: 700 17px/1.4 var(--ir-font-heading);
}

.ir-page .ir-article ul,
.ir-page .ir-article ol {
  margin: 0 0 1.1em;
  padding-left: 1.5em;
  list-style: disc;
}

.ir-page .ir-article ol {
  list-style: decimal;
}

.ir-article li {
  margin: .3em 0;
}

.ir-article a,
.ir-article a:visited {
  color: var(--ir-red-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ir-article strong,
.ir-article b {
  font-weight: 600;
}

.ir-article img {
  display: block;
  max-width: 100%;
  height: auto !important;
  margin: 1.2em 0;
  border: 1px solid var(--ir-line);
  border-radius: 10px;
  box-shadow: 0 2px 10px rgba(20, 20, 30, .06);
  cursor: zoom-in;
}

.ir-article [class*="wysiwyg-text-align-center"] img {
  margin-left: auto;
  margin-right: auto;
}

.ir-article figure {
  margin: 1.2em 0;
}

.ir-article iframe {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  margin: 1.2em 0;
  border: 0;
  border-radius: 10px;
}

.ir-article table {
  width: 100%;
  margin: 1.2em 0;
  border-collapse: collapse;
  font-size: 15px;
}

.ir-article th,
.ir-article td {
  padding: 8px 12px;
  border: 1px solid var(--ir-line);
  text-align: left;
}

.ir-article hr {
  margin: 2em 0;
  border: 0;
  border-top: 1px solid var(--ir-line);
}

/* anexos */
.ir-attachments {
  margin-top: 28px;
  padding-top: 20px;
  border-top: 1px solid var(--ir-line);
}

.ir-attachments__title {
  margin-bottom: 8px !important;
  font-size: 18px;
  font-weight: 700;
}

.ir-attachments a {
  color: var(--ir-red-text);
  font-weight: 600;
}

.ir-attachments__size {
  color: var(--ir-ink-2);
  font-size: 14px;
}

/* "Este artigo foi útil?" */
.ir-feedback {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px 24px;
  margin-top: 36px;
  padding-top: 24px;
  border-top: 1px solid var(--ir-line);
}

.ir-feedback__title {
  font-size: 18px;
  font-weight: 700;
}

.ir-feedback__count {
  margin-top: 2px !important;
  font-size: 14px;
  color: var(--ir-ink-2);
}

.ir-feedback__btns {
  display: flex;
  gap: 10px;
}

.ir-page .ir-vote {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 88px;
  min-height: 44px;
  padding: 0 20px;
  border: 1.5px solid var(--ir-line);
  border-radius: 999px;
  background: var(--ir-surface);
  color: var(--ir-ink);
  font: 600 15px var(--ir-font-body);
  cursor: pointer;
  transition: background-color var(--ir-ease), border-color var(--ir-ease), color var(--ir-ease);
}

.ir-page .ir-vote:hover {
  border-color: var(--ir-red-200);
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

.ir-page .ir-vote--selected,
.ir-page .ir-vote[aria-pressed="true"] {
  border-color: var(--ir-red);
  background: var(--ir-red);
  color: #fff;
}

/* lateral: rolagem própria quando ficar mais alta que a tela */
.ir-art-aside {
  position: sticky;
  top: 16px;
  display: grid;
  gap: 16px;
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 2px 4px 8px;
  margin: -2px -4px 0;
  scrollbar-width: thin;
}

/* coluna principal: artigo + cartão do WhatsApp logo abaixo */
.ir-art-main {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.ir-help-card {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px 24px;
  padding: 24px 28px;
  border-radius: var(--ir-radius);
  background: var(--ir-ink);
  color: #fff;
  box-shadow: var(--ir-shadow-sm);
}

.ir-help-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(80% 120% at 100% 0%, rgba(227, 0, 5, .45), rgba(227, 0, 5, 0) 70%);
  pointer-events: none;
}

.ir-help-card > * {
  position: relative;
}

.ir-help-card__title {
  font-size: 19px;
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
}

.ir-help-card__text {
  margin: 4px 0 0 !important;
  font-size: 15px;
  line-height: 1.5;
  color: #D6D6DE;
}

.ir-help-card .ir-btn {
  flex: none;
}

.ir-btn__icon {
  width: 18px;
  height: 18px;
  margin-right: 8px;
  vertical-align: -3px;
}

.ir-box {
  padding: 16px 12px;
  background: var(--ir-surface);
  border-radius: var(--ir-radius);
  box-shadow: var(--ir-shadow-sm);
}

.ir-box[hidden] {
  display: none;
}

.ir-box__title {
  margin: 0 8px 8px !important;
  font: 600 12px var(--ir-font-body);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ir-ink-2);
}

.ir-box ul a,
.ir-box ul a:visited {
  display: block;
  padding: 7px 10px;
  border-radius: 8px;
  color: var(--ir-ink);
  font-size: 14px;
  line-height: 1.4;
  text-decoration: none;
}

.ir-box ul a:hover {
  background: var(--ir-bg);
  color: var(--ir-ink);
}

.ir-box ul a[aria-current="true"],
.ir-box ul a[aria-current="page"] {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
  font-weight: 600;
}

.ir-box .ir-toc-l2 a {
  padding-left: 22px;
  font-size: 13.5px;
}

.ir-box__more,
.ir-box__more:visited {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  margin: 4px 10px 0;
  color: var(--ir-red-text);
  font-size: 14px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* relacionados e vistos recentemente (marcação gerada pelo Zendesk) */
.ir-after {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
  gap: 0 24px;
}

/* o Zendesk não gera nada quando não há itens; :empty falha com espaços em branco */
.ir-zd-list:not(:has(*)) {
  display: none;
}

.ir-zd-list :is(.related-articles, .recent-articles) {
  margin: 0;
  padding: 56px 0 0;
  border: 0;
}

.ir-zd-list :is(.related-articles-title, .recent-articles-title) {
  margin: 0 0 20px !important;
  padding: 0;
  font: 700 24px/1.25 var(--ir-font-heading) !important;
  color: var(--ir-ink);
  text-transform: none;
}

.ir-zd-list :is(.related-articles, .recent-articles) ul {
  padding: 4px 20px;
  background: var(--ir-surface);
  border-radius: var(--ir-radius);
  box-shadow: var(--ir-shadow-sm);
}

.ir-zd-list :is(.related-articles, .recent-articles) li {
  margin: 0;
  padding: 0;
  border: 0;
}

.ir-zd-list :is(.related-articles, .recent-articles) li + li {
  border-top: 1px solid var(--ir-line);
}

.ir-zd-list :is(.related-articles, .recent-articles) a,
.ir-zd-list :is(.related-articles, .recent-articles) a:visited {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 52px;
  padding: 12px 0;
  color: var(--ir-ink);
  font-weight: 500;
  text-decoration: none;
}

.ir-zd-list :is(.related-articles, .recent-articles) a::after {
  content: "→";
  flex: none;
  color: var(--ir-red-text);
}

.ir-zd-list :is(.related-articles, .recent-articles) a:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* visualizador de imagem */
.ir-lightbox {
  max-width: 96vw;
  max-height: 94vh;
  padding: 0;
  border: 0;
  background: transparent;
  overflow: visible;
}

.ir-lightbox::backdrop {
  background: rgba(10, 10, 14, .85);
}

.ir-lightbox img {
  display: block;
  max-width: 96vw;
  max-height: 86vh;
  border-radius: 10px;
  background: #fff;
}

.ir-lightbox__close {
  position: fixed;
  top: 16px;
  right: 16px;
  min-height: 44px;
  padding: 0 18px;
  border: 0;
  border-radius: 999px;
  background: #fff;
  color: var(--ir-ink);
  font: 600 14px var(--ir-font-body);
  cursor: pointer;
}

.ir-lightbox__close:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
}

@media (max-width: 1024px) {
  .ir-art-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .ir-art-aside {
    position: static;
    max-height: none;
    overflow: visible;
    padding: 0;
    margin: 0;
  }
}

@media (max-width: 640px) {
  .ir-article {
    font-size: 16px;
  }

  .ir-help-card {
    padding: 20px;
  }

  .ir-help-card .ir-btn {
    width: 100%;
  }

  .ir-feedback__btns {
    width: 100%;
  }

  .ir-page .ir-vote {
    flex: 1;
  }
}

/* ---------------------------------------------------------- página de busca */
.ir-page .ir-results {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ir-result {
  padding: 22px 26px;
}

.ir-result + .ir-result {
  border-top: 1px solid var(--ir-line);
}

.ir-result__title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.35;
}

.ir-result__title a,
.ir-result__title a:visited {
  color: var(--ir-ink);
  text-decoration: none;
}

.ir-result__title a:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* o título inteiro do resultado é a área de clique */
.ir-result {
  position: relative;
}

.ir-result__title a::after {
  content: "";
  position: absolute;
  inset: 0;
}

.ir-result:hover {
  background: #FFFAFA;
}

.ir-result:first-child {
  border-radius: var(--ir-radius) var(--ir-radius) 0 0;
}

.ir-result:last-child {
  border-radius: 0 0 var(--ir-radius) var(--ir-radius);
}

.ir-result__path {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 6px;
  margin-top: 4px !important;
  font-size: 13px;
  font-weight: 500;
  color: var(--ir-ink-2);
}

.ir-result__path span + span::before {
  content: "›";
  margin-right: 6px;
}

.ir-result__text {
  margin-top: 8px !important;
  font-size: 15px;
  line-height: 1.6;
  color: var(--ir-ink);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* trecho encontrado, destacado pelo Zendesk com <em> */
.ir-result__text em {
  font-style: normal;
  font-weight: 600;
  background: var(--ir-red-50);
  border-radius: 3px;
  padding: 0 2px;
}

.ir-result__meta {
  margin-top: 8px !important;
  font-size: 13px;
  color: var(--ir-ink-2);
}

/* busca sem resultado */
.ir-noresults {
  padding: 26px 28px 28px;
}

.ir-page .ir-noresults__tips {
  margin: 12px 0 0;
  padding-left: 1.3em;
  list-style: disc;
  color: var(--ir-ink-2);
}

.ir-noresults__tips li {
  margin: 4px 0;
}

.ir-noresults__label {
  margin-top: 20px !important;
  font-weight: 600;
}

.ir-page .ir-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.ir-chips a,
.ir-chips a:visited {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 6px 16px;
  border: 1px solid var(--ir-red-200);
  border-radius: 999px;
  background: var(--ir-red-50);
  color: var(--ir-red-text);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}

.ir-chips a:hover {
  background: var(--ir-red-100);
  color: var(--ir-red-text);
}

.ir-toc-mobile a[aria-current="true"],
.ir-toc-mobile a[aria-current="page"] {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
  font-weight: 600;
}

@media (max-width: 640px) {
  .ir-result {
    padding: 18px;
  }

  .ir-noresults {
    padding: 20px;
  }
}

/* ---------------------------------------------------- busca instantânea */
.ir-has-ac {
  position: relative;
  z-index: 40;
}

.ir-page .ir-ac {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  max-height: min(70vh, 520px);
  overflow-y: auto;
  margin: 0;
  padding: 6px;
  list-style: none;
  background: var(--ir-surface);
  border: 1px solid var(--ir-line);
  border-radius: 14px;
  box-shadow: 0 16px 40px rgba(20, 20, 30, .22);
  color: var(--ir-ink);
  text-align: left;
}

.ir-page .ir-ac[hidden] {
  display: none;
}

.ir-ac__opt {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  border-radius: 10px;
  cursor: pointer;
}

.ir-ac__opt + .ir-ac__opt {
  margin-top: 2px;
}

.ir-ac__opt[aria-selected="true"] {
  background: var(--ir-red-50);
  box-shadow: inset 3px 0 0 var(--ir-red);
}

.ir-ac__title {
  font: 600 15px/1.4 var(--ir-font-body);
  color: var(--ir-ink);
}

.ir-ac__opt[aria-selected="true"] .ir-ac__title {
  color: var(--ir-red-text);
}

.ir-ac__snippet {
  font-size: 13px;
  line-height: 1.5;
  color: var(--ir-ink-2);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ir-ac__snippet:empty {
  display: none;
}

.ir-ac__snippet em {
  font-style: normal;
  font-weight: 600;
  color: var(--ir-ink);
}

.ir-ac__all {
  flex-direction: row;
  align-items: center;
  min-height: 44px;
  margin-top: 4px !important;
  border-top: 1px solid var(--ir-line);
  border-radius: 0 0 10px 10px;
}

.ir-ac__all-text {
  color: var(--ir-red-text);
  font-size: 14px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ir-ac__all-text::after {
  content: " →";
  text-decoration: none;
}

.ir-ac__empty {
  padding: 12px;
  font-size: 14px;
  color: var(--ir-ink-2);
}

@media (max-width: 640px) {
  .ir-page .ir-ac {
    max-height: 60vh;
  }
}

/* ---------------------------------------------- formulário de solicitação
   Os campos são gerados pelo Zendesk (React + Garden). Os seletores usam os
   atributos data-garden-id, que são estáveis entre versões. A borda dos
   campos precisa de 3:1 de contraste (WCAG 1.4.11): #85858F dá 3,65:1. */
.ir-request-form {
  --ir-field-border: #85858F;
  /* o CKEditor (campo Descrição) usa variáveis próprias para as bordas */
  --ck-color-base-border: #85858F;
  --ck-color-toolbar-border: #85858F;
  --ck-color-focus-border: #16161D;
}

.ir-request-form [data-garden-id] {
  font-family: var(--ir-font-body);
}

.ir-request-form [data-garden-id="forms.input_label"],
.ir-request-form [data-garden-id="dropdowns.combobox.label"] {
  font-size: 15px;
  font-weight: 600;
  color: var(--ir-ink);
}

.ir-request-form [data-garden-id="forms.input_hint"],
.ir-request-form [data-garden-id="dropdowns.combobox.hint"] {
  font-size: 14px;
  color: var(--ir-ink-2);
}

.ir-request-form [data-garden-id="forms.input"],
.ir-request-form [data-garden-id="forms.textarea"],
.ir-request-form [data-garden-id="dropdowns.combobox.trigger"] {
  min-height: 44px;
  border-color: var(--ir-field-border);
  border-radius: 10px;
  font-size: 16px;
  color: var(--ir-ink);
}

.ir-request-form [data-garden-id="forms.input"]:hover,
.ir-request-form [data-garden-id="forms.textarea"]:hover,
.ir-request-form [data-garden-id="dropdowns.combobox.trigger"]:hover {
  border-color: var(--ir-ink-2);
}

/* editor de texto do campo Descrição (CKEditor) */
.ir-request-form .ck.ck-editor__top .ck-toolbar {
  border-color: var(--ir-field-border) !important;
  border-radius: 10px 10px 0 0 !important;
  background: #FAFAFB;
}

.ir-request-form .ck.ck-editor__main > .ck-editor__editable {
  min-height: 160px;
  border-color: var(--ir-field-border);
  border-radius: 0 0 10px 10px !important;
  font-family: var(--ir-font-body);
  font-size: 16px;
  line-height: 1.6;
}

/* área de anexos */
.ir-request-form [data-garden-id="forms.file_upload"] {
  min-height: 72px;
  border: 1.5px dashed var(--ir-field-border);
  border-radius: 12px;
  background: #FAFAFB;
  color: var(--ir-ink);
  font-size: 15px;
}

.ir-request-form [data-garden-id="forms.file_upload"]:hover {
  border-color: var(--ir-red);
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

/* botão Enviar */
.ir-request-form [data-garden-id="buttons.button"] {
  min-height: 48px;
  margin-top: 28px;
  padding: 0 32px;
  border-radius: 999px;
  font-size: 16px;
  font-weight: 600;
}

/* lateral */
.ir-tip {
  padding: 20px;
}

.ir-tip__title {
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
}

.ir-tip__text {
  margin-top: 6px !important;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ir-ink-2);
}

.ir-mini-search.ir-tip__search {
  max-width: none;
  margin-top: 12px;
  border: 1px solid var(--ir-field-border, #85858F);
}

.ir-tip__search:focus-within {
  box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--ir-ink);
}

.ir-request-aside {
  --ir-field-border: #85858F;
  overflow: visible;
}

.ir-help-card--stack {
  flex-direction: column;
  align-items: stretch;
}

.ir-help-card--stack .ir-btn {
  width: 100%;
}

/* -------------------------------------------------------------- contato */
.ir-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 56px;
  padding: 32px clamp(20px, 4vw, 40px);
  border-radius: var(--ir-radius-lg);
  background: var(--ir-ink);
  color: #fff;
  position: relative;
  overflow: hidden;
}

.ir-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(60% 140% at 100% 0%, rgba(227, 0, 5, .35), rgba(227, 0, 5, 0) 70%);
  pointer-events: none;
}

.ir-cta > * {
  position: relative;
}

.ir-cta__title {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.3;
}

.ir-cta__text {
  margin-top: 6px;
  color: #D6D6DE;
  max-width: 560px;
}

/* ---------------------------------------------------------------- rodapé */
.ir-footer {
  display: none; /* ativado página a página, conforme cada uma é migrada */
  font-family: var(--ir-font-body);
  font-size: 14px;
  color: var(--ir-ink-2);
  background: var(--ir-surface);
  border-top: 1px solid var(--ir-line);
}

body:has(.ir-page) .ir-footer {
  display: block;
}

body:has(.ir-page) .footer {
  display: block !important; /* o style.css antigo esconde o .footer em todas as páginas */
  margin-top: 64px;
  padding: 0;
  border: 0;
}

body:has(.ir-page) .footer-inner {
  display: none;
}

.ir-footer__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px 24px;
  padding-top: 20px;
  padding-bottom: 20px;
}

.ir-footer__brand {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
}

.ir-footer__brand img {
  display: block;
  width: 72px;
  height: auto;
}

.ir-footer ul {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 20px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.ir-footer a,
.ir-footer a:visited {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--ir-ink-2);
  text-decoration: none;
}

.ir-footer a:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ------------------------------------------------------------ responsivo */
@media (max-width: 1024px) {
  .ir-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 860px) {
  .ir-hero__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .ir-hero__art {
    display: none;
  }
}

@media (max-width: 600px) {
  .ir-header__inner {
    min-height: 64px;
  }

  .ir-header__logo img {
    width: 92px;
  }

  .ir-header .ir-btn {
    min-height: 40px;
    padding: 8px 14px;
    font-size: 14px;
  }

  .ir-hero__lead {
    font-size: 16px;
  }

  .ir-search {
    flex-wrap: wrap;
    padding: 6px;
  }

  .ir-search__icon {
    margin-left: 8px;
  }

  .ir-search__btn {
    width: 100%;
  }

  .ir-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .ir-cta {
    flex-direction: column;
    align-items: flex-start;
  }

  .ir-cta .ir-btn {
    width: 100%;
  }


}

@media (max-width: 380px) {
  .ir-header .ir-btn__long {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ir-page *,
  .ir-footer * {
    transition: none !important;
  }

  .ir-mod:hover {
    transform: none;
  }
}

/* ------------------------------------------------------- página de erro
   Um template para três casos (error): not_found, unauthorized, forbidden. */
.ir-error {
  max-width: 760px;
  margin: 0 auto;
  padding: clamp(32px, 6vw, 56px) clamp(20px, 5vw, 56px);
  border-radius: var(--ir-radius-lg);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
  text-align: center;
}

.ir-error:focus {
  outline: 0;
}

.ir-error__code {
  font: 800 clamp(88px, 18vw, 136px)/1 var(--ir-font-heading);
  letter-spacing: -0.04em;
  color: var(--ir-red);
  background: var(--ir-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ir-error__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

.ir-error__icon svg {
  width: 32px;
  height: 32px;
}

.ir-page .ir-error__title {
  margin-top: 20px;
  font-size: clamp(24px, 4vw, 32px);
  font-weight: 700;
  line-height: 1.2;
}

.ir-error__text {
  max-width: 520px;
  margin: 12px auto 0 !important;
  font-size: 17px;
  color: var(--ir-ink-2);
}

.ir-error__actions {
  margin-top: 24px;
}

.ir-search.ir-error__search {
  margin: 32px auto 0;
  border: 1px solid #85858F;
  box-shadow: none;
}

.ir-search.ir-error__search:focus-within {
  box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--ir-ink);
}

.ir-error__label {
  margin-top: 24px !important;
  font-size: 14px;
  font-weight: 600;
  color: var(--ir-ink-2);
}

.ir-page .ir-error__chips {
  justify-content: center;
}

.ir-error__home,
.ir-error__home:visited {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  margin-top: 28px;
  padding: 0 8px;
  color: var(--ir-red-text);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ir-error__home:hover {
  color: var(--ir-carmine);
}

.ir-error__home svg {
  width: 18px;
  height: 18px;
}

@media (max-width: 600px) {
  .ir-search.ir-error__search .ir-search__btn {
    padding: 10px 16px;
  }
}

/* ------------------------------------------------------------ minha conta
   Botão no cabeçalho escuro. Logado: abre o menu da conta; sem login: leva
   para a página de entrar. */
.ir-header__actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ir-account {
  position: relative;
  flex: none;
}

.ir-inner-nav .ir-account {
  margin-left: auto;
}

.ir-inner-nav .ir-btn ~ .ir-account {
  margin-left: 0;
}

.ir-account__btn,
.ir-account__btn:visited {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 6px 14px 6px 10px;
  border: 1.5px solid rgba(255, 255, 255, .75);
  border-radius: 999px;
  background: transparent;
  color: #fff;
  font: 600 15px/1.2 var(--ir-font-body);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--ir-ease);
}

.ir-account__btn:hover {
  background: rgba(255, 255, 255, .14);
  color: #fff;
  text-decoration: none;
}

.ir-account__icon,
.ir-account__chevron {
  flex: none;
  width: 20px;
  height: 20px;
}

.ir-account__chevron {
  width: 16px;
  height: 16px;
  transition: transform var(--ir-ease);
}

.ir-account__btn[aria-expanded="true"] .ir-account__chevron {
  transform: rotate(180deg);
}

.ir-account__avatar {
  flex: none;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
  background: #fff;
}

.ir-page .ir-account__menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 60;
  width: 248px;
  padding: 6px;
  background: var(--ir-surface);
  border: 1px solid var(--ir-line);
  border-radius: 14px;
  box-shadow: 0 16px 40px rgba(20, 20, 30, .22);
  color: var(--ir-ink);
  text-align: left;
}

.ir-page .ir-account__menu[hidden] {
  display: none;
}

.ir-account__name {
  padding: 10px 12px 8px;
  border-bottom: 1px solid var(--ir-line);
  margin-bottom: 4px !important;
  font-size: 13px;
  font-weight: 600;
  color: var(--ir-ink-2);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ir-account__menu a,
.ir-account__menu a:visited {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 8px 12px;
  border-radius: 10px;
  color: var(--ir-ink);
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
}

.ir-account__menu a:hover {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
  text-decoration: none;
}

.ir-account__menu :focus-visible {
  outline: 3px solid var(--ir-ink);
  outline-offset: -3px;
}

.ir-account__sep {
  margin-top: 4px;
  padding-top: 4px;
  border-top: 1px solid var(--ir-line);
}

/* celular: só o ícone (o texto continua para leitores de tela) */
@media (max-width: 640px) {
  .ir-account__btn {
    min-width: 44px;
    justify-content: center;
    padding: 6px;
  }

  .ir-account__label {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
  }

  .ir-account__chevron {
    display: none;
  }

  .ir-header__actions {
    gap: 8px;
  }
}

/* ------------------------------------------------------------ perfil */
.ir-profile {
  padding: clamp(20px, 4vw, 32px);
  border-radius: var(--ir-radius-lg);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
}

.ir-profile:focus {
  outline: 0;
}

.ir-profile__main {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 24px;
  align-items: start;
}

.ir-profile__avatar {
  position: relative;
  width: 96px;
  height: 96px;
}

.ir-profile__avatar img {
  display: block;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--ir-red-50);
  box-shadow: 0 0 0 4px #fff, 0 0 0 5px var(--ir-line);
}

.ir-profile__agent {
  position: absolute;
  right: 0;
  bottom: 2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: 3px solid #fff;
  border-radius: 50%;
  background: var(--ir-red);
  color: #fff;
}

.ir-profile__agent svg {
  width: 14px;
  height: 14px;
}

.ir-page .ir-profile__name {
  font-size: clamp(24px, 3.4vw, 32px);
  font-weight: 700;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.ir-profile__name a,
.ir-profile__name a:visited {
  color: inherit;
  text-decoration: none;
}

.ir-profile__name a:hover {
  text-decoration: underline;
}

.ir-page .ir-profile__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

.ir-page .ir-profile__tags:not(:has(li)) {
  display: none;
}

.ir-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  border-radius: 999px;
  background: #EDEDF0;
  color: var(--ir-ink);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
}

.ir-chip svg {
  width: 14px;
  height: 14px;
}

.ir-chip--brand {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

.ir-chip--pending {
  background: #FFF4D6;
  color: #6B4A00;
}

.ir-chip--answered,
.ir-chip--completed {
  background: #E3F4EA;
  color: #1C5E36;
}

.ir-profile__meta {
  margin-top: 10px !important;
  font-size: 15px;
  color: var(--ir-ink-2);
}

.ir-profile__desc {
  max-width: 640px;
  margin-top: 12px !important;
  font-size: 16px;
  line-height: 1.6;
}

.ir-page .ir-profile__badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
}

.ir-page .ir-profile__badges:not(:has(li)) {
  display: none;
}

.ir-profile__badges img {
  display: block;
  width: 36px;
  height: 36px;
  padding: 6px;
  border-radius: 10px;
  background: var(--ir-red-50);
}

.ir-profile__badges-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 8px;
  border-radius: 10px;
  background: #EDEDF0;
  font-size: 13px;
  font-weight: 700;
}

/* ações do Zendesk (editar perfil, seguir): botão contornado */
.ir-profile__actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
}

.ir-profile__actions button,
.ir-profile__actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 44px;
  padding: 8px 20px;
  border: 1.5px solid var(--ir-red-text);
  border-radius: 999px;
  background: #fff;
  color: var(--ir-red-text);
  font: 600 15px/1.2 var(--ir-font-body);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

.ir-profile__actions button:hover,
.ir-profile__actions a:hover {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

.ir-profile__actions button[aria-pressed="true"] {
  background: var(--ir-red);
  border-color: var(--ir-red);
  color: #fff;
}

.ir-profile__follow > div {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
}

.ir-profile__follow span {
  font-size: 13px;
  color: var(--ir-ink-2);
}

/* números */
.ir-page .ir-profile__stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  margin: 24px 0 0;
  padding-top: 24px;
  border-top: 1px solid var(--ir-line);
}

.ir-stat {
  padding: 14px 16px;
  border-radius: var(--ir-radius);
  background: var(--ir-bg);
}

.ir-stat dt {
  font-size: 13px;
  font-weight: 600;
  color: var(--ir-ink-2);
}

.ir-page .ir-stat dd {
  margin: 2px 0 0;
  font: 700 24px/1.2 var(--ir-font-heading);
  color: var(--ir-ink);
}

/* conteúdo + lateral */
.ir-profile-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 24px;
  align-items: start;
  margin-top: 24px;
}

.ir-profile-layout > :only-child {
  grid-column: 1 / -1;
}

.ir-profile-aside {
  position: sticky;
  top: 24px;
}

.ir-shortcuts {
  padding: 18px 12px;
}

/* abas */
.ir-tabs {
  margin-bottom: 16px;
  overflow-x: auto;
  scrollbar-width: none;
}

.ir-page .ir-tabs ul {
  display: flex;
  gap: 8px;
  width: max-content;
}

.ir-tabs a,
.ir-tabs a:visited {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 8px 18px;
  border: 1px solid var(--ir-line);
  border-radius: 999px;
  background: #fff;
  color: var(--ir-ink);
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.ir-tabs a:hover {
  border-color: var(--ir-red-200);
  color: var(--ir-red-text);
}

.ir-tabs a[aria-current="page"] {
  border-color: var(--ir-ink);
  background: var(--ir-ink);
  color: #fff;
}

.ir-profile-section__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.ir-page .ir-profile-section__title {
  margin-bottom: 12px;
  font-size: 20px;
  font-weight: 700;
}

.ir-profile-section__head .ir-profile-section__title {
  margin-bottom: 0;
}

.ir-sorters {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
}

.ir-sorters__label {
  color: var(--ir-ink-2);
}

.ir-page .ir-sorters ul {
  display: flex;
  gap: 4px;
}

.ir-sorters a,
.ir-sorters a:visited {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 4px 12px;
  border-radius: 999px;
  color: var(--ir-ink);
  text-decoration: none;
}

.ir-sorters a:hover,
.ir-sorters a[aria-current="true"] {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

.ir-sorters a[aria-current="true"] {
  font-weight: 600;
}

.ir-profile-section__head + .ir-activity-list,
.ir-profile-section__head + .ir-empty {
  margin-top: 12px;
}

/* lista de atividades */
.ir-page .ir-activity-list {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ir-activity__label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px !important;
  font-size: 14px;
  font-weight: 600;
  color: var(--ir-ink-2);
}

.ir-activity__dot {
  flex: none;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ir-red);
}

.ir-activity__card {
  padding: 18px 20px;
  border-radius: var(--ir-radius);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
}

.ir-page .ir-activity__title {
  font: 600 17px/1.4 var(--ir-font-body);
}

.ir-activity__title a,
.ir-activity__title a:visited {
  color: var(--ir-ink);
  text-decoration: none;
}

.ir-activity__title a:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
}

.ir-page .ir-activity__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.ir-page .ir-activity__chips:not(:has(li)) {
  display: none;
}

.ir-activity__path {
  margin-top: 6px !important;
  font-size: 13px;
  color: var(--ir-ink-2);
}

.ir-activity__path a,
.ir-activity__path a:visited {
  color: var(--ir-ink-2);
}

.ir-activity__path a:hover {
  color: var(--ir-red-text);
}

.ir-activity__body {
  margin-top: 8px !important;
  font-size: 15px;
  line-height: 1.6;
}

.ir-activity__meta {
  margin-top: 10px !important;
  font-size: 13px;
  color: var(--ir-ink-2);
}

.ir-activity__meta a,
.ir-activity__meta a:visited {
  color: var(--ir-red-text);
  font-weight: 600;
}

/* conquistas */
.ir-page .ir-badge-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 12px;
}

.ir-badge-card {
  display: flex;
  gap: 14px;
  padding: 16px;
  border-radius: var(--ir-radius);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
}

.ir-badge-card img {
  flex: none;
  width: 48px;
  height: 48px;
  padding: 8px;
  border-radius: 12px;
  background: var(--ir-red-50);
}

.ir-badge-card__name {
  font-weight: 700;
}

.ir-badge-card__desc {
  margin-top: 2px !important;
  font-size: 14px;
  color: var(--ir-ink-2);
}

.ir-badge-card__date {
  margin-top: 6px !important;
  font-size: 13px;
  color: var(--ir-ink-2);
}

/* estado vazio */
.ir-empty {
  padding: 36px 24px;
  border: 1.5px dashed #C9C9D1;
  border-radius: var(--ir-radius);
  background: var(--ir-surface);
  text-align: center;
}

.ir-empty__icon {
  width: 32px;
  height: 32px;
  margin-bottom: 8px;
  color: var(--ir-ink-2);
}

.ir-empty__title {
  font-size: 17px;
  font-weight: 700;
}

.ir-empty__text {
  margin-top: 4px !important;
  color: var(--ir-ink-2);
}

.ir-empty__link,
.ir-empty__link:visited {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-top: 8px;
  color: var(--ir-red-text);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 900px) {
  .ir-profile__main {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .ir-profile__actions {
    grid-column: 1 / -1;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
  }

  .ir-profile__follow > div {
    flex-direction: row;
    align-items: center;
    gap: 10px;
  }

  .ir-page .ir-profile__stats {
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  }

  .ir-profile-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .ir-profile-aside {
    position: static;
  }
}

@media (max-width: 600px) {
  .ir-profile__main {
    grid-template-columns: minmax(0, 1fr);
    justify-items: start;
    gap: 16px;
  }

  .ir-profile__avatar,
  .ir-profile__avatar img {
    width: 80px;
    height: 80px;
  }

  .ir-page .ir-profile__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ir-activity__card {
    padding: 16px;
  }
}

/* ------------------------------------------------------- minhas solicitações
   Os campos do filtro são gerados pelo Zendesk ({{input}}, {{select}});
   o script.js envia o formulário ao trocar o status (ids mantidos). */
.ir-req-panel {
  padding: 18px 20px 20px;
  border-radius: var(--ir-radius-lg);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
}

.ir-req-panel .ir-tabs {
  margin: 0 -20px 18px;
  padding: 0 20px 16px;
  border-bottom: 1px solid var(--ir-line);
}

.ir-req-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 16px 20px;
}

.ir-req-toolbar__search {
  flex: 1 1 320px;
}

.ir-req-toolbar__label,
.ir-req-toolbar__field label {
  display: block;
  margin-bottom: 6px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ir-ink);
}

.ir-req-toolbar__row {
  display: flex;
  gap: 8px;
}

.ir-req-toolbar__input {
  position: relative;
  flex: 1;
  min-width: 0;
}

.ir-req-toolbar__input .ir-search__icon {
  position: absolute;
  top: 50%;
  left: 12px;
  transform: translateY(-50%);
  pointer-events: none;
}

.ir-page .ir-req-toolbar__input input {
  width: 100%;
  min-height: 44px;
  padding: 0 12px 0 40px;
  border: 1px solid #85858F;
  border-radius: 10px;
  background: #fff;
  font: 400 16px var(--ir-font-body);
  color: var(--ir-ink);
}

.ir-req-toolbar__btn {
  border-radius: 10px;
}

.ir-req-toolbar__filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 16px;
}

.ir-page .ir-req-toolbar__field select {
  min-width: 200px;
  min-height: 44px;
  padding: 0 40px 0 12px;
  border: 1px solid #85858F;
  border-radius: 10px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2316161D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center / 18px;
  font: 400 16px var(--ir-font-body);
  color: var(--ir-ink);
  -webkit-appearance: none;
  appearance: none;
}

.ir-page .ir-req-toolbar :is(input, select):focus-visible {
  outline: 3px solid var(--ir-ink);
  outline-offset: 2px;
}

.ir-req-toolbar__follow button {
  min-height: 44px;
  padding: 8px 18px;
  border: 1.5px solid var(--ir-red-text);
  border-radius: 999px;
  background: #fff;
  color: var(--ir-red-text);
  font: 600 15px var(--ir-font-body);
  cursor: pointer;
}

.ir-req-toolbar__follow span {
  display: none;
}

.ir-req-info {
  margin-top: 16px !important;
  font-weight: 600;
}

/* lista */
.ir-page .ir-req-list {
  display: grid;
  gap: 10px;
  margin-top: 16px;
}

.ir-req {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 20px;
  border-radius: var(--ir-radius);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
  transition: box-shadow var(--ir-ease);
}

.ir-req:hover {
  box-shadow: var(--ir-shadow-red);
}

.ir-req__main {
  min-width: 0;
}

.ir-page .ir-req__title {
  font: 600 17px/1.4 var(--ir-font-body);
}

.ir-req__title a,
.ir-req__title a:visited {
  color: var(--ir-ink);
  text-decoration: none;
}

.ir-req__title a:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
}

.ir-req__meta {
  margin-top: 4px !important;
  font-size: 14px;
  color: var(--ir-ink-2);
}

.ir-req--closed .ir-req__title a {
  color: var(--ir-ink-2);
}

/* status: cor + texto (a cor nunca é a única informação) */
.ir-status {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border-radius: 999px;
  background: #EDEDF0;
  color: var(--ir-ink);
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}

.ir-status::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: currentColor;
}

.ir-status--new,
.ir-status--open {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

.ir-status--pending {
  background: #FFF4D6;
  color: #6B4A00;
}

.ir-status--solved {
  background: #E3F4EA;
  color: #1C5E36;
}

.ir-status--closed {
  color: var(--ir-ink-2);
}

.ir-requests .ir-empty {
  margin-top: 16px;
}

.ir-empty__btn {
  margin-top: 16px;
}

.ir-requests-beta {
  padding: 24px;
}

.ir-req-help {
  margin-top: 40px;
}

@media (max-width: 640px) {
  .ir-req-panel {
    padding: 16px;
  }

  .ir-req-panel .ir-tabs {
    margin: 0 -16px 16px;
    padding: 0 16px 14px;
  }

  .ir-req-toolbar__filters,
  .ir-req-toolbar__field {
    width: 100%;
  }

  .ir-page .ir-req-toolbar__field select {
    width: 100%;
  }

  .ir-req {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding: 16px;
  }
}