/* ============================================
   Tema iShoot — design system "Professional Creative" (Stitch)
   Pele compartilhada pelo painel da Iza (admin.html) e pelo portal
   do parceiro (parceiro.html). Carregar DEPOIS de base.css/admin.css
   (as redefinições daqui vencem por ordem).

   As páginas PÚBLICAS de cliente (orçamento, contrato, entrega…)
   NÃO carregam este arquivo de propósito — seguem com a identidade
   "Iza Gonçalves Fotografia" (marrom/creme) do base.css.

   Fontes: cada página que usa este tema carrega Plus Jakarta Sans +
   Inter (Google Fonts, display=swap); sem rede, cai no Segoe.
   Os nomes "--marrom" são a variável de marca do projeto (base.css);
   renomear exigiria reescrever o base — por isso ficam.
   ============================================ */
:root {
  /* Paleta: índigo profundo (autoridade) + roxo elétrico (ação) */
  --marrom: #6b38d4;          /* roxo elétrico — botões, links, aba ativa */
  --marrom-escuro: #1e1b4b;   /* índigo profundo — títulos e ênfase */
  --dourado: #f59e0b;
  --creme: #f7f9fb;           /* fundo geral (surface) */
  --areia: #eef0f4;           /* superfície secundária */
  --borda: #e2e8f0;           /* slate 200 — borda padrão dos cartões */
  --texto: #191c1e;
  --texto-suave: #64626b;
  --sombra: 0 4px 20px rgba(30, 27, 75, .05);
  --raio: 12px;
  --ishoot-1: #6b38d4;        /* roxo elétrico */
  --ishoot-2: #8455ef;        /* roxo claro (gradientes) */
  --ishoot-indigo: #070235;   /* índigo quase-preto da logo */
}

/* Tipografia: Inter no corpo, Plus Jakarta Sans nos títulos
   (vence os pontos onde base.css/admin.css usam Georgia) */
body { font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif; }
h1, h2, h3,
.topo-mobile .titulo,
.cartao-numero .num,
.meta-titulo, .meta-pct,
.previsto-titulo, .previsto-valor,
.agenda-mes {
  font-family: 'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif;
  letter-spacing: -.01em;
}
h1, h2, h3 { color: var(--marrom-escuro); }

/* Cartões: borda slate fina, sombra suave "iluminada de cima" */
.cartao { box-shadow: var(--sombra); }
a.cartao-numero:hover { box-shadow: 0 8px 24px rgba(30, 27, 75, .12); }
.cartao-numero .rotulo { font-size: 10.5px; font-weight: 700; letter-spacing: .08em; }
.cartao-numero .num { color: var(--ishoot-1); }
.cartao-numero .num.moeda { color: var(--marrom-escuro); }

/* Campos: foco com anel roxo (o base.css usa um marrom hardcoded) */
input:focus, select:focus, textarea:focus {
  border-color: var(--ishoot-1);
  box-shadow: 0 0 0 3px rgba(107, 56, 212, .15);
}

/* Login: cartão premium com brilho de marca no topo */
#tela-login { background: var(--creme); }
#tela-login .cartao {
  border-radius: 16px;
  border-top: 4px solid transparent;
  border-image: linear-gradient(100deg, var(--ishoot-1), var(--ishoot-2)) 1;
  box-shadow: 0 20px 40px rgba(30, 27, 75, .12);
}

/* Navegação lateral: item ativo vira pílula em gradiente de marca */
.lateral-nav a { border-radius: 10px; }
.lateral-nav a.ativa {
  background: linear-gradient(100deg, var(--ishoot-1), var(--ishoot-2));
  color: #fff;
}
.nav-grupo-titulo { color: var(--texto-suave); }

/* Ícones SVG da navegação (no lugar dos emojis) */
.ic svg { display: block; margin: 0 auto; }
.lateral-nav a .ic svg { width: 19px; height: 19px; }
.barra-inferior .ic svg { width: 23px; height: 23px; }

/* Barra inferior: rótulos CAPS curtinhos e indicador na borda de cima */
.barra-inferior a, .barra-inferior button {
  text-transform: uppercase;
  font-size: 10px !important;
  letter-spacing: .03em;
  border-top: 2px solid transparent;
}
.barra-inferior a.ativa, .barra-inferior button.ativa {
  border-top-color: var(--ishoot-1);
}

/* Véus (modal, gaveta) com tinta índigo em vez do marrom do painel */
.modal-fundo, .lateral-fundo { background: rgba(7, 2, 53, .45); }

