/* #FCED2F   #70A9FF */
html:not(.editor):not(.editor-parent) {
  height: 100%;
  letter-spacing: 1px !important;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
}
body {
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f7cac9+0,92a8d1+100 */
  /* IE6-9 fallback on horizontal gradient */
  height: 100%;
}
button {
}


.bg-datacook-blue{
  background-color: #70A9FF !important;
}

.bg-datacook-yellow{
  background-color: #FCED2F !important;
}

.txt-datacook-blue{
  color: #70A9FF !important;
}

.txt-datacook-yellow{
  color: #FCED2F !important;
}

.btn-datacook{
}
.btn-warning{
  
  color: rgb(0, 0, 0) !important;
}
.btn-secondary{
  color: rgb(255,255,255) !important;
}
.btn-secondary i{
  color: rgb(255,255,255) !important;
}
.btn-yellow{
  background-color: #FCED2F !important;
  border-radius: 0px !important;
  font-weight: 1000 !important;
  font-size: 15px !important;
  padding: 0.9rem !important;
  margin: 0.3rem !important;
  color: rgb(0, 0, 0) !important;
}
.btn-yellow:hover{
  background-color: #eee130 !important;
  color: rgba(0, 0, 0, 0.8) !important;
}

#top {
  margin-top:2rem;
}

.card{
  margin-bottom: 0!important;
}


.answer :is(.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6) {
  color:rgba(57, 76, 94, 0.9) !important;
  margin-top: 1em !important;
  margin-bottom: 1em !important;
  font-size: 1.5rem !important;
}

/*
.card{
  margin:0.5rem;
  padding:0.5rem;
  border-color: rgba(0, 0, 0,0.075) !important;
  border-style: solid !important;
  border-width: 1px !important;
  border-radius: 0px !important;
  background-color: rgb(248, 249, 250, 0.1) !important;
}
*/
/*.card{
  background-color: rgba(255, 255, 255, 0.61) !important;
}
.card-header{
  background-color: rgba(255, 255, 255, 0.61) !important;
}*/
.answer:not(.editor):not(.editor-parent){
    margin:1rem;
    padding:0.5rem;
  }
  
.answer-card :is(h1,h2,h3,h4,h5){
  margin-top: 1em !important;
  margin-bottom: 1em !important;
}


.query{
  margin:0.5rem;
  padding:0.5rem;
  background-color: rgba(222, 236, 255, 0.05);
  -box-shadow: rgba(14, 13, 13, 0.1) 1px 2px 4px;
  width:100%;
  border: 1px solid rgba(0, 0, 0, 0.05);
  border-radius: 0px;
  color: rgba(0,0,0,0.6) !important;
  box-shadow:0rem 0.5rem 0.5rem 0  rgba( 31, 38, 135, 0.1 ); 
  
}
.query:focus{
  border: 1px solid rgba(0, 0, 0, 0.15) !important;
  color: rgba(0,0,0,0.6) !important;
}

.square-card .query{
  background-color: rgba(222, 236, 255, 0.2) !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  color: rgba(255, 255, 255, 0.966) !important; 
  
}
.square-card .button-datacook{
  background-color: #70A9FF66 !important;
  border: 1px solid #C4E1FF96 !important;
  box-shadow: rgba(95, 195, 255, 0.28) 2px 2px 14px !important;
}
/*
.logo{
    
  display: block;
  margin: auto;
}
*/
.prop{
  margin:2px;
  padding:3px 10px;
  font-size: 11;
  background: #ffffff50;
  border:0;
  text-align: left;
  font-size: 14px;
  letter-spacing: 1px !important;
  border-radius: 4px !important;
}


.button-datacook {
  background: #70A9FF;
  border: 1px solid #70A9FF;
  border-radius: 6px;
  box-shadow: rgba(0, 0, 0, 0.1) 1px 2px 4px;
  box-sizing: border-box;
  color: #FFFFFF;
  cursor: pointer;
  font-size: 14;
  font-weight: 800;
  line-height: 16px;
  min-height: 40px;
  outline: 0;
  padding: 12px 14px;
  text-align: center;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  vertical-align: middle;

}

.button-datacook:hover,
.button-datacook:active {
  background-color: initial;
  background-position: 0 0;
  color: #70A9FF !important;
}

.button-datacook:active {
  opacity: .5;
}

.button-datacook:disabled {
  background-color: #a8c3eb !important;
  border: black;
  cursor: not-allowed;
}

.button-black{
  background: #000000;
  border: 1px solid #000000;
}
.button-black:hover,
.button-black:active {
  background-color: initial;
  background-position: 0 0;
  color: #000000;
}


#button_ask{
  margin-top: 0.5rem !important;
  display: block;
  margin: auto;
}

.editor-parent{
  display:inline-block;
  position:relative;
  width:100%;
  /*height: 0;*/ /*need to be unset at startup*/
  
  box-shadow: 0.25rem 0.25rem 0 0  rgba( 31, 38, 135, 0.15 ),
      0rem 0.5rem 0 0  rgba(58, 12, 87, 0.15);
}


.editor{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  /*font-family: "Monaco", "Menlo", "Ubuntu Mono", "Consolas", "Source Code Pro", "source-code-pro", monospace;
  font-feature-settings: normal
  font-kerning: auto*/
}

button{
  color: rgb(255, 255, 255, 0.9) !important;
}
.square-card{
  backdrop-filter: blur(50px);
  /*color:azure !important;*/
  color: rgb(255, 255, 255, 0.9) !important;
  box-shadow:0rem 0.75rem 1rem 0  rgba( 31, 38, 135, 0.1 ),
            inset rgba(255, 255, 255, 0.6) 0px 0px 3rem -0.7rem; 
  
  /*box-shadow: 0rem 0.25rem 1rem 0 rgba(255, 255, 255, 0.1);*/

border: solid 1px rgba(255, 255,255, 0.2);
border-radius: 0 !important;
transition: background-color .2s ease-in-out;
}
.square-card :is(h1,h2,h3,h4,h5,button){
  color: rgb(255, 255, 255, 1) !important;
}

.dark-card{
  /*rgba(111, 169, 255, 0.7)*/
  /*rgba(252, 237, 48, 0.7)*/
  background-color: rgba(0, 0, 0, 0.9);
}
.dark-card:hover{
  background-color: rgba(0, 0, 0, 0.95);
}

.panel-tabs nav button{
  padding: 0px 30px !important;
  margin: 1px !important;
  
  background-color: #36609b73 !important;
  color: #364457 !important;
  border-radius: 0px !important;
}
.panel-tabs nav button:hover{
  background-color: #364457 !important;
  border-radius: 3px !important;
  color: #ffffff !important;
}
.panel-tabs nav button:active{
  background-color: #36445746 !important;
  color: #364457 !important;
  border-radius: 0px !important;
}
.panel-tabs nav .active{
  background-color: #546b8c !important;
  border-radius: 0px !important;
  color: #ffffff !important;
}

.blue-card{
  background-color: rgba(72, 130, 183, 0.9);
}
.blue-card:hover{
  background-color: rgba(72, 130, 183, 0.95);
}
.blue-datacook-card{
  background-color: rgba(90, 151, 215, 0.9);;
}
.blue-datacook-card:hover{
  background-color: rgba(90, 151, 215, 0.95);;
}
.grey-card{
  background-color: rgba(70, 83, 98, 0.9);
  color: rgb(255, 255, 255, 0.9) !important;
}
.grey-card:hover{
  background-color: rgba(70, 83, 98, 0.95);
  color: rgb(255, 255, 255, 0.9) !important;
}
.green-card{
  background-color: rgba(111, 174, 154, 0.9);;
}
.green-card:hover{
  background-color: rgba(111, 174, 154, 0.95);;
}


.shadow-card{
  /*rgba(111, 169, 255, 0.7)*/
  /*rgba(252, 237, 48, 0.7)*/
  background: linear-gradient(-45deg, 
  rgba(252, 237, 48, 0.50) 0%,
  rgba(252, 237, 48, 0.50) 5%,
   rgba(111, 169, 255, 0.50) 5%,
   rgba(111, 169, 255, 0.50) 7%,
   rgba(255, 255, 255, 0.7) 7%,
   rgba(255, 255, 255, 0.7) 70%,
   rgba(255, 255, 255, 0.7) 100%);
    backdrop-filter: blur(50px);
    /*color:azure !important;*/
    color: rgba(142, 146, 165) !important;
    box-shadow:0rem 0.75rem 1rem 0  rgba( 31, 38, 135, 0.1 ),
              inset rgba(0, 0, 0, 0.1) 0px 0px 3rem -0.7rem; 
    
    /*box-shadow: 0rem 0.25rem 1rem 0 rgba(255, 255, 255, 0.1);*/

  background-color: rgba(255, 255, 255, 0);
  border: solid 1px rgba(255, 255,255, 0.2);
    transition: background-color .2s ease-in-out;
}
.shadow-card:hover{
  background-color: rgba(255, 255, 255, 0.2);
}
.credit-card-widget .card-header{
  
  background-color: rgb(63, 90, 119) !important;
  padding:1rem !important;
}
.credit-card-widget .card-header::before{
  -opacity:0.5 !important;
  background: linear-gradient(225deg, #70A9FF 6%, #023e62 56%) !important;
}
.credit-card-widget .card-header::after{
  background: linear-gradient(145deg, var(#079aa2) 6%, var(#006166) 56%) !important;
}

.badge-primary{
  background-color: #6fa6fc !important;
}
.badge-secondary{
  background-color: rgb(1, 31, 77) !important;
}
.badge-warning{
  background-color: rgb(241, 106, 27) !important;
}
.badge-danger{
  background-color: rgb(192, 50, 33) !important;
}
.badge-success{
  background-color: rgb(26, 160, 83) !important;
}
.badge-info{
  background-color: #079aa2 !important;
}
.badge-light{
  background-color: rgb(222, 226, 230) !important;
  color: #575757 !important;
}
.badge-dark{
  background-color: rgb(33, 37, 42) !important;
}

.alert-success{
  background-color: #20ff0033;
  border: 1px solid #0000001c;
  box-shadow: 3px 3px 2px 1px rgba(0, 0, 0, 0.03), -10px 0 10px #fff0;
  color: #35593a;
}

table.dataTable{
  /* évite un décalage visuel entre le header et le contenu */
  margin: unset !important;
}
div.dt-container {
  /* évite que la barre de scroll soit décollée de la table */
  width: fit-content !important;
}

input[type="checkbox"]:focus:not(:checked) {
  background-color: transparent !important;
  outline: none;
  box-shadow: none;
}