/* =============================================================================
    new-edit.css — Tema bonito e prático para NEW/EDIT
    - Cartões limpos, cabeçalhos com chip/ícone, barra sticky
    - Handsontable harmonizado (zebra leve, foco bonito, alturas estáveis)
    - Sem interferir no Bootstrap (tudo “suave”)
============================================================================= */

/* ===== Design tokens ===== */
:root{
    --ui-bg: #f5f7fb;
    --ui-card: #ffffff;
    --ui-border: #e6e9ef;
    --ui-soft: rgba(16,24,40,.04);
    --ui-muted: #6b7280;
    --ui-ink: #101828;
    --ui-primary: #0d6efd;
    --ui-primary-600: #0b5ed7;
    --ui-radius: 14px;
    --ui-gap: 1rem;
}

/* ===== Página ===== */
body{ background: var(--ui-bg); }
.container{ max-width: 1120px; }

/* ===== Barra de ações (sticky) ===== */
.sticky-actions{
    position: sticky; top: 0; z-index: 30;
    background: linear-gradient(180deg, rgba(245,247,251,.98), rgba(245,247,251,.85));
    padding: .75rem 0; margin-bottom: 1rem;
    backdrop-filter: saturate(140%) blur(6px);
    border-bottom: 1px solid var(--ui-border);
}

/* ===== Seções (cards) ===== */
.section-block{
    background: var(--ui-card);
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius);
    padding: 1.25rem;
    margin-bottom: 1.25rem;
    box-shadow: 0 1px 2px rgba(16,24,40,.04);
}
.section-header{
    display:flex; align-items:center; gap:.6rem;
    margin-bottom:.9rem;
}
.section-chip{
    display:inline-flex; align-items:center; justify-content:center;
    width: 36px; height: 36px;
    border-radius: 10px;
    background: var(--ui-soft);
    color: var(--ui-primary-600);
}
.section-title{ font-size: 1rem; font-weight: 700; color: var(--ui-ink); margin:10px 20px; }

.form-text{ margin-top: .25rem; color: var(--ui-muted); }

/* Inputs um tiquinho mais compactos em desktop */
@media (min-width: 992px){
    .form-control, .form-select{ padding-top:.44rem; padding-bottom:.44rem; }
}

/* Campo ghost (somente leitura “fake”) */
.form-control-ghost{
    background:#f3f4f6 !important; color:#94a3b8 !important; cursor:not-allowed !important;
}

/* ===== Botões menores firmes ===== */
.btn.btn-sm{ padding:.28rem .6rem; border-radius:10px; }
.btn i{ opacity:.9; }

/* ===== Cabeçalhos e separações ===== */
.mb-2-hard{ margin-bottom: .75rem !important; }
.mb-4-hard{ margin-bottom: 1.5rem !important; }

/* ===== HOT wrappers + headings ===== */
.hot-header{ margin-bottom: 1rem; }
.hot-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.hot-compact{ min-width: 640px; }

/* ===== Handsontable (tema) ===== */
.handsontable{ font-size:.95rem; line-height:1.25; }
.handsontable .htCore{ border-collapse:separate !important; border-spacing:0; }
.handsontable thead th{
    background:#f0f3f8; color:#111827; font-weight:700;
    border-bottom:1px solid #e5e7eb;
}
.handsontable tbody td,
.handsontable thead th,
.handsontable .ht_clone_left thead th,
.handsontable .ht_clone_left tbody td{
    border-right:1px solid #eef2f7 !important;
    border-bottom:1px solid #eef2f7 !important;
}
.handsontable tbody tr:nth-child(odd) td{ background:#fbfcfe; }

/* Foco/seleção */
.handsontable .area{
    background: rgba(13,110,253,.12) !important;
    border: 2px solid rgba(13,110,253,.55) !important;
}
.handsontable .current{
    outline:2px solid rgba(13,110,253,.72) !important;
    outline-offset:-2px;
}

/* Células */
.htCenter{ text-align:center !important; }
.htRight { text-align:right !important; }
.handsontable input[type="text"]{ padding:.275rem .4rem; line-height:1.2; }

/* Alturas estáveis (como original) */
#ruidoGrid_1{ height:520px; }
#ruidoGrid_2{ height:380px; }

/* ===== Imagens preview ===== */
.ratio.border.rounded>img{ display:block; object-fit:cover; }

/* ===== Pequenos utilitários ===== */
.text-muted-2{ color:#9aa3af; }
.icon-muted{ color:#64748b; }