:root {
    /* ======================================================
       Cores Principais
    ====================================================== */

    --cor-branco: #ffffff;
    --cor-preto: #111827;

    --cor-texto: #111827;
    --cor-texto-secundario: #6b7280;

    --cor-azul: #60a5fa;

    /* ======================================================
       Estados
    ====================================================== */

    --cor-sucesso: #22c55e;
    --cor-erro: #ef4444;
    --cor-aviso: #f59e0b;
    --cor-info: #3b82f6;

    /* ======================================================
    Bordas
    ====================================================== */

    --border-divider: rgba(148,163,184,.25);

    /* ======================================================
    Sombras
    ====================================================== */

    --shadow-modal-hover: 0 8px 24px rgba(0,0,0,.32);

    --shadow-modal: 0 12px 30px rgba(0,0,0,.35);

}

/* ==========================================================
   02 - TEMA DARK
========================================================== */

[data-theme="dark"] {

    /* ======================================================
       Fundos / Bordas
    ====================================================== */

    --modal-bg: #1e293b;

    --modal-card: #0f172a81;

    --modal-select: #0f172a;

    --modal-border: #334155;

    --modal-toggle : #808a97;

    /* ======================================================
       Textos
    ====================================================== */

    --modal-text: #e2e8f0;

    --modal-text-secondary: #94a3b8;

    /* ======================================================
       Hover
    ====================================================== */

    --modal-hover: #2d36476c;

}

/* ==========================================================
   03 - TEMA LIGHT
========================================================== */

[data-theme="light"] {

    /* ======================================================
       Fundos / Bordas
    ====================================================== */
    
    --modal-bg: #ffffff;

    --modal-card: #ffffff;

    --modal-select: #ffffff;

    --modal-border: #e5e7eb;

    --modal-toggle : #fffffff3;

    /* ======================================================
       Textos
    ====================================================== */

    --modal-text: #111827;

    --modal-text-secondary: #6b7280;

    /* ======================================================
       Hover
    ====================================================== */

    --modal-hover: #f3f4f6;

}
 

[data-theme="light"] .protocolos-table thead {
    background:#f3f4f6;
}

[data-theme="dark"] .protocolos-table thead {
    background:rgba(255,255,255,.04);
}

/*  MODAL PROTOCOLO  */

.novo-protocolo-form {
    display: flex;
    flex-direction: column;
    gap: 18px;

    margin-right: 6px;
}

.grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.campo-full {
    width: 100%;
}

.novo-protocolo-form label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 600;
}


.novo-protocolo-form input:not([type="checkbox"]):not([type="radio"]),
.novo-protocolo-form select  {
    width: 100%;
    height: 44px;
    border-radius: 10px;
    padding: 0 12px;
    transition: .2s;
    border: 1px solid var(--modal-border); 
    background: var(--modal-select);
    color: var(--modal-text);
}

.novo-protocolo-form input::placeholder{
    color:var(--modal-text-secondary);
}

input[type="date"]{
    color:var(--modal-text);
}

.modal-content.modal-protocolo input {
    border: 1px solid var(--modal-border); 
    margin-bottom: -1px;
}


.tipo-proposta {
    display: flex;
    gap: 24px;
    align-items: center;
}

.tipo-proposta label {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
}

.tipo-proposta input[type="radio"] {
    width: auto !important;
    height: auto !important;
    margin: 0;
}

/* LOGO MODAL PROPOSTA*/
.logo-seguradora-preview {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px 0;
    min-height: 60px;
}

.logo-seguradora-preview img {
    max-width: 150px;
    max-height: 70px;
    object-fit: contain;
}

/* ===========================
   UPLOAD PDF
=========================== */

.upload-lista{
    display:flex;
    flex-direction:column;
    gap:18px;
}

.upload-item{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.upload-link{
    display:flex;
    align-items:center;
    gap:6px;
    color:#2563eb;
    text-decoration:none;
    font-weight:500;
    transition:.20s;
}

.upload-link:hover{
    color:#1d4ed8;
}

.upload-icon{
    font-size:20px;
    line-height:20px;
}

.upload-emoji{
    font-size:20px;
    line-height:20px;
    margin-top:-2px;
}

.upload-item label{
    font-size:14px;
    font-weight:600;
    color:var(--modal-text);
}

.upload-box{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    height:46px;
    padding:0 4px 0 12px;
    border-radius:12px;
    border:1px solid var(--modal-border);
    background:var(--modal-select);
}

.upload-nome{
    flex:1;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:normal;
    line-height:1.3;
    color:var(--modal-text);
}

.upload-nome small{
    display:block;
    color:var(--modal-text-secondary);
    font-size:12px;
    margin-top:2px;
}

.btn-upload-pdf{
    width: 100px;
    height:36px;
    padding:0 18px;
    border:none;
    border-radius:8px;
    cursor:pointer;
    font-size:13px;
    font-weight:600;
    transition:.2s;
    background:#3b82f6;
    color:#fff;
}

.btn-upload-pdf:hover{
    background:#2563eb;
}

.upload-ok{
    color:#22c55e;
    font-weight:700;
    margin-right:8px;
}

.upload-nome small{
    display:block;
    margin-top:2px;
    font-size:12px;
    color:var(--modal-text-secondary);
}

.btn-upload-pdf.upload-concluido{
    background:#22c55e;
}

.btn-upload-pdf.upload-concluido:hover{
    background:#16a34a;
}

.upload-acoes{
    display:flex;
    align-items:center;
    gap:14px;
    flex-shrink:0;
}

.modal-content.modal-protocolo {
    width:100% !important;
    max-width:600px !important;

    max-height:90vh !important;

    overflow-y:auto;
}

.checkbox-group {
    display: flex;
    align-items: center;
    gap: 10px;
}

.checkbox-group input {
    width: 18px !important;
    height: 18px !important;
    margin: 0;
}

.checkbox-group label {
    margin: 0;
    cursor: pointer;
}

.info-card {
    min-height: 44px;
    display: flex;
    align-items: center;
    padding: 0 14px;
    border-radius: 10px;
    border: 1px solid var(--modal-border);
    background: var(--modal-select);
    color: var(--modal-text);
    font-size: 14px;
}

.segurado-row {
    display: flex;
    gap: 10px;
    align-items: center;
}

.segurado-row select {
    flex: 1;
}

#btnNovoSegurado {
    min-width: 140px;
    height: 44px;
    white-space: nowrap;
}