/* ── Módulos do CRM na lateral ── */
.nav-crm-modulo { position: relative; }
.nav-lock { margin-left: auto; font-size: 11px; line-height: 1; opacity: .58; filter: grayscale(1); }
#portal.crm-liberado .nav-lock { display: none; }
#portal.crm-bloqueado .nav-crm-modulo:not(.ativa) { color: #777580; }
#portal.crm-bloqueado .nav-crm-modulo:not(.ativa) .ic { opacity: .72; }
.lateral-nav a.ativa .nav-lock { opacity: .9; filter: grayscale(1) brightness(4); }
.crm-chamada {
  display: flex;
  align-items: center;
  gap: 12px;
  color: inherit;
  text-decoration: none;
  border-color: rgba(107, 56, 212, .24);
  background: linear-gradient(115deg, #fff, #f5f1ff);
  transition: transform .15s, box-shadow .15s;
}
.crm-chamada:hover { transform: translateY(-1px); box-shadow: 0 8px 24px rgba(30,27,75,.1); }
.crm-chamada-icone { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: #ebe3ff; font-size: 20px; flex: 0 0 auto; }
.crm-chamada strong, .crm-chamada small { display: block; }
.crm-chamada small { margin-top: 4px; color: var(--texto-suave); line-height: 1.4; }
.crm-chamada-seta { margin-left: auto; color: var(--ishoot-1); font-size: 28px; }
.crm-cabecalho { align-items: center; }
.crm-cabecalho h2 { margin: 2px 0 0; }
.crm-sobretitulo { color: var(--ishoot-1); font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.crm-status { display: inline-flex; align-items: center; gap: 6px; padding: 7px 10px; border: 1px solid var(--borda); border-radius: 999px; background: #fff; color: var(--texto-suave); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.crm-hero { display: flex; align-items: center; gap: 22px; overflow: hidden; position: relative; padding: 26px; border-color: rgba(107,56,212,.22); background: radial-gradient(circle at 94% 10%, rgba(132,85,239,.2), transparent 34%), linear-gradient(125deg, #fff 35%, #f4f0ff); }
.crm-hero-cadeado { display: grid; place-items: center; width: 76px; height: 76px; flex: 0 0 auto; border-radius: 22px; background: linear-gradient(145deg, var(--ishoot-1), var(--ishoot-2)); box-shadow: 0 12px 30px rgba(107,56,212,.25); font-size: 34px; }
.crm-hero h3 { margin: 4px 0 8px; font-size: clamp(21px, 3vw, 30px); }
.crm-hero p { max-width: 720px; margin: 0 0 14px; color: var(--texto-suave); line-height: 1.6; }
.crm-grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.crm-modulo { display: flex; align-items: center; gap: 12px; min-height: 86px; margin: 0; padding: 15px; position: relative; }
.crm-modulo.bloqueado { background: #fbfbfc; }
.crm-modulo-icone { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; color: var(--ishoot-1); background: #f0ebff; flex: 0 0 auto; }
.crm-modulo-icone svg { width: 23px; height: 23px; }
.crm-modulo-texto strong, .crm-modulo-texto small { display: block; }
.crm-modulo-texto small { margin-top: 4px; color: var(--texto-suave); line-height: 1.35; }
.crm-modulo-lock { margin-left: auto; filter: grayscale(1); opacity: .55; font-size: 14px; }
.crm-aviso { display: flex; gap: 8px 18px; align-items: center; justify-content: center; flex-wrap: wrap; margin-top: 14px; text-align: center; }
.crm-aviso span { color: var(--texto-suave); }

/* ── CRM funcional ── */
.crm-status-liberado { color: #166534; border-color: #bbebcc; background: #f0fdf4; }
.crm-boas-vindas, .crm-titulo-linha, .linha-entre {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.crm-boas-vindas { background: linear-gradient(120deg,#fff,#f4f0ff); border-color: rgba(107,56,212,.2); }
.crm-boas-vindas h3, .crm-titulo-linha h3 { margin: 3px 0; }
.crm-titulo-linha { margin: 4px 0 14px; }
.crm-titulo-linha p { margin: 4px 0 0; }
.grade-2 { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.acoes { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 6px; }
.crm-pacote.inativo { opacity: .64; }
.crm-pacote h3 { margin: 0; }
.crm-preco { display: block; color: var(--ishoot-1); font-family: 'Plus Jakarta Sans',sans-serif; font-size: 23px; margin: 12px 0 4px; }
.crm-mes-nav { display: flex; align-items: center; gap: 9px; margin-top: 8px; text-transform: capitalize; }
.crm-agenda-topo { align-items: center; }
#crm-calendario .cal-dia, #pt-calendario-rede .cal-dia { min-height: 104px; }
#crm-calendario .cal-dia.hoje, #pt-calendario-rede .cal-dia.hoje { border-color: var(--ishoot-1); box-shadow: inset 0 0 0 1px var(--ishoot-1); }
#crm-calendario .cal-dia.hoje .num, #pt-calendario-rede .cal-dia.hoje .num { color: var(--ishoot-1); }
#crm-calendario .cal-chip, #pt-calendario-rede .cal-chip { font-weight: 600; }
.cal-chip.rede-bloqueio { background: #f9e5e0; color: var(--vermelho); }
.impersonacao-aviso {
  position: sticky;
  top: 0;
  z-index: 35;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 22px;
  border-bottom: 1px solid #e8c94a;
  background: #fff7cf;
  color: #51410b;
  box-shadow: 0 3px 12px rgba(81, 65, 11, .09);
}
.impersonacao-aviso[hidden] { display: none; }
.impersonacao-aviso strong, .impersonacao-aviso span { display: block; }
.impersonacao-aviso span { margin-top: 2px; font-size: 12px; line-height: 1.4; }
.impersonacao-aviso .btn { flex: 0 0 auto; background: #5a4700; border-color: #5a4700; }
.crm-item-editor { display: grid; grid-template-columns: 1.1fr 2fr 76px 110px 38px; gap: 7px; align-items: end; margin: 7px 0; }
.crm-item-editor input, .crm-item-editor select { margin: 0; min-width: 0; }

@media (max-width: 700px) {
  .impersonacao-aviso { align-items: flex-start; padding: 9px 12px; }
  .impersonacao-aviso .btn { padding: 7px 9px; font-size: 11px; }
  .grade-2 { grid-template-columns: 1fr; gap: 4px; }
  .crm-boas-vindas, .crm-titulo-linha { align-items: flex-start; flex-direction: column; }
  .crm-boas-vindas .btn, .crm-titulo-linha > .btn { width: 100%; }
  .crm-agenda-topo { align-items: stretch; }
  .crm-agenda-topo .agenda-nav, .crm-agenda-topo > .btn { width: 100%; }
  #crm-calendario .cal-dia, #pt-calendario-rede .cal-dia { min-height: 58px; }
  .crm-item-editor { grid-template-columns: 1fr 70px 100px 38px; }
  .crm-item-editor [data-pacote] { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
  .crm-hero { align-items: flex-start; padding: 20px; }
  .crm-hero-cadeado { width: 52px; height: 52px; border-radius: 15px; font-size: 24px; }
  .crm-grade { grid-template-columns: 1fr; }
  .crm-modulo { min-height: 76px; }
  .crm-status { font-size: 9px; }
}
/* Contrato da rede e entrega RAW no portal */
.contrato-rede-texto {
  white-space: pre-wrap; overflow-wrap: anywhere; max-height: 58vh; overflow: auto;
  background: #fbfaf7; border: 1px solid var(--borda, #ddd); border-radius: 10px;
  padding: 16px; font: 14px/1.6 Inter, system-ui, sans-serif;
}
.aceite-contrato {
  display: flex; align-items: flex-start; gap: 14px; padding: 17px 18px;
  border: 2px solid #d7c9f5; border-radius: 14px;
  background: linear-gradient(120deg, #fbf9ff, #f3eeff);
  box-shadow: 0 6px 20px rgba(107,56,212,.09); cursor: pointer;
}
.aceite-contrato.marcado { border-color: var(--ishoot-1); background: #f0eaff; }
.aceite-contrato input[type="checkbox"] {
  appearance: auto; width: 28px; height: 28px; min-width: 28px; margin: 1px 0 0;
  accent-color: var(--ishoot-1); cursor: pointer;
}
.aceite-contrato label, label.aceite-contrato { margin: 0; cursor: pointer; font-weight: 400; }
.aceite-contrato label span, .aceite-contrato > span { display: block; color: var(--texto); line-height: 1.5; }
.aceite-contrato strong { display: block; margin-bottom: 4px; color: var(--ishoot-1); font-size: 15px; }
.aceite-termo { align-items: center; }
.aceite-termo > span { flex: 1; }
.assinatura-canvas {
  display: block; width: 100%; height: 170px; box-sizing: border-box;
  background: #fff; border: 1px solid var(--borda, #ccc); border-radius: 10px;
  touch-action: none; margin: 6px 0 10px;
}
.entrega-raw { border-top: 1px solid var(--borda, #ddd); padding-top: 14px; }