*::-webkit-scrollbar {
    width: 10px;
}

*::-webkit-scrollbar-track {
    background: transparent;
}


*::-webkit-scrollbar-thumb {
    background-color: #1a1c9b;
    /* color of the scroll thumb */
    border-radius: 20px;
    /* roundness of the scroll thumb */
    border: 3px solid #1a1c9b;
    /* creates padding around scroll thumb */
    cursor: pointer;
}

*{
    font-family: 'Comfortaa', sans-serif;

}


html, body {
    height: 100vh;
    margin: 0;
    overflow: hidden;


}

	    .login-container {
	        min-height: 100vh;
	        display: flex;
	        align-items: center;
	        justify-content: center;
	        background-color: #f8f9fa;
	    }

	    .login-box {
	        width: 100%;
	        max-width: 400px;
	        padding: 30px;
	        background-color: #fff;
	        border: 1px solid #dee2e6;
	        border-radius: 10px;
	        box-shadow: 0 0 20px rgba(0,0,0,0.05);
	    }

	    .login-box h1 {
	        color: #0d47a1;
	        font-weight: 600;
	        font-size: 28px;
	        margin-bottom: 20px;
	    }


    #mySidenav {
        position: fixed;
        top: 0;
        left: 0;
        width: 0px;
        height: 100vh;
        background: linear-gradient(90deg, rgb(0 36 51) 0%, rgb(0 83 117) 68%, rgb(0 107 151) 100%);
        color: white;
        overflow-y: auto;
        overflow-x: hidden;
        z-index: 1;
        padding-top: 1px;
        transition: 0.3s;
        box-shadow: 5px 1px 10px black;

    }
	.smenu{
        list-style: none;
        padding: 0;
        margin: 0;
        width: 100%;
		padding-left: 10px;
    }
    .smenu li {
        position: relative;
        padding: 10px;
        border-left: 1px solid rgb(238, 37, 37);
        transition: border-left-width 0.3s ease, background 0.3s ease;
        overflow: hidden;
        color: white;
        cursor: pointer;
    }

    .side{
        list-style: none;
        padding: 0;
        margin: 0;
        width: 100%;
    }

    .side li {
        position: relative;
        padding: 10px;
        border-left: 1px solid white;
        transition: border-left-width 0.3s ease, background 0.3s ease;
        overflow: hidden;
        color: white;
        cursor: pointer;
    }

    /* Gradiente suave usando pseudo-elemento */
    .side li::before {
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(
            90deg,
            rgb(0, 45, 73) 0%,
            rgba(255, 255, 255, 0.5) 30%,
            rgba(255, 255, 255, 0.2) 80%
        );
        opacity: 0;
        transition: opacity 0.5s ease-in-out;
        z-index: -1; /* Fica atrás do texto */
        pointer-events: none;
    }

    .side li:hover {
        border-left-width: 10px;
    }

    .side li:hover::before {
        opacity: 1;
    }

    .nav-nome{
        font-size: 15pt;
        color: white;
    }

    .nav-nome-subtexto{
        font-size: 10pt;
        font-style: italic;
        color: white;
    }

    .submenu {
        border: 1px solid white;
        padding: 5px;
        margin: 0px 0px 2px 8px;
        background-color: #66604b;
        cursor: pointer;
        transition: linear 0.3s;
        font-size: 10pt;
        list-style-type: none;
        text-decoration: none;
    }

    .submenu:hover {
        background-color: #5e5a4a;
    }

    a {
        text-decoration: none;
        font-size: 12pt;
        color: white;
    }


    .main-content {
        width: 100%;
        height: 100vh;
        display: flex;
        flex-direction: column;
    }

    .top-bar {
        background: #2a5d7f;
        height: 50px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 10px;
        color: white;
        font-weight: bold;
    }

    .workspace {
        flex: 1;
        background: transparent;
        overflow: auto;
        padding: 15px;
    }

sub{
    padding: 5px;
}
.lista-card{
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
}