.grid-financeiro {
    display: grid;
    grid-template-columns: 0.7fr 0.1fr 0.7fr 1fr;
    gap: 25px;
    align-items: start;
    margin-bottom: 15px;
}


.toggle-entrada {
    display: flex;
    align-items: center;
    margin-top: 13px;
    white-space: nowrap;
}

.parcelas-input{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    height:45px;
    border:1px solid var(--modal-border);
    border-radius:10px;
    background:var(--modal-card);
}

/* CADEADO*/

.campo-parcelas{
    position: relative;
}

.campo-parcelas input{
    width:100%;
    padding-right:40px;
}

.cadeado-parcelas{
    position:absolute;
    right:12px;
    top:50%;
    transform:translateY(-50%);
    font-size:16px;
    opacity:0;
    transition:.2s;
    pointer-events:none;
}

.cadeado-parcelas.ativo{
    opacity:1;
}
/*-----*/
.parcelas-input input{
    flex:1;
    border:none !important;
    background:transparent !important;
    height:100%;
    padding:0;
    margin:0;
    outline:none;
    box-shadow:none;
}

.parcelas-input input:focus{
    outline:none;
}

.parcelas-input .toggle-entrada{
    flex-shrink:0;
}

/* centralizar numero */
.campo-parcelas input[readonly]{
    background: #e5e7eb;
    color: #374151;
    font-weight: 600;
    text-align: center;
    cursor: default;
}

body[data-theme="dark"] .campo-parcelas input[readonly]{
    background: #374151;
    color: #f3f4f6;
}

#qtParcelas{
    text-align: center;
    font-weight: 600;
}

.toggle-entrada input {
    position: absolute !important;
    opacity: 0 !important;
    width: 1px !important;
    height: 1px !important;
    pointer-events: none;
}

.toggle-entrada label {
    width: 46px;
    height: 24px;
    background: #33415504;
    border: 1px solid #67e4e4a8;
    border-radius: 999px;
    cursor: pointer;
    position: relative;
    transition: .3s;
}

.toggle-entrada label::after {
    content: "";
    width: 18px;
    height: 18px;
    background: var(--modal-toggle);
    border-radius: 50%;
    position: absolute;
    top: 2px;
    left: 3px;
    transition: .3s;
}

.toggle-entrada input:checked + label {
    background: #3ad66e;
}

.toggle-entrada input:checked + label::after {
    transform: translateX(22px);
}

.toggle-entrada span {
    font-size: 13px;
    font-weight: 600;
}

#comissao{
    text-align: center;
    font-weight: 600;
}

#comissao::placeholder{
    text-align: center;
}

.campo-invalido {
    border: 2px solid #ef4444 !important;
    border-radius: 12px;
    box-shadow: 0 0 0 3px rgba(239,68,68,.15);
}

input[type="date"]::-webkit-calendar-picker-indicator {

    filter:
        invert(56%)
        sepia(92%)
        saturate(1588%)
        hue-rotate(192deg)
        brightness(101%)
        contrast(95%);

}

#motivoRecusa {
    width: 100%;
    min-height: 100px;
    padding: 12px;
    border: 1px solid #dbe3eb;
    border-radius: 10px;
    font-size: 14px;
    resize: vertical;
    font-family: inherit;
}

#motivoRecusa:focus {

    outline: none;
    border-color: #2563eb;
    box-shadow:
        0 0 0 3px
        rgba(37, 99, 235, 0.15);

}

.modal-content.modal-protocolo::-webkit-scrollbar{
    width:10px;
}

.modal-content.modal-protocolo::-webkit-scrollbar-track{
    background:transparent;
}

.modal-content.modal-protocolo::-webkit-scrollbar-thumb{
    background:#CBD5E1;
    border-radius:999px;
}

.modal-content.modal-protocolo::-webkit-scrollbar-thumb:hover{
    background:#94A3B8;
}

.modal-content.modal-protocolo{
    scrollbar-width:thin;
    scrollbar-color:#94A3B8 transparent;
}


@media (max-width: 768px) {

    .grid-2 {
        grid-template-columns: 1fr;
    }

    .upload-grid {
        grid-template-columns: 1fr;
    }

     .modal-content.modal-protocolo {
        width: 95%;
        padding: 12px;
    }

}

@media (max-width: 588px) {

    .grid-financeiro {
        display: grid;
        grid-template-columns:
            repeat(2,minmax(105px,1fr));
        /*grid-template-columns: 0.7fr 0.1fr 0.7fr 1fr;*/
        gap: 25px;
        align-items: start;
        margin-bottom: 15px;
    }
    
    #btnNovoSegurado {
        min-width: 100px;
        
    }

}