:root {
  --zg-tabs-color-1: var(--color-body, #074361);
  --zg-tabs-color-2: #136893;
  --zg-tabs-active-color-1: #0c90c9;
  --zg-tabs-active-color-2: #34c8fb;
  --zg-tabs-panel-border-radius: 6px;
}

/* MAIN WRAPPER
--------------------------- */
.zg-tabs { margin-bottom:30px; }

/* CONTROLS
--------------------------- */
.zg-tabs-controls { min-height:45px; display:flex; align-items:center; justify-content:flex-start; flex-wrap: nowrap; white-space: nowrap; }
.no-js .zg-tabs-controls { display:none; }
.zg-tabs-control { padding:0 1rem; height:45px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; opacity:0; color:#fff; font-size:1.125rem; background:linear-gradient(90deg, var(--gradient-1), var(--color-primary-2)); border-radius:6px 6px 0 0; user-select:none; animation:FADE .7s forwards; }
.no-js .zg-tabs-control { margin:-24px -24px 0; padding-top:10px; padding-bottom:5px; display:flex !important; align-items:center; justify-content:flex-start; opacity:1; color:var(--color-primary-1); background:#e9f4f9 !important; border-radius:6px 6px 0 0; }
.zg-tabs-control + .zg-tabs-control { margin-left:5px; }
.zg-tabs-control.zg-tabs-active { cursor:default; background:linear-gradient(var(--zg-tabs-active-color-1), var(--zg-tabs-active-color-2)); }

/* PANELS
--------------------------- */
.zg-tabs-panel { position:relative; padding:var(--zg-tabs-panel-padding); display:none; background:#fff; border-radius:0 6px 6px 6px; box-shadow:0 0 15px rgba(0,0,0,.1); }
.zg-tabs-panel.zg-tabs-active { display:block; }
.no-js .zg-tabs-panel { display:flow-root; border:1px solid rgba(0,0,0,.1); border-radius:var(--zg-tabs-panel-border-radius); }
.zg-tabs-panel.zg-tabs-active { display:block; display:flow-root; }
.no-js .zg-tabs-panel + .zg-tabs-panel { margin-top:50px; }
.zg-tabs-panel > :first-child { margin-top:0 !important; }
.zg-tabs-panel > :last-child { margin-bottom:0 !important; }
.zg-tabs-panel pre { margin:0; }
/* No-JS Tab */
/* [data-zg-integration~="panel"] [data-zg-integration~="tab"] { display:none; } */
/* .no-js [data-zg-integration~="panel"] [data-zg-integration~="tab"] { display:inline-flex; } */
.zg-tabs-panel h3 { overflow:hidden; }


/* MEDIA QUERIES (MIN)
--------------------------- */

/* CUSTOM DESKTOP+ */
@media screen and (min-width:1399px) {
  :root {
    --zg-tabs-panel-padding: 1.5rem;
  }
}

/* MEDIA QUERIES (ONLY)
--------------------------- */


/* MEDIA QUERIES (MAX)
--------------------------- */

/* UP TO CUSTOM DESKTOP */
@media screen and (max-width:1299px) {
  :root {
    --zg-tabs-panel-padding: 1rem;
  }
}

/* MOBILE */
@media screen and (max-width:767px) {
  :root {
    --zg-tabs-panel-padding: 0;
  }

  .zg-tabs-controls { width: 100%; }
  .zg-tabs-control { flex-grow:1; padding:inherit; }
}