body.light{
    background: rgba(237, 244, 245, 1);
    font-family: "Host Grotesk", sans-serif;

}

body.dark{
    background: rgba(8, 29, 36, 1);
    font-family: "Host Grotesk", sans-serif;

}

h2, h3, h4{
    color: rgba(90, 138, 151, 1);
    font-weight: bold;

}

.bg-theme{
    background-color: #F34E16;
}

.text-theme{
    color: #F34E16
}
/* .dropdown-menu{
    z-index: 9001;
} */

.sidebar-desktop{
    width:260px;
    height:100vh;
    overflow:hidden;
}

.sidebar-header{
    flex-shrink:0;
}

.sidebar-body{
    flex:1;
    overflow-y:auto;
}

.bg-dark-theme{
    background: rgba(1, 39, 48, 1);
}
/* ===========================
   HSE SUBHEADER
=========================== */

.hse-subheader{
    max-width:100%;
    background:#fff;
    border-bottom:1px solid #e8edf2;

    display:flex;
    justify-content:space-around;
    align-items:center;

     overflow-y: hidden;

     -webkit-overflow-scrolling: touch; /* iOS */

    scrollbar-width: none;      /* Firefox */
    -ms-overflow-style: none;   /* IE/Edge antigo */

    white-space: nowrap;

    padding:10px 0;
     overflow-x: auto;
      scroll-behavior: smooth;
    overscroll-behavior-x: contain;
    touch-action: pan-x;
    cursor: grab;
    user-select: none;
}
 .hse-subheader::-webkit-scrollbar{
    display: none;              /* Chrome, Edge, Safari */
}

.hse-subheader-item{
    flex: 0 0 auto; /* impede encolher */
    min-width: 90px;
   

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    gap:6px;

    padding:8px 5px;

    color:#5b8695;
    text-decoration:none;
    /* min-width: 90px; */

    transition:.25s ease;
}

.hse-subheader-item i{
    font-size:32px;
    line-height:1;
}

.hse-subheader-item span{
    font-size:15px;
    font-weight:500;
    text-align:center;
}

.hse-subheader-item:hover{
    color:#e65a1f;
    text-decoration:none;
}

.hse-subheader-item.active{
    color:#e65a1f;
}


/* Responsivo */

@media (max-width:768px){

    .hse-subheader{
        padding:8px 0;
    }

    .hse-subheader-item i{
        font-size:26px;
    }

    .hse-subheader-item span{
        font-size:12px;
    }

}

.nav-item i{
    font-size:29px;
    margin-bottom:4px;
}

.nav-item span{
    font-size:15px;
    font-weight:500;
}

.nav-item.active{
    color:#f15a24;
}

.nav-item:hover{
    color:#f15a24;
}

/* CARD */

.hse-card{
    /* position:relative; */
    width:100%;
   

    background:#fff;

    border-radius:24px;

    /* overflow:hidden; */

    border:1px solid #dbe6ec;

    box-shadow:0 8px 24px rgba(0,0,0,.05);

    transition:.25s;
    padding: 20px;

}

.hse-card:hover{
    transform:translateY(-3px);
    box-shadow:0 15px 35px rgba(0,0,0,.08);
}

.hse-card-border{
    position:absolute;
    left:0;
    top:0;
    width:12px;
    height:100%;
    background:#C53A2D;
}

.hse-card-body{
    padding:30px 32px 26px 42px;
}

/* Header */

.hse-card-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:18px;
}

/* Categoria */

.hse-card-category{

    display:inline-flex;
    align-items:center;
    gap:12px;

    border:2px solid #c5d8e3;

    border-radius:999px;

    padding:12px 24px;

    color:#e95a20;

    background:#fff;
}

.hse-card-category i{
    font-size:24px;
}

.hse-card-category span{
    color:#243946;
    font-size:20px;
    font-weight:500;
}

/* Status */

.hse-card-status{

    background:#d8e9f7;

    color:#20567f;

    font-size:18px;

    font-weight:600;

    border-radius:10px;

    padding:12px 20px;
}

/* Conteúdo */

.hse-card-title{

    margin:0;

    font-size:28px;

    font-weight:700;

    color:#19303d;
}

.hse-card-location{

    margin-top:8px;

    font-size:20px;

    color:#5b6b75;
}

/* Rodapé */

.hse-card-footer{

    margin-top:18px;

    padding-top:16px;

    border-top:1px solid #e8edf2;

    display:flex;

    justify-content:space-between;

    align-items:center;
}

.hse-card-date{

    color:#556773;

    font-size:18px;
}

.hse-card-priority{

    color:#C53A2D;

    font-size:20px;

    font-weight:700;
}

/* Responsivo */

@media (max-width:768px){

    .hse-card-body{
        padding: 0px 0px 0px 0px;
    }

    .hse-card-header{
        flex-direction:column;
        align-items:flex-start;
        gap:15px;
    }

    .hse-card-title{
        font-size:22px;
    }

    .hse-card-location{
        font-size:18px;
    }

    /* .hse-card-footer{
        flex-direction:column;
        align-items:flex-start;
        gap:10px;
    } */
}

/* ===============================
   HSE TASK CARD
================================== */

.hse-task-card{

    display:flex;
    align-items:center;
    gap:20px;

    width:100%;
    max-width:700px;

    padding:18px 28px;

    background:#EEF4F6;

    border:1px solid #CFE0E6;

    border-radius:24px;

    transition:.25s;

}

.hse-task-card:hover{

    background:#F5FAFC;

    box-shadow:0 10px 30px rgba(0,0,0,.06);

}

/* Ícone */

.hse-task-icon{

    width:78px;
    height:78px;

    border-radius:50%;

    background:#fff;

    display:flex;
    align-items:center;
    justify-content:center;

    flex-shrink:0;

}

.hse-task-icon i{

    font-size:36px;

    color:#F05A24;

}

/* Conteúdo */

.hse-task-content{

    flex:1;

}

.hse-task-title{

    font-size:20px;

    font-weight:700;

    color:#17313F;

    margin-bottom:6px;

}

.hse-task-subtitle{

    font-size:16px;

    color:#5A6B76;

}

/* Checkbox */

.hse-task-check{

    flex-shrink:0;

}

.hse-task-check input{

    width:38px;
    height:38px;

    appearance:none;
    -webkit-appearance:none;

    border:4px solid #C8D9E0;

    border-radius:8px;

    background:#fff;

    cursor:pointer;

    transition:.2s;

}

.hse-task-check input:hover{

    border-color:#8DB8C8;

}

.hse-task-check input:checked{

    background:#2E8B57;

    border-color:#2E8B57;

    position:relative;

}

.hse-task-check input:checked::after{

    content:"✓";

    color:#fff;

    font-size:22px;

    font-weight:bold;

    position:absolute;

    left:50%;
    top:50%;

    transform:translate(-50%,-55%);

}

/* Responsivo */

@media(max-width:576px){

    .hse-task-card{

        padding:16px;

        gap:14px;

    }

    .hse-task-icon{

        width:58px;
        height:58px;

    }

    .hse-task-icon i{

        font-size:28px;

    }

    .hse-task-title{

        font-size:18px;

    }

    .hse-task-subtitle{

        font-size:14px;

    }

    .hse-task-check input{

        width:32px;
        height:32px;

    }

}

/* ===================================
   HSE STEPPER
=================================== */

.hse-stepper{

    display:flex;
    align-items:center;

    width:100%;

}

/* Cada etapa */

.hse-step{

    flex:0 0 auto;

    position:relative;

    z-index:2;

}

/* Linha */

.hse-step-line{

    flex:1;

    height:4px;

    background:#DCE7EC;

    transition:.3s;

}

/* Linha ativa */

.hse-step-line.active{

    background:#F45A18;

}

/* Bolinha */

.hse-step-circle{

    width:56px;
    height:56px;

    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:18px;
    font-weight:700;

    background:#fff;

    color:#53636D;

    border:4px solid #DCE7EC;

    transition:.3s;

}

/* Etapa atual */

.hse-step.active .hse-step-circle{

    background:#F45A18;

    border-color:#F45A18;

    color:#fff;

}

/* Etapa concluída */

.hse-step.done .hse-step-circle{

    background:#F45A18;

    border-color:#F45A18;

    color:#fff;

}

.hse-step.done i{

    font-size:22px;

}

/* Responsivo */

@media(max-width:768px){

    .hse-step-circle{

        width:42px;
        height:42px;

        font-size:15px;

        border-width:3px;

    }

    .hse-step.done i{

        font-size:16px;

    }

    .hse-step-line{

        height:3px;

    }

}

/* ======================================
   HSE OPTION GROUP
====================================== */

.hse-option-group{
    
    width:100%;

}

.hse-option-title{

    margin-bottom:20px;

    font-size:18px;

    font-weight:700;

    color:#19313F;

}

/* Grid */

.hse-option-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:22px;

}

/* Esconde radio */

.hse-option-group input[type=radio]{

    display:none;

}

/* Card */

.hse-option-card{

    display:flex;

    align-items:center;

    justify-content:center;

    text-align:center;

    height:76px;

    cursor:pointer;

    border-radius:18px;

    border:2px solid #DDE8EE;

    background:#fff;

    font-size:18px;

    font-weight:700;

    color: rgba(92, 138, 150, 1);
;

    transition:.25s;

    user-select:none;

}

/* Hover */

.hse-option-card:hover{

    border-color:#BFD4DD;

    background:#F8FBFC;

}

/* Selecionado */

.hse-option-group input[type=radio]:checked + .hse-option-card{

    background:#FF5B18;

    color:#fdfeff;

}

/* Variante vermelha */

.hse-option-danger{

    border-color:#D53C2F;

}

.hse-option-group input[type=radio]:checked + .hse-option-danger{

    background:#FCE0DE;

    border-color:#D53C2F;

    color:#C33628;

}

/* Responsivo */

@media(max-width:992px){

    .hse-option-grid{

        grid-template-columns:repeat(2,1fr);

    }

}

@media(max-width:576px){

    .hse-option-grid{

        /* grid-template-columns:1fr; */
          grid-template-columns:repeat(2,1fr);

    }

    .hse-option-card{

        height:72px;

        font-size:17px;

    }

}

/* ===========================
   TCO COMPONENTS
   Não conflita com Bootstrap 5
=========================== */

