@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.0/font/bootstrap-icons.css");
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap');

* {
  font-family: 'Roboto Flex', sans-serif;
}

.modal-backdrop{
    opacity:0.2 !important;
}

.modal-dialog-shop {
    border-radius: 6px 6px 0px 0px;
    border-top: 2px solid #C20000;
}

.modal-dialog-add {
    border-radius: 6px 6px 0px 0px;
    border-top: 2px solid #0D6EFD;
}

.modal-dialog-see {
    border-radius: 6px 6px 0px 0px;
    border-top: 2px solid green;
}

.modal-dialog-upd {
    border-radius: 6px 6px 0px 0px;
    border-top: 2px solid orange;
}

.modal-dialog-upload {
    border-radius: 6px 6px 0px 0px;
    border-top: 2px solid darkviolet;
}

.modal-dialog-del {
    border-radius: 6px 6px 0px 0px;
    border-top: 2px solid indianred;
}

.modal-dialog-tip {
    border-radius: 6px 6px 0px 0px;
    border-top: 2px solid orangered;
}

.modal-header{
    height: 36px !important;
    display: flex;
    align-items: center;
    background-color:var(--bg-color-fondo) !important; 
}

.modal-title-shop {
    font-size: 15px; 
    font-weight: 400;
    color: #C20000;
/*    margin-top: -8px; */
}

.modal-title-add {
    font-size: 15px; 
    font-weight: 400;
    color: #0D6EFD;
/*    margin-top: -8px; */
}

.modal-title-see {
    font-size: 15px; 
    font-weight: 400;
    color: green;
/*    margin-top: -8px; */
}

.modal-title-upd {
    font-size: 15px; 
    font-weight: 400;
    color: orange;
/*    margin-top: -8px; */
}

.modal-title-del {
    font-size: 15px; 
    font-weight: 400;
    color: indianred;
/*    margin-top: -8px; */
}

.modal-title-tip {
    font-size: 15px; 
    font-weight: 400;
    color: orangered;
/*    margin-top: -8px; */
}

.body_staff{
   border-radius: 5px 5px 0px 0px;
}

.input {
    height: 30px;
    width: 100%;
    color: #566573;
    font-size: 13px;
    border-style: solid;
    border-width: 1px;
    border-radius: 5px;
    border-color: rgb(222, 226, 230);
/*    background-color: lightskyblue ;*/
}

h6 {
    height: 30px;
    width: 100%;
    display: flex;
    color: #566573;
    font-family: 'Roboto Flex', sans-serif;
    font-size: 13px;
    align-items: center;
/*    border-radius: 5px;
    border-style: solid;
    border-width: 1px;
    border-color: green;*/
}

.row-cols-12 {
    margin-bottom: 6px;
    margin-top: 6px;
}

.form-select {
    height: 30px;
    width: 100%;
    color: #566573;
    font-size: 13px;
}

select {
    height: 30px;
    width: 100%;
    color: #566573;
    font-size: 13px;
    margin-bottom: 0px;
    margin-top: 0px;
}

.icon_shop{
    color: #C20000; 
    width: 36px; 
    height: 36px; 
    font-size: 20px; 
    margin-top: 14px; 
}

.icon_add{
    color: #0D6EFD; 
    width: 36px; 
    height: 36px; 
    font-size: 20px; 
/*    margin-top: -8px; */
}

.icon_upd{
    color: orange; 
    width: 36px; 
    height: 36px; 
    font-size: 20px; 
/*    margin-top: -8px; */
}

.icon_see{
    color: green; 
    width: 36px; 
    height: 36px; 
    font-size: 20px; 
/*    margin-top: -8px; */
}

.icon_del{
    color: indianred; 
    width: 36px; 
    height: 36px; 
    font-size: 20px; 
/*    margin-top: -8px; */
}

.icon_tips{
    color: orangered; 
    width: 36px; 
    height: 36px; 
    font-size: 20px; 
/*    margin-top: -8px; */
}

hr{
  border: none;
  height: 1px;
  /* Set the hr color */
  color: #333;  /* old IE */
  background-color: #333;  /* Modern Browsers */
}
/*
.modal-body{
  background-color:var(--bg-color-fondo) !important; 
}*/

.modal-footer{
  height: 40px; 
  align-content: center;
/*  background-color:var(--bg-color-fondo) !important; */
}

input:disabled{
  background-color: transparent;
  border-width: 0px ;
  color:#566573;
}

select:disabled{
  background-color: transparent;
  border-width: 0px ;
  color:#566573;
}

.btn_style{
  font-size: 14px !important;
  font-family: 'Roboto Flex', sans-serif !important;
  color: #C20000;
}

.btn-close{
  color:white;
}

.own_font{
  color:#566573;
  font-size: 13px;
  font-family: 'Roboto Flex', sans-serif;
}

.btn_login{
  max-width: 30%;
}