/* SQL Chart Builder 3.0 — front-end styles */

.gf-alert {
  padding: 15px !important;
  margin-bottom: 20px !important;
  border: 1px solid transparent !important;
  border-radius: 6px !important;
  overflow: auto
}

.gf-alert-success {
  color: #3c763d;
  background-color: #dff0d8;
  border-color: #d6e9c6;
}


.gf-alert-info {
  color: #31708f !important;
  background-color: #d9edf7 !important;
  border-color: #bce8f1 !important;
}


.gf-alert-warning {
  color: #8a6d3b;
  background-color: #fcf8e3;
  border-color: #faebcc;
}


.gf-alert-danger {
  color: white !important;
  background-color: #a94442 !important;
  border-color: #ebccd1 !important;

}

/* ---------- chart wrapper ---------- */

.gvn-chartwrap {
  position: relative;
  margin: 10px 0 20px;
  width: 100%;
}

/* ---------- dynamic filters form ---------- */

.guaven_sqlcharts_form {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  padding: 14px 16px;
  margin: 0 0 18px;
  background: #f8f9fb;
  border: 1px solid #e3e6ea;
  border-radius: 8px;
}

.guaven_sqlcharts_form .gvn-filter-field {
  display: inline-flex;
  flex-direction: column;
  gap: 4px;
}

.guaven_sqlcharts_form .gvn-filter-field label {
  font-size: 12px;
  font-weight: 600;
  color: #50575e;
  text-transform: uppercase;
  letter-spacing: .03em;
}

.guaven_sqlcharts_form input[type="text"],
.guaven_sqlcharts_form input[type="number"],
.guaven_sqlcharts_form input[type="date"] {
  display: inline-block;
  max-width: 210px;
  padding: 7px 10px;
  font-size: 14px;
  color: #1d2327;
  background: #fff;
  border: 1px solid #c6cbd2;
  border-radius: 6px;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}

.guaven_sqlcharts_form input[type="number"] {
  width: 110px;
}

.guaven_sqlcharts_form input:focus {
  border-color: #4693dd;
  box-shadow: 0 0 0 2px rgba(70, 147, 221, .18);
}

.guaven_sqlcharts_form input[type="submit"] {
  padding: 8px 22px;
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  background: #4693dd;
  border: 0;
  border-radius: 6px;
  cursor: pointer;
  transition: background .15s ease;
}

.guaven_sqlcharts_form input[type="submit"]:hover {
  background: #3a7fc4;
}

.gws_datepicker { display: inline-block !important }

/* ---------- table view ---------- */

.gvn-tablewrap {
  overflow-x: auto;
  margin: 6px 0 14px;
  border: 1px solid #e3e6ea;
  border-radius: 8px;
}

.gvn-tablewrap .gvn-table {
  width: 100%;
  margin: 0;
  border-collapse: collapse;
  font-size: 14px;
  background: #fff;
}

.gvn-tablewrap .gvn-table th {
  padding: 10px 14px;
  text-align: left;
  font-weight: 600;
  color: #fff;
  background: #4693dd;
  border: 0;
  white-space: nowrap;
}

.gvn-tablewrap .gvn-table td {
  padding: 9px 14px;
  border: 0;
  border-top: 1px solid #eef0f3;
  color: #1d2327;
}

.gvn-tablewrap .gvn-table tr:nth-child(even) td {
  background: #f8f9fb;
}

.gvn-tablewrap .gvn-table tr:hover td {
  background: #eef5fc;
}