.tco-switch-group{
    display:flex;
    align-items:center;
    gap:28px;
    flex-wrap:wrap;
}

/* Switch */

.tco-toggle{
    display:flex;
    background:#d9dee3;
    border-radius:999px;
    padding:7px;
    min-width:278px;
}

.tco-toggle-btn{
    flex:1;
    height:74px;
    border:0;
    background:transparent;
    border-radius:999px;
    font-size:22px;
    font-weight:700;
    color:#52616b;
    cursor:pointer;
    transition:all .25s ease;
}

.tco-toggle-btn:hover{
    background:rgba(255,255,255,.35);
}

.tco-toggle-btn.active{
    background:#ef5316;
    color:#fff;
    box-shadow:0 5px 12px rgba(239,83,22,.30);
}

/* Botões */

.tco-icon-btn{
    width:84px;
    height:84px;
    border-radius:50%;
    border:2px solid #d9dee3;
    background:#fff;
    display:flex;
    justify-content:center;
    align-items:center;
    cursor:pointer;
    transition:all .25s ease;
    box-shadow:0 2px 6px rgba(0,0,0,.05);
    padding:0;
}

.tco-icon-btn svg{
    width:36px;
    height:36px;
}

.tco-icon-btn.success{
    color:#1c6f43;
}

.tco-icon-btn.success:hover{
    background:#1c6f43;
    color:#fff;
    border-color:#1c6f43;
}

.tco-icon-btn.danger{
    color:#c53d31;
}

.tco-icon-btn.danger:hover{
    background:#c53d31;
    color:#fff;
    border-color:#c53d31;
}

.tco-icon-btn:active{
    transform:scale(.96);
}

.tco-toggle-btn:focus,
.tco-icon-btn:focus{
    outline:none;
    box-shadow:none;
}

/* Variante compacta - uso dentro de formulários (ex: Ativo Sim/Não) */
.tco-toggle-sm{
    min-width:0;
    width:fit-content;
    padding:4px;
}

.tco-toggle-sm .tco-toggle-btn{
    height:36px;
    padding:0 18px;
    font-size:13px;
    font-weight:600;
    flex:0 0 auto;
}

.tco-toggle-sm .tco-toggle-btn.active{
    box-shadow:0 3px 8px rgba(239,83,22,.25);
}

/* =======================================================
   SELECT2
======================================================= */

.select2-container{
    width:100% !important;
    font-size:16px;
}

/* Campo fechado */

.select2-container--default .select2-selection--single{
    height:62px !important;
    border:2px solid #d8e4ec;
    border-radius:16px;
    background:#fff;
    box-shadow:none;
    transition:.25s;
}

.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single{
    border-color:#5ca9d6;
}

/* Texto */

.select2-container--default .select2-selection--single .select2-selection__rendered{

    line-height:58px;
    padding-left:22px;

    color:#516675;
    font-size:18px;
    font-weight:500;
}

/* Placeholder */

.select2-container--default .select2-selection--single .select2-selection__placeholder{

    color:#70808c;

}

/* Seta */

.select2-container--default .select2-selection--single .select2-selection__arrow{

    height:60px;
    width:55px;

}

/* Variante compacta - uso dentro de formulários (combina com .hse-input, 44px) */
.hse-select2-sm .select2-container--default .select2-selection--single{
    height:44px !important;
    border:2px solid #d7e7ef;
    border-radius:10px;
    background:#fff;
}

.hse-select2-sm .select2-container--default.select2-container--focus .select2-selection--single,
.hse-select2-sm .select2-container--default.select2-container--open .select2-selection--single{
    border-color:#3fa4dc;
    box-shadow:0 0 0 4px rgba(63,164,220,.12);
}

.hse-select2-sm .select2-container--default .select2-selection--single .select2-selection__rendered{
    line-height:40px;
    padding-left:20px;
    color:#193242;
    font-size:14px;
    font-weight:400;
}

.hse-select2-sm .select2-container--default .select2-selection--single .select2-selection__placeholder{
    color:#5b6f7c;
}

.hse-select2-sm .select2-container--default .select2-selection--single .select2-selection__arrow{
    height:40px;
    width:40px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b{

    border:none;

    width:12px;
    height:12px;

    border-right:3px solid #4f6470;
    border-bottom:3px solid #4f6470;

    transform:rotate(45deg);

    margin-top:-9px;
    margin-left:-10px;
}

/* Dropdown */

.select2-dropdown{

    border:none;
    border-radius:18px;
    overflow:hidden;

    margin-top:8px;

    box-shadow:0 18px 45px rgba(0,0,0,.15);
}

/* Opções */

.select2-results__option{

    padding:22px;

    font-size:18px;

    color:#263844;

}

/* Hover */

.select2-results__option--highlighted{

    background:#f4f8fb !important;
    color:#263844 !important;
}

/* Selecionado */

.select2-results__option--selected{

    background:#fff4ee !important;
    color:#ef5b17 !important;
    font-weight:700;

}

/* Campo de pesquisa */

.select2-search--dropdown{

    padding:12px;

}

.select2-search--dropdown .select2-search__field{

    border:1px solid #d9e5ec;
    border-radius:10px;
    padding:10px;

}

.custom-select{

    width:100%;
    height:44px;

    padding:0 55px 0 20px;

    font-size:18px;

    color:#516675;

    border:2px solid #d8e4ec;
    border-radius:10px;

    background:#fff;

    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;

    cursor:pointer;

    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%234f6470' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='2,5 9,12 16,5'/%3E%3C/svg%3E");

    background-repeat:no-repeat;
    background-position:right 22px center;

}

/* ===========================================
   HSE INPUTS
   Não conflita com Bootstrap
=========================================== */

.hse-field{

    margin-bottom:28px;

}

/* Label */

.hse-label{

    display:block;

    margin-bottom:10px;

    color:#ef5b17;

    font-size:18px;
    font-weight:700;

}

/* Input + textarea */

.hse-input,
.hse-textarea{

    width:100%;

    background:#fff;

    border:2px solid #d7e7ef;

    border-radius:10px;

    padding:0 20px;

    color:#193242;

    font-size: 14px;

    font-weight:500;

    transition:.25s;

    outline:none;

    box-shadow:none;

}

/* Input */

.hse-input{

    height:44px;

}

/* Textarea */

.hse-textarea{

    min-height:190px;

    padding-top:22px;

    resize:vertical;

}

/* Placeholder */

.hse-input::placeholder,
.hse-textarea::placeholder{

    color:#5b6f7c;

    opacity:1;

}

/* Focus */

.hse-input:focus,
.hse-textarea:focus{

    border-color:#3fa4dc;

    box-shadow:0 0 0 4px rgba(63,164,220,.12);

}

/* Disabled */

.hse-input:disabled,
.hse-textarea:disabled{

    background:#edf2f5;

    color:#7c8c97;

    cursor:not-allowed;

}

/* Erro */

.hse-error{

    border-color:#ef5b17 !important;

}

.hse-error:focus{

    border-color:#ef5b17;

    box-shadow:0 0 0 4px rgba(239,91,23,.12);

}

/* Mensagem */

.hse-feedback{

    display:block;

    margin-top:8px;

    color:#ef5b17;

    font-size:16px;

    font-weight:500;

}

/* ===================================
   HSE BUTTONS
=================================== */
.tap-avatar{
    width: 38px;
    height: 38px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    border: 2px solid #e9ecef;
}

.tap-avatar img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Selo discreto "Admin" sob o avatar */
.hse-admin-tag{
    display:block;
    margin-top:4px;
    font-size:9px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:#fff;
    background:#F34E16;
    border-radius:999px;
    padding:1px 8px;
    line-height:1.4;
    text-align:center;
    white-space:nowrap;
}

/* Empresa/Filial do usuário, ao lado do avatar */
.hse-user-org{
    display:flex;
    flex-direction:column;
    line-height:1.25;
}

.hse-user-org-line{
    font-size:11px;
    font-weight:600;
    color:#5b6f7c;
    white-space:nowrap;
}

.hse-user-org-line:first-child{
    color:#193242;
    font-weight:700;
}

.hse-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.5rem;

    vertical-align:middle;
    text-align:center;
    white-space:nowrap;

    min-height: 58px;

    padding:0 20px;

    border:2px solid transparent;
    border-radius:18px;

    background:transparent;

    font-size:22px;
    font-weight:700;
    line-height:1.5;

    text-decoration:none;

    cursor:pointer;
    user-select:none;
    touch-action:manipulation;
    -webkit-tap-highlight-color:transparent;
    -webkit-appearance:none;
    appearance:none;

    transition:
        color .15s ease-in-out,
        background-color .15s ease-in-out,
        border-color .15s ease-in-out,
        box-shadow .15s ease-in-out,
        transform .08s ease-in-out;
}

/* =========================
   PRIMARY
========================= */

.hse-btn-primary{

    background:#F34E16;
    color:#fff;
    border-color:#F34E16;

}

.hse-btn-primary:hover:not(:disabled){

    background:#e74610;
    border-color:#e74610;

}

/* =========================
   SECONDARY
========================= */

.hse-btn-secondary{

    background:#fff;

    color:#F34E16;

    border:2px solid #F34E16;

}

.hse-btn-secondary:hover:not(:disabled){

    background:#fff4ef;

}

/* =========================
   GHOST
========================= */

.hse-btn-ghost{

    background:#EDF4F8;

    color:#193242;

    border:2px solid #EDF4F8;

}

.hse-btn-ghost:hover:not(:disabled){

    background:#dfeaf0;

}

/* =========================
   DANGER
========================= */

.hse-btn-danger{

    background:#C63A2A;

    border-color:#C63A2A;

    color:#fff;

}

.hse-btn-danger:hover:not(:disabled){

    background:#b23224;

}

/* =========================
   DISABLED
========================= */

.hse-btn:disabled{

    opacity:.55;

    cursor:not-allowed;

    pointer-events:none;

}

/* =========================
   ACTIVE
========================= */

.hse-btn:active:not(:disabled){

    transform:scale(.98);

}

/* =========================
   FOCUS
========================= */

.hse-btn:focus-visible{

    box-shadow:0 0 0 4px rgba(52,152,219,.18);

}

/* =========================
   RESPONSIVO
========================= */

@media(max-width:768px){

    .hse-btn{

        width:100%;

        min-width:unset;

        height:42px;

        font-size:18px;

    }

}

