/* Aparência das telas do Click: Windows clássico (Tahoma 8pt, clBtnFace), como os formulários Delphi originais. */
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body { background: #6d8da8; font: 11px Tahoma, Verdana, sans-serif; color: #000; }

/* visualizador */
.v-topo { display: flex; gap: 10px; align-items: center; padding: 6px 10px; background: #1e2b33; color: #fff; position: sticky; top: 0; z-index: 10; flex-wrap: wrap; }
.v-topo select { font: 12px Tahoma; max-width: 420px; }
#info { color: #c9d6de; }
#palco { padding: 24px; overflow: auto; }
#palco > .d-janela { display: block; width: max-content; margin: 0 auto; }

/* janela */
.d-janela { display: inline-block; border: 1px solid #555; box-shadow: 0 8px 30px rgba(0,0,0,.35); background: #f0f0f0; }
.d-titulo { height: 26px; display: flex; align-items: center; justify-content: space-between; padding: 0 0 0 8px;
  background: linear-gradient(#dbe8f5, #c2d6eb); border-bottom: 1px solid #9fb6cf; font: 12px "Segoe UI", Tahoma, sans-serif; }
.d-titulo-bts b { display: inline-block; width: 30px; text-align: center; font-weight: normal; line-height: 24px; }
.d-titulo-bts b.fechar { background: #c75050; color: #fff; width: 44px; }
.d-cliente { position: relative; overflow: hidden; background: #f0f0f0; font: 11px Tahoma, sans-serif; }

/* componentes */
.d-c { position: absolute; margin: 0; }
.d-desabilitado { opacity: .55; pointer-events: none; }
.d-rotulo { white-space: nowrap; overflow: visible; line-height: 13px; }
.d-rotulo.quebra { white-space: normal; }
.d-edit, .d-combo, .d-memo { border: 1px solid #abadb3; background: #fff; padding: 1px 3px; font: inherit; }
.d-edit:focus, .d-combo:focus, .d-memo:focus { border-color: #3399ff; outline: none; }
.d-edit[readonly] { background: #f7f7f7; color: #444; }
.d-edit.maiusculas { text-transform: uppercase; }
.d-edit.numero { text-align: right; }
.d-memo { resize: none; }
.d-check { display: flex; align-items: center; gap: 4px; white-space: nowrap; }
.d-check input { margin: 0; }
.d-grupo-radio { position: absolute; box-sizing: border-box; }
.d-grupo-radio::before { content: ""; position: absolute; left: 0; right: 0; top: 6px; bottom: 0; border: 1px solid #d5dfe5; border-radius: 3px; }
.d-grupo-legenda { position: absolute; left: 7px; top: 0; padding: 0 2px; background: inherit; background-color: #f0f0f0; line-height: 13px; }
.d-grupo-botao { position: absolute; display: flex; align-items: center; gap: 3px; white-space: nowrap; overflow: hidden; }
.d-grupo-botao input { margin: 0; width: 13px; height: 13px; }
label.d-legenda { display: flex; align-items: center; gap: 3px; }
.d-imagem.esticar img { width: 100%; height: 100%; object-fit: fill; }
.d-botao { display: inline-flex; align-items: center; justify-content: center; gap: 4px; border: 1px solid #707070; border-radius: 3px;
  background: linear-gradient(#f2f2f2, #ebebeb 49%, #dddddd 50%, #cfcfcf); font: inherit; padding: 0 6px; cursor: default; }
.d-botao:hover { border-color: #3c7fb1; background: linear-gradient(#eaf6fd, #d9f0fc 49%, #bee6fd 50%, #a7d9f5); }
.d-botao:active { background: linear-gradient(#e5f4fc, #c4e5f6 49%, #98d1ef 50%, #68b3db); }
.d-botao img.glifo { max-height: calc(100% - 4px); }
.d-painel { overflow: hidden; }
.d-painel.elevado { border: 1px solid; border-color: #fff #a0a0a0 #a0a0a0 #fff; }
.d-painel.rebaixado { border: 1px solid; border-color: #a0a0a0 #fff #fff #a0a0a0; }
.d-painel.grupo { border: 1px solid #d5dfe5; border-radius: 3px; overflow: visible; }
.d-legenda { position: absolute; left: 8px; top: -7px; background: #f0f0f0; padding: 0 3px; }
.d-painel-texto { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.d-painel.bevel { background: transparent; border: 1px solid #a0a0a0; }
.d-imagem { overflow: hidden; }
.d-imagem img { display: block; }
.d-imagem img.esticar { width: 100%; height: 100%; }
.d-imagem img.proporcional { object-fit: contain; }
.d-imagem img.centro { margin: auto; }
.d-abas { background: #f0f0f0; }
.d-abas-cab { display: flex; align-items: flex-end; gap: 0; padding-left: 2px; border-bottom: 1px solid #898c95; }
.d-aba { font: inherit; border: 1px solid #898c95; border-bottom: 0; background: linear-gradient(#f2f2f2, #dbdbdb); padding: 2px 10px; margin-right: -1px; height: calc(100% - 2px); }
.d-aba.ativa { background: #fff; height: 100%; position: relative; top: 1px; }
.d-abas-corpo { position: absolute; left: 0; right: 0; bottom: 0; background: #fff; border: 1px solid #898c95; border-top: 0; }
.d-pagina { position: absolute; inset: 0; }
.d-barra { display: flex; align-items: center; gap: 2px; padding: 2px 4px; background: linear-gradient(#fdfdfd, #e7e9ec); border-bottom: 1px solid #c5c5c5; overflow: hidden; }
.d-botao-barra { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; border: 1px solid transparent; border-radius: 2px; background: none; font: inherit; padding: 1px 4px; height: 100%; }
.d-botao-barra:hover { border-color: #a8d8eb; background: linear-gradient(#f3fbfe, #d8f0fa); }
.d-barra .na-barra { position: relative; left: auto !important; top: auto !important; }
.d-separador { width: 1px; align-self: stretch; margin: 2px 3px; background: #c5c5c5; }
.icone { display: inline-block; background-repeat: no-repeat; flex: none; }
.d-status { display: flex; background: #f0f0f0; border-top: 1px solid #c5c5c5; }
.d-status-painel { border-right: 1px solid #c5c5c5; padding: 2px 6px; white-space: nowrap; overflow: hidden; }
.d-grade { background: #fff; border: 1px solid #828790; overflow: hidden; display: flex; flex-direction: column; }
.d-grade-faixa { flex: 0 0 36px; display: flex; align-items: center; padding-left: 8px; background: #a0a0a0; color: #fff; }
.d-grade-corpo { flex: 1 1 auto; overflow: auto; min-height: 0; }
.d-rodape-caixa { flex: 0 0 auto; overflow: hidden; border-top: 1px solid #a0a0a0; }
.d-tabela td.num { text-align: right; }
.d-tabela { border-collapse: collapse; table-layout: fixed; min-width: 100%; }
.d-tabela th { background: linear-gradient(#fff, #f1f2f4); border: 1px solid #d5d5d5; border-top: 0; font-weight: normal; text-align: left; padding: 2px 4px; white-space: nowrap; overflow: hidden; }
.d-tabela td { border: 1px solid #ececec; padding: 1px 4px; white-space: nowrap; overflow: hidden; }
.d-rodape td { background: #f0f0f0; border: 1px solid #d5d5d5; height: 19px; }
.d-rodape td.total { background: #e8e8e8; text-align: right; }
.d-desconhecido { border: 1px dashed #c33; background: rgba(255,0,0,.05); }
.d-progresso { appearance: none; }
.d-rotulo.link { color: #0066cc; text-decoration: underline; cursor: pointer; }
.d-reservado { border: 1px solid #c9c9c9; background: repeating-linear-gradient(45deg, #f7f7f7, #f7f7f7 6px, #efefef 6px, #efefef 12px); }
.d-tiles { position: absolute; overflow: auto; background: #fff; }
/* Medidas do TdxTileControl do Click (Menu Fiscal capturado pelo robô): título Segoe UI Light 36pt, grupos 16pt, texto do bloco 9pt branco */
.d-tiles-titulo { position: absolute; top: 12px; font: 300 46.5px/1 "Segoe UI Light", "Segoe UI", sans-serif; color: #000; white-space: nowrap; }
.d-tiles-grupo { position: absolute; top: 117px; font: 300 22px/1 "Segoe UI Light", "Segoe UI", sans-serif; color: #000; white-space: nowrap; }
.d-tile { position: absolute; width: 120px; height: 120px; padding: 6px 7px; border: 0; display: flex; flex-direction: column; align-items: flex-start; color: #fff; background: linear-gradient(to bottom right, #4b9317, #65a930); font: 11.4px/1.25 "Segoe UI", Tahoma, sans-serif; text-align: left; cursor: pointer; overflow: hidden; }
.d-tile.grande { width: 248px; }
.d-tile span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.d-tile:hover { filter: brightness(1.08); }
.d-tile img { max-width: 48px; max-height: 48px; }
.d-barra.vertical { flex-direction: column; align-items: stretch; padding: 4px; border-bottom: 0; border-right: 1px solid #c5c5c5; background: linear-gradient(90deg, #fdfdfd, #eef0f3); }
.d-barra.vertical .d-botao-barra { flex-direction: row; justify-content: flex-start; height: 24px; gap: 6px; padding: 2px 6px; }
.d-tabela tbody tr { cursor: default; }
.d-tabela tbody tr:nth-child(even) td { background: #f7f9fc; }
.d-tabela tbody tr.sel td { background: #3399ff; color: #fff; }
/* Jv*Edit com botão embutido (calculadora / calendário / "..."), 21x17 à direita como no Click */
.d-edit-com-botao { display: flex; align-items: stretch; background: #fff; border: 1px solid #7a7a7a; box-sizing: border-box; }
.d-edit-com-botao > .d-edit { border: 0; flex: 1; min-width: 0; height: 100%; }
.d-edit-bt { flex: 0 0 21px; height: 17px; align-self: center; margin-right: 1px; background: #e8e8e8; border: 1px solid #b5b5b5; box-sizing: border-box; display: flex; align-items: center; justify-content: center; font-size: 10px; line-height: 1; }
.d-edit-bt.calc::before { content: "▦"; color: #2d5b9a; }
.d-edit-bt.date::before { content: "▾"; }
.d-edit-bt.combo::before, .d-edit-bt.filename::before, .d-edit-bt.directory::before { content: "…"; }