/* ------------------------------------------
  Reset ♥
  http://meyerweb.com/eric/tools/css/reset/
  v2.0 | 20110126
  License: none (public domain)
---------------------------------------------*/

h1,h2,h3,h4,h5 {
  font-weight:bold;
  display:block;
  margin:0 0 10px;
  }

  
h2 { font-size:18px; line-height:24px; margin:20px 0 10px;}
h3 { font-size:15px; margin:20px 0; }
ul { margin:0 0 20px; }


a {
  color:#404040;
  font-weight:bold;
  text-decoration:none;
  border-bottom:1px solid #ddd;
  }
  a:hover {
    border-color:#d0d0d0;
    }
strong {
  font-weight:bold;
  }
.notice {
  background:#ffa;
  border:1px solid #cc7;
  display:block;
  padding:10px;
  margin-bottom:10px;
  }
.stretch {
  display:block;
  width:100%;
  }
.pad1y {
  padding:10px 0;
  }
.center {
  text-align:center;
  }
.content {
  margin-top:40px;
  padding:0 0 60px;
  }
.info {
    background-color: #e7f3fe;
    border-left: 6px solid #2196F3;
    border-right: 6px solid #2196F3;
  }

/* Style the tab */
.tab {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
}

/* Style the buttons inside the tab */
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
  font-size: 17px;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #ccc;
}

/* Style the tab content */

.tabcontent {
  display: none;
  padding: 6px 12px;
  -webkit-animation: fadeEffect 1s;
  animation: fadeEffect 1s;
}
/* Fade in tabs */
@-webkit-keyframes fadeEffect {
  from {opacity: 0;}
  to {opacity: 1;}
}

@keyframes fadeEffect {
  from {opacity: 0;}
  to {opacity: 1;}
}