.status-badge {
  display: inline-block;
  padding: 0.4em 0.9em;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: bold;
  line-height: 1.4;
  white-space: nowrap;
  background: #fff;
  border: 1.5px solid transparent;
}

.status-badge--open {
  border-color: #F34E16;
  color: #F34E16;
}

.status-badge--investigating {
  border-color: #f9aa28;
  color: #d88908;
}

.status-badge--done {
  border-color: #2e7d52;
  color: #2e7d52;
}

.status-badge--ativo {
  border-color: #2e7d52;
  color: #2e7d52;
}

.status-badge--inativo {
  border-color: #8291a3;
  color: #8291a3;
}

.status-badge--admin {
  border-color: #F34E16;
  color: #F34E16;
}

.status-badge--corporativo {
  border-color: #0b3240;
  color: #0b3240;
}

.status-badge--gestor {
  border-color: #1f7a8c;
  color: #1f7a8c;
}

.status-badge--comum {
  border-color: #8291a3;
  color: #8291a3;
}

.chip-group {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.chip {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.55em 1.1em;
  border: 1px solid #d7dde3;
  border-radius: 50rem;
  background-color: #fff;
  color: #212529;
  font-size: 0.95rem;
  line-height: 1.4;
  white-space: nowrap;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.chip:hover {
  border-color: #b6c1cc;
}

.chip__icon {
  color: #f4511e;
  font-size: 1.05rem;
}

/* Grupo */
.hse-event-group{
    display:flex;
    align-items: center;
    justify-content: space-between;
    gap:14px;
    flex-wrap: nowrap;
}

@media(min-width:769px){

    .hse-event-group{
        justify-content: flex-start;
    }
}

/* Esconde o radio */
.hse-event-group input[type=radio]{
    display:none;
}

/* Card */
.hse-event-card{

    width:100%;
    max-width: 150px;
    max-height: 150px;
   
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;

    background:#fff;

    border:2px solid #e9ecef;
    border-radius:12px;

    cursor:pointer;

    transition:.25s;

    user-select:none;
}

/* Hover */

.hse-event-card:hover{

    border-color:#ff6b35;

    transform:translateY(-2px);

    box-shadow:0 8px 20px rgba(0,0,0,.08);

}

/* Ícone */

.hse-event-icon{

    font-size:30px;

    color:#1e3442;

}
.title_theme {
    color: #5b8695;
    font-weight:700;
}

.hse-seguro-total-label{
    font-size:13px;
    color:#5b8695;
}

.hse-seguro-total-label b{
    color:#17313f;
}

body.dark .hse-seguro-total-label{
    color:#8ca2ac;
}

body.dark .hse-seguro-total-label b{
    color:#dbe7ec;
}

/* Texto */

.hse-event-card span{

    color:#20313d;

    font-size:12px;

    font-weight:600;

    text-align:center;

}

/* Selecionado */

.hse-event-group input[type=radio]:checked + .hse-event-card{

    border-color:#ff5a1f;

    box-shadow:0 0 0 3px rgba(255,90,31,.15);

}

.hse-event-group input[type=radio]:checked + .hse-event-card .hse-event-icon{

    color:#ff5a1f;

}

/* Grupo */

.hse-radio-group{
    display:flex;
    gap:10px;
    flex-wrap:nowrap;
}

/* Esconde o radio */

.hse-radio-group input[type=radio]{
    display:none;
}

/* Botão */

.hse-radio-pill{

    min-width: 64px;
    height: 36px;

    padding:0 10px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:999px;

    background:#fff;

    border:1px solid #cfe1e9;

    color:#5d8394;

    font-size:12px;
    font-weight:600;
    white-space:nowrap;

    cursor:pointer;

    transition:.20s;

    user-select:none;

}

/* Hover */

.hse-radio-pill:hover{

    transform:translateY(-1px);

}

/* ---------- NENHUMA ---------- */

.hse-pill-none{}

input[type=radio]:checked + .hse-pill-none{

    background:#eef4f6;
    border-color:#d9e5ea;
    color:#6f8792;

}

/* ---------- BAIXA ---------- */

.breadcrumbs-pill-green{
    background: rgba(46, 125, 82, 1);
    color: white;
}

.hse-pill-dark{}

input[type=radio]:checked + .hse-pill-dark{

    background:#0b3240;
    border-color:#0b3240;
    color:#fff;

}

/* ---------- MÉDIA ---------- */

.hse-pill-orange{}

input[type=radio]:checked + .hse-pill-orange{

    background:#f9aa28;
    border-color:#d88908;
    color:#fff;

}

/* ---------- ALTA ---------- */

.hse-pill-red{}

input[type=radio]:checked + .hse-pill-red{

    background:#f34b4b;
    border-color:#d73d3d;
    color:#fff;

}

/* Upload */

.hse-upload-box{

    width:100%;
    min-height:170px;

    border:2px dashed #d5e7ef;
    border-radius:18px;

    background:#fff;

    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;

    cursor:pointer;

    transition:.25s;

}

.hse-upload-box:hover{

    border-color:#6da6bb;

    background:#fafcfd;

}

.hse-upload-box i{

    font-size:48px;

    color:#5b8ea0;

    margin-bottom:18px;

}

.hse-upload-box span{

    font-size:23px;

    color:#5b8ea0;

    font-weight:600;

}


/* ---------- PREVIEW ---------- */

.hse-photo{

    position:relative;

    width:100%;
    min-height:140px;
    max-height: 140px;

    border-radius:14px;

    overflow:hidden;

    cursor:pointer;

    box-shadow:0 6px 18px rgba(0,0,0,.12);

}

.hse-photo img{

    width:100%;
    height:100%;

    object-fit:cover;

    transition:.35s;

}


/* Gradient estilo Netflix */

.hse-photo::after{

    content:"";

    position:absolute;

    inset:0;

    background:
        linear-gradient(
            140deg,
            rgba(0,0,0,.05) 20%,
            rgba(0,0,0,.75) 100%
        );

    transition:.25s;

}


/* Overlay */

.hse-overlay{

    position:absolute;

    inset:0;

    display:flex;

    justify-content:center;

    align-items:center;

    gap:12px;

    opacity:0;

    transition:.25s;

    z-index:10;

}


.hse-photo:hover img{

    transform:scale(1.08);

}


.hse-photo:hover::after{

    background:
        linear-gradient(
            140deg,
            rgba(0,0,0,.35),
            rgba(0,0,0,.85)
        );

}


.hse-photo:hover .hse-overlay{

    opacity:1;

}


.hse-remove{

    width:42px;
    height:42px;

    border-radius:50%;

    border:none;

    color:#fff;

    background:#dc3545;

    cursor:pointer;

}


.hse-remove:hover{

    background:#bb2d3b;

}

.hse-ver-foto{

    width:42px;
    height:42px;

    border-radius:50%;

    border:none;

    color:#fff;

    background:#3aa0e8;

    cursor:pointer;

}

.hse-ver-foto:hover{

    background:#2f8dcf;

}

.breadcrumbs-pill{
    background: rgba(224, 240, 242, 1);
    color: rgba(12, 43, 53, 1);
    max-width: 120px;
    font-size: 13px;


}

/* Container */

.hse-segment{

    position:relative;

    display:grid;
    grid-template-columns:repeat(4,1fr);

    width:100%;

    max-width:650px;

    padding:4px;

    border:1px solid #cfdde5;

    border-radius:14px;

    background:#eef6fa;

}

/* Esconde radios */

.hse-segment input{

    display:none;

}

/* Botões */

.hse-segment label{

    position:relative;

    z-index:2;

    height:44px;

    display:flex;

    justify-content:center;

    align-items:center;

    cursor:pointer;

    font-size:13px;

    font-weight:600;

    color:#5f8799;

    transition:.25s;

    user-select:none;

}

/* Slider */

.hse-segment-slider{

    position:absolute;

    top:4px;
    left:4px;

    width:calc((100% - 8px)/4);

    height:44px;

    border-radius:10px;

    background:#ff5b18;

    box-shadow:
        0 6px 16px rgba(255,91,24,.35);

    transition:
        transform .30s cubic-bezier(.22,.8,.25,1);

}

/* Texto ativo */

#exp1:checked ~ label[for="exp1"],
#exp2:checked ~ label[for="exp2"],
#exp3:checked ~ label[for="exp3"],
#exp4:checked ~ label[for="exp4"]{

    color:#fff;

}

/* Movimento do slider */

#exp1:checked ~ .hse-segment-slider{

    transform:translateX(0);

}

#exp2:checked ~ .hse-segment-slider{

    transform:translateX(100%);

}

#exp3:checked ~ .hse-segment-slider{

    transform:translateX(200%);

}

#exp4:checked ~ .hse-segment-slider{

    transform:translateX(300%);

}

/* Hover */

.hse-segment label:hover{

    color:#255468;

}

.epi-checkbox-group {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 10px;
}

.epi-checkbox {
    position: relative;
    display: inline-block;
    margin: 0;
    padding: 0;
    cursor: pointer;
    user-select: none;
}

.epi-checkbox input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.epi-checkbox span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 44px;
    padding: 7px 17px;

    border: 1px solid #c5d8df;
    border-radius: 22px;

    background: #fff;
    color: #56869a;

    font-size: 18px;
    font-weight: 600;
    line-height: 1.2;

    transition: all 0.2s ease;
}

/* Selecionado */
.epi-checkbox input:checked + span {
    background: #f4511e;
    border-color: #f4511e;
    color: #fff;
}

/* Hover */
.epi-checkbox:hover span {
    border-color: #f4511e;
}

/* Foco pelo teclado */
.epi-checkbox input:focus-visible + span {
    outline: 2px solid rgba(244, 81, 30, 0.35);
    outline-offset: 2px;
}

.qtd-control {
    width: 100%;
    min-height: 72px;

    display: flex;
    align-items: center;
    gap: 12px;

    padding: 10px;

    background: #fff;
    border: 1px solid #cbdde2;
    border-radius: 10px;

    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);

    box-sizing: border-box;
}

.qtd-valor {
    flex: 1;

    padding-left: 12px;

    color: #163746;
    font-size: 21px;
    font-weight: 400;
}

