/*********************************************

Defaults

*********************************************/
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;400;700;900&display=swap');

body{
    font-family: 'Inter', sans-serif !important;
    background-color: #c2c2c2;
}
h1, h2, h3, h4, h5, h6 {
    margin-block-start: 0 !important;
    margin-block-end: -15px !important;
}
ul {
    display: block;
    list-style-type: none;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
    padding-inline-start: 0;
}
p {
    display: block;
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}
a{ 
    text-decoration: none; 
    cursor: pointer;
}
:focus-visible { outline: -webkit-focus-ring-color auto 0px; }
hr{
    border-top: 1px dotted var(--color2);
}
.ph-whatsapp-logo{
    color: green;
}
/*********************************************

Cores

*********************************************/
:root {
    --color1: #000000;
    --color2: #14213D;
    --color3: #FCA311;
    --color4: #c2c2c2;
    --color5: #ffffff;
}

::selection { background: #FCA311; }
::-moz-selection { background: #FCA311; }

.color1 { color: var(--color1) !important; }
.color2 { color: var(--color2) !important; }
.color3 { color: var(--color3) !important; }
.color4 { color: var(--color4) !important; }
.color5 { color: var(--color5) !important; }

.bg1 { background-color: var(--color1) !important; }
.bg2 { background-color: var(--color2) !important; }
.bg3 { background-color: var(--color3) !important; }
.bg4 { background-color: var(--color4) !important; }
.bg5 { background-color: var(--color5) !important; }

.alert{ color: red; }
.background { background-color: #f2f2f2 !important; }
.ativo{
    background-color: var(--color3);
}
.suspenso{
    background-color: #ccc;
}
.finalizado{
    color: #aaa;
    background-color: #eee;
    filter: blur(2px);
    cursor: not-allowed;
}

/*********************************************

Alinhamentos & Espaços

*********************************************/
.clear10x { height: 10px; }
.clear20x { height: 20px; }
.clear30x { height: 30px; }
.clear40x { height: 40px; }
.clear50x { height: 50px; }
.clear60x { height: 60px; }
.clear70x { height: 70px; }
.clear80x { height: 80px; }
.clear90x { height: 90px; }
.clear100x { height: 100px; }

.center{ text-align: center; }

/*********************************************

Buttons

*********************************************/
.btn{
    width: 100%;
    background-color: var(--color2);
    color: antiquewhite !important;
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 20px;
    padding-bottom: 20px;
    margin-top: 10px;
    border: 0 !important;
    border-radius: 10px;
    font-size: 14px;
    text-transform: uppercase;
    cursor: pointer;
}
.btn:hover{
    background-color: var(--color4);
}
.btn-delete{
    width: auto;
    background-color: indianred;
    color: antiquewhite !important;
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-top: 0px;
    border: 0 !important;
    border-radius: 10px;
    font-size: 12px;
    text-transform: uppercase;
    cursor: pointer;
}
.btn-delete:hover{
    background-color: red;
}
.btn-mini-delete{
    float: right;
    width: auto;
    background-color: indianred;
    color: white !important;
    padding: 5px;
    margin-top: 0px;
    border: 0 !important;
    border-radius: 5px;
    font-size: 10px;
    font-weight: bold;
    font-family: Arial !important;
    text-transform: uppercase;
    cursor: pointer;
}

/*********************************************

Modal

*********************************************/
.modal{
    display: none;
    width: 700px;
    border-radius: 10px;
}
.modal h1{
    color: var(--color2);
    font-size: 30px;
}
.modal h2{
    color: orangered;
    font-size: 20px;
}
.modal .btn{
    width: 100%;
    background-color: var(--color2);
    color: antiquewhite !important;
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 20px;
    padding-bottom: 20px;
    margin-top: 0px;
    border: 0 !important;
    border-radius: 10px;
    font-size: 14px;
    text-transform: uppercase;
    cursor: pointer;
}
.modal .btn:hover{
    background-color: var(--color4);
}
.modal small{
    font-size: 10px;
    text-transform: uppercase;
}
.modal input{
    width: 100%;
    height: 30px;
    border-radius: 5px;
    border: 1px dotted var(--color2);
    padding: 20px;
    background-color: #eee;
    color: var(--color2);
    font-size: 16px;
    margin-top: 5px;
    margin-bottom: 15px;
}
.modal input:focus{
    background-color: var(--color5);
}

.modal input[type="file"]{
    width: 100%;
    height: 45px;
    border-radius: 5px;
    border: 1px solid var(--color2);
    font-size: 14px;
    padding-left: 10px;
    padding-top: 10px;
    color: var(--color2);
    background-color: #f2f2f2;
}
.modal select{
    width: 100%;
    border-radius: 5px;
    border: 1px dotted var(--color2);
    padding: 10px;
    background-color: #eee;
    color: var(--color1);
    font-size: 16px;
    margin-top: 5px;
    margin-bottom: 15px;
    cursor: pointer;
}
.modal textarea{
    width: 100%;
    height: 200px;
    border-radius: 5px;
    border: 1px dotted var(--color2);
    padding: 20px;
    background-color: #eee;
    color: var(--color2);
    font-size: 16px;
    margin-top: 5px;
    margin-bottom: 15px;
}
.note-modal-content{
    height: 300px;
}
.checkbox.sn-checkbox-open-in-new-window {
    display: none;
}
.checkbox.sn-checkbox-use-protocol {
    display: none;
}
.note-modal-footer {
    height: 55px;
    padding: 20px;
    text-align: center;
    margin-top: -50px;
}
.note-modal-footer .note-btn {
    float: right;
    height: 55px;
}
.featured{
    font-weight: bold !important;
}