table {
  background:#fff;
  max-width:100%;
  border-spacing:0;
  width:100%;
  margin:10px 0;
  border:1px solid #ddd;
  border-collapse:separate;
  *border-collapse:collapsed;
  -webkit-box-shadow:0 0 4px rgba(0,0,0,0.10);
     -moz-box-shadow:0 0 4px rgba(0,0,0,0.10);
          box-shadow:0 0 4px rgba(0,0,0,0.10);
  }
  table th,
  table td {
    padding:8px;
    line-height:18px;
    text-align:left;
    border-top:1px solid #ddd;
    }
  table th {
    background:#eee;
    background:-webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#eee));
    background:-moz-linear-gradient(top, #f6f6f6, #eee);
    text-shadow:0 1px 0 #fff;
    font-weight:bold;
    vertical-align:bottom;
    cursor: pointer;
    }
  table td {
    vertical-align:top;
    }
  table thead:first-child tr th,
  table thead:first-child tr td {
    border-top:0;
    }
  table tbody + tbody {
    border-top:2px solid #ddd;
    }
  table th + th,
  table td + td,
  table th + td,
  table td + th {
    border-left:1px solid #ddd;
    }
  table thead:first-child tr:first-child th,
  table tbody:first-child tr:first-child th,
  table tbody:first-child tr:first-child td {
    border-top:0;
    }

header {
  width:960px;
  margin:0 auto;
  padding:0 20px;
  }

.limiter {
  width:520px;
  margin:0 auto;
  padding:0 20px;
  }

.links {
  width:480px;
  margin:50px auto 0;
  }
  .links a {
    width:50%;
    float:left;
    }
a.button {
  background:#1F90FF;
  border:1px solid #1f4fff;
  height:40px;
  line-height:38px;
  color:#fff;
  display:inline-block;
  text-align:center;
  padding:0 10px;
  -webkit-border-radius:1px;
          border-radius:1px;
  -webkit-transition:box-shadow 150ms linear;
     -moz-transition:box-shadow 150ms linear;
       -o-transition:box-shadow 150ms linear;
          transition:box-shadow 150ms linear;
  }
  a.button:hover {
    background-color:#0081ff;
    -webkit-box-shadow:0 1px 5px rgba(0,0,0,0.25);
            box-shadow:0 1px 5px rgba(0,0,0,0.25);
    border:1px solid #1f4fff;
    }
  a.button:focus,
  a.button:active {
    background:#0081ff;
    -webkit-box-shadow:inset 0 1px 5px rgba(0,0,0,0.25);
            box-shadow:inset 0 1px 5px rgba(0,0,0,0.25);
    }

.options {
  margin:10px 0 30px 15px;
  }
  .options h3 {
    display:block;
    padding-top:10px;
    margin-top:20px;
    }
  .options h3:first-child {
    border:none;
    margin-top:0;
    }

pre,
code {
  font-family:Consolas, Menlo, 'Liberation Mono', Courier, monospace;
  word-wrap:break-word;
  color:#333;
  }
pre {
  font-size:13px;
  line-height:1.25em;
  background:#fff;
  padding:10px 15px;
  margin:10px 0;
  overflow: auto;
  -webkit-box-shadow:0 1px 3px rgba(0, 0, 0, 0.30);
          box-shadow:0 1px 3px rgba(0, 0, 0, 0.30);
  }
code {
  font-size:12px;
  border:0;
  padding:0;
  background:#e6e6e6;
  background:rgba(0,0,0,0.08);
  box-shadow:0 0 0 2px rgba(0,0,0,0.08);
  }
pre code {
  font-size:13px;
  line-height:1.25em;
  background:transparent;
  box-shadow:none;
  border:none;
  padding:0;
  margin:0;
  }

.col12 { width:100%; }
.col6 { width:50%; float:left; display:block; }
.dropdown { width: 160px;}
.pill-group {
  margin:40px 0 0;
  }
  .pill-group a:first-child {
    border-radius:20px 0 0 20px;
    border-right-width:0;
    }
  .pill-group a:last-child {
    border-radius:0 20px 20px 0;
    }

.content.server table {
      margin: 20px auto;
      width: 90%;
}
  
.content.server .title {
      width: 90%;
      margin: 0 auto;
      text-align: center;
  }
  
.content.server .title h1,
.content.server .title h2 {
      margin: 0;
  }
  
.content.server .title h1 {
      font-size: 44px;
  }
  
.content.server .feedback-quality {
      margin: 0 auto;
      width: 90%;
      text-align: center;
  }
  
.content.server .cvp-popover .popover {
      max-width: 400px !important;
  }

/*-----------------------------------
  Markup free clearing
  Details: http: //perishablepress.com/press/2009/12/06/new-clearfix-hack
-------------------------------------*/
.clearfix:after {
  content: '.';
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
  }

* html .clearfix { height: 1%; } /* IE6 */
*:first-child + html .clearfix { min-height: 1%; } /* IE7 */

/* Syntax highlighting */
.c     { color: #998; font-style: italic } /* Comment */
.err   { color: #a61717; background-color: #e3d2d2 } /* Error */
.k     { font-weight: bold } /* Keyword */
.o     { font-weight: bold } /* Operator */
.cm    { color: #998; font-style: italic } /* Comment.Multiline */
.cp    { color: #999; font-weight: bold } /* Comment.Preproc */
.c1    { color: #998; font-style: italic } /* Comment.Single */
.cs    { color: #999; font-weight: bold; font-style: italic } /* Comment.Special */
.gd    { color: #000; background-color: #fdd } /* Generic.Deleted */
.gd .x { color: #000; background-color: #faa } /* Generic.Deleted.Specific */
.ge    { font-style: italic } /* Generic.Emph */
.gr    { color: #a00 } /* Generic.Error */
.gh    { color: #999 } /* Generic.Heading */
.gi    { color: #000; background-color: #dfd } /* Generic.Inserted */
.gi .x { color: #000; background-color: #afa } /* Generic.Inserted.Specific */
.go    { color: #888 } /* Generic.Output */
.gp    { color: #555 } /* Generic.Prompt */
.gs    { font-weight: bold } /* Generic.Strong */
.gu    { color: #aaa } /* Generic.Subheading */
.gt    { color: #a00 } /* Generic.Traceback */
.kc    { font-weight: bold } /* Keyword.Constant */
.kd    { font-weight: bold } /* Keyword.Declaration */
.kp    { font-weight: bold } /* Keyword.Pseudo */
.kr    { font-weight: bold } /* Keyword.Reserved */
.kt    { color: #458; font-weight: bold } /* Keyword.Type */
.m     { color: #099 } /* Literal.Number */
.s     { color: #d14 } /* Literal.String */
.na    { color: #008080 } /* Name.Attribute */
.nb    { color: #0086B3 } /* Name.Builtin */
.nc    { color: #458; font-weight: bold } /* Name.Class */
.no    { color: #008080 } /* Name.Constant */
.ni    { color: #800080 } /* Name.Entity */
.ne    { color: #900; font-weight: bold } /* Name.Exception */
.nf    { color: #900; font-weight: bold } /* Name.Function */
.nn    { color: #555 } /* Name.Namespace */
.nt    { color: #000080 } /* Name.Tag */
.nv    { color: #008080 } /* Name.Variable */
.ow    { font-weight: bold } /* Operator.Word */
.w     { color: #bbb } /* Text.Whitespace */
.mf    { color: #099 } /* Literal.Number.Float */
.mh    { color: #099 } /* Literal.Number.Hex */
.mi    { color: #099 } /* Literal.Number.Integer */
.mo    { color: #099 } /* Literal.Number.Oct */
.sb    { color: #d14 } /* Literal.String.Backtick */
.sc    { color: #d14 } /* Literal.String.Char */
.sd    { color: #d14 } /* Literal.String.Doc */
.s2    { color: #d14 } /* Literal.String.Double */
.se    { color: #d14 } /* Literal.String.Escape */
.sh    { color: #d14 } /* Literal.String.Heredoc */
.si    { color: #d14 } /* Literal.String.Interpol */
.sx    { color: #d14 } /* Literal.String.Other */
.sr    { color: #009926 } /* Literal.String.Regex */
.s1    { color: #d14 } /* Literal.String.Single */
.ss    { color: #990073 } /* Literal.String.Symbol */
.bp    { color: #999 } /* Name.Builtin.Pseudo */
.vc    { color: #008080 } /* Name.Variable.Class */
.vg    { color: #008080 } /* Name.Variable.Global */
.vi    { color: #008080 } /* Name.Variable.Instance */
.il    { color: #099 } /* Literal.Number.Integer.Long */
.wrap-image {
  word-break: break-word;   /* break long words */
  overflow-wrap: break-word;
  white-space: normal;      /* allow wrapping */
}

/* Table responsive improvements for mobile rotation */
.table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch; /* smoother scrolling on iOS */
}

/* Prevent cards from stretching to full viewport height to avoid large empty frames */
.card, .container .card {
  height: auto !important;
}
.card-body {
  height: auto !important;
  overflow: visible;
}

/* Landscape mobile: reduce padding and make table horizontally scrollable; show as many columns as possible */
@media (max-width: 812px) and (orientation: landscape) {
  table th, table td { padding: 6px; font-size: 13px; white-space: nowrap; }
  .table-responsive { max-height: calc(100vh - 120px); overflow-y: auto; }
}

/* Small screens portrait: compact rows */
@media (max-width: 576px) {
  table th, table td { padding: 6px; font-size: 13px; }
  .action-buttons { padding: 0.5rem; gap: 0.25rem; }
}

/* Let the whole page a flex column that fills the viewport */
html, body {
  height: 100%;
  margin: 0;
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;          /* full height */
}

/* Let the main content area grow to fill the space */
.container.mt-3 {
  flex: 1;                    /* take up remaining space */
}

/* Optional: keep the footer at the bottom */
footer {
  flex-shrink: 0;             /* never shrink */
}