/* Botões */
.qtd-btn {
    width: 40px;
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0;
    border: 0;
    border-radius: 8px;

    font-size: 16px;
    cursor: pointer;

    transition: all 0.15s ease;
}

/* Menos */
.qtd-btn-minus {
    background: #cbdde2;
    color: #163746;
}

/* Mais */
.qtd-btn-plus {
    background: #f4511e;
    color: #fff;
}

/* Hover */
.qtd-btn-minus:hover {
    background: #b8cfd6;
}

.qtd-btn-plus:hover {
    background: #df4215;
}

/* Clique */
.qtd-btn:active {
    transform: scale(0.94);
}

/* Foco */
.qtd-btn:focus-visible {
    outline: 2px solid rgba(244, 81, 30, 0.35);
    outline-offset: 2px;
}

/* ===================================
   HSE WIZARD (localização de lesão / impacto ambiental / patrimônio)
=================================== */

/* Variantes de cor do breadcrumb (severidade) */
.breadcrumbs-pill-orange{
    background: rgba(249, 170, 40, 1);
    color: white;
}

.breadcrumbs-pill-red{
    background: rgba(243, 75, 75, 1);
    color: white;
}

/* Etiqueta de classificação de dano patrimonial (% sobre o valor de seguro) */
.hse-classe-dano{
    display:inline-flex;
    align-items:center;

    padding:6px 14px;

    border-radius:999px;

    font-size:12px;
    font-weight:700;
    letter-spacing:.3px;

    color:#fff;

    box-shadow:0 2px 6px rgba(0,0,0,.12);
}

.hse-classe-dano-yellow{
    background: rgba(249, 200, 40, 1);
    color: rgba(90, 60, 0, 1);
}

.hse-classe-dano-orange{
    background: rgba(249, 170, 40, 1);
}

.hse-classe-dano-red{
    background: rgba(243, 75, 75, 1);
}

/* Pill de navegação/seleção sem radio (Corpo/Cabeça, etc) */
.hse-radio-pill.active{
    background:#0b3240;
    border-color:#0b3240;
    color:#fff;
}

/* Ilustração do corpo/cabeça (somente exibição) */
.hse-body-illustration{
    display:block;
    margin:0 auto;
    max-width:220px;
    width:100%;
    height:auto;
}

/* Tag de região selecionada (corpo/cabeça) */
.hse-tag-selected{
    display:inline-flex;
    align-items:center;
    gap:8px;

    padding:8px 14px;

    border:1.5px solid #f4511e;
    border-radius:999px;

    background:#fff5f0;
    color:#f4511e;

    font-size:14px;
    font-weight:600;
}

.hse-tag-selected i{
    cursor:pointer;
    font-size:12px;
}

/* Grid de opção com 2 colunas (Sim/Não) */
.hse-option-grid-2{
    grid-template-columns:repeat(2,1fr);
}

/* Áreas clicáveis sobre o SVG do corpo/cabeça */
.hse-hitzone{
    fill:rgba(0,0,0,0);
    stroke:transparent;
    stroke-width:2;
    cursor:pointer;
    transition:.2s;
}

.hse-hitzone:hover{
    fill:rgba(244,81,30,.15);
}

.hse-hitzone.hse-hitzone-active{
    fill:rgba(244,81,30,.35);
    stroke:#f4511e;
}

/* ===================================
   HSE RELATÓRIOS (dashboard de filial)
=================================== */

/* Filtro de período */
.hse-period-group{
    display:flex;
    gap:8px;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding-bottom:2px;
}

.hse-period-group::-webkit-scrollbar{
    display:none;
}

.hse-period-group input[type=radio]{
    display:none;
}

.hse-period-pill{
    flex:0 0 auto;
    padding:10px 20px;
    border-radius:999px;
    border:1px solid #d8e4ec;
    background:#fff;
    color:#5d8394;
    font-size:14px;
    font-weight:600;
    cursor:pointer;
    white-space:nowrap;
    transition:.2s;
    user-select:none;
}

.hse-period-group input[type=radio]:checked + .hse-period-pill{
    background:#F34E16;
    border-color:#F34E16;
    color:#fff;
}

.hse-period-group-wrap{
    flex-wrap:wrap;
    overflow:visible;
}

.hse-period-group-wrap .hse-period-pill{
    padding:8px 18px;
}

/* Chips de filtros ativos (relatórios) */
.hse-filter-chip{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:5px 12px;
    border-radius:999px;
    background:#fff;
    border:1px solid #d8e4ec;
    color:#5d8394;
    font-size:12px;
    font-weight:600;
    max-width:100%;
}

.hse-filter-chip.main{
    background:#fff3ee;
    border-color:#F34E16;
    color:#F34E16;
}

body.dark .hse-filter-chip{
    background:#16262f;
    border-color:#2c4452;
    color:#9fb5c2;
}

body.dark .hse-filter-chip.main{
    background:#2a1a14;
    border-color:#F34E16;
    color:#ff8a5c;
}

.hse-input-search-group{
    display:flex;
    align-items:center;
    gap:8px;
}

.hse-input-search-group .hse-input{
    flex:1;
    min-width:0;
}

/* Botão de ícone do cabeçalho */
.hse-icon-btn{
    width:42px;
    height:42px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#EDF4F8;
    color:#193242;
    cursor:pointer;
    transition:.2s;
    flex-shrink:0;
}

.hse-icon-btn-highlight{
    background:rgba(243,78,22,.12);
    color:#F34E16;
}

.hse-icon-btn-highlight:hover{
    background:rgba(243,78,22,.22);
}

.hse-icon-btn-label{
    width:auto;
    padding:0 16px;
    gap:8px;
    font-size:14px;
    font-weight:600;
    white-space:nowrap;
}

.hse-icon-btn:hover{
    background:#dfeaf0;
}

/* Botão "Filtros" (mobile) com badge de contagem de filtros ativos */
.hse-filtros-trigger{
    position:relative;
}

.hse-filtros-badge{
    position:absolute;
    top:-6px;
    right:-6px;
    min-width:18px;
    height:18px;
    padding:0 4px;
    border-radius:999px;
    background:#F34E16;
    color:#fff;
    font-size:11px;
    font-weight:700;
    line-height:1;
    display:flex;
    align-items:center;
    justify-content:center;
    border:2px solid #fff;
}

.hse-filtros-badge.d-none{
    display:none;
}

/* A partir do breakpoint lg, o offcanvas de filtros vira uma barra inline normal (sem sheet) */
@media (min-width: 992px){
    .hse-filtros-offcanvas{
        position:static !important;
        transform:none !important;
        visibility:visible !important;
        display:flex !important;
        flex-wrap:wrap;
        align-items:center;
        gap:8px;
        width:auto !important;
        max-width:none !important;
        height:auto !important;
        min-height:0 !important;
        background:transparent !important;
        box-shadow:none !important;
        border:0 !important;
        z-index:auto !important;
    }

    .hse-filtros-offcanvas .offcanvas-header,
    .hse-filtros-offcanvas .hse-filtros-footer{
        display:none !important;
    }

    .hse-filtros-offcanvas .offcanvas-body{
        display:flex !important;
        flex-wrap:wrap;
        align-items:center;
        gap:8px;
        padding:0 !important;
        overflow:visible !important;
    }
}

/* Card genérico de relatório */
.hse-report-card{
    background:#fff;
    border:1px solid #e8edf2;
    border-radius:18px;
    padding:18px;
    box-shadow:0 4px 14px rgba(0,0,0,.04);
}

.hse-report-title{
    font-size:13px;
    font-weight:700;
    letter-spacing:.02em;
    color:#5b8695;
    text-transform:uppercase;
}

/* Stat card */
.hse-stat-label{
    display:flex;
    align-items:center;
    justify-content:space-between;
    font-size:13px;
    color:#5b8695;
    font-weight:600;
    margin-bottom:10px;
}

.hse-stat-value{
    font-size:28px;
    font-weight:700;
    color:#17313f;
    line-height:1;
}

.hse-stat-sub{
    display:block;
    margin-top:8px;
    font-size:13px;
    color:#8291a3;
}

.hse-stat-sub.up{
    color:#2e7d52;
    font-weight:600;
}

/* Destaque - Valor Total de Seguro */
.hse-insurance-highlight{
    display:flex;
    align-items:center;
    gap:16px;
    flex-wrap:wrap;
    background:linear-gradient(135deg, rgba(243,78,22,.08), rgba(243,78,22,.02));
    border:1px solid rgba(243,78,22,.25);
    border-radius:18px;
    padding:16px 20px;
}

.hse-insurance-icon{
    width:52px;
    height:52px;
    border-radius:14px;
    background:#F34E16;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:20px;
    flex-shrink:0;
    box-shadow:0 4px 12px rgba(243,78,22,.35);
}

.hse-insurance-info{
    flex:1;
    min-width:220px;
}

.hse-insurance-label{
    display:block;
    font-size:13px;
    font-weight:700;
    color:#5b8695;
    text-transform:uppercase;
    letter-spacing:.02em;
    margin-bottom:8px;
}

.hse-insurance-sub{
    display:block;
    font-size:11px;
    font-weight:500;
    text-transform:none;
    color:#8291a3;
    letter-spacing:0;
    margin-top:2px;
}

.hse-insurance-input-wrap{
    display:flex;
    align-items:center;
    background:#fff;
    border:1px solid #e8edf2;
    border-radius:12px;
    padding:0 14px;
    max-width:280px;
    transition:.2s;
}

.hse-insurance-input-wrap:focus-within{
    border-color:#F34E16;
    box-shadow:0 0 0 3px rgba(243,78,22,.12);
}

.hse-insurance-prefix{
    font-weight:700;
    color:#17313f;
    margin-right:6px;
}

.hse-insurance-input{
    border:none;
    outline:none;
    background:transparent;
    padding:12px 0;
    font-size:20px;
    font-weight:700;
    color:#17313f;
    width:100%;
}

/* Bolinha indicadora */
.hse-dot{
    display:inline-block;
    width:8px;
    height:8px;
    border-radius:50%;
    flex-shrink:0;
}

/* Barras horizontais (Eventos por tipo) */
.hse-bar-row{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:16px;
}

.hse-bar-row:last-child{
    margin-bottom:0;
}

.hse-bar-label{
    width:100px;
    font-size:14px;
    color:#243946;
    font-weight:600;
    flex-shrink:0;
}

