/* ============================================
   GRUPO TAUÁ HOTÉIS — DESIGN TOKENS
   Design System / UI Kit oficial
   ============================================ */

/* ---------- FONTES ---------- */
@font-face {
  font-family: 'CoHeadline';
  src: url('../fonts/CO_HEADLINE_LIGHT.TTF') format('truetype');
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: 'CoHeadline';
  src: url('../fonts/CO_HEADLINE_REGULAR.TTF') format('truetype');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'CoHeadline';
  src: url('../fonts/CO_HEADLINE_CORP_BOLD.TTF') format('truetype');
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: 'Krub';
  src: url('../fonts/KRUB-EXTRALIGHT.TTF') format('truetype');
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: 'Krub';
  src: url('../fonts/KRUB-LIGHT.TTF') format('truetype');
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: 'Krub';
  src: url('../fonts/KRUB-REGULAR.TTF') format('truetype');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'Krub';
  src: url('../fonts/KRUB-ITALIC.TTF') format('truetype');
  font-weight: 400;
  font-style: italic;
}
@font-face {
  font-family: 'Krub';
  src: url('../fonts/KRUB-MEDIUM.TTF') format('truetype');
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: 'Krub';
  src: url('../fonts/KRUB-SEMIBOLD.TTF') format('truetype');
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: 'Krub';
  src: url('../fonts/KRUB-BOLD.TTF') format('truetype');
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: 'Krub';
  src: url('../fonts/KRUB-BOLDITALIC.TTF') format('truetype');
  font-weight: 700;
  font-style: italic;
}

/* ---------- TOKENS (CSS VARIABLES) ---------- */
:root {

  /* Cores — Padrão */
  --taua-verde-primario: #007A47;
  --taua-verde-secundario: #00A565;
  --taua-verde-terciario: #00643A;
  --taua-texto-primario: #191919;
  --taua-texto-secundario: #444444;
  --taua-texto-terciario: #7E8392;
  --taua-background-claro: #F3F3F3;
  --taua-laranja-primario: #EC6724;
  --taua-laranja-secundario: #F8D0BD;
  --taua-branco: #FFFFFF;
  --taua-desativado: #e6e6e6;
  --taua-desativado-1: #D1D1D1;

  /* Cores — Destaques */
  --taua-laranja-terciario: #FF9500;
  --taua-azul-claro: #30B0C7;
  --taua-rosa: #FF2D55;
  --taua-amarelo: #FFCC00;
  --taua-verde-destaque: #00C853;

  /* Tipografia */
  --font-headline: 'CoHeadline', sans-serif;
  --font-body: 'Krub', sans-serif;

  /* Border Radius */
  --radius-pequeno: 10px;   /* Botão */
  --radius-medio: 20px;     /* Default */
  --radius-grande: 30px;    /* Buscador */

  /* Espaçamento */
  --spacing-xs: 4px;    /* gaps mínimos, ícone↔texto */
  --spacing-sm: 8px;    /* gaps internos, listas */
  --spacing-md: 16px;   /* padding de componentes, gap padrão */
  --spacing-lg: 24px;   /* separação entre blocos */
  --spacing-xl: 32px;   /* padding de seções */
  --spacing-2xl: 48px;  /* respiro entre grandes seções */

  /* Sombras */
  --shadow-default: 0px 6px 13px rgba(0, 0, 0, 0.25);
  --shadow-vertical-up: 0px -7px 15px rgba(0, 0, 0, 0.16);
}

/* ---------- ESCALA TIPOGRÁFICA ---------- */
.titulo-conteudo   { font-family: var(--font-headline); font-weight: 400; font-size: 15px; color: var(--taua-texto-primario); }
.titulo-pagina      { font-family: var(--font-headline); font-weight: 400; font-size: 20px; color: var(--taua-texto-primario); }
.titulo-calendario  { font-family: var(--font-headline); font-weight: 400; font-size: 22px; color: var(--taua-texto-primario); }
.titulo-carrinho    { font-family: var(--font-headline); font-weight: 400; font-size: 24px; color: var(--taua-texto-primario); }
.texto-buscador-primario   { font-family: var(--font-headline); font-weight: 400; font-size: 14px; color: var(--taua-texto-primario); }
.texto-buscador-secundario { font-family: var(--font-headline); font-weight: 400; font-size: 10px; color: var(--taua-texto-primario); }

.texto-primario     { font-family: var(--font-body); font-weight: 400; font-size: 12px; color: var(--taua-texto-primario); }
.texto-secundario   { font-family: var(--font-body); font-weight: 400; font-size: 12px; color: var(--taua-texto-terciario); }
.texto-terciario    { font-family: var(--font-body); font-weight: 400; font-size: 10px; color: var(--taua-texto-terciario); }

.texto-preco-minicart    { font-family: var(--font-headline); font-weight: 400; font-size: 16px; color: var(--taua-verde-secundario); }
.texto-timer-minicart    { font-family: var(--font-body); font-weight: 400; font-size: 12px; color: var(--taua-rosa); }
.texto-secundario-minicart { font-family: var(--font-body); font-weight: 400; font-size: 10px; color: var(--taua-texto-primario); }
.texto-primario-minicart { font-family: var(--font-headline); font-weight: 400; font-size: 14px; color: var(--taua-texto-primario); }

.texto-primario-carrinho   { font-family: var(--font-headline); font-weight: 400; font-size: 14px; color: var(--taua-texto-primario); text-decoration: underline; }
.texto-secundario-carrinho { font-family: var(--font-headline); font-weight: 400; font-size: 12px; color: var(--taua-laranja-primario); }
.texto-preco-carrinho      { font-family: var(--font-headline); font-weight: 400; font-size: 16px; color: var(--taua-texto-primario); }
.texto-desconto-carrinho   { font-family: var(--font-headline); font-weight: 400; font-size: 16px; color: var(--taua-texto-terciario); text-decoration: line-through; }
.texto-timer-carrinho      { font-family: var(--font-body); font-weight: 400; font-size: 16px; color: var(--taua-rosa); }

/* ---------- BOTÕES ---------- */
.btn-grande {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: var(--taua-laranja-primario);
  color: var(--taua-branco);
  border: none;
  border-radius: var(--radius-pequeno);
  padding: 13px 18px;
  font-family: var(--font-headline);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  cursor: pointer;
}
.btn-grande:hover { background: #b84e15; }
.btn-grande:disabled { background: var(--taua-desativado-1); color: var(--taua-desativado); cursor: not-allowed; }
.btn-grande.outlined { background: transparent; border: 2px solid var(--taua-laranja-primario); color: var(--taua-laranja-primario); }

.btn-medio {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  background: var(--taua-laranja-primario);
  color: var(--taua-branco);
  border: none;
  border-radius: var(--radius-pequeno);
  padding: 10px 16px;
  font-family: var(--font-headline);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  cursor: pointer;
}
.btn-medio.secundario { background: transparent; border: 2px solid var(--taua-laranja-primario); color: var(--taua-laranja-primario); }
.btn-medio:disabled { background: transparent; border: 1px solid var(--taua-desativado-1); color: var(--taua-desativado-1); cursor: not-allowed; }

.btn-nav-interna {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--taua-verde-primario);
  color: var(--taua-branco);
  border: none;
  border-radius: var(--radius-pequeno);
  padding: 10px 16px;
  font-family: var(--font-body);
  font-size: 12px;
  cursor: pointer;
}
.btn-nav-interna:hover { background: var(--taua-verde-terciario); }

.btn-tour-virtual {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--taua-verde-secundario);
  color: var(--taua-branco);
  border: none;
  border-radius: var(--radius-grande);
  padding: 11px 22px;
  font-family: var(--font-body);
  font-size: 13px;
  cursor: pointer;
}
.btn-tour-virtual:hover { background: var(--taua-verde-primario); }

.btn-promo {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  background: var(--taua-laranja-primario);
  color: var(--taua-branco);
  border: none;
  border-radius: var(--radius-grande);
  padding: 12px 20px;
  font-family: var(--font-headline);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  cursor: pointer;
}
.btn-promo.verde { background: var(--taua-verde-secundario); }
.btn-promo:disabled { background: transparent; border: 1px solid var(--taua-desativado-1); color: var(--taua-desativado-1); cursor: not-allowed; }