/* Identidade do Portal LANDD = a do app NFS-e (landd-nfse-app/app/styles.css):
   azul profundo, areia e âmbar, com tema "aconchego" (claro) e escuro. */
:root{
  color-scheme:light;
  --ink:#0c1d33; --ink-soft:#586b82;
  --paper:#fbf6e9; --surface:#fffdf6; --surface-soft:#f6ecd8; --input-bg:#fffdf6;
  --sidebar:#f6ecd8; --sidebar-soft:rgba(217,138,11,.16); --sidebar-text:#7a5a0a; --on-sidebar:#0c1d33;
  --topbar:#f0e2c6; --on-chrome:#0c1d33;
  --line:rgba(12,29,51,.14);
  --accent:#d98a0b; --accent-hover:#b87309; --on-accent:#0c1d33; --label:#8f5d05;
  --green:#1f8a4c; --green-soft:#e3f3e9; --amber:#8f5d05; --amber-soft:#fff1d0;
  --red:#c4362a; --red-soft:#fce8e5; --blue:#1d63a8; --blue-soft:#e7f0fa;
  --logo-bg:#1d568b; --logo-stroke:#f2a50c;
  --scroll-track:#f6ecd8; --scroll-thumb:#d98a0b; --scroll-thumb-hover:#b87309;
  --r-sm:10px; --r-md:14px; --r-lg:16px;
  --shadow:0 12px 30px rgba(12,29,51,.14);
  --sans:'Poppins',system-ui,sans-serif;
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --ink:#e8ecf2; --ink-soft:#b3bdcc;
  --paper:#101e2f; --surface:#1a2c44; --surface-soft:#152a44; --input-bg:#101e2f;
  --sidebar:#152a44; --sidebar-soft:#1d3d63; --sidebar-text:#f2a50c; --on-sidebar:#ffffff;
  --topbar:rgba(21,74,125,.9); --on-chrome:#ffffff;
  --line:rgba(255,255,255,.16);
  --accent:#f2a50c; --accent-hover:#ffbe3d; --on-accent:#0c1d33; --label:#f2a50c;
  --green:#3fcb7a; --green-soft:#183f31; --amber:#f2a50c; --amber-soft:#3e3319;
  --red:#f2604d; --red-soft:#47201e; --blue:#5ea0e0; --blue-soft:#1b3857;
  --scroll-track:#152a44; --scroll-thumb:#f2a50c; --scroll-thumb-hover:#ffbe3d;
  --shadow:0 14px 34px rgba(0,0,0,.5);
}

*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--paper);scrollbar-color:var(--scroll-thumb) var(--scroll-track);scrollbar-width:thin}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-track{background:var(--scroll-track);border-radius:999px}
*::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border:2px solid var(--scroll-track);border-radius:999px}
*::-webkit-scrollbar-thumb:hover{background:var(--scroll-thumb-hover)}
body{font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.55;min-height:100vh;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased}
a{color:var(--blue)}
.wrap{width:100%;max-width:1080px;margin:0 auto;padding:0 20px}
main.wrap{flex:1;padding-top:32px;padding-bottom:48px}

/* Marca: símbolo âmbar no quadrado azul, como no NFS-e */
.logo{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--logo-bg);color:var(--logo-stroke);flex:0 0 auto}
.logo svg{width:30px;height:30px}
.marca{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--on-chrome)}
.marca-nome{font-weight:700;font-size:1.2rem;letter-spacing:-.03em;line-height:1.1}
.marca-sub{display:block;color:var(--label);font-size:.72rem;font-weight:500}

.topo{background:var(--topbar);color:var(--on-chrome);border-bottom:1px solid var(--line)}
.topo-in{max-width:1080px;margin:0 auto;padding:0 20px;height:72px;display:flex;align-items:center;gap:20px}
#abas{display:flex;gap:4px;margin-left:12px;flex:1}
#abas button{background:none;border:0;color:var(--ink-soft);font:600 14px var(--sans);padding:8px 14px;border-radius:10px;cursor:pointer}
#abas button:hover,#abas button[aria-current="page"]{background:var(--sidebar-soft);color:var(--on-chrome)}
.topo-acoes{margin-left:auto;display:flex;align-items:center;gap:12px}
#sair{color:var(--on-chrome)}
.rodape{padding:20px;font-size:12.5px;color:var(--ink-soft);text-align:center}
.rodape a{color:var(--ink-soft)}

/* Botão de tema (Escuro / Aconchego) */
.theme-toggle{min-height:36px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);padding:7px 12px;display:inline-flex;align-items:center;gap:7px;font:700 .75rem var(--sans);cursor:pointer}
.theme-toggle:hover{border-color:var(--accent)}

