:root {
  --release-navy: #00142d;
  --release-orange: #f5820a;
  --release-muted: #617188;
  --release-line: #dfe7f0;
  --release-bg: #f4f7fb;
}

body.release-page { background: var(--release-bg); color: #16283d; }
.release-page .site-header { position: relative; background: var(--release-navy) !important; }
.release-content { min-height: calc(100vh - 180px); padding: 2.5rem 0 3rem; }
.release-back { display: inline-block; margin-bottom: 1.25rem; color: #1769aa; font-size: .9rem; font-weight: 700; text-decoration: none; }
.release-back:hover { color: var(--release-orange); }
.release-card { max-width: 900px; margin: 0 auto; padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid var(--release-line); border-radius: 1rem; background: #fff; box-shadow: 0 10px 30px rgba(0, 20, 45, .06); }
.release-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; padding-bottom: 1.35rem; border-bottom: 1px solid var(--release-line); }
.release-kicker { margin: 0; color: var(--release-orange); font-size: .75rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.release-heading h1 { margin: .4rem 0 .35rem; color: var(--release-navy); font-size: clamp(1.8rem, 4vw, 2.4rem); }
.release-heading p { margin: 0; color: var(--release-muted); }
.release-stage { padding: .45rem .7rem; border-radius: 2rem; color: #17613b; background: #def5e8; font-size: .75rem; font-weight: 800; white-space: nowrap; }
.release-notice { display: grid; gap: .2rem; margin: 1.5rem 0; padding: 1rem; border-left: 4px solid var(--release-orange); border-radius: .5rem; background: #fff7e8; }
.release-notice strong { color: #8b5515; font-size: .9rem; }
.release-notice span { color: #6e5b3d; font-size: .85rem; line-height: 1.45; }
.release-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 1.15rem; }
.release-field { min-width: 0; }
.release-field-wide { grid-column: 1 / -1; }
.release-field label, .release-field legend { display: block; margin-bottom: .45rem; color: var(--release-navy); font-size: .88rem; font-weight: 700; }
.release-field label span, .release-field legend span { color: var(--release-orange); }
.release-field input[type="date"], .release-field input[type="time"], .release-field input[type="text"], .release-field select, .release-field textarea { width: 100%; padding: .72rem .8rem; border: 1px solid #cbd7e5; border-radius: .5rem; color: #16283d; background: #fff; font: inherit; }
.release-field textarea { resize: vertical; }
.release-field input:focus, .release-field select:focus, .release-field textarea:focus { border-color: var(--release-orange); outline: 3px solid rgba(245, 130, 10, .16); }
#employee-search { margin-bottom: .5rem; }
.release-field small { display: block; margin-top: .4rem; color: var(--release-muted); font-size: .76rem; }
.release-options { display: flex; flex-wrap: wrap; gap: .65rem; }
.release-options label { display: inline-flex; align-items: center; gap: .4rem; margin: 0; padding: .65rem .8rem; border: 1px solid var(--release-line); border-radius: .5rem; font-weight: 600; cursor: pointer; }
.release-options label:has(input:checked) { border-color: var(--release-orange); color: #8b5515; background: #fff7e8; }
.release-options-highlight label:has(input:checked) { color: #17613b; border-color: #5cbd85; background: #effbf4; }
.release-options input { accent-color: var(--release-orange); }
.release-field fieldset, fieldset.release-field { min-width: 0; padding: 0; border: 0; }
.signature-box { display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: center; margin-top: 1.5rem; padding: 1.1rem; border: 1px solid var(--release-line); border-radius: .75rem; background: #f8fafc; }
.signature-box h2 { margin: .3rem 0; color: var(--release-navy); font-size: 1.1rem; }
.signature-box p { margin: 0; color: var(--release-muted); font-size: .82rem; }
.signature-check { display: flex; align-items: center; gap: .5rem; color: var(--release-navy); font-size: .82rem; font-weight: 700; }
.signature-check input { width: 1.1rem; height: 1.1rem; accent-color: var(--release-orange); }
.biometric-button { padding: .65rem 1rem; border: 1px solid var(--release-orange); border-radius: .5rem; color: var(--release-orange); background: #fff; font-size: .85rem; font-weight: 700; }
.biometric-button:disabled { opacity: .55; cursor: default; }
.biometric-box.is-signed { border-color: #7cc79b; background: #eef9f2; }
.biometric-box.is-signed .biometric-button { border-color: #17613b; color: #17613b; }
.biometric-box.is-error #biometric-status { color: #b42318; }
.release-error, .release-success { margin: 1rem 0 0; padding: .8rem 1rem; border-radius: .5rem; font-size: .85rem; }
.release-error { color: #8b2930; background: #fde5e6; }
.release-success { color: #17613b; background: #def5e8; }
.release-actions { display: flex; justify-content: flex-end; align-items: center; gap: .75rem; margin-top: 1.25rem; }
.release-secondary, .release-submit { padding: .72rem 1.1rem; border-radius: .5rem; font-size: .88rem; font-weight: 700; text-decoration: none; }
.release-secondary { color: #1769aa; }
.release-submit { border: 0; color: #fff; background: var(--release-orange); }
.release-submit:hover, .release-submit:focus-visible { background: #d96800; }
@media (max-width: 620px) {
  .release-heading { flex-direction: column; }
  .release-fields { grid-template-columns: 1fr; }
  .release-field-wide { grid-column: auto; }
  .signature-box { grid-template-columns: 1fr; }
  .release-actions { flex-direction: column-reverse; align-items: stretch; }
  .release-secondary, .release-submit { text-align: center; }
}
.release-success.is-done { display: grid; justify-items: center; gap: .35rem; padding: 1.4rem 1rem; text-align: center; font-size: 1rem; }
.release-success.is-done strong { font-size: 1.4rem; }
.release-success.is-done small { opacity: .8; }
.release-done-icon { display: grid; place-items: center; width: 3.2rem; height: 3.2rem; border-radius: 50%; color: #fff; background: #1e7d4b; font-size: 1.8rem; font-weight: 800; animation: release-done-pop .45s cubic-bezier(.2,.9,.3,1.3) both; }
@keyframes release-done-pop { 0% { transform: scale(0); } 100% { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .release-done-icon { animation: none; } }

/* Aviso do horário embaixo do campo Horário (js/features/lunch-time.js): só aparece no almoço (12:00–13:00) ou fora do expediente. */
.release-field small.lunch-hint { display: none; padding: .45rem .6rem; border: 1px solid #f5cf9f; border-radius: .45rem; color: #8a4300; background: #fff3e2; line-height: 1.35; }
.release-field.is-lunch input { border-color: #c62835; box-shadow: 0 0 0 .2rem rgba(198, 40, 53, .15); }
.release-field.is-lunch small.lunch-hint { display: block; border-color: #f1c4c7; color: #8b2930; background: #fdeaea; }

/* Aviso de data retroativa embaixo do campo Data (js/features/retro-date-hint.js). Só informa, não bloqueia. */
.release-field small.retro-hint { display: block; padding: .45rem .6rem; border: 1px solid #bcd9f0; border-radius: .45rem; color: #0b4a7a; background: #e3f0fb; line-height: 1.35; }
.release-field small.retro-hint[hidden] { display: none; }

/* Sem engenheiro vinculado: aviso no topo do formulário (o envio fica bloqueado até o DP ou o engenheiro vincular). */
.release-no-engineer { margin: 0 0 1rem; padding: .75rem .9rem; border: 1px solid #e0a2a6; border-radius: .55rem; color: #8b2930; background: #fff4f4; font-size: .9rem; line-height: 1.4; }
.release-no-engineer strong { display: block; margin-bottom: .15rem; }

/* "Folhas já enviadas": liberações recentes, igual na individual e na coletiva. */
.collective-history { margin-top: 1.5rem; }
.collective-history-list { display: grid; gap: .6rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.collective-history-list li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem; padding: .8rem 1rem; border: 1px solid var(--release-line); border-radius: .6rem; }
.collective-history-list strong { display: block; color: var(--release-navy); }
.collective-history-list small { color: var(--release-muted); }
.collective-history-list button { padding: .5rem .75rem; border: 1px solid #1769aa; border-radius: .45rem; color: #1769aa; background: #f2f8fd; font-size: .78rem; font-weight: 700; cursor: pointer; }
.collective-history-list button + button { margin-left: .4rem; border-color: #e0a2a6; color: #8b2930; background: #fff; }
.collective-empty { color: var(--release-muted); }
/* Botão sempre à direita, do mesmo tamanho em todas as linhas (texto comprido quebra só o texto). No celular, embaixo em todas. */
.collective-history-list li { flex-wrap: nowrap; }
.collective-history-list li > div:first-child { flex: 1; min-width: 0; }
.collective-history-list li > div:last-child { flex: none; display: flex; gap: .4rem; }
.collective-history-list li > div:last-child button + button { margin-left: 0; }
@media (max-width: 600px) { .collective-history-list li { flex-wrap: wrap; } .collective-history-list li > div:last-child { flex-basis: 100%; } }

/* Paginação das "Folhas já enviadas" (js/core/pagination.js, mesmo visual do portal). */
.pager { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.6rem 1rem; margin-top:.9rem; padding-top:.8rem; border-top:1px solid var(--release-line); color:var(--release-muted); font-size:.8rem; }
.pager[hidden] { display:none; }
.pager-info { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem .9rem; }
.pager-size-label { display:inline-flex; align-items:center; gap:.35rem; margin:0; }
.pager-size { padding:.25rem .4rem; border:1px solid var(--release-line); border-radius:.4rem; color:#16283d; background:#fff; font-size:.8rem; }
.pager-buttons { display:flex; flex-wrap:wrap; gap:.25rem; }
.pager-btn { min-width:2.1rem; padding:.35rem .6rem; border:1px solid var(--release-line); border-radius:.4rem; color:#1769aa; background:#fff; font-size:.8rem; font-weight:700; cursor:pointer; }
.pager-btn:hover:not(:disabled) { border-color:#1769aa; background:#f2f8fd; }
.pager-btn.is-current { border-color:#00142d; color:#fff; background:#00142d; cursor:default; }
.pager-btn:disabled:not(.is-current) { opacity:.45; cursor:default; }
@media (max-width:600px) { .pager { flex-direction:column; align-items:stretch; } .pager-buttons { justify-content:center; } }
/* Saída particular: "Abonado" travado no pedido de abono (js/pages/liberacao.js) */
.release-options label:has(input:disabled) { opacity: .45; cursor: not-allowed; }
.bonus-particular-hint { display: block; margin-top: .35rem; color: #b45309; font-weight: 600; }