.hse-bar-track{
    flex:1;
    height:8px;
    background:#e8edf2;
    border-radius:999px;
    overflow:hidden;
}

.hse-bar-fill{
    height:100%;
    border-radius:999px;
}

.hse-bar-value{
    width:28px;
    text-align:right;
    font-weight:700;
    color:#17313f;
    flex-shrink:0;
}

/* Donut (Eventos por gravidade) */
.hse-donut-wrap{
    position:relative;
    width:150px;
    height:150px;
    margin:8px auto 18px;
}

.hse-donut-center{
    position:absolute;
    inset:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
}

.hse-donut-value{
    font-size:26px;
    font-weight:700;
    color:#17313f;
    line-height:1;
}

.hse-donut-label{
    font-size:12px;
    color:#8291a3;
    margin-top:4px;
}

.hse-legend{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:16px;
}

.hse-legend-item{
    display:flex;
    align-items:center;
    gap:6px;
    font-size:13px;
    color:#243946;
}

.hse-legend-item b{
    color:#17313f;
}

/* Linha temporal */
.hse-line-legend{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:18px;
    margin-top:10px;
}

.hse-line-legend-item{
    display:flex;
    align-items:center;
    gap:6px;
    font-size:13px;
    color:#5b8695;
}

.hse-line-legend-swatch{
    width:16px;
    height:2px;
    border-radius:2px;
}

/* Eventos por status */
.hse-status-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:14px 16px;
    background:#f7fafb;
    border-radius:14px;
    margin-bottom:10px;
}

.hse-status-row:last-child{
    margin-bottom:0;
}

.hse-status-left{
    display:flex;
    align-items:center;
    gap:10px;
    font-weight:600;
    color:#243946;
}

.hse-status-square{
    width:10px;
    height:10px;
    border-radius:4px;
    display:inline-block;
    flex-shrink:0;
}

/* Unidades com maior risco (visão corporativa) */
.hse-risk-card{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    padding:14px 16px;
    background:#f7fafb;
    border-radius:14px;
    margin-bottom:10px;
    border-left:3px solid transparent;
}

.hse-risk-card:last-child{
    margin-bottom:0;
}

.hse-risk-card.risco-alto{
    border-left-color:#f34b4b;
}

.hse-risk-card.risco-medio{
    border-left-color:#f9822e;
}

.hse-risk-title{
    font-weight:700;
    color:#17313f;
    font-size:14px;
    margin-bottom:2px;
}

.hse-risk-desc{
    font-size:13px;
    color:#5b8695;
}

.hse-risk-time{
    font-size:11px;
    color:#8291a3;
    margin-top:6px;
}

.hse-risk-badge{
    font-size:11px;
    font-weight:700;
    padding:4px 10px;
    border-radius:999px;
    white-space:nowrap;
    flex-shrink:0;
}

.hse-risk-badge.alto{
    background:rgba(243,75,75,.12);
    color:#f34b4b;
}

.hse-risk-badge.medio{
    background:rgba(249,130,46,.12);
    color:#f9822e;
}

/* Taxa de eventos - tendência (visão corporativa) */
.hse-trend-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:12px 0;
    border-bottom:1px solid #eef2f5;
}

.hse-trend-row:last-child{
    border-bottom:none;
    padding-bottom:0;
}

.hse-trend-label{
    font-size:13px;
    color:#5b8695;
    font-weight:600;
}

.hse-trend-value{
    font-size:20px;
    font-weight:700;
    color:#17313f;
}

.hse-trend-spark{
    display:flex;
    align-items:flex-end;
    gap:3px;
    height:24px;
    flex-shrink:0;
}

.hse-trend-spark span{
    width:5px;
    border-radius:2px;
}

.hse-trend-arrow{
    font-size:14px;
    font-weight:700;
    flex-shrink:0;
    width:20px;
    text-align:center;
}

.hse-trend-arrow.down{
    color:#2e7d52;
}

.hse-trend-arrow.up{
    color:#f9822e;
}

.hse-trend-arrow.flat{
    color:#8291a3;
}

/* ===================================
   HSE EVENTOS - FEED (tela inicial)
=================================== */

/* Sub-tabs (Aguardando investigação / Todos os eventos) */
.hse-subtabs{
    display:flex;
    gap:26px;
    border-bottom:1px solid #e8edf2;
    margin-bottom:18px;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
}

.hse-subtabs::-webkit-scrollbar{
    display:none;
}

.hse-subtab{
    flex:0 0 auto;
    padding:10px 2px 12px;
    font-weight:700;
    font-size:15px;
    color:#8291a3;
    cursor:pointer;
    border-bottom:2px solid transparent;
    white-space:nowrap;
    user-select:none;
}

.hse-subtab.active{
    color:#F34E16;
    border-bottom-color:#F34E16;
}

/* Badge de tipo do evento (ACIDENTE / INCIDENTE / QUASE-ACIDENTE) */
.hse-event-type-badge{
    display:inline-block;
    padding:4px 10px;
    border-radius:6px;
    background:#0b3240;
    color:#fff;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.02em;
}

/* Card da listagem de eventos */
.hse-event-list-card{
    display:block;
    background:#fff;
    border-radius:16px;
    border-left:4px solid #cfd9e0;
    box-shadow:0 4px 14px rgba(0,0,0,.05);
    padding:16px 18px;
    margin-bottom:14px;
    text-decoration:none;
}

.hse-event-list-card.status-aberto{
    border-left-color:#F34E16;
}

.hse-event-list-card.status-investigacao{
    border-left-color:#f9aa28;
}

.hse-event-list-card.status-concluido{
    border-left-color:#2e7d52;
}

.hse-event-list-card.status-ativo{
    border-left-color:#2e7d52;
}

.hse-event-list-card.status-inativo{
    border-left-color:#cfd9e0;
}

.hse-event-list-title{
    font-size:17px;
    font-weight:700;
    color:#17313f;
    margin:10px 0 2px;
}

.hse-event-list-sub{
    font-size:13px;
    color:#8291a3;
}

.hse-event-list-acoes{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    justify-content:flex-end;
}

@media(min-width:769px){

    .hse-event-list-resumo,
    .hse-event-list-investigar{
        min-height:unset;
        height:34px;
        padding:0 14px;
        border-radius:10px;
        font-size:13px;
        gap:.35rem;
    }
}

/* Card tracejado "adicionar item" (CRUD dentro de wizard) */
.hse-add-card{
    display:flex;
    align-items:center;
    justify-content:center;
    border:2px dashed #cfd9e0;
    border-radius:16px;
    padding:16px 18px;
    margin-bottom:14px;
    color:#5b6f7c;
    font-weight:600;
    cursor:pointer;
    transition:.2s;
}

.hse-add-card:hover{
    border-color:#F34E16;
    color:#F34E16;
    background:rgba(243,78,22,.04);
}

/* Botão flutuante (Registrar evento) */
.hse-fab{
    position:fixed;
    right:24px;
    bottom:24px;
    z-index:1030;

    display:inline-flex;
    align-items:center;
    gap:10px;

    padding:16px 26px;

    border-radius:999px;
    border:none;

    background:#F34E16;
    color:#fff;

    font-weight:700;
    font-size:16px;

    box-shadow:0 10px 25px rgba(243,78,22,.35);

    cursor:pointer;
    text-decoration:none;
}

.hse-fab:hover{
    background:#e74610;
    color:#fff;
}

@media(max-width:576px){

    .hse-fab{
        right:16px;
        bottom:16px;
        padding:14px 22px;
        font-size:15px;
    }
}

/* ===================================
   HSE PERFIL (avatar upload / senha)
=================================== */

.hse-avatar-upload{
    position:relative;
    width:120px;
    height:120px;
    margin:0 auto;
}

.hse-avatar-upload img{
    width:120px;
    height:120px;
    border-radius:50%;
    object-fit:cover;
    border:3px solid #edf4f8;
    background:#edf4f8;
    display:block;
}

.hse-avatar-edit-btn{
    position:absolute;
    right:0;
    bottom:0;

    width:38px;
    height:38px;

    border-radius:50%;

    background:#F34E16;
    color:#fff;

    display:flex;
    align-items:center;
    justify-content:center;

    cursor:pointer;

    border:3px solid #fff;
    box-shadow:0 4px 10px rgba(0,0,0,.15);

    transition:.2s;
}

.hse-avatar-edit-btn:hover{
    background:#e74610;
}

/* Toggle de mostrar/ocultar senha */
.hse-senha-toggle{
    position:absolute;
    right:15px;
    top:50%;
    transform:translateY(-50%);
    cursor:pointer;
    color:#F34E16;
}

/* ===================================
   HSE DESKTOP HEADER
=================================== */

.hse-desktop-header{
    justify-content:space-between;
    padding:12px 24px;
    background:#fff;
    border-bottom:1px solid #e8edf2;
}

.hse-desktop-header-right{
    display:flex;
    align-items:center;
    gap:22px;
}

.hse-desktop-logo{
    display:flex;
    align-items:center;
    gap:10px;
    flex-shrink:0;
    text-decoration:none;
}

.hse-desktop-logo:hover{
    text-decoration:none;
}

.hse-desktop-tagline{
    font-size:11px;
    font-weight:700;
    letter-spacing:.04em;
    color:#8291a3;
    white-space:nowrap;
    padding-left:10px;
    border-left:1px solid #e8edf2;
}

.hse-desktop-nav{
    display:flex;
    align-items:center;
    gap:4px;
    flex-shrink:0;
}

.hse-desktop-nav-item{
    display:inline-flex;
    align-items:center;
    gap:8px;

    padding:9px 16px;
    border-radius:999px;

    font-size:14px;
    font-weight:600;
    color:#5b6b75;

    white-space:nowrap;
    text-decoration:none;

    transition:.2s;
}

.hse-desktop-nav-item:hover{
    background:#f4f8fb;
    color:#243946;
    text-decoration:none;
}

.hse-desktop-nav-item.active{
    background:#fde3d8;
    color:#F34E16;
}

.hse-nav-dot{
    width:6px;
    height:6px;
    border-radius:50%;
    background:#3aa0e8;
    display:inline-block;
}

.hse-desktop-search{
    flex:1;
    max-width:280px;

    display:flex;
    align-items:center;
    gap:10px;

    padding:9px 16px;
    border-radius:999px;

    background:#eef4f6;
    color:#8291a3;
}