h1{font-size:26px;font-weight:700;letter-spacing:-.03em;margin-bottom:6px}
h2{font-size:19px;font-weight:600;margin:28px 0 12px}
.sub{color:var(--ink-soft);margin-bottom:22px}
.carregando{color:var(--ink-soft)}
.eyebrow{display:block;color:var(--label);font-size:.74rem;text-transform:uppercase;letter-spacing:.12em;font-weight:700}

.cartao{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:28px;box-shadow:var(--shadow)}
.estreito{max-width:440px;margin:24px auto}
.grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}

label{display:flex;flex-direction:column;gap:6px;font-size:13.5px;font-weight:600;margin-bottom:14px}
input,select,textarea{font:inherit;font-size:15px;padding:11px 13px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--input-bg);color:var(--ink)}
input:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--sidebar-soft)}
.codigo{letter-spacing:.4em;font-size:22px;text-align:center;font-weight:600}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;border-radius:12px;font:700 14.5px var(--sans);border:0;cursor:pointer;text-decoration:none}
.btn:disabled{opacity:.6;cursor:wait}
.btn-primario{background:var(--accent);color:var(--on-accent)}
.btn-primario:hover{background:var(--accent-hover)}
.btn-azul{background:var(--blue);color:#fff}
.btn-claro{background:var(--input-bg);color:var(--ink);border:1px solid var(--line)}
.btn-perigo{background:var(--red-soft);color:var(--red)}
.btn-pequeno{padding:7px 14px;font-size:13px}
.largo{width:100%}
.link{background:none;border:0;font:600 14px var(--sans);color:var(--blue);cursor:pointer;text-decoration:underline}

.msg{border-radius:var(--r-sm);padding:12px 14px;font-size:14px;margin:12px 0}
.msg.erro{background:var(--red-soft);color:var(--red)}
.msg.ok{background:var(--green-soft);color:var(--green)}
.msg.info{background:var(--blue-soft);color:var(--blue)}

.tabela{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;font-size:14px}
.tabela th{text-align:left;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--label);background:var(--surface-soft);padding:10px 12px;border-bottom:1px solid var(--line)}
.tabela td{padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.tabela tr:last-child td{border-bottom:0}
.tabela tr.clicavel{cursor:pointer}
.tabela tr.clicavel:hover td{background:var(--sidebar-soft)}
.rolagem{overflow-x:auto}

.pill{display:inline-block;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600}
.pill.novo{background:var(--amber-soft);color:var(--amber)}
.pill.respondido,.pill.ativo{background:var(--green-soft);color:var(--green)}
.pill.descartado,.pill.inativo{background:var(--surface-soft);color:var(--ink-soft)}
.pill.convidado{background:var(--blue-soft);color:var(--blue)}

.barra{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.barra .espaco{flex:1}
.acoes{display:flex;gap:6px;flex-wrap:wrap}

.respostas{list-style:none;display:grid;gap:10px;margin-top:10px}
.respostas li{background:var(--surface-soft);border-radius:var(--r-sm);padding:10px 14px;font-size:14px}
.respostas b{display:block;font-weight:500}
.respostas span{color:var(--label);font-weight:600}

.aviso{max-height:52vh;overflow-y:auto;background:var(--surface-soft);border:1px solid var(--line);border-radius:var(--r-md);padding:18px 20px;font-size:14px}
.aviso h2{margin:0 0 10px;font-size:17px}
.aviso p,.aviso ul{margin:8px 0}
.aviso ul{padding-left:20px}

.qr{display:flex;justify-content:center;margin:12px 0}
.qr img{width:200px;height:200px;background:#fff;border-radius:var(--r-sm);padding:8px}
.segredo{font-family:ui-monospace,monospace;font-size:12.5px;word-break:break-all;background:var(--surface-soft);padding:8px 10px;border-radius:var(--r-sm)}

.boas-vindas{background:var(--sidebar);color:var(--on-sidebar);border:1px solid var(--line);border-radius:var(--r-lg);padding:32px;margin-bottom:20px}
.boas-vindas p{color:var(--sidebar-text)}
.modulo{border:1.5px dashed var(--line);border-radius:var(--r-lg);padding:24px;background:var(--surface);color:var(--ink-soft)}
.modulo b{display:block;color:var(--ink);font-size:16px;margin-bottom:4px}

dialog{margin:auto;border:0;border-radius:var(--r-lg);padding:26px;max-width:460px;width:calc(100% - 32px);box-shadow:var(--shadow);background:var(--surface);color:var(--ink)}
dialog::backdrop{background:rgba(12,29,51,.45)}

/* Fundo escolhido (menu Fundo, mesmo esquema da central de apps): foto + véu
   regulável por cima; superfícies translúcidas com desfoque. Tudo escopado em
   [data-fundo="on"]: com o fundo liso nenhuma destas regras existe.
   O véu da coluna de conteúdo NÃO acompanha o controle: é o piso de legibilidade. */
:root{--veu:52%}
:root[data-fundo="on"] body{
  background-image:linear-gradient(color-mix(in srgb,var(--paper) var(--veu),transparent),color-mix(in srgb,var(--paper) var(--veu),transparent)),var(--fundo-url);
  background-size:cover;background-position:center;background-attachment:fixed;background-repeat:no-repeat}
:root[data-fundo="on"] main.wrap{background:color-mix(in srgb,var(--paper) 30%,transparent)}
:root[data-fundo="on"] body.tela-cheia main.wrap{background:none}
:root[data-fundo="on"] .topo{background:color-mix(in srgb,var(--topbar) 78%,transparent);backdrop-filter:blur(20px) saturate(1.3);-webkit-backdrop-filter:blur(20px) saturate(1.3)}
:root[data-fundo="on"] .cartao,:root[data-fundo="on"] .tabela,:root[data-fundo="on"] .modulo{background:color-mix(in srgb,var(--surface) 84%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
:root[data-fundo="on"] .boas-vindas{background:color-mix(in srgb,var(--sidebar) 84%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
:root[data-fundo="on"] main.wrap>h1,:root[data-fundo="on"] main.wrap>h2,:root[data-fundo="on"] main.wrap>.sub,:root[data-fundo="on"] .rodape{text-shadow:0 1px 3px color-mix(in srgb,var(--paper) 85%,transparent)}
:root[data-fundo="on"] .login-page{background:transparent}
:root[data-fundo="on"] .login-brand{background:color-mix(in srgb,var(--sidebar) 80%,transparent);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
:root[data-fundo="on"] .login-card{background:color-mix(in srgb,var(--surface) 86%,transparent);padding:28px;border-radius:var(--r-lg);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
input[type=range]{padding:0;border:0;accent-color:var(--accent);background:none}

/* Tela de login dividida (igual ao NFS-e): marca à esquerda, formulário à direita */
body.tela-cheia .topo,body.tela-cheia .rodape{display:none}
body.tela-cheia main.wrap{max-width:none;padding:0}
.login-page{min-height:100vh;display:grid;grid-template-columns:minmax(320px,.85fr) minmax(420px,1.15fr);background:var(--surface)}
.login-brand{background:var(--sidebar);color:var(--on-sidebar);padding:clamp(34px,7vw,90px);display:flex;flex-direction:column;justify-content:space-between;gap:40px}
.login-brand .marca{color:var(--on-sidebar)}
.login-brand h1{font-size:clamp(2.2rem,4.6vw,4.4rem);line-height:1;letter-spacing:-.065em;margin:18px 0 22px;max-width:640px}
.login-brand p{color:var(--sidebar-text);max-width:520px;line-height:1.7}
.login-foot{color:var(--ink-soft);font-size:.78rem}
.login-foot a{color:var(--ink-soft)}
.login-panel{display:grid;place-items:center;padding:34px;position:relative}
.login-panel>.aparencia{position:absolute;right:24px;top:24px;display:flex;gap:8px}
.login-card{width:min(430px,100%)}
.login-card h2{font-size:clamp(1.8rem,3vw,2.4rem);letter-spacing:-.05em;margin:8px 0}
.login-card .muted{color:var(--ink-soft);margin-bottom:20px}
.login-note{font-size:.75rem;color:var(--ink-soft);margin-top:18px;line-height:1.6}

@media (max-width:860px){
  .login-page{grid-template-columns:1fr}
  .login-brand{padding:28px;gap:0}
  .login-brand h1{font-size:2.2rem;margin-top:36px}
  .login-brand p,.login-foot{display:none}
  .login-panel{padding:72px 22px 36px}
  .login-panel>.aparencia{top:20px;right:20px}
}
@media (max-width:700px){
  #abas{position:fixed;bottom:0;left:0;right:0;background:var(--surface);border-top:1px solid var(--line);justify-content:space-around;padding:8px;margin:0;z-index:5}
  main.wrap{padding-bottom:90px}
  .marca-sub{display:none}
  .theme-toggle span:last-child{display:none}
  .theme-toggle{width:36px;padding:7px;justify-content:center}
  .cartao{padding:22px}
}