.lista-card li{
    padding: 10px;
    min-height: 60px;
    width: 100%;
    border: 1px solid #c1c1c1;
    margin-bottom: 3px;
    box-shadow: rgba(0, 0, 0, 0.35) 1px 0px 6px;
    align-items: center;
    justify-content: space-between;
}











		/* ESTILO DO CALENDÁRIO*/
			.dropdown-menu a {
		    	cursor: pointer;
			}
		    .ul-calendar{
		        list-style-type: none; margin: 0; padding: 10px;
		        width: 100%;
		        background: white;
		        color: #00b0ff;
		        /*border: 1px solid #c1c1c1;*/
		    }

		    .ul-calendar li {
		        margin-bottom: 5px;
		        border: 1px solid #c1c1c1;
		        min-height: 30px;
		        box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 5px 0 rgba(0, 0, 0, 0.19); 
		    }

		    .ul-calendar li table {
		        width: 100%;
		        height: 30px;
		        text-align: center;
		    }

		    .ul-calendar li table td {
		        width: 14.285%;
		    }

		    .li-header{       
		        background: #4e73df;
		        color: white;
		        font-size: 18pt;
		        border: 1px solid red;
		    }
		/* ESTILO DAS CÉLULAS DO CALENDÁRIO;*/
		    .td_ds > div:first-child{
		        position: relative; 
		        text-align: left; 
		        font-size: 10pt; 
		        padding-left: 10px;
		        background: white;
		    }

		    .td_ds:hover{
		        background: #fff9c4;
		        cursor: pointer;   
		    }

		    .td_fds > div:first-child{
		        position: relative; 
		        text-align: left; 
		        font-size: 10pt; 
		        padding-left: 10px; 
		        color: white;
		        background: #bdbdbd;
		    }

		    .td_fds:hover{
		        background: #ffe0b2;
		        cursor: pointer;   
		    }		
	    /* ESTILO DO CONTROLADOR DE EFETIVO; */
		    .ul-efetivo{
		        list-style-type: none; margin: 0; padding: 10px;
		        width: 100%;
		        background: white;
		        color: #00b0ff;
		        /*border: 1px solid #c1c1c1;*/
		    }

		    .ul-efetivo li {
		        margin-bottom: 5px;
		        border: 1px solid #c1c1c1;
		        min-height: 30px;
		        box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 5px 0 rgba(0, 0, 0, 0.19); 
		    }

		    .ul-efetivo li table {
		        width: 100%;
		        min-height: 30px;
		        text-align: center;
		    }
		/* ESTILOS DAS TABELAS DA ESCALA */
			.escala{
			    margin-bottom: 10px;
			}

			.text_header{
			    font-size: 18pt; text-align: center;
			    color: #616161;
			}

			.txt_input {
			    text-align: center;
			    font-size: 15pt;
			    padding: 2px;
			    margin: 5px;
			    min-width: 60%;
			}

			.sm-input, .sm-select{
			    font-size: 10pt;
			    width: 100%;
			    height: 25px;
			    text-align: center
			}

			ul { 
				list-style-type: none; 
				margin: 0; 
				padding: 0;
			}

			ul li{ 
				width: 100%; 
				list-style-type: none; 
				margin-bottom:5px; 
			}

			.gp_escala{
			    border: 1px solid #c1c1c1;
			    background: white;
			}

			.gp_grid .tb_head{
			    width: 100%;
			    background: #00b0ff;
			    color: #fafafa;
			    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 5px 0 rgba(0, 0, 0, 0.19);
			}

			.gp_grid .tb_3 .tb_head td{
			    width: 25%;
			    border: 1px solid #fafafa;
			    text-align: center;
			}

			.gp_grid .tb_3 .tb_body{
			    width: 100%;
			    background: #fafafa;
			    color: #00b0ff;
			    border: 1px solid red;
			}

			.gp_grid .tb_3 .tb_body td{
			    width: 25%;
			    border: 1px solid #fafafa;
			    text-align: center;


			}

			.gp_grid .tb_4 .tb_head td{
			    width: 20%;
			    border: 1px solid #fafafa;
			    text-align: center;
			    padding: 3px;
			}

			.gp_grid .tb_4 .tb_body{
			    width: 100%;
			    background: #fafafa;
			    color: #00b0ff;
			    border: 1px solid red;
			}

			.gp_grid .tb_4 .tb_body td{
			    width: 20%;
			    border: 1px solid #dddddd;
			    text-align: center;
			}

			.ui-droppable-active{
			    background: #eeeeee;
			}

			.ui-droppable-hover{
			    background: #fff8e1;
			}

			.linhas{
				padding: 2px 5px;
				padding-top: 10px;
			}
			.gp_grid .linhas li {
			   border: 1px solid #c1c1c1;
			   box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 5px 0 rgba(0, 0, 0, 0.19); 
			}
		/* ESTILO DOS BOTÕES DA ESCALA; */
				.btn-flat{
				    font-size: 12pt;
				    border: 1px solid #c1c1c1;
				    width: 30px;
				    height: 30px;
				    margin: 2px;
				}

				.btn-flat-success{
					background-color: #5eff07;
					color: black;
				}

				.btn-flat-primary{
					background-color: #88a9ff;
					color: black;
				}

				.btn-flat-secondary{
					background-color: #515151;
					color: white;
				}

				.btn-flat-danger{
					background-color: #fb5959;
					color: black;
				}

				.btn-flat-info{
					background-color: #59eefb;
					color: black;
				}

				.btn-flat-warning{
					background-color: #f2ff00;
					color: black;
				}
		/* ESTILO DE BOXES DE EFETIVO */
			#painelEscalas_efetivo{
			    margin-left: 0;
			    margin-right: 0;   
			}

			#painelEscalas_efetivo li{
			    padding: 10px;
			    border: 1px solid #c1c1c1;
			    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 5px 0 rgba(0, 0, 0, 0.19);
			    cursor: pointer;
			    transition: 0.3s ease-in;
			    
			}

			#painelEscalas_efetivo li:hover{
			    background: #fff8e1 ;
			}	

		/* jquery UI*/
			.ui-droppable-active{
			    background: #eeeeee;
			}
			.ui-droppable-hover{
			    background: #fff8e1;
			}

			.btn_draggable {
			    background: #007bff;
			    color: white;
			    padding: 10px 15px;
			    border-radius: 4px;
			    border: 1px solid #0056b3;
			    font-size: 14px;
			    box-shadow: 0 0 5px rgba(0,0,0,0.3);
			    z-index: 1000;
			}

			.box-grid{
			    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 5px 0 rgba(0, 0, 0, 0.19); 
			    padding: 2px 2px;
			    border: 1px solid #4665d6;
			    background: #4665d6;
			    color: white;
			    font-size: 12pt;  
			    margin: 2px; 
			}

			.box-at2{
			    display: inline-block;
			    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 5px 0 rgba(0, 0, 0, 0.19); 
			    padding: 2px 10px;
			    border: 1px solid #00838f;
			    background: #3886ab;
			    color: white;
			    font-size: 12pt;  
			    margin: 2px; 
			}

			.box-fg{
			    display: inline-block;
			    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 5px 0 rgba(0, 0, 0, 0.19); 
			    padding: 2px 10px;
			    border: 1px solid #00838f;
			    background: #006064;
			    color: white;
			    font-size: 12pt;  
			    margin: 2px; 
			}

			.box-af{
			    display: inline-block;
			    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 5px 0 rgba(0, 0, 0, 0.19); 
			    padding: 2px 10px;
			    border: 1px solid #00838f;
			    background: #4a148c;
			    color: white;
			    font-size: 12pt;  
			    margin: 2px; 
			}

			.box-confirmado {
			    font-style: italic;

			}

			.box-danger {
			    background: #d50000;
			    box-shadow: 0 1px 1px 0 #ff1744, 0 2px 5px 0 #ff1744;
			    border: 1px solid #d50000;
			}

			.box-danger-o {
			    background: white;
			    color: #d50000;
			    box-shadow: 0 1px 0px 0 #d50000, 0 0px 5px 0 #d50000;
			    border: 1px solid #d50000;
			}

			.box-danger-outline {
			    display: inline-block;
			    padding: 2px 10px;
			    background: #f1f1f1;
			    font-style: italic;
			    box-shadow: 0 1px 1px 0 #c1c1c1, 0 2px 5px 0 #c1c1c1;
			    border: 1px solid #c1c1c1;
			}

















