img.flagSizeSmall {
  height: 15px;
  width: 20px;
}

body {
  position: relative;
  padding-top: 40px;
  padding-bottom: 30px;
}

a.user:hover {
  text-decoration: none;
}

textarea {
  height: 300px;
  width: 98%;
}

.comment {
  height: 100px;
  width: 80%;
}

.message {
  height: 100px;
  width: 50%;
}

.cell-adjust-to-content {
  white-space: nowrap;
  width: 1%;
}

.sample-tests .input,
.sample-tests .output {
  border: 1px solid #888;
}

.sample-tests .output {
  margin-bottom: 1em;
  position: relative;
  top: -1px;
}

.sample-tests .pre {
  padding: 0.25em;
  margin: 0;
  background-color: #efefef;
  max-height: calc(1.4em * 30); /* 30 lines assuming 1.4em line-height */
  line-height: 1.4em;
  overflow: hidden;
}

.sample-test .overflow-message {
  display: none;
  text-align: center;
}

.has-overflow .overflow-message {
  display: block;
}

.sample-tests {
  font-family: Consolas, "Lucida Console", "Andale Mono",
    "Bitstream Vera Sans Mono", "Courier New", Courier;
  font-size: 0.9em;
}

.sample-tests .title {
  font-size: 1.3em;
  padding: 0.25em;
  border-bottom: 1px solid #888;
  text-transform: lowercase;
  font-weight: bold;
}

.standings .cell {
  text-align: center;
  min-width: 75px;
  max-width: 75px;
  font-size: 13px;
  padding-top: 10px;
}

.cell-small {
  width: 20px;
}

.cell-problem-letter {
  width: 40px;
}

.cell-medium {
  width: 70px;
}

.standing-row-selected {
  background-color: #ddf1fb;
}

.standings .user {
  min-width: 50px;
  max-width: 100px;
}

.standing .problem {
  text-align: center;
}

.text {
  white-space: pre;
}

.center {
  text-align: center;
}

.right {
  text-align: right;
}

.statement h5,
.statement h4,
.statement h3,
.statement h2 {
  text-align: center;
}

.form-signin {
  max-width: 700px;
  padding: 19px 29px 29px;
  margin: 0 auto 20px;
  background-color: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 5px;
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.form-signin .form-signin-heading {
  margin-bottom: 10px;
}

a.disabled {
  color: gray;
  pointer-events: none;
}

.alert-problem-first {
  background-color: #b9d4ac;
  color: #39703a;
}

.alert-contest-first {
  background-color: #b9d4ac;
  color: #39703a;
}

.alert-failed {
  background-color: #f2dede;
  color: #b94a48;
}

.alert-solved {
  background-color: #dff0d8;
  color: #468847;
}

.alert-frozen {
  background-color: #e5e5e5;
  color: #717171;
}

.margin-bottom-0 {
  margin-bottom: 0 !important;
}
.margin-bottom-5 {
  margin-bottom: 5px !important;
}
.margin-bottom-10 {
  margin-bottom: 10px !important;
}
.margin-bottom-15 {
  margin-bottom: 15px !important;
}
.margin-bottom-20 {
  margin-bottom: 15px !important;
}

.margin-top-0 {
  margin-top: 0 !important;
}
.margin-top-5 {
  margin-top: 5px !important;
}
.margin-top-10 {
  margin-top: 10px !important;
}
.margin-top-15 {
  margin-top: 15px !important;
}
.margin-top-20 {
  margin-top: 15px !important;
}

/* PROBLEM TAGS */
a.problem-tag {
  text-decoration: none;
}

/* login/register */
.social-button {
  text-decoration: none !important;
  padding: 0 !important;
  margin: 0 5px 0 5px !important;
}

.lined-text {
  width: 100%;
  text-align: center;
  border-bottom: 1px solid #999;
  line-height: 0.1em;
  margin: 10px 0 20px;
}

.lined-text span {
  background: #fff;
  padding: 0 10px;
}

/* responsive filter form */
form.filter {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

form.filter * {
  margin: 0 2px 0 2px;
}

@media (max-width: 600px) {
  form.filter {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  form.filter * {
    margin: 2px 0 2px;
  }
}

#report-issues a.reporter-button {
  position: fixed;
  right: 10px;
  bottom: 10px;
  font-size: 25px;
  color: #337ab7;
}

.modal-open {
  position: fixed;
  overflow: scroll;
  width: 100%;
  padding-right: 0 !important;
}

/* captcha field */
.captcha-wrapper {
  display: flex;
  align-items: center;
}

.captcha-wrapper > img.captcha {
  display: inline-block;
  max-width: 100%;
  height: auto;
  padding: 4px;
  line-height: 1.42857143;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.captcha-wrapper > input {
    margin: 0 5px 0 5px;
}

/* field errors */
.errorlist {
    list-style: none;
    padding: 0;
}

.instance-info {
  display: flex;
  gap: 5px;
}
.instance-info-last-login {
  display: flex;
  justify-content: center;
  margin-top: 3px;
  min-width: 20px;
}
.instance-info-team {
  flex: auto;
}
.instance-info-team-profiles {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 10px;
}
.instance-info-user {
  flex: auto;
}
.instance-info-last-login .not-logged {
  color: #dd2828;
}
.instance-info-last-login .logged {
  color: #2da529;
}
.instance-action {
  display: flex;
  gap: 5px;
  justify-content: center;
}

/* markdown editor styles */
.markdown-view-container .CodeMirror {
  min-height: auto;
  padding: 10px 0;
  border: none;
}
.markdown-view-container .editor-preview-side,
.markdown-view-container .CodeMirror > * {
  display: none !important;
}
.markdown-view-container .CodeMirror > .editor-preview.editor-preview-active {
  display: block !important;
  position: relative;
  padding: 10px 0;
  background: white;
}

/* fullscreen editor overleid the header nav */
.editor-toolbar.fullscreen,
.editor-toolbar.fullscreen::before,
.editor-toolbar.fullscreen::after {
  z-index: 1050 !important;
}
.CodeMirror.CodeMirror-fullscreen,
.editor-preview-side.editor-preview-active-side {
  z-index: 1050 !important;
}

/* badge colors */
.badge.badge-success {
  color: #fff;
  background-color: #5cb85c;
  border-color: #4cae4c;
}
.badge.badge-primary {
  color: #fff;
  background-color: #337ab7;
  border-color: #2e6da4;
}
.badge.badge-danger {
  color: #fff;
  background-color: #d9534f;
  border-color: #d43f3a;
}

/* feedback image */
.feedback-screenshot {
  display: flex;
  margin: auto;
  cursor: pointer;
  max-height: 500px;
  max-width: 100%;
  object-fit: cover;
  border: 1px solid #ccc;
  border-radius: 4px;
}
.feedback-screenshot:hover {
  filter: brightness(0.95);
}
.overlay-image {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #00000050;
  z-index: 2000;
}
.overlay-image img {
  max-width: 95vw;
  max-height: 95vh;
  object-fit: contain;
  border: 1px solid #ccc;
  border-radius: 4px;
}