.hse-desktop-search input{
    flex:1;
    border:none;
    background:transparent;
    outline:none;
    font-size:14px;
    color:#243946;
    min-width:0;
}

.hse-desktop-search input::placeholder{
    color:#8291a3;
}

.hse-header-cta{
    flex-shrink:0;
    padding:10px 20px;
    border-radius:999px;
    background:#F34E16;
    color:#fff;
    font-weight:700;
    font-size:14px;
    white-space:nowrap;
    text-decoration:none;
    transition:.2s;
}

.hse-header-cta:hover{
    background:#e74610;
    color:#fff;
}

/* ===================================
   HSE INÍCIO (hero animado + atalhos)
=================================== */

.hse-hero-card{
    background: rgba(1, 39, 48, 1);
    border-radius:24px;
    padding:40px 32px;

    display:flex;
    align-items:center;
    gap:26px;
    flex-wrap:wrap;
}

.hse-hero-mark{
    flex-shrink:0;
}

.hse-hero-mark path{
    opacity:0;
}

.hse-hero-mark .mark-square{
    transform-origin:center;
    animation:hseMarkSquareIn .5s cubic-bezier(.22,.8,.25,1) .15s forwards;
}

.hse-hero-mark .mark-t{
    transform-origin:center;
    animation:hseMarkTIn .55s cubic-bezier(.22,.8,.25,1) .45s forwards;
}

.hse-hero-mark .mark-dot{
    transform-origin:center;
    animation:hseMarkDotIn .5s cubic-bezier(.34,1.56,.64,1) .95s forwards;
}

.hse-hero-wordmark{
    opacity:0;
    animation:hseWordmarkIn .5s ease 1.15s forwards;
}

.hse-hero-wordmark h2{
    color:#fff;
    font-weight:700;
    margin:0 0 6px;
}

.hse-hero-wordmark p{
    color:#9fb4bd;
    font-size:15px;
    margin:0;
}

@keyframes hseMarkSquareIn{
    0%{ opacity:0; transform:scale(.4) translateY(10px); }
    100%{ opacity:1; transform:scale(1) translateY(0); }
}

@keyframes hseMarkTIn{
    0%{ opacity:0; transform:scaleY(0) translateY(-16px); }
    100%{ opacity:1; transform:scaleY(1) translateY(0); }
}

@keyframes hseMarkDotIn{
    0%{ opacity:0; transform:scale(0); }
    65%{ opacity:1; transform:scale(1.25); }
    100%{ opacity:1; transform:scale(1); }
}

@keyframes hseWordmarkIn{
    0%{ opacity:0; transform:translateX(-14px); }
    100%{ opacity:1; transform:translateX(0); }
}

@media(max-width:576px){

    .hse-hero-card{
        justify-content:center;
        text-align:center;
        padding:32px 20px;
    }
}

/* Grid de atalhos */
.hse-shortcut-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(140px, 1fr));
    gap:16px;
    margin-top:22px;
}

.hse-shortcut-card{
    background:#fff;
    border:1px solid #e8edf2;
    border-radius:18px;
    padding:26px 16px;

    display:flex;
    flex-direction:column;
    align-items:center;
    gap:12px;

    text-decoration:none;
    color:#17313f;

    box-shadow:0 4px 14px rgba(0,0,0,.04);
    transition:transform .2s, box-shadow .2s;

    opacity:0;
    animation:hseShortcutIn .5s ease forwards;
}

.hse-shortcut-card:hover{
    transform:translateY(-4px);
    box-shadow:0 10px 26px rgba(0,0,0,.08);
    color:#17313f;
    text-decoration:none;
}

.hse-shortcut-card:nth-child(1){ animation-delay:1.35s; }
.hse-shortcut-card:nth-child(2){ animation-delay:1.42s; }
.hse-shortcut-card:nth-child(3){ animation-delay:1.49s; }
.hse-shortcut-card:nth-child(4){ animation-delay:1.56s; }
.hse-shortcut-card:nth-child(5){ animation-delay:1.63s; }
.hse-shortcut-card:nth-child(6){ animation-delay:1.70s; }

.hse-shortcut-icon{
    width:56px;
    height:56px;
    border-radius:16px;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:23px;
}

.hse-shortcut-label{
    font-weight:700;
    font-size:15px;
    text-align:center;
}

@keyframes hseShortcutIn{
    0%{ opacity:0; transform:translateY(16px); }
    100%{ opacity:1; transform:translateY(0); }
}

/* ---------- Tríade animada (tela inicial) ---------- */

.hse-triade-hero-card{
    background: rgba(1, 39, 48, 1);
    border-radius:24px;
    padding:36px 24px;
    margin-top:22px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:18px;

    cursor:pointer;
}

.hse-triade-hero-svg{
    width:100%;
    max-width:220px;
    height:auto;
    display:block;
}

.hse-triade-hero-svg path{
    transition:transform .5s cubic-bezier(.34,1.56,.64,1);
    transform-box:fill-box;
    transform-origin:center;
}

.hse-triade-hero-card:hover .hse-triade-hero-svg path:nth-child(1){
    transform:translate(-16px, 10px) rotate(-10deg);
}

.hse-triade-hero-card:hover .hse-triade-hero-svg path:nth-child(2){
    transform:translate(14px, -16px) rotate(12deg);
}

.hse-triade-hero-card:hover .hse-triade-hero-svg path:nth-child(3){
    transform:translate(6px, 18px) rotate(-8deg);
}

.hse-triade-hero-caption{
    text-align:center;
}

.hse-triade-hero-caption b{
    display:block;
    color:#fff;
    font-size:17px;
    margin-bottom:4px;
}

.hse-triade-hero-caption span{
    color:#8fb0b8;
    font-size:13px;
}

/* =========================================================
   MODO ESCURO
   (body.dark, aplicado conforme usuarios.tema)
========================================================= */

body.dark{
    color:#dbe7ec;
}

body.dark h2,
body.dark h3,
body.dark h4{
    color:#7ea5b2;
}

body.dark .text-dark{
    color:#eaf2f4 !important;
}

body.dark .text-muted{
    color:#8ca2ac !important;
}

/* ---------- Header / navegação ---------- */

body.dark .hse-desktop-header{
    background:#0c2029;
    border-bottom-color:#1c3038;
}

body.dark .hse-desktop-tagline{
    color:#8ca2ac;
    border-left-color:#22383f;
}

body.dark .hse-desktop-nav-item{
    color:#9bb0b9;
}

body.dark .hse-user-org-line{
    color:#8ca2ac;
}

body.dark .hse-user-org-line:first-child{
    color:#eaf2f4;
}

body.dark .hse-desktop-nav-item:hover{
    background:#132a33;
    color:#eaf2f4;
}

body.dark .hse-desktop-nav-item.active{
    background:rgba(243,78,22,.18);
    color:#ff8a5c;
}

body.dark .hse-desktop-search{
    background:#132a33;
    color:#8ca2ac;
}

body.dark .hse-desktop-search input{
    color:#eaf2f4;
}

body.dark .hse-desktop-search input::placeholder{
    color:#76909a;
}

body.dark .hse-subheader{
    background:#0c2029;
    border-bottom-color:#1c3038;
}

body.dark .hse-subheader-item{
    color:#8ca2ac;
}

body.dark .hse-subheader-item:hover,
body.dark .hse-subheader-item.active{
    color:#ff8a5c;
}

body.dark .dropdown-menu{
    background:#102830;
    border-color:#1c3644;
}

body.dark .dropdown-item{
    color:#dbe7ec;
}

body.dark .dropdown-item:hover,
body.dark .dropdown-item:focus{
    background:#183440;
    color:#eaf2f4;
}

/* ---------- Cards ---------- */

body.dark .hse-card,
body.dark .hse-report-card,
body.dark .hse-shortcut-card,
body.dark .hse-event-list-card,
body.dark .hse-task-card{
    background:#0f262e;
    border-color:#1c3644;
}

body.dark .hse-card-footer{
    border-top-color:#1c3644;
}

body.dark .hse-add-card{
    border-color:#22404c;
    color:#8ca2ac;
}

body.dark .hse-add-card:hover{
    border-color:#F34E16;
    color:#F34E16;
    background:rgba(243,78,22,.08);
}

body.dark .hse-shortcut-label{
    color:#eaf2f4;
}

body.dark .hse-event-list-title{
    color:#eaf2f4;
}

body.dark .hse-event-list-sub{
    color:#8ca2ac;
}

body.dark .hse-status-row{
    background:#132a33;
}

body.dark .hse-status-left{
    color:#dbe7ec;
}

body.dark .hse-report-title{
    color:#8ca2ac;
}

body.dark .hse-risk-card{
    background:#132a33;
}

body.dark .hse-risk-title{
    color:#dbe7ec;
}

body.dark .hse-risk-desc{
    color:#8ca2ac;
}

body.dark .hse-trend-row{
    border-bottom-color:#22404c;
}

body.dark .hse-trend-value{
    color:#dbe7ec;
}

/* ---------- Sub-tabs (feed de eventos) ---------- */

body.dark .hse-subtabs{
    border-bottom-color:#1c3644;
}

body.dark .hse-subtab{
    color:#8ca2ac;
}

/* ---------- Formulários ---------- */

body.dark .hse-input,
body.dark .hse-textarea,
body.dark .custom-select{
    background:#0c2029;
    border-color:#22404c;
    color:#eaf2f4;
}

body.dark .custom-select{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%238ca2ac' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='2,5 9,12 16,5'/%3E%3C/svg%3E");
}

body.dark .hse-input::placeholder,
body.dark .hse-textarea::placeholder{
    color:#63767f;
}

body.dark .hse-input:focus,
body.dark .hse-textarea:focus{
    border-color:#3fa4dc;
}

body.dark .hse-input:disabled,
body.dark .hse-textarea:disabled{
    background:#0a1a20;
    color:#5c6f78;
}

body.dark .select2-container--default .select2-selection--single{
    background:#0c2029;
    border-color:#22404c;
}

body.dark .select2-container--default .select2-selection--single .select2-selection__rendered{
    color:#eaf2f4;
}

body.dark .select2-dropdown{
    background:#102830;
}

body.dark .select2-results__option{
    color:#dbe7ec;
    background:#102830;
}

body.dark .select2-container--default .select2-results__option--highlighted{
    background:#183440 !important;
    color:#eaf2f4 !important;
}

body.dark .slim-label,
body.dark label{
    color:#9bb0b9;
}

body.dark .hse-insurance-highlight{
    background:linear-gradient(135deg, rgba(243,78,22,.14), rgba(243,78,22,.03));
    border-color:rgba(243,78,22,.3);
}

body.dark .hse-insurance-label{
    color:#8ca2ac;
}

body.dark .hse-insurance-sub{
    color:#63767f;
}

body.dark .hse-insurance-input-wrap{
    background:#0c2029;
    border-color:#22404c;
}

body.dark .hse-insurance-prefix,
body.dark .hse-insurance-input{
    color:#eaf2f4;
}

/* ---------- Botões ---------- */

body.dark .hse-btn-ghost{
    background:#132a33;
    color:#dbe7ec;
    border-color:#132a33;
}

body.dark .hse-btn-ghost:hover:not(:disabled){
    background:#1c3644;
}

body.dark .hse-icon-btn{
    background:#132a33;
    color:#dbe7ec;
}

body.dark .hse-icon-btn-highlight{
    background:rgba(243,78,22,.18);
    color:#ff7a4d;
}

body.dark .hse-icon-btn-highlight:hover{
    background:rgba(243,78,22,.28);
}

body.dark .hse-filtros-badge{
    border-color:#132a33;
}

body.dark .hse-icon-btn:hover{
    background:#1c3644;
}

/* ---------- Pills / badges ---------- */

body.dark .hse-radio-pill{
    background:#0c2029;
    border-color:#22404c;
    color:#9bb0b9;
}

body.dark .hse-option-card{
    background:#0c2029;
    border-color:#22404c;
    color:#9bb0b9;
}

body.dark .hse-option-card:hover{
    background:#132a33;
    border-color:#2c4c58;
}

body.dark .epi-checkbox span{
    background:#0c2029;
    border-color:#22404c;
    color:#9bb0b9;
}

body.dark .status-badge{
    background:transparent;
}

body.dark .breadcrumbs-pill{
    background:#132a33;
    color:#dbe7ec;
}

body.dark .hse-tag-selected{
    background:rgba(244,81,30,.12);
}

body.dark .hse-event-card{
    background:#0c2029;
    border-color:#22404c;
}

body.dark .hse-upload-box{
    background:#0c2029;
    border-color:#2c4c58;
}

body.dark .qtd-control{
    background:#0c2029;
    border-color:#22404c;
}

body.dark .qtd-valor{
    color:#eaf2f4;
}

body.dark .qtd-btn-minus{
    background:#1c3644;
    color:#dbe7ec;
}

body.dark .hse-segment{
    background:#0c2029;
    border-color:#22404c;
}

body.dark .hse-segment label{
    color:#8ca2ac;
}

body.dark .tco-toggle{
    background:#0c2029;
}

body.dark .tco-toggle-btn{
    color:#8ca2ac;
}

body.dark .hse-avatar-upload img{
    border-color:#1c3644;
    background:#1c3644;
}

body.dark .hse-bar-track{
    background:#1c3644;
}

body.dark .hse-period-pill{
    background:#0c2029;
    border-color:#22404c;
    color:#9bb0b9;
}

/* ===================================
   HSE INVESTIGAÇÃO (contexto / planejamento)
=================================== */

.hse-save-indicator{
    display:inline-flex;
    align-items:center;
    gap:6px;

    padding:6px 12px;
    border-radius:999px;

    background:#eef4f6;
    color:#5d8394;

    font-size:12px;
    font-weight:600;
    white-space:nowrap;
}

.hse-mini-home{
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#8291a3;
    font-size:13px;
    font-weight:600;
    text-decoration:none;
    cursor:pointer;
    transition:.2s;
    flex-shrink:0;
}

.hse-mini-home:hover{
    color:#F34E16;
}

.hse-step-label{
    color:#F34E16;
    font-weight:700;
    font-size:14px;
    display:flex;
    align-items:center;
    gap:8px;
}

.hse-progress-track{
    width:100%;
    height:6px;
    margin-top:10px;
    margin-bottom:14px;

    background:#e8edf2;
    border-radius:999px;
    overflow:hidden;
}

.hse-progress-fill{
    height:100%;
    background:#F34E16;
    border-radius:999px;
    transition:width .3s ease;
}

.hse-wizard-crumbs{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
    margin-top:12px;
}

.hse-contexto-logo-anim{
    flex-shrink:0;
    margin-left:12px;
}

@media(max-width:768px){

    .hse-crumbs-logo-row{
        flex-direction:column;
        align-items:flex-start;
    }

    .hse-crumbs-logo-row .hse-contexto-logo-anim{
        margin-left:0;
        margin-top:10px;
        align-self:center;
    }
}

.hse-wizard-crumb{
    padding:5px 12px;
    border-radius:999px;

    background:#eef4f6;
    color:#8291a3;

    font-size:12px;
    font-weight:600;
    white-space:nowrap;

    cursor:pointer;
    transition:.2s;
    user-select:none;
}

.hse-wizard-crumb:hover{
    background:#e2ebf0;
}

.hse-wizard-crumb.active{
    background:#F34E16;
    color:#fff;
}

.hse-wizard-crumb-sep{
    color:#c3d1d8;
    font-size:11px;
}

.hse-event-chip-bar{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px;

    padding:12px 16px;
    margin:18px 0;

    border-radius:14px;
    background:#eef4f6;

    color:#5d8394;
    font-size:14px;
}

.hse-event-chip-bar b{
    color:#17313f;
}

.hse-attribution{
    display:flex;
    align-items:center;
    gap:8px;
    margin-top:8px;
}

.hse-attribution-avatar{
    width:24px;
    height:24px;
    border-radius:50%;
    flex-shrink:0;

    background:#0b3240;
    color:#fff;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:10px;
    font-weight:700;
}

.hse-attribution-text{
    font-size:12px;
    color:#8291a3;
}

.hse-count-badge{
    background:#F34E16;
    color:#fff;
    font-size:12px;
    font-weight:700;
    padding:5px 12px;
    border-radius:999px;
    white-space:nowrap;
}

.hse-check-row{
    display:flex;
    align-items:center;
    gap:14px;

    padding:16px;
    margin-bottom:10px;

    border-radius:14px;
    border:1.5px solid #e8edf2;
    background:#fff;

    cursor:pointer;
    transition:.2s;
}

.hse-check-row:hover{
    border-color:#d8e4ec;
}

.hse-check-row.checked{
    background:#fdeeea;
    border-color:#f4b8a8;
}

.hse-check-row input[type=checkbox]{
    width:20px;
    height:20px;
    accent-color:#e04b2f;
    flex-shrink:0;
    cursor:pointer;
}

.hse-check-row label{
    flex:1;
    margin:0;
    font-size:15px;
    color:#243946;
    cursor:pointer;
}

/* ---------- Modo escuro ---------- */

body.dark .hse-save-indicator{
    background:#132a33;
    color:#8ca2ac;
}

body.dark .hse-mini-home{
    color:#8ca2ac;
}

body.dark .hse-mini-home:hover{
    color:#ff7a4d;
}

body.dark .hse-progress-track{
    background:#1c3644;
}

body.dark .hse-wizard-crumb{
    background:#132a33;
    color:#8ca2ac;
}

body.dark .hse-wizard-crumb:hover{
    background:#1c3644;
}

body.dark .hse-wizard-crumb-sep{
    color:#3a5561;
}

body.dark .hse-event-chip-bar{
    background:#132a33;
    color:#8ca2ac;
}

body.dark .hse-event-chip-bar b{
    color:#eaf2f4;
}

body.dark .hse-attribution-text{
    color:#8ca2ac;
}

body.dark .hse-check-row{
    background:#0c2029;
    border-color:#22404c;
}

body.dark .hse-check-row:hover{
    border-color:#2c4c58;
}

body.dark .hse-check-row.checked{
    background:rgba(224,75,47,.15);
    border-color:#e04b2f;
}

body.dark .hse-check-row label{
    color:#dbe7ec;
}

/* ---------- Árvore de fragilidades (pai / filho / neto) ---------- */

.hse-triade-node{
    margin-bottom:10px;
}

.hse-triade-node .hse-check-row-filho{
    margin-left:32px;
    padding:12px 16px;
}

.hse-triade-node .hse-check-row-filho label{
    font-size:14px;
}

.hse-triade-filhos{
    display:none;
    margin-top:2px;
    margin-bottom:6px;
}

.hse-triade-aviso{
    display:none;
    margin-left:32px;
    margin-bottom:8px;
    color:#c0392b;
    font-size:13px;
    font-weight:600;
}

.hse-triade-resumo-item{
    margin-bottom:18px;
    text-align:left;
}

.hse-triade-resumo-pai{
    font-weight:700;
    color:#17313f;
    margin-bottom:6px;
}

.hse-triade-resumo-filho{
    margin:6px 0 10px 16px;
    text-align:left;
}

.hse-triade-resumo-filho b{
    color:#F34E16;
}

.hse-triade-resumo-netos{
    margin:6px 0 0;
    padding-left:20px;
    font-size:13px;
    color:#4c6672;
    text-align:left;
}

.hse-triade-resumo-netos li{
    margin-bottom:4px;
}

body.dark .hse-triade-resumo-netos{
    color:#a9bdc6;
}

/* ---------- Diagrama da tríade (passo 4) ---------- */

.hse-triade-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
    gap:12px;
    margin:20px 0 24px;
}

.hse-triade-grid-item{
    background:#f7fafb;
    border-radius:14px;
    border-top:3px solid #17313f;
    padding:14px 16px;
}

.hse-triade-grid-item-desfecho{
    border-top-color:#e04b2f;
}

.hse-triade-grid-label{
    font-size:11px;
    font-weight:700;
    letter-spacing:.02em;
    color:#8291a3;
    text-transform:uppercase;
    margin-bottom:6px;
}

.hse-triade-grid-text{
    font-size:13px;
    font-weight:600;
    color:#e04b2f;
    line-height:1.4;
    text-align:left;
}

.hse-triade-summary-card{
    background:#f7fafb;
    border-radius:14px;
    border-top:3px solid #17313f;
    padding:14px 16px;
    height:100%;
}

.hse-triade-summary-card.desfecho{
    border-top-color:#e04b2f;
}

.hse-triade-summary-card .hse-triade-summary-label{
    font-size:11px;
    font-weight:700;
    letter-spacing:.02em;
    color:#8291a3;
    text-transform:uppercase;
    margin-bottom:8px;
}

.hse-triade-summary-card textarea{
    width:100%;
    border:none;
    background:transparent;
    resize:none;
    font-size:13px;
    color:#243946;
    padding:0;
    min-height:70px;
    text-align:left;
}

.hse-triade-summary-card textarea:focus{
    outline:none;
}

body.dark .hse-triade-grid-item{
    background:#132a33;
    border-top-color:#3a5561;
}

body.dark .hse-triade-grid-item-desfecho{
    border-top-color:#e04b2f;
}

body.dark .hse-triade-summary-card{
    background:#132a33;
    border-top-color:#3a5561;
}

body.dark .hse-triade-summary-card.desfecho{
    border-top-color:#e04b2f;
}

body.dark .hse-triade-summary-card textarea{
    color:#dbe7ec;
}

/* ---------- Ícone de triângulo (indicador de etapa) ---------- */

.hse-triade-icon{
    flex-shrink:0;
}

.hse-triade-icon-edge{
    stroke:#cfd9e0;
    stroke-width:2.5;
    stroke-linecap:round;
}

.hse-triade-icon-highlight{
    stroke:#F34E16;
    stroke-width:3.5;
    stroke-linecap:round;
}

.hse-triade-icon-glow{
    stroke:#F34E16;
    stroke-width:8;
    stroke-linecap:round;
    opacity:.22;
}

.hse-triade-icon-dot{
    fill:#17313f;
}

body.dark .hse-triade-icon-edge{
    stroke:#3a5561;
}

body.dark .hse-triade-icon-dot{
    fill:#8ca2ac;
}

/* =========================================================
   HSE GLASS UI — substitui o SweetAlert2 (toast, confirmação,
   prompt, loading, viewer de imagem). Visual glassmorphism
   neutro: funciona igual em cima de qualquer um dos 3 temas
   e também na tela de login (que não tem classe de tema).
========================================================= */

#hse-toast-area{
    position:fixed;
    top:20px;
    right:20px;
    z-index:10600;

    display:flex;
    flex-direction:column;
    gap:10px;

    max-width:360px;
    width:calc(100% - 40px);
}

@media(max-width:576px){
    #hse-toast-area{
        top:12px;
        right:12px;
        left:12px;
        max-width:none;
        width:auto;
    }
}

.hse-toast{
    display:flex;
    align-items:flex-start;
    gap:12px;

    padding:14px 16px;
    border-radius:16px;

    background:rgba(20,35,42,.55);
    -webkit-backdrop-filter:blur(20px) saturate(160%);
    backdrop-filter:blur(20px) saturate(160%);
    border:1px solid rgba(255,255,255,.14);
    box-shadow:0 12px 34px rgba(0,0,0,.28);

    color:#eaf2f4;

    opacity:0;
    transform:translateX(24px);
    transition:opacity .3s ease, transform .3s ease;
}

.hse-toast.show{
    opacity:1;
    transform:translateX(0);
}

.hse-toast.hide{
    opacity:0;
    transform:translateX(24px);
}

.hse-toast-icon{
    flex-shrink:0;
    font-size:20px;
    margin-top:1px;
}

.hse-toast-body{
    flex:1;
    min-width:0;
}

.hse-toast-body b{
    display:block;
    font-size:14px;
    font-weight:700;
    color:#fff !important;
}

.hse-toast-body span{
    display:block;
    font-size:13px;
    color:#c3d3d8 !important;
    margin-top:2px;
}

.hse-toast-close{
    flex-shrink:0;
    cursor:pointer;
    color:#8ca2ac;
    font-size:13px;
    padding:2px;
    transition:.2s;
}

.hse-toast-close:hover{
    color:#fff;
}

.hse-modal-backdrop{
    position:fixed;
    inset:0;
    z-index:10500;

    display:flex;
    align-items:center;
    justify-content:center;
    padding:20px;

    background:rgba(5,15,20,.55);
    -webkit-backdrop-filter:blur(6px);
    backdrop-filter:blur(6px);

    opacity:0;
    transition:opacity .25s ease;
}

.hse-modal-backdrop.show{
    opacity:1;
}

.hse-modal-glass{
    width:100%;
    max-width:420px;

    background:rgba(22,38,46,.6);
    -webkit-backdrop-filter:blur(24px) saturate(160%);
    backdrop-filter:blur(24px) saturate(160%);
    border:1px solid rgba(255,255,255,.16);
    border-radius:22px;
    box-shadow:0 24px 70px rgba(0,0,0,.4);

    padding:32px 28px;
    text-align:center;

    color:#eaf2f4;

    transform:scale(.92);
    transition:transform .25s ease;
}

.hse-modal-backdrop.show .hse-modal-glass{
    transform:scale(1);
}

.hse-modal-icon{
    font-size:40px;
    margin-bottom:14px;
}

.hse-modal-glass h5{
    color:#fff !important;
    font-weight:700;
    font-size:18px;
    margin-bottom:8px;
}

.hse-modal-glass p{
    color:#c3d3d8 !important;
    font-size:14px;
    margin-bottom:0;
}

.hse-modal-glass .hse-input{
    margin-top:18px;
    background:rgba(255,255,255,.08);
    border-color:rgba(255,255,255,.2);
    color:#fff;
}

.hse-modal-glass .hse-input::placeholder{
    color:#8ca2ac;
}

.hse-modal-erro{
    display:none;
    color:#ff8a8a;
    font-size:13px;
    font-weight:600;
    margin-top:10px;
    text-align:left;
}

.hse-modal-erro.show{
    display:block;
}

.hse-modal-actions{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    margin-top:24px;
}

.hse-modal-actions .hse-btn{
    flex:1;
    justify-content:center;
}

.hse-modal-loading h5{
    margin-top:16px;
    margin-bottom:0;
}

.hse-spinner{
    width:38px;
    height:38px;
    margin:0 auto;

    border:3px solid rgba(255,255,255,.2);
    border-top-color:#F34E16;
    border-radius:50%;

    animation:hseSpin .8s linear infinite;
}

@keyframes hseSpin{
    to{ transform:rotate(360deg); }
}

.hse-image-viewer{
    background:rgba(0,0,0,.85);
}

.hse-image-viewer img{
    max-width:90vw;
    max-height:85vh;
    border-radius:12px;
    box-shadow:0 20px 60px rgba(0,0,0,.5);

    transform:scale(.94);
    transition:transform .25s ease;
}

.hse-image-viewer.show img{
    transform:scale(1);
}

.hse-image-viewer-close{
    position:fixed;
    top:24px;
    right:28px;

    width:42px;
    height:42px;
    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    background:rgba(255,255,255,.12);
    color:#fff;
    font-size:18px;
    cursor:pointer;
    transition:.2s;
}

.hse-image-viewer-close:hover{
    background:rgba(255,255,255,.22);
}

/* ============ PWA: botão de instalar + bottom sheet (instalação / push) ============ */

.hse-pwa-btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 14px;
    border-radius:50px;
    border:1px solid #F34E16;
    background:transparent;
    color:#F34E16;
    font-size:13px;
    font-weight:700;
    white-space:nowrap;
    cursor:pointer;
    transition:background .2s ease, color .2s ease;
}

.hse-pwa-btn:hover{
    background:#F34E16;
    color:#fff;
}

.hse-pwa-btn.d-none{
    display:none !important;
}

@media (max-width: 575.98px){
    .hse-pwa-btn{ padding:7px 10px; }
    .hse-pwa-btn span{ display:none; }
}

.pwa-sheet-backdrop{
    position:fixed;
    inset:0;
    z-index:10500;
    display:flex;
    align-items:flex-end;
    justify-content:center;
    background:rgba(5,15,20,.5);
    -webkit-backdrop-filter:blur(4px);
    backdrop-filter:blur(4px);
    opacity:0;
    transition:opacity .25s ease;
}

.pwa-sheet-backdrop.show{
    opacity:1;
}

.pwa-sheet{
    width:100%;
    max-width:480px;
    margin:0 12px calc(12px + env(safe-area-inset-bottom));
    padding:12px 22px 22px;
    background:#0c2029;
    border:1px solid rgba(255,255,255,.12);
    border-top:3px solid #F34E16;
    border-radius:22px;
    box-shadow:0 24px 70px rgba(0,0,0,.45);
    color:#eaf2f4;
    transform:translateY(40px);
    transition:transform .3s ease;
}

.pwa-sheet-backdrop.show .pwa-sheet{
    transform:translateY(0);
}

.pwa-sheet-handle{
    width:38px;
    height:4px;
    margin:0 auto 16px;
    border-radius:4px;
    background:rgba(255,255,255,.22);
}

.pwa-sheet-head{
    display:flex;
    gap:14px;
    align-items:flex-start;
}

.pwa-sheet-icon{
    flex:0 0 46px;
    height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:14px;
    background:rgba(243,78,22,.14);
    color:#F34E16;
    font-size:21px;
}

.pwa-sheet-head h5{
    margin:0 0 4px;
    color:#fff !important;
    font-size:17px;
    font-weight:700;
}

.pwa-sheet-head p{
    margin:0;
    font-size:13.5px;
    line-height:1.5;
    color:#9fb4be;
}

.pwa-sheet-passos{
    margin:18px 0 0;
    padding:0;
    list-style:none;
    counter-reset:passo;
}

.pwa-sheet-passos li{
    counter-increment:passo;
    display:flex;
    align-items:center;
    gap:12px;
    padding:10px 0;
    border-top:1px solid rgba(255,255,255,.08);
    font-size:13.5px;
    line-height:1.4;
    color:#eaf2f4;
}

.pwa-sheet-passos li::before{
    content:counter(passo);
    flex:0 0 26px;
    height:26px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#17313f;
    color:#F34E16;
    font-size:12px;
    font-weight:700;
}

.pwa-ico{
    margin:0 2px;
    color:#3aa0e8;
}

.pwa-sheet-acoes{
    display:flex;
    gap:10px;
    margin-top:18px;
}

.pwa-sheet-acoes .hse-btn{
    flex:1;
    justify-content:center;
    text-align:center;
}