.doc {
  font-size: 12px;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
  background-color: white;
}
.doc p {
    margin: 0;
    padding: 0;
    font-size: 10pt;
}

/* Larguras máximas baseadas nas breakpoints do Bootstrap 5 */
    @media (min-width: 576px) {
      .doc {
        max-width: 540px;
      }
    }

    @media (min-width: 768px) {
      .doc {
        max-width: 540px;
      }
    }

    @media (min-width: 992px) {
      .doc {
        max-width: 650px;
      }
    }

    @media (min-width: 1200px) {
      .doc {
        max-width: 650px;
      }
    }

    @media (min-width: 1400px) {
      .doc {
        max-width: 1320px;
      }
    }

    /* 🔸 Modo de impressão: ocupar largura total */
    @media print {
      .doc {
        max-width: 100% !important;
        padding: 0 !important;
      }
    }

.doc-table-head{
    width: 100%;
    border: 1px solid black;
    border-collapse: collapse;
    text-align: center;
}

.doc-table-head td{
    border: 1px solid #c1c1c1;
    border-collapse: collapse;
    background-color: white;
    padding: 5px;
}
.doc_tb_3{
  width: 25%;

}

.doc_tb_4{
  width: 20%;
  
}

.doc-bloco-tabela{

}
.doc-bloco-tabela table{
    width: 100%;
    border: 1px solid #c1c1c1;
    border-collapse: collapse;
}
.doc-bloco-tabela th{
    border: 1px solid #c1c1c1;
    border-collapse: collapse;
    text-align: center;
    background-color: #f1f1f1;
    padding: 5px;
}
.doc-bloco-tabela td{
    border: 1px solid #c1c1c1;
    border-collapse: collapse;
    text-align: center;
    padding: 3px;
}
.doc_td_vtr{
  font-size: 9px;
  font-style: italic;
}
.doc_box{
    width: 100%;
    font-size: 9px;
    text-align: center;
    padding: 3px;
}
.doc_box_at2{
    display: inline;
    white-space: nowrap;
    padding: 3px;
    font-size: 9px;
}