/* Orbitek Pets — camada compartilhada de experiência do usuário */
:root {
  --orbitek-roxo: #6c4cf1;
  --orbitek-roxo-escuro: #5135c9;
  --orbitek-foco: 0 0 0 4px rgba(108, 76, 241, .18);
}

html { scroll-behavior: smooth; }
body { opacity: 0; transition: opacity .18s ease; }
body.orbitek-pagina-pronta { opacity: 1; }

:where(button, a, input, select, textarea):focus-visible {
  outline: none;
  box-shadow: var(--orbitek-foco);
}

button:disabled, [aria-disabled="true"] {
  cursor: not-allowed !important;
  opacity: .68;
}

.orbitek-conexao {
  position: fixed;
  z-index: 99999;
  left: 50%;
  bottom: 18px;
  transform: translate(-50%, 130%);
  width: min(520px, calc(100% - 28px));
  padding: 12px 16px;
  border-radius: 14px;
  background: #27233a;
  color: #fff;
  box-shadow: 0 18px 45px rgba(20, 18, 34, .26);
  font: 700 .9rem/1.35 Inter, system-ui, sans-serif;
  text-align: center;
  transition: transform .25s ease;
}
.orbitek-conexao.visivel { transform: translate(-50%, 0); }
.orbitek-conexao.online { background: #137a4d; }

.orbitek-notificacoes {
  position: fixed;
  z-index: 100000;
  top: 18px;
  right: 18px;
  display: grid;
  gap: 10px;
  width: min(390px, calc(100% - 36px));
  pointer-events: none;
}
.orbitek-toast {
  position: relative;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 32px;
  align-items: center;
  gap: 11px;
  min-height: 66px;
  overflow: hidden;
  padding: 12px 10px 12px 12px;
  border: 1px solid #e8e7ee;
  border-radius: 16px;
  background: rgba(255,255,255,.97);
  color: #252337;
  box-shadow: 0 18px 50px rgba(31, 28, 55, .18);
  opacity: 0;
  transform: translateY(-12px) scale(.98);
  transition: opacity .2s ease, transform .2s ease;
  pointer-events: auto;
  backdrop-filter: blur(12px);
}
.orbitek-toast.visivel { opacity: 1; transform: none; }
.orbitek-toast-icone {
  display: grid; place-items: center;
  width: 36px; height: 36px;
  border-radius: 12px;
  color: #fff;
  font-weight: 900;
}
.orbitek-toast-sucesso .orbitek-toast-icone { background: #16a34a; }
.orbitek-toast-erro .orbitek-toast-icone { background: #dc2626; }
.orbitek-toast-aviso .orbitek-toast-icone { background: #d97706; }
.orbitek-toast-info .orbitek-toast-icone { background: #2563eb; }
.orbitek-toast-conteudo { display: grid; gap: 2px; min-width: 0; }
.orbitek-toast-conteudo strong { font-size: .92rem; }
.orbitek-toast-conteudo span { color: #625f72; font-size: .88rem; line-height: 1.35; }
.orbitek-toast-fechar {
  border: 0; border-radius: 9px; background: transparent;
  color: #858194; cursor: pointer; font-size: 1.25rem; line-height: 1;
  width: 32px; height: 32px;
}
.orbitek-toast-fechar:hover { background: #f1f0f6; color: #252337; }
.orbitek-toast-progresso {
  position: absolute; left: 0; bottom: 0; width: 100%; height: 3px;
  background: currentColor; transform-origin: left;
  animation: orbitek-progresso linear forwards;
}
.orbitek-toast-sucesso { color: #16a34a; }
.orbitek-toast-erro { color: #dc2626; }
.orbitek-toast-aviso { color: #d97706; }
.orbitek-toast-info { color: #2563eb; }
@keyframes orbitek-progresso { to { transform: scaleX(0); } }

.orbitek-confirmacao-fundo {
  position: fixed; inset: 0; z-index: 100001;
  display: grid; place-items: center; padding: 20px;
  background: rgba(21, 18, 38, .55);
  opacity: 0; transition: opacity .18s ease;
  backdrop-filter: blur(5px);
}
.orbitek-confirmacao-fundo.visivel { opacity: 1; }
.orbitek-confirmacao {
  width: min(430px, 100%); padding: 28px;
  border-radius: 24px; background: #fff; color: #252337;
  box-shadow: 0 28px 80px rgba(13, 10, 29, .3);
  text-align: center; transform: translateY(10px) scale(.98);
  transition: transform .18s ease;
}
.orbitek-confirmacao-fundo.visivel .orbitek-confirmacao { transform: none; }
.orbitek-confirmacao-icone {
  display: grid; place-items: center; width: 52px; height: 52px;
  margin: 0 auto 15px; border-radius: 18px;
  background: #eeeaff; color: var(--orbitek-roxo); font-size: 1.45rem; font-weight: 900;
}
.orbitek-confirmacao h2 { margin: 0; font-size: 1.25rem; }
.orbitek-confirmacao p { margin: 10px 0 22px; color: #6f6b7e; line-height: 1.55; }
.orbitek-confirmacao-acoes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.orbitek-confirmacao-acoes button { min-height: 45px; border-radius: 13px; font-weight: 800; cursor: pointer; }
.orbitek-confirmacao-cancelar { border: 1px solid #dedbe8; background: #fff; color: #4d495d; }
.orbitek-confirmacao-confirmar { border: 0; background: var(--orbitek-roxo); color: #fff; }
.orbitek-modal-aberto { overflow: hidden; }

.orbitek-skeleton-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 18px;
  width: 100%;
}
.orbitek-skeleton-card {
  min-height: 360px; overflow: hidden;
  border: 1px solid #e7e5f0; border-radius: 24px; background: #fff;
  box-shadow: 0 12px 30px rgba(41,34,82,.08);
}
.orbitek-skeleton-bloco {
  background: linear-gradient(90deg, #ecebf2 25%, #f7f6fa 45%, #ecebf2 65%);
  background-size: 220% 100%;
  animation: orbitek-skeleton 1.25s ease-in-out infinite;
}
.orbitek-skeleton-foto { height: 220px; }
.orbitek-skeleton-corpo { padding: 18px; display: grid; gap: 12px; }
.orbitek-skeleton-linha { height: 14px; border-radius: 8px; }
.orbitek-skeleton-linha.grande { width: 68%; height: 20px; }
.orbitek-skeleton-linha.media { width: 84%; }
.orbitek-skeleton-linha.pequena { width: 48%; }
@keyframes orbitek-skeleton { to { background-position-x: -220%; } }

@media (max-width: 600px) {
  .orbitek-notificacoes { top: 10px; right: 14px; width: calc(100% - 28px); }
  .orbitek-confirmacao-acoes { grid-template-columns: 1fr; }
  .orbitek-confirmacao-confirmar { order: -1; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  body, .orbitek-toast, .orbitek-confirmacao-fundo, .orbitek-confirmacao, .orbitek-conexao { transition: none !important; }
  .orbitek-toast-progresso, .orbitek-skeleton-bloco { animation: none !important; }
}