/*!
 * Datepicker v1.0.0
 * https://fengyuanchen.github.io/datepicker
 *
 * Copyright 2014-present Chen Fengyuan
 * Released under the MIT license
 *
 * Date: 2018-08-05T03:02:13.513Z
 */.datepicker-container{-moz-user-select:none;-ms-touch-action:none;-ms-user-select:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;background-color:#fff;direction:ltr;font-size:12px;left:0;line-height:30px;position:fixed;top:0;touch-action:none;user-select:none;width:210px;z-index:-1}.datepicker-container:after,.datepicker-container:before{border:5px solid rgba(0,0,0,0);content:" ";display:block;height:0;position:absolute;width:0}.datepicker-dropdown{-webkit-box-shadow:0 3px 6px #ccc;-webkit-box-sizing:content-box;border:1px solid #ccc;box-shadow:0 3px 6px #ccc;box-sizing:content-box;position:absolute;z-index:1}.datepicker-inline{position:static}.datepicker-top-left,.datepicker-top-right{border-top-color:#39f}.datepicker-top-left:after,.datepicker-top-left:before,.datepicker-top-right:after,.datepicker-top-right:before{border-top:0;left:10px;top:-5px}.datepicker-top-left:before,.datepicker-top-right:before{border-bottom-color:#39f}.datepicker-top-left:after,.datepicker-top-right:after{border-bottom-color:#fff;top:-4px}.datepicker-bottom-left,.datepicker-bottom-right{border-bottom-color:#39f}.datepicker-bottom-left:after,.datepicker-bottom-left:before,.datepicker-bottom-right:after,.datepicker-bottom-right:before{border-bottom:0;bottom:-5px;left:10px}.datepicker-bottom-left:before,.datepicker-bottom-right:before{border-top-color:#39f}.datepicker-bottom-right:after,.datepicker-bottom-right:before,.datepicker-top-right:after,.datepicker-top-right:before{left:auto;right:10px}.datepicker-panel>ul{margin:0;padding:0;width:102%}.datepicker-panel>ul:after,.datepicker-panel>ul:before{content:" ";display:table}.datepicker-panel>ul:after{clear:both}.datepicker-panel>ul>li{background-color:#fff;cursor:pointer;float:left;height:30px;list-style:none;margin:0;padding:0;text-align:center;width:30px}.datepicker-panel>ul>li:hover{background-color:#e5f2ff}.datepicker-panel>ul>li.muted,.datepicker-panel>ul>li.muted:hover{color:#999}.datepicker-panel>ul>li.highlighted{background-color:#e5f2ff}.datepicker-panel>ul>li.highlighted:hover{background-color:#cce5ff}.datepicker-panel>ul>li.picked,.datepicker-panel>ul>li.picked:hover{color:#39f}.datepicker-panel>ul>li.disabled,.datepicker-panel>ul>li.disabled:hover{background-color:#fff;color:#ccc;cursor:default}.datepicker-panel>ul>li.disabled.highlighted,.datepicker-panel>ul>li.disabled:hover.highlighted{background-color:#e5f2ff}.datepicker-panel>ul>li[data-view="month next"],.datepicker-panel>ul>li[data-view="month prev"],.datepicker-panel>ul>li[data-view="year next"],.datepicker-panel>ul>li[data-view="year prev"],.datepicker-panel>ul>li[data-view="years next"],.datepicker-panel>ul>li[data-view="years prev"],.datepicker-panel>ul>li[data-view=next]{font-size:18px}.datepicker-panel>ul>li[data-view="month current"],.datepicker-panel>ul>li[data-view="year current"],.datepicker-panel>ul>li[data-view="years current"]{width:150px}.datepicker-panel>ul[data-view=months]>li,.datepicker-panel>ul[data-view=years]>li{height:52.5px;line-height:52.5px;width:52.5px}.datepicker-panel>ul[data-view=week]>li,.datepicker-panel>ul[data-view=week]>li:hover{background-color:#fff;cursor:default}.datepicker-hide{display:none}

/* ---------- datepicker modern skin (overrides) ---------- */

.datepicker-dropdown {
  border: 1px solid #e3e6ea !important;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(29, 35, 39, .14) !important;
}

.datepicker-panel > ul > li {
  transition: background .12s ease, color .12s ease;
  border-radius: 4px;
}

.datepicker-panel > ul > li:hover,
.datepicker-panel > ul > li.highlighted {
  background-color: #eaf3fc;
}

.datepicker-panel > ul > li.highlighted:hover {
  background-color: #d7e9f9;
}

.datepicker-panel > ul > li.picked,
.datepicker-panel > ul > li.picked:hover {
  color: #fff;
  background-color: #4693dd;
  font-weight: 600;
}

.datepicker-panel > ul[data-view=week] > li {
  font-weight: 600;
  color: #50575e;
  text-transform: uppercase;
  font-size: 10px;
}

.datepicker-panel > ul > li[data-view="month current"],
.datepicker-panel > ul > li[data-view="year current"],
.datepicker-panel > ul > li[data-view="years current"] {
  font-weight: 600;
  color: #1d2327;
}

.datepicker-top-left, .datepicker-top-right { border-top-color: #4693dd }
.datepicker-top-left:before, .datepicker-top-right:before { border-bottom-color: #4693dd }
.datepicker-bottom-left, .datepicker-bottom-right { border-bottom-color: #4693dd }
.datepicker-bottom-left:before, .datepicker-bottom-right:before { border-top-color: #4693dd }