@media (min-width: 1200px) {
  .container{
    max-width: 970px;
  }
}

@media (max-width: 991px) {
  body {
    margin-top: 50px;
  }
  .navbar{
    position: fixed;
    right: 0;
    left: 0;
    border-radius: 0;
    top: 0;
    /* Hold innholdet i menyen unna hakket på iPhone i liggende modus (viewport-fit=cover) */
    padding-left: env(safe-area-inset-left, 0px);
    padding-right: env(safe-area-inset-right, 0px);
  }
}
/* Med viewport-fit=cover går siden helt ut til kantene på iPhone; innholdet holdes unna hakket */
body {
  padding-left: env(safe-area-inset-left, 0px);
  padding-right: env(safe-area-inset-right, 0px);
}

::selection {
  background-color: #c9812f;
  color: white;
}

/* The side navigation menu */
.sidenav {
  height: 100%; /* 100% Full-height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 2; /* Stay on top */
  top: 0; /* Stay at the top */
  right: 0;
  color: #ebebeb;
  background-color: #343a40;
  overflow-x: hidden; /* Disable horizontal scroll */

  transition: 0.2s; /* 0.5 second transition effect to slide in the sidenav */
  margin-bottom: 100px;
}

.sidenav-menu {
  margin-top: 43px; /* Place content 60px from the top */
  border-left: 2px solid #c9812f;
  padding: 7px;
  padding-bottom: 100px;
}

#overlay {
  position: fixed; /* Sit on top of the page content */
  display: none; /* Hidden by default */
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.6); /* Black background with opacity */
  z-index: 1; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
}

* {
  -webkit-border-radius: 0 !important;
  -moz-border-radius: 0 !important;
  border-radius: 0 !important;
}
::-webkit-scrollbar {
  width: 5px;
}
::-webkit-scrollbar-track {
  background: #343a40;
}
::-webkit-scrollbar-thumb {
  background: #c9812f;
}
::-webkit-scrollbar-thumb:hover {
  background: #a56a27;
}
/* Rullefeltet ligger alltid på html, så Bootstrap trenger ikke å fylle inn for det
   når en modal åpnes. Ellers skyves hele siden mot venstre. */
body.modal-open,
.modal-open .fixed-top,
.modal-open .fixed-bottom,
.modal-open .is-fixed,
.modal-open .sticky-top {
  padding-right: 0 !important;
}
.modal-open .sticky-top {
  margin-right: 0 !important;
}
.modal-open .modal {
  padding-right: 0 !important;
  padding-left: 0 !important;
}
html {
  overflow-y:scroll;
  position: relative;
  min-height: 100%;
  scrollbar-width: thin;
  scrollbar-color: #c9812f #343a40;
}
body {
  background-color: transparent;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  margin-bottom: calc(60px + var(--privacy-h, 0px) + var(--sticky-h, 0px));
  font-size: 14px;
}
.navbar {
  z-index: 3;
  padding: 0px;
  border-bottom: 2px solid #c9812f;
}
.shadow-text {
  text-shadow: 1px 1px 2px black;
}
.footer {
  position: absolute;
  bottom: calc(var(--privacy-h, 0px) + var(--sticky-h, 0px));
  width: 100%;
  height: 60px;
}
.card-menu {
  color: #ebebeb;
  background-color: #343a40;
  border: 2px solid #c9812f;
  padding: 7px;
}
/* Viktig melding på hovedsiden: oransje stripe langs teksten */
.main-important { border-left: 4px solid #c9812f; padding-left: 10px; }
/* Skillet i tittelstien: «Marked / Handelshistorie» */
.crumb-sep { color: #6c757d; }
h5 {
  font-size: 1.1rem;
}
ul.menu {
  list-style: none;
  padding: 0px;
  margin-bottom: 0px;
}
/* Mørke skjemafelt. Bootstrap 4 gir .form-control og .custom-select lys bakgrunn, også ved
   fokus og når feltet er låst, så de tilstandene står med her. Denne filen lastes etter
   Bootstrap, så samme spesifisitet holder uten !important. */
input, textarea, select, .editor,
.form-control, .form-control:focus, .form-control:disabled, .form-control[readonly],
.custom-select, .custom-select:focus, .custom-select:disabled, .input-group-text {
  background-color: #535C66;
  color: #ebebeb;
  border: 1px solid #92A3B2;
}
hr {
  border-top: 1px solid #c9812f;
  margin-top: 5px;
  margin-bottom: 5px;
}
.close {
  color: #f8f9fa;
}
.close:hover {
  color: #f8f9fa;
}
.progress .bg-warning {
  background-color: #c9812f !important;
}
.progress span {
  position: absolute;
  display: flex;
  width: 94%;
  justify-content: center;
  align-items: center;
  height: 16px;
}
/* Bakelag: nivålinja med en markør for ukekravet */
.progress.bakingteam-progress {
  position: relative;
}
.progress.bakingteam-progress span {
  width: 100%;
  top: 0;
  left: 0;
}
.bakingteam-requirement-marker {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  margin-left: -1px;
  background-color: #343a40;
}
.overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.overlay-opacity {
  opacity: 0.2;
}
/* Spillets egne emojier i chat og meldinger (:cookie: osv.) */
img.game-emoji {
  height: 1.4em;
  width: 1.4em;
  margin: 0 .05em;
  vertical-align: -0.35em;
}
a {
  color: #ebebeb;
}
a:hover {
  color: #c9812f;
  text-decoration: none;
}
/* Knapper som ser ut som lenker får samme farge som lenkene, ikke Bootstraps blå */
.btn-link {
  color: #ebebeb;
}
.btn-link:hover, .btn-link:focus {
  color: #c9812f;
  text-decoration: none;
}
a.menu-link {
  width: 100%;
  display: inline-block;
}
.modal-content {
  color: #f8f9fa;
  background-color: #343a40;
  border: 2px solid #c9812f;
}
.modal-header, .modal-footer {
  color: #f8f9fa;
  border-color: #c9812f;
}
/* Oppgraderingsvinduet (Views/upgrade/modal.php): tabell med faste kolonner og like brede sifre, så ingenting hopper */
#upgradeModal {
  font-variant-numeric: tabular-nums;
}
.upg-title-img {
  /* 28 px bilde i en tekstlinje på ca. 19 px: negativ marg så overskriften ikke blir høyere */
  width: 28px;
  height: 28px;
  margin: -5px 6px -5px -2px;
}
.upg-table {
  width: 100%;
  table-layout: fixed;
  font-size: .9rem;
}
.upg-col-label {
  width: 34%;
}
.upg-col-num {
  width: 22%;
}
.upg-table th,
.upg-table td {
  padding: 4px 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.upg-table th {
  font-weight: normal;
  font-size: .8rem;
  color: #adb5bd;
}
.upg-table td {
  border-top: 1px solid #495057;
}
.upg-table th:not(:first-child),
.upg-table td:not(:first-child) {
  text-align: right;
}
/* Økningen i lys oransje, som i forslaget */
.upg-table td.upg-increase {
  color: #f0c27a;
}
.upg-why {
  margin-top: 4px;
  font-size: .8rem;
  color: #adb5bd;
}
.upg-select {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
}
.upg-stepper {
  display: inline-flex;
  align-items: center;
  border: 1px solid #6c757d;
  border-radius: 4px;
  overflow: hidden;
}
.upg-stepper button {
  background: transparent;
  border: 0;
  color: #ebebeb;
  width: 30px;
  height: 30px;
  font-size: 1.1rem;
  line-height: 1;
}
.upg-stepper button:hover:not(:disabled) {
  background: #3E464C;
}
.upg-stepper button:disabled {
  opacity: .4;
}
.upg-steps {
  min-width: 74px;
  text-align: center;
  font-size: .9rem;
}
.upg-max,
.upg-reset {
  display: inline-flex;
  align-items: center;
  height: 32px;
  padding: 0 10px;
  font-size: .8rem;
}
.upg-checkout {
  justify-content: flex-end;
  gap: 12px;
}
.upg-sum {
  min-width: 150px;
  text-align: right;
  white-space: nowrap;
}
.upg-have {
  font-size: .8rem;
  color: #adb5bd;
}
@media (max-width: 420px) {
  .upg-table {
    font-size: .78rem;
  }
  .upg-col-label {
    width: 28%;
  }
  .upg-col-num {
    width: 24%;
  }
}
.gray-scale {
  filter: grayscale(100%);
}
.alert {
  padding: 3px;
}
/* Ingen luft under et varsel når det ikke kommer noe synlig etter det i boksen */
.alert:not(:has(~ :not(.d-none, script, style, template))) {
  margin-bottom: 0;
}
.alert .alert-heading {
  margin-bottom: 0px;
  font-size: inherit;
  font-weight: 400;
}
/* Mørke, tonede varsler som passer de mørke kortene. Cookie-banneret øverst
   (fixed-top) beholder Bootstrap-fargene, siden det ligger over innholdet. */
.alert-success:not(.fixed-top), .alert-danger:not(.fixed-top), .alert-warning:not(.fixed-top) {
  padding: 6px 10px;
  color: #ebebeb;
}
.alert-success:not(.fixed-top) { background-color: rgba(40, 167, 69, .16); border-color: #28a745; }
.alert-danger:not(.fixed-top) { background-color: rgba(220, 53, 69, .16); border-color: #dc3545; }
.alert-warning:not(.fixed-top) { background-color: rgba(255, 193, 7, .14); border-color: #ffc107; }
.alert-success:not(.fixed-top) hr, .alert-danger:not(.fixed-top) hr, .alert-warning:not(.fixed-top) hr { border-top-color: rgba(255, 255, 255, .15); }
.alert-success:not(.fixed-top) .alert-link, .alert-danger:not(.fixed-top) .alert-link, .alert-warning:not(.fixed-top) .alert-link { color: #fff; }
/* Tonede knapper som passer med varslene: svak farge, tydelig kant og lys tekst.
   Litt sterkere farge når du holder over, omtrent like mye som den gule blir mørkere. */
.btn-danger, .btn-outline-danger {
  color: #ebebeb;
  background-color: rgba(220, 53, 69, .16);
  border-color: #dc3545;
}
.btn-danger:hover, .btn-outline-danger:hover,
.btn-danger:focus, .btn-outline-danger:focus, .btn-danger.focus, .btn-outline-danger.focus {
  color: #fff;
  background-color: rgba(220, 53, 69, .28);
  border-color: #dc3545;
}
.btn-danger:focus, .btn-outline-danger:focus, .btn-danger.focus, .btn-outline-danger.focus {
  box-shadow: 0 0 0 .2rem rgba(220, 53, 69, .35);
}
.btn-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled):active,
.btn-danger:not(:disabled):not(.disabled).active, .btn-outline-danger:not(:disabled):not(.disabled).active,
.show > .btn-danger.dropdown-toggle, .show > .btn-outline-danger.dropdown-toggle {
  color: #fff;
  background-color: rgba(220, 53, 69, .36);
  border-color: #dc3545;
}
.btn-danger.disabled, .btn-danger:disabled, .btn-outline-danger.disabled, .btn-outline-danger:disabled {
  color: #ebebeb;
  background-color: rgba(220, 53, 69, .16);
  border-color: #dc3545;
}
.btn-success, .btn-outline-success {
  color: #ebebeb;
  background-color: rgba(40, 167, 69, .16);
  border-color: #28a745;
}
.btn-success:hover, .btn-outline-success:hover,
.btn-success:focus, .btn-outline-success:focus, .btn-success.focus, .btn-outline-success.focus {
  color: #fff;
  background-color: rgba(40, 167, 69, .28);
  border-color: #28a745;
}
.btn-success:focus, .btn-outline-success:focus, .btn-success.focus, .btn-outline-success.focus {
  box-shadow: 0 0 0 .2rem rgba(40, 167, 69, .35);
}
.btn-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled):active,
.btn-success:not(:disabled):not(.disabled).active, .btn-outline-success:not(:disabled):not(.disabled).active,
.show > .btn-success.dropdown-toggle, .show > .btn-outline-success.dropdown-toggle {
  color: #fff;
  background-color: rgba(40, 167, 69, .36);
  border-color: #28a745;
}
.btn-success.disabled, .btn-success:disabled, .btn-outline-success.disabled, .btn-outline-success:disabled {
  color: #ebebeb;
  background-color: rgba(40, 167, 69, .16);
  border-color: #28a745;
}
.btn-secondary, .btn-outline-secondary {
  color: #ebebeb;
  background-color: rgba(255, 255, 255, .06);
  border-color: rgba(255, 255, 255, .25);
}
.btn-secondary:hover, .btn-outline-secondary:hover,
.btn-secondary:focus, .btn-outline-secondary:focus, .btn-secondary.focus, .btn-outline-secondary.focus {
  color: #fff;
  background-color: rgba(255, 255, 255, .12);
  border-color: rgba(255, 255, 255, .25);
}
.btn-secondary:focus, .btn-outline-secondary:focus, .btn-secondary.focus, .btn-outline-secondary.focus {
  box-shadow: 0 0 0 .2rem rgba(255, 255, 255, .35);
}
.btn-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled):active,
.btn-secondary:not(:disabled):not(.disabled).active, .btn-outline-secondary:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle, .show > .btn-outline-secondary.dropdown-toggle {
  color: #fff;
  background-color: rgba(255, 255, 255, .18);
  border-color: rgba(255, 255, 255, .25);
}
.btn-secondary.disabled, .btn-secondary:disabled, .btn-outline-secondary.disabled, .btn-outline-secondary:disabled {
  color: #ebebeb;
  background-color: rgba(255, 255, 255, .06);
  border-color: rgba(255, 255, 255, .25);
}
/* Banneret om personvern nederst på sidene for utloggede, i samme stil som kortene.
   Det ligger under bunnlinjen, som flyttes opp med --privacy-h. */
.privacy-banner {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1030;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px 14px;
  padding: 10px 16px;
  border: 0;
  border-top: 2px solid #c9812f;
  border-radius: 0;
  background: rgba(33, 37, 41, .96);
  color: #ebebeb;
  text-align: center;
  font-size: .9rem;
}
.privacy-banner a {
  color: #ffc107;
}
/* Varsel med beløpet til høyre, som i spillene */
.alert-amount { display: flex; align-items: center; gap: 12px; }
.alert-amount .alert-heading { flex: 1; min-width: 0; }
.alert-amount-value { font-weight: 700; white-space: nowrap; line-height: 1.2; }
.alert-amount-value img { margin-left: 4px; vertical-align: -2px; }
.alert-success .alert-amount-value { color: #28a745; }
.alert-danger .alert-amount-value { color: #ff6b6b; }
.alert-warning .alert-amount-value { color: #ffc107; }
.tooltip .tooltip-inner {
  background-color: #212529;
}
.text-normal {
  color: #ebebeb;
}
.card-menu-label {
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
}
a.card-menu:hover {
  background-color: #3E464C;
  color: inherit;
  text-decoration: none;
}
.bs-tooltip-top .arrow::before, .bs-tooltip-auto[x-placement^="top"] .arrow::before {
  border-top-color: #212529;
}
.bs-tooltip-right .arrow::before, .bs-tooltip-auto[x-placement^="right"] .arrow::before {
  border-right-color: #212529;
}
.bs-tooltip-bottom .arrow::before, .bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
  border-bottom-color: #212529;
}
.bs-tooltip-left .arrow::before, .bs-tooltip-auto[x-placement^="left"] .arrow::before {
  border-left-color: #212529;
}
.table td, .table th {
  color: #f8f9fa;
  border-top: 1px solid #c9812f;
  padding: .25rem;
}
.table thead th {
  border-bottom: 1px solid #c9812f;
}
.table-bordered td, .table-bordered th {
  border: 1px solid #c9812f;
}
.table-bordered thead th {
  border: 1px solid #c9812f;
}
.list-group a {
  color: inherit;
}
.list-group-item-child div {
  color: inherit;
  background-color: #3e464c;
}
.list-group-item {
  color: inherit;
  background-color: #343a40;
}
.list-group a:hover, .list-group a:focus {
  color: inherit;
  background-color: #3e464c;
}
.list-group-item-action:focus, .list-group-item-action:hover, .list-group-item-action:active {
  color: inherit;
  background-color: #3e464c;
}
.list-group-item.collapsed a {
  color: inherit;
  background-color: #343a40;
}

::placeholder, .form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #aaaaaa;
  opacity: 1; /* Firefox */
}

:-ms-input-placeholder, .form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #aaaaaa;
}

::-ms-input-placeholder, .form-control::-ms-input-placeholder { /* Microsoft Edge */
  color: #aaaaaa;
}

.function-bakery, .function-chef, .function-cocoafarm, .function-coinflip, .function-cookie, .function-cookiejar, .function-cookiemonster, .function-dailychores, .function-dairy, .function-eggs, .function-factory, .function-grainmill, .function-level, .function-lottery, .function-market, .function-monster, .function-refer, .function-roost, .function-storage, .function-sugarplantation, .function-team, .function-timeplayed
{display:inline-block; overflow:hidden; background-repeat: no-repeat;
  background-image:url('../img/icons/functions.sprite.png?v=1633691373.png');}

.function-bakery {width: 100px; height: 100px; background-position: 14.2857% 0.485437%; background-size: 1024.00%; }
.function-chef {width: 100px; height: 100px; background-position: 25.3247% 0.485437%; background-size: 1024.00%; }
.function-cocoafarm {width: 100px; height: 100px; background-position: 36.3636% 0.485437%; background-size: 1024.00%; }
.function-coinflip {width: 100px; height: 100px; background-position: 47.4026% 0.485437%; background-size: 1024.00%; }
.function-cookie {width: 100px; height: 100px; background-position: 58.4416% 0.485437%; background-size: 1024.00%; }
.function-cookiejar {width: 100px; height: 100px; background-position: 69.4805% 0.485437%; background-size: 1024.00%; }
.function-cookiemonster {width: 100px; height: 100px; background-position: 80.5195% 0.485437%; background-size: 1024.00%; }
.function-dailychores {width: 100px; height: 100px; background-position: 91.5584% 0.485437%; background-size: 1024.00%; }
.function-dairy {width: 100px; height: 100px; background-position: 0.216450% 32.0388%; background-size: 1024.00%; }
.function-eggs {width: 100px; height: 100px; background-position: 11.2554% 32.0388%; background-size: 1024.00%; }
.function-factory {width: 100px; height: 100px; background-position: 22.2944% 32.0388%; background-size: 1024.00%; }
.function-grainmill {width: 100px; height: 100px; background-position: 33.3333% 32.0388%; background-size: 1024.00%; }
.function-level {width: 100px; height: 100px; background-position: 44.3723% 32.0388%; background-size: 1024.00%; }
.function-lottery {width: 100px; height: 100px; background-position: 55.4113% 32.0388%; background-size: 1024.00%; }
.function-market {width: 100px; height: 100px; background-position: 66.4502% 32.0388%; background-size: 1024.00%; }
.function-monster {width: 100px; height: 100px; background-position: 77.4892% 32.0388%; background-size: 1024.00%; }
.function-refer {width: 100px; height: 100px; background-position: 88.5281% 32.0388%; background-size: 1024.00%; }
.function-roost {width: 100px; height: 100px; background-position: 99.5671% 32.0388%; background-size: 1024.00%; }
.function-storage {width: 128px; height: 128px; background-position: 0.223214% 0.520833%; background-size: 800.000%; }
.function-sugarplantation {width: 100px; height: 100px; background-position: 0.216450% 56.7961%; background-size: 1024.00%; }
.function-team {width: 100px; height: 100px; background-position: 11.2554% 56.7961%; background-size: 1024.00%; }
.function-timeplayed {width: 100px; height: 100px; background-position: 22.2944% 56.7961%; background-size: 1024.00%; }


.flag-da, .flag-en, .flag-no, .flag-sv, .flag-tr
{ max-width: 100%; background-size: 100%; background-image: url('../img/icons/flags.sprite.png'); }

.flag-da { background-position: 0 0%; background-size: 100%; }
.flag-en { background-position: 0 24.626866%; background-size: 100%; }
.flag-no { background-position: 0 48.091603%; background-size: 100%; }
.flag-sv { background-position: 0 73.282443%; background-size: 100%; }
.flag-tr { background-position: 0 100%; background-size: 107.317073%; }

.worker-check, .worker-chief, .worker-grandma, .worker-robot
{ max-width: 100%; background-size: 100%; background-image: url('../img/icons/workers.sprite.png'); }

.worker-check { background-position: 0 0%; background-size: 100%; }
.worker-chief { background-position: 0 33.333333%; background-size: 100%; }
.worker-grandma { background-position: 0 66.666667%; background-size: 100%; }
.worker-robot { background-position: 0 100%; background-size: 100%; }

.custom-control-input:checked~.custom-control-label::before {
  background-color: #c9812f;
  border-color: #c9812f;
}

.custom-radio .custom-control-input:checked ~ .custom-control-label::before {
  background-color: #c9812f;
}
.custom-control-input:focus ~ .custom-control-label::before {
  box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(201, 129, 47, 0.25);
}
.custom-control-input:active ~ .custom-control-label::before {
  color: #fff;
  background-color: #C4A78B;
}
.custom-control-label:before{
  background-color: #ffffff;
  border-radius: 0;
}
.custom-checkbox .custom-control-label::before {
  border-radius: 0;
}
.custom-checkbox .custom-control-input:checked~.custom-control-label::before{
  background-color: #c9812f;
  border-radius: 0;
}
.flag-item:hover {
  background-color: #535C66;
}

p.min-height {
  min-height: 3em;
}

.slider-container {
  width: 100%;
}
.slider {
  -webkit-appearance: none;
  width: 100%;
  height: 10px;
  border-radius: 3px !important;
  background: #d3d3d3;
  outline: none;
  -webkit-transition: .2s;
  transition: opacity .2s;
}
.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 25px;
  height: 25px;
  background: url('../img/logo/logo.svg');
  background-size: 25px;
  cursor: pointer;
  border: 0;
}
.slider::-moz-range-thumb {
  width: 25px;
  height: 25px;
  background: url('../img/logo/logo.svg');
  background-size: 25px;
  cursor: pointer;
  border: 0;
}
.slider-green-yellow-red {
  background: rgb(40,167,69);
  background: linear-gradient(90deg, rgba(40,167,69,1) 0%, rgba(255,193,7,1) 50%, rgba(220,53,69,1) 100%);
  border: 0 !important;
}
.badge {
  border-radius: .25rem !important;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
}
.badge-pill {
  padding-right: .7em;
  padding-left: .6em;
  border-radius: 10rem !important;
}
/* Grønne, røde og grå merker har samme dempede farge og kant som varslene og knappene.
   Kanten tegnes innvendig, så merket ikke blir større */
.badge-success, a.badge-success:hover, a.badge-success:focus {
  color: #ebebeb;
  background-color: rgba(40, 167, 69, .16);
  box-shadow: inset 0 0 0 1px #28a745;
}
.badge-danger, a.badge-danger:hover, a.badge-danger:focus {
  color: #ebebeb;
  background-color: rgba(220, 53, 69, .16);
  box-shadow: inset 0 0 0 1px #dc3545;
}
.badge-secondary, a.badge-secondary:hover, a.badge-secondary:focus {
  color: #ebebeb;
  background-color: rgba(108, 117, 125, .16);
  box-shadow: inset 0 0 0 1px #6c757d;
}

.navbar-toggler-icon-danger {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(220, 53, 69, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

.dropdown-menu {
  padding: 0px;
  font-size: 14px;
  background-color: #343a40;
}

.dropdown-item {
  background-color: #343a40;
  color: #ebebeb;
}

.dropdown-item:hover, .dropdown-item:active, .dropdown-item:focus {
  color: #ebebeb;
  text-decoration: none;
  background-color: #464e55;
}

.dropdown-divider {
  border-top: 1px solid #6c757d;
}

.dropdown-header {
  background-color: #343a40;
}

/*------------------------------------
- COLOR purple
------------------------------------*/
.alert-purple {
  color: #3a2166;
  background-color: #e4dbf3;
  border-color: #d8ccee;
}

.alert-purple hr {
  border-top-color: #c9b9e8;
}

.alert-purple .alert-link {
  color: #241540;
}

.badge-purple {
  color: #fff;
  background-color: #6f42c1;
}

.badge-purple[href]:hover, .badge-purple[href]:focus {
  color: #fff;
  background-color: #58339c;
}

.bg-purple {
  background-color: #6f42c1 !important;
}

a.bg-purple:hover, a.bg-purple:focus,
button.bg-purple:hover,
button.bg-purple:focus {
  background-color: #58339c !important;
}

.border-purple {
  border-color: #6f42c1 !important;
}

.btn-purple {
  color: #fff;
  background-color: #6f42c1;
  border-color: #6f42c1;
}

.btn-purple:hover {
  color: #fff;
  background-color: #5f37a8;
  border-color: #58339c;
}

.btn-purple:focus, .btn-purple.focus {
  box-shadow: 0 0 0 0.2rem rgba(111, 66, 193, 0.5);
}

.btn-purple.disabled, .btn-purple:disabled {
  color: #fff;
  background-color: #6f42c1;
  border-color: #6f42c1;
}

.btn-purple:not(:disabled):not(.disabled):active, .btn-purple:not(:disabled):not(.disabled).active, .show > .btn-purple.dropdown-toggle {
  color: #fff;
  background-color: #58339c;
  border-color: #522f91;
}

.btn-purple:not(:disabled):not(.disabled):active:focus, .btn-purple:not(:disabled):not(.disabled).active:focus, .show > .btn-purple.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(111, 66, 193, 0.5);
}

.btn-outline-purple {
  color: #6f42c1;
  background-color: transparent;
  border-color: #6f42c1;
}

.btn-outline-purple:hover {
  color: #fff;
  background-color: #6f42c1;
  border-color: #6f42c1;
}

.btn-outline-purple:focus, .btn-outline-purple.focus {
  box-shadow: 0 0 0 0.2rem rgba(111, 66, 193, 0.5);
}

.btn-outline-purple.disabled, .btn-outline-purple:disabled {
  color: #6f42c1;
  background-color: transparent;
}

.btn-outline-purple:not(:disabled):not(.disabled):active, .btn-outline-purple:not(:disabled):not(.disabled).active, .show > .btn-outline-purple.dropdown-toggle {
  color: #fff;
  background-color: #6f42c1;
  border-color: #6f42c1;
}

.btn-outline-purple:not(:disabled):not(.disabled):active:focus, .btn-outline-purple:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-purple.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(111, 66, 193, 0.5);
}

.list-group-item-purple {
  color: #3a2166;
  background-color: #d8ccee;
}

.list-group-item-purple.list-group-item-action:hover, .list-group-item-purple.list-group-item-action:focus {
  color: #3a2166;
  background-color: #c9b9e8;
}

.list-group-item-purple.list-group-item-action.active {
  color: #fff;
  background-color: #3a2166;
  border-color: #3a2166;
}

.table-purple,
.table-purple > th,
.table-purple > td {
  background-color: #d8ccee;
}

.table-hover .table-purple:hover {
  background-color: #c9b9e8;
}

.table-hover .table-purple:hover > td,
.table-hover .table-purple:hover > th {
  background-color: #c9b9e8;
}

.text-purple {
  color: #6f42c1 !important;
}

a.text-purple:hover, a.text-purple:focus {
  color: #58339c !important;
}


/*------------------------------------
- COLOR purple
------------------------------------*/
.alert-purple {
  color: #5703f1;
  background-color: #12613bff;
  border-color: #119127ff;
}

.alert-purple hr {
  border-top-color: #10810dff;
}

.alert-purple .alert-link {
  color: #4502be;
}

.badge-purple {
  color: #212529;
  background-color: #a372fd;
}

.badge-purple[href]:hover, .badge-purple[href]:focus {
  color: #212529;
  background-color: #823ffc;
}

.bg-purple {
  background-color: #a372fd !important;
}

a.bg-purple:hover, a.bg-purple:focus,
button.bg-purple:hover,
button.bg-purple:focus {
  background-color: #823ffc !important;
}

.border-purple {
  border-color: #a372fd !important;
}

.btn-purple {
  color: #212529;
  background-color: #a372fd;
  border-color: #a372fd;
}

.btn-purple:hover {
  color: #212529;
  background-color: #8c4efc;
  border-color: #823ffc;
}

.btn-purple:focus, .btn-purple.focus {
  box-shadow: 0 0 0 0.2rem rgba(163, 114, 253, 0.5);
}

.btn-purple.disabled, .btn-purple:disabled {
  color: #212529;
  background-color: #a372fd;
  border-color: #a372fd;
}

.btn-purple:not(:disabled):not(.disabled):active, .btn-purple:not(:disabled):not(.disabled).active, .show > .btn-purple.dropdown-toggle {
  color: #212529;
  background-color: #823ffc;
  border-color: #7830fc;
}

.btn-purple:not(:disabled):not(.disabled):active:focus, .btn-purple:not(:disabled):not(.disabled).active:focus, .show > .btn-purple.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(163, 114, 253, 0.5);
}

.btn-outline-purple {
  color: #a372fd;
  background-color: transparent;
  border-color: #a372fd;
}

.btn-outline-purple:hover {
  color: #212529;
  background-color: #a372fd;
  border-color: #a372fd;
}

.btn-outline-purple:focus, .btn-outline-purple.focus {
  box-shadow: 0 0 0 0.2rem rgba(163, 114, 253, 0.5);
}

.btn-outline-purple.disabled, .btn-outline-purple:disabled {
  color: #a372fd;
  background-color: transparent;
}

.btn-outline-purple:not(:disabled):not(.disabled):active, .btn-outline-purple:not(:disabled):not(.disabled).active, .show > .btn-outline-purple.dropdown-toggle {
  color: #212529;
  background-color: #a372fd;
  border-color: #a372fd;
}

.btn-outline-purple:not(:disabled):not(.disabled):active:focus, .btn-outline-purple:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-purple.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(163, 114, 253, 0.5);
}

.list-group-item-purple {
  color: #5703f1;
  background-color: #119127ff;
}

.list-group-item-purple.list-group-item-action:hover, .list-group-item-purple.list-group-item-action:focus {
  color: #5703f1;
  background-color: #10810dff;
}

.list-group-item-purple.list-group-item-action.active {
  color: #212529;
  background-color: #5703f1;
  border-color: #5703f1;
}

.table-purple,
.table-purple > th,
.table-purple > td {
  background-color: #119127ff;
}

.table-hover .table-purple:hover {
  background-color: #10810dff;
}

.table-hover .table-purple:hover > td,
.table-hover .table-purple:hover > th {
  background-color: #10810dff;
}

.text-purple {
  color: #a372fd !important;
}

a.text-purple:hover, a.text-purple:focus {
  color: #823ffc !important;
}

.text-danger {
  color: #fa565a !important;
}

a.text-danger:hover, a.text-danger:focus {
  color: #f82429 !important;
}
.select2-container--bootstrap4 .select2-selection {
  background-color: #535C66 !important;
  color: #ebebeb !important;
  border: 1px solid #92A3B2 !important;
}
.select2-search__field {
  border: none !important;
}
.select2-selection__choice {
  background-color: #ffc107;
  color: #212529 !important;
  border-radius: 0 !important;
  border: 1px #212529 !important;
}
.select2-results__message {
  background-color: #535C66 !important;
  color: #ebebeb !important;
}
.select2-dropdown {
  background-color: #535C66 !important;
  color: #ebebeb !important;
  border: 0 !important;
}
.select2-container--bootstrap4 .select2-results__option--highlighted,
.select2-container--bootstrap4 .select2-results__option--highlighted.select2-results__option[aria-selected=true] {
  background-color: #464e55 !important;
  color: #ebebeb !important;
}
.select2-selection__choice__remove {
  color: #212529 !important;
}
.message-list:hover {
  background-color: #464e55;
}
.item-tooltip {
  color: #ebebeb;
  background-color: #343a40;
}
.item-tooltip-empty {
  border: 1px solid #818c98;
}
.item-tooltip-gray {
  border: 1px solid #818c98;
}
.item-tooltip-green {
  border: 1px solid #238d3B;
}
.item-tooltip-blue {
  border: 1px solid #237dde;
}
.item-tooltip-purple {
  border: 1px solid #835bcf;
}
.item-tooltip-orange {
  border: 1px solid #c9812f;
}
.item-slot-background {
  background-color: #2e3338;
}
/* Tooltip for gjenstander: bilde og navn øverst, så beskrivelsen og varigheten på egen linje */
.tooltip-inner.item-tip {
  max-width: 260px;
  padding: 8px 10px;
  border-radius: 6px;
  text-align: left;
  font-size: 13px;
  line-height: 1.4;
}
.item-tip-top {
  display: flex;
  align-items: center;
  gap: 10px;
}
.item-tip .item-tip-img {
  flex: none;
  width: 40px;
  height: 40px;
  border-radius: 3px;
  background-color: #2e3338;
  box-shadow: inset 0 0 0 1px #818c98;
}
.item-tip-name {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.25;
}
.item-tip-sub, .item-tip-duration span, .item-tip-drops-title, .item-tip-drops-chance {
  color: rgba(255, 255, 255, .55);
}
.item-tip-sub {
  font-size: 12px;
}
.item-tip-desc {
  margin: 7px 0 0;
}
.item-tip b {
  color: #fff;
}
.item-tip-duration {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 6px;
  padding-top: 5px;
  border-top: 1px solid rgba(255, 255, 255, .1);
  font-size: 12px;
}
.item-tip-market {
  margin: 4px 0 0;
  font-size: 12px;
  color: #ffc107;
}
.item-tip-untradable {
  color: #ffc107;
}
/* Sannsynlighet på hjelpesiden: sted, prosent og 1 av N i tre kolonner */
.item-tip-drops {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 0 10px;
  margin-top: 6px;
  padding-top: 5px;
  border-top: 1px solid rgba(255, 255, 255, .1);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
.item-tip-drops-title {
  grid-column: 1 / -1;
}
.item-tip-drops-chance {
  text-align: right;
  white-space: nowrap;
}
.item-tooltip-gray .item-tip-name { color: #aab3bd; }
.item-tooltip-green .item-tip-name { color: #4cc46e; }
.item-tooltip-blue .item-tip-name { color: #66aaf2; }
.item-tooltip-purple .item-tip-name { color: #ab8de9; }
.item-tooltip-orange .item-tip-name { color: #e8a85e; }
.item-tooltip-green .item-tip-img { box-shadow: inset 0 0 0 1px #238d3B; }
.item-tooltip-blue .item-tip-img { box-shadow: inset 0 0 0 1px #237dde; }
.item-tooltip-purple .item-tip-img { box-shadow: inset 0 0 0 1px #835bcf; }
.item-tooltip-orange .item-tip-img { box-shadow: inset 0 0 0 1px #c9812f; }
a.item-link:hover, span.item-link:hover {
  filter: brightness(110%);
}

.item-butterchurn, .item-cookie, .item-crystalball, .item-eggbasket, .item-flourbag, .item-hammer, .item-machete, .item-santahat, .item-secretnote, .item-washbucket
{display:inline-block; overflow:hidden; background-repeat: no-repeat;
  background-image:url('../img/icons/items.sprite.png?v=1793460095');}

.item-butterchurn {width: 100px; height: 100px; background-position: 0.485437% 1.28205%; background-size: 512.000%; }
.item-cookie {width: 100px; height: 100px; background-position: 25.2427% 1.28205%; background-size: 512.000%; }
.item-crystalball {width: 100px; height: 100px; background-position: 99.5146% 1.28205%; background-size: 512.000%; }
.item-eggbasket {width: 100px; height: 100px; background-position: 0.485437% 66.6667%; background-size: 512.000%; }
.item-flourbag {width: 100px; height: 100px; background-position: 25.2427% 66.6667%; background-size: 512.000%; }
.item-hammer {width: 100px; height: 100px; background-position: 74.7573% 66.6667%; background-size: 512.000%; }
.item-machete {width: 100px; height: 100px; background-position: 50.0000% 66.6667%; background-size: 512.000%; }
.item-santahat {width: 100px; height: 100px; background-position: 99.5146% 66.6667%; background-size: 512.000%; }
.item-secretnote {width: 100px; height: 100px; background-position: 50.0000% 1.28205%; background-size: 512.000%; }
.item-washbucket {width: 100px; height: 100px; background-position: 74.7573% 1.28205%; background-size: 512.000%; }

.emoji-red {
  -webkit-filter: invert(40%) grayscale(100%) brightness(40%) sepia(100%) hue-rotate(-50deg) saturate(400%) contrast(2);
  filter: grayscale(100%) brightness(40%) sepia(100%) hue-rotate(-50deg) saturate(600%) contrast(0.8);
}

.resource-butter, .resource-chocolate, .resource-egg, .resource-flour, .resource-points, .resource-sugar {
  display:inline-block;
  overflow:hidden;
  background-repeat: no-repeat;
  background-image:url('../img/icons/resources.sprite.png?v=1793531143');
}

.resource-butter {width: 100px; height: 100px; background-position: 74.7573% 1.28205%; background-size: 512.000%; }
.resource-chocolate {width: 100px; height: 100px; background-position: 0.485437% 66.6667%; background-size: 512.000%; }
.resource-egg {width: 100px; height: 100px; background-position: 25.2427% 1.28205%; background-size: 512.000%; }
.resource-flour {width: 100px; height: 100px; background-position: 50.0000% 1.28205%; background-size: 512.000%; }
.resource-points {width: 100px; height: 100px; background-position: 99.5146% 1.28205%; background-size: 512.000%; }
.resource-sugar {width: 100px; height: 100px; background-position: 0.485437% 1.28205%; background-size: 512.000%; }

/* Gjestebanner: en skuff som henger ned fra toppmenyen, med en fane når den er skjult.
   Både skuffen og fanen ligger over innholdet, så de dytter ingenting ned. */
.guest-drawer-wrap {
  position: absolute;
  top: calc(100% + 2px);
  left: 0;
  right: 0;
  height: 0;
}
.guest-drawer-wrap > .container {
  position: relative;
}
.guest-drawer {
  position: absolute;
  top: 0;
  left: 21px;
  right: 21px;
  z-index: 5;
  display: flex;
  align-items: center;
  gap: .5rem 1rem;
  flex-wrap: wrap;
  padding: .5rem .75rem;
  background: #343a40;
  color: #f8f9fa;
  font-size: 14px;
  border: 2px solid #c9812f;
  border-top: 0;
  border-radius: 0 0 .5rem .5rem;
  box-shadow: 0 4px 10px rgba(0, 0, 0, .5);
}
.guest-drawer-text {
  flex: 1 1 240px;
}
.guest-tab {
  background: #343a40;
  color: #ffc107;
  line-height: 1;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 5;
  padding: .3rem .75rem .35rem;
  font-size: 13px;
  font-weight: 600;
  border: 2px solid #c9812f;
  border-top: 0;
  border-radius: 0 0 .5rem .5rem;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .4);
}
/* Lukkefanen henger midt under skuffen, på samme sted som åpnefanen når skuffen er skjult */
.guest-tab:hover {
  color: #fff;
}
.guest-tab-close {
  top: 100%;
  margin-top: 2px;
}

/* Rolig overgang: skuffen glir litt ned og tones inn, fanen tones bort, og motsatt */
.guest-drawer,
.guest-tab:not(.guest-tab-close) {
  transition: opacity .25s ease, transform .25s ease, visibility 0s linear 0s;
}
.guest-tab:not(.guest-tab-close),
.guest-drawer-wrap.is-hidden .guest-drawer {
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s ease, transform .25s ease, visibility 0s linear .25s;
}
.guest-drawer-wrap.is-hidden .guest-drawer {
  transform: translateY(-8px);
}
.guest-drawer-wrap.is-hidden .guest-tab:not(.guest-tab-close) {
  opacity: 1;
  visibility: visible;
  transition: opacity .25s ease, transform .25s ease, visibility 0s linear 0s;
}
@media (prefers-reduced-motion: reduce) {
  .guest-drawer,
  .guest-tab {
    transition: none !important;
  }
}

/* Skjemafelt med etiketten inni feltet (float_field i field_helper) */
.float-field {
  position: relative;
  margin-bottom: .75rem;
}
.float-field .form-control {
  height: 36px;
  padding: 14px 10px 2px;
  font-size: 14px;
  line-height: 18px;
  background-color: #2a2f34;
  border-color: #4b525a;
  border-radius: 6px;
}
.float-field .form-control::placeholder {
  color: transparent;
}
.float-field .form-control:focus {
  border-color: #c9812f;
  box-shadow: 0 0 0 3px rgba(201, 129, 47, .25);
}
.float-field label {
  position: absolute;
  left: 11px;
  top: 9px;
  margin: 0;
  font-size: 14px;
  line-height: 18px;
  color: #8b939c;
  pointer-events: none;
  transition: top .15s ease, font-size .15s ease, line-height .15s ease, color .15s ease;
}
.float-field .form-control:focus + label,
.float-field .form-control:not(:placeholder-shown) + label,
.float-field .form-control:-webkit-autofill + label {
  top: 3px;
  font-size: 10px;
  line-height: 12px;
  color: #c9812f;
}
.float-hint {
  display: block;
  margin-top: .2rem;
  font-size: 12px;
  color: #9ca3ab;
}
.float-field.is-invalid .form-control {
  border-color: #e4606d;
}
.float-field.is-invalid .float-hint {
  color: #e4606d;
}
@media (prefers-reduced-motion: reduce) {
  .float-field label {
    transition: none;
  }
}

/* Bonusen i meldingen etter innhøsting: hold over (eller trykk på) for å se hva den kommer fra */
.bonus-hint {
  cursor: help;
}

/* Vervemerket på profilen: antall vervinger i en liten pille i bronse, sølv eller gull */
.refer-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 0 7px;
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
  border-radius: 9px;
}
.refer-badge-bronze {
  color: #e0a36b;
  background-color: rgba(205, 127, 50, .16);
  box-shadow: inset 0 0 0 1px #cd7f32;
}
.refer-badge-silver {
  color: #dfe4e9;
  background-color: rgba(192, 199, 207, .14);
  box-shadow: inset 0 0 0 1px #c0c7cf;
}
.refer-badge-gold {
  color: #ffd54f;
  background-color: rgba(255, 193, 7, .16);
  box-shadow: inset 0 0 0 1px #ffc107;
}

/* Vervelenken: mørk boks som pakkene i butikken, med lenken som tekst og kopier-knappen til høyre */
.refer-link {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 6px 6px 10px;
  background-color: #3b4248;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 4px;
}
.refer-link-url {
  flex: 1;
  min-width: 0;
  color: #ffc107;
  font-weight: 600;
  overflow-wrap: anywhere;
  user-select: all;
}
.refer-link .btn {
  flex-shrink: 0;
  padding: 1px 8px;
  font-size: .75rem;
  line-height: 1.5;
}

/* Vervestigen på «Verv en venn»: låste trinn er dempet, neste trinn er uthevet */
.refer-ladder td {
  border-top-color: rgba(255, 255, 255, .08);
  vertical-align: middle;
}
.refer-ladder tr:first-child td {
  border-top: 0;
}
.refer-ladder .refer-ladder-count {
  width: 1px;
  padding-right: 12px;
  font-weight: 700;
}
.refer-ladder .is-locked {
  color: #8a9299;
}
.refer-ladder .is-next {
  color: #ffc107;
}
/* Trinnet man står på: svakt oransje bakgrunn */
.refer-ladder .is-current td {
  background-color: rgba(201, 129, 47, .14);
}
/* Linjen over stigen: antall vervinger, hvor mange som mangler og fremdrift mot neste trinn */
.refer-status {
  margin-bottom: 10px;
}
.refer-status-text {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 2px 12px;
  margin-bottom: 4px;
}
.refer-status-next {
  color: #ffc107;
}
.refer-status .progress {
  height: 8px;
  background-color: #2e3338;
}
.refer-status .progress-bar {
  background-color: #c9812f;
}


/* For mange forespørsler (429): kort midt på siden med nedtelling */
.throttle-page {
  display: flex;
  justify-content: center;
  padding-top: 60px;
}
.throttle-card {
  width: 100%;
  max-width: 360px;
  padding: 24px 20px 20px;
}
.throttle-monster {
  display: block;
  margin: -84px auto 8px;
  filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .5));
  animation: throttle-chew 1.2s ease-in-out infinite;
}
.throttle-joke {
  color: #9ca3ab;
  margin-bottom: 20px;
}
.throttle-timer {
  position: relative;
  width: 120px;
  height: 120px;
  margin: 0 auto;
}
.throttle-timer svg {
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}
.throttle-timer circle {
  fill: none;
  stroke-width: 8;
}
.throttle-timer-track {
  stroke: rgba(255, 255, 255, .1);
}
.throttle-timer-bar {
  stroke: #c9812f;
  stroke-linecap: round;
  stroke-dasharray: 100;
  stroke-dashoffset: 0;
  animation: throttle-countdown var(--throttle-wait, 5s) linear forwards;
}
.throttle-timer-text {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.throttle-timer-text span {
  font-size: 36px;
  font-weight: 700;
  color: #fff;
}
.throttle-timer-text small {
  margin-top: 4px;
  color: #9ca3ab;
}
.throttle-hint {
  font-size: 12px;
  color: #9ca3ab;
}
@keyframes throttle-countdown {
  to { stroke-dashoffset: 100; }
}
@keyframes throttle-chew {
  0%, 100% { transform: rotate(-4deg); }
  50% { transform: rotate(4deg) translateY(-3px); }
}
@media (prefers-reduced-motion: reduce) {
  .throttle-monster, .throttle-timer-bar {
    animation: none;
  }
}

/* Brukermenyen øverst til høyre: bilde, navn og status, ikoner og neste steg for kontoen */
.user-menu-toggle {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.user-menu-avatar {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  object-fit: cover;
}
.user-menu-avatar-lg {
  width: 32px;
  height: 32px;
}
.user-menu {
  /* Bare så bred som innholdet trenger; lange brukernavn kuttes med … */
  min-width: 170px;
  max-width: 260px;
  color: #ebebeb;
  margin-top: 6px;
  overflow: hidden;
  border: 1px solid #c9812f;
  border-radius: 6px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, .45);
}
.user-menu-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  margin-bottom: 4px;
  border-bottom: 1px solid #4b525a;
}
.user-menu-who {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.user-menu-who b {
  color: #f8f9fa;
  font-size: 14px;
  line-height: 18px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.user-menu-status {
  justify-self: start;
  padding: 0 7px;
  font-size: 11px;
  font-weight: 700;
  line-height: 17px;
  border-radius: 9px;
}
.user-menu-status-guest {
  color: #ffc107;
  background-color: rgba(255, 193, 7, .16);
}
.user-menu-status-link {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  text-decoration: none;
}
.user-menu-status-link:hover,
.user-menu-status-link:focus {
  color: #212529;
  background-color: #ffc107;
  text-decoration: none;
}
.user-menu-status-link .bi {
  font-size: 10px;
}
.user-menu-status-registered {
  color: #ffc107;
  background-color: rgba(255, 193, 7, .16);
}
.user-menu-verified {
  margin-left: 5px;
  vertical-align: -1px;
}
.user-menu .dropdown-item {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
}
.user-menu .dropdown-divider {
  margin: 4px 0;
  border-top-color: #4b525a;
}
.user-menu .dropdown-header {
  padding: 6px 14px 2px;
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #9ca3ab;
}
.user-menu .user-menu-logout {
  margin-bottom: 4px;
}
.user-menu .user-menu-logout:hover,
.user-menu .user-menu-logout:focus,
.user-menu .user-menu-logout:hover .bi,
.user-menu .user-menu-logout:focus .bi {
  color: #ff8a80;
}

/* Innstillinger: dempede hjelpetekster under feltene og lenken til brukerstatus */
.settings-hint {
  display: block;
  margin-top: .25rem;
  font-size: 12px;
  color: #9ca3ab;
}
.settings-form .form-group {
  margin-bottom: .85rem;
}
.settings-status-link {
  margin-left: 6px;
  font-size: 12px;
  color: #9ca3ab;
}
.settings-status-link .bi {
  font-size: 10px;
}
.settings-status-link:hover {
  color: #ffc107;
  text-decoration: none;
}

/* Sidemenyen på mobil: overskrift over admin-valgene */
.menu-heading {
  margin: 0 0 4px;
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #9ca3ab;
}

/* Den faste menyen nederst på mobil. Luften nederst følger telefonen: ingen ekstra på telefoner
   uten hjemmestrek, og akkurat nok på iPhone, også når siden er lagt til på hjemskjermen. */
.sticky-menu {
  padding-top: .5rem;
  padding-bottom: calc(.4rem + env(safe-area-inset-bottom, 0px));
  padding-left: calc(15px + env(safe-area-inset-left, 0px));
  padding-right: calc(15px + env(safe-area-inset-right, 0px));
  border-top: 2px solid #c9812f;
}
.sticky-menu .text-normal {
  display: block;
  min-height: 18px;
  font-size: 13px;
  line-height: 18px;
}
/* Før skriptet har målt menyen: omtrent like høy som den */
@media (max-width: 991px) {
  .has-sticky-menu {
    --sticky-h: 84px;
  }
}
/* Sidemenyen på mobil holdes unna hakket og hjemmestreken (luften ligger på innholdet, så
   ingenting vises når menyen er lukket) */
.sidenav .sidenav-menu {
  padding-right: calc(7px + env(safe-area-inset-right, 0px));
  padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px));
}

/* Spørsmålet om å installere appen: et lite kort nederst, over den faste menyen på mobil */
.app-install {
  position: fixed;
  left: 50%;
  bottom: calc(12px + var(--sticky-h, 0px) + env(safe-area-inset-bottom, 0px));
  z-index: 1035;
  display: none;
  align-items: center;
  gap: 12px;
  width: calc(100% - 24px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px));
  max-width: 440px;
  padding: 10px 12px;
  color: #ebebeb;
  background-color: #343a40;
  border: 2px solid #c9812f;
  border-radius: 6px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .5);
  transform: translateX(-50%);
}
.app-install.is-open {
  display: flex;
}
.app-install img {
  flex: none;
  border-radius: 8px;
}
.app-install-text {
  flex: 1;
  min-width: 0;
  display: grid;
  gap: 2px;
  font-size: 13px;
  line-height: 1.35;
}
.app-install-text b {
  font-size: 14px;
}
.app-install-actions {
  flex: none;
  display: grid;
  gap: 2px;
  justify-items: end;
}
/* Én tekst for nettlesere som kan installere, en annen for iPhone og iPad */
.app-install .app-install-ios,
.app-install.is-ios .app-install-default {
  display: none;
}
.app-install.is-ios .app-install-ios {
  display: inline;
}
@media (max-width: 400px) {
  .app-install {
    flex-wrap: wrap;
  }
  .app-install-actions {
    width: 100%;
    grid-auto-flow: column;
    justify-content: end;
  }
}

/* Admin: kontoer bot-sjekken har markert */
.bot-score {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  border-radius: 50%;
  font-weight: 700;
  font-size: 16px;
}
.bot-hours {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  height: 40px;
  border-bottom: 1px solid rgba(255, 255, 255, .2);
}
.bot-hours span {
  flex: 1;
  background-color: #c9812f;
  border-radius: 2px 2px 0 0;
}
.bot-hours-labels {
  display: flex;
  justify-content: space-between;
}
.bot-score-sm {
  min-width: 30px;
  height: 30px;
  font-size: 13px;
}
.bot-list li + li {
  margin-top: 8px;
}

/* Admin: nyeste brukere, én linje per bruker. E-posten kortes av, sist sett står til høyre */
.admin-user-list li {
  display: flex;
  align-items: baseline;
  gap: 6px;
  padding: 3px 0;
  white-space: nowrap;
}
.admin-user-list li + li {
  border-top: 1px solid rgba(255, 255, 255, .08);
}
.admin-user-list .badge {
  vertical-align: 1px;
}
.admin-user-email {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #9ca3ab;
}
.admin-user-seen {
  flex-shrink: 0;
  color: #9ca3ab;
}

/* Spillere pålogget: gjestekontoer i grått sist i lista. Ved hover blir alle navn
   lysere i sin egen farge (Bootstrap gjør røde, gule og lilla mørkere, som forsvinner mot bakgrunnen) */
.playerlist-guests,
.playerlist-guests a {
  color: #9ca3ab;
}
.playerlist a:hover, .playerlist a:focus { color: #c9812f; }
.playerlist .playerlist-guests a:hover, .playerlist .playerlist-guests a:focus { color: #ebebeb; }
.playerlist a.text-danger:hover, .playerlist a.text-danger:focus { color: #f1707b !important; }
.playerlist a.text-warning:hover, .playerlist a.text-warning:focus { color: #ffd75e !important; }
.playerlist a.text-purple:hover, .playerlist a.text-purple:focus { color: #c3a3ff !important; }

/* Admin: handlingsloggen, én linje per forespørsel. Klikk (skjema) får en oransje strek */
.action-log-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.action-log-filter .form-control {
  width: auto;
  flex: 1 1 120px;
}
.action-log {
  font-size: 13px;
}
.action-log li {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 2px 0 2px 6px;
  border-left: 2px solid transparent;
  white-space: nowrap;
}
.action-log li.is-post {
  border-left-color: #c9812f;
}
.action-log li.action-log-day {
  display: block;
  padding: 10px 0 4px;
  border-left: 0;
  font-weight: 600;
  color: #c9812f;
}
.action-log li.action-log-day:first-child {
  padding-top: 0;
}
.action-log-time {
  color: #9ca3ab;
  font-variant-numeric: tabular-nums;
}
.action-log-action {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #9ca3ab;
}
.action-log-ip {
  color: #6c757d;
}
@media (max-width: 576px) {
  .action-log-ip {
    display: none;
  }
}
.admin-user-log {
  color: #9ca3ab;
}

/* Låsefeltet i stedet for et skjema brukeren ikke har lov til å bruke ennå (level_lock_box i access_helper) */
.level-lock-box {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px 12px;
  padding: 10px 12px;
  text-align: center;
  background-color: #2b3035;
  border: 1px solid #c9812f;
  border-radius: 4px;
}

/* Markedet: lite ikon for det selgeren ønsker, pil som viser at linja kan åpnes, filtre og seksjoner */
.market-want-icon {
  width: 18px;
  height: 18px;
  border-radius: 2px;
  vertical-align: -4px;
  margin: 0 2px;
}
.market-chevron {
  width: 18px;
  flex: none;
  text-align: center;
  color: #adb5bd;
  transition: transform .15s;
}
.market-listing[aria-expanded="true"] .market-chevron {
  transform: rotate(180deg);
  color: #ffc107;
}
.market-summary {
  font-size: .85rem;
  line-height: 1.3;
}
.market-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.market-section {
  font-size: .75rem;
  color: #adb5bd;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin: 10px 0 3px;
}
.market-section:first-child {
  margin-top: 0;
}

/* Handelshistorien: én tett linje per bytte med ikon på begge sider og tidspunkt */
.trade-history {
  width: 100%;
  font-size: .9rem;
}
.trade-history td {
  padding: 4px 2px;
  border-top: 1px solid #495057;
  vertical-align: middle;
}
.trade-history tr:first-child td {
  border-top: 0;
}
.trade-history-icon {
  width: 20px;
  height: 20px;
  border-radius: 2px;
  vertical-align: -5px;
}
.trade-history-arrow {
  color: #adb5bd;
  text-align: center;
}
.trade-history-time {
  color: #adb5bd;
  font-size: .8rem;
  white-space: nowrap;
}

/* Hovedsiden: linjer med bilde, «Siden sist» som tidslinje og sjekklista for «Kom i gang» */
a.main-line, .main-line {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 0;
  border-top: 1px solid #495057;
  color: inherit;
  text-decoration: none;
}
.main-line:first-of-type {
  border-top: 0;
}
a.main-line:hover .main-line-text {
  color: #c9812f;
}
.main-line img {
  flex: none;
}
.main-line-text {
  flex: 1;
  line-height: 1.2;
}
.main-line-text small {
  display: block;
  color: #adb5bd;
}
.main-feed {
  border-left: 2px solid #495057;
  margin-left: 6px;
  padding-left: 10px;
}
.main-feed div {
  position: relative;
  padding: 3px 0;
}
.main-feed div::before {
  content: "";
  position: absolute;
  left: -15px;
  top: 10px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #c9812f;
}
.main-feed small {
  color: #adb5bd;
}
.main-steps div {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 3px 0;
}
.main-check {
  width: 18px;
  height: 18px;
  flex: none;
  border: 2px solid #6c757d;
  border-radius: 3px;
  text-align: center;
  line-height: 14px;
  font-size: .75rem;
}
.main-steps .done .main-check {
  border-color: #28a745;
  color: #28a745;
}
.main-steps .done span:last-child {
  color: #adb5bd;
  text-decoration: line-through;
}

/* Ny annonse: ressurser og gjenstander i én liste, like gjenstander samlet med antall */
.market-pick {
  border: 1px solid #6c757d;
  border-radius: 4px;
  max-height: 330px;
  overflow-y: auto;
}
.market-pick-head {
  background: #2e3338;
  color: #adb5bd;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: 2px 6px;
}
.market-pick-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 3px 6px;
  border-top: 1px solid #3d444b;
  font-size: .9rem;
  cursor: pointer;
}
.market-pick-row input {
  display: none;
}
.market-pick-row:hover {
  background: #3a3f45;
}
.market-pick-row.on {
  background: #4a4030;
}
.market-pick-icon {
  width: 26px;
  height: 26px;
  border-radius: 3px;
  flex: none;
}
.market-pick-name {
  flex: 1;
}
.market-pick-count {
  color: #adb5bd;
  font-size: .85rem;
}
.market-pick-empty {
  color: #adb5bd;
  font-size: .85rem;
  padding: 3px 6px;
}
.market-rarity-gray { color: #aab3bd; }
.market-rarity-green { color: #4cc46e; }
.market-rarity-blue { color: #66aaf2; }
.market-rarity-purple { color: #ab8de9; }
.market-rarity-orange { color: #e8a85e; }
.market-amount {
  display: flex;
  align-items: center;
  gap: 4px;
}
.market-amount input {
  flex: 1;
  min-width: 0;
}
.market-amount .market-step {
  padding: 0 10px;
}
.market-max {
  color: #adb5bd;
  font-size: .85rem;
  white-space: nowrap;
}

/* Lageret: plassen gjenstanden dras til */
.storage-slot-ghost { opacity: .35; }
.storage-swap img { box-shadow: 0 0 0 2px #c9812f; }
/* Hold inne på mobil skal starte dra, ikke åpne bildemenyen eller markere tekst */
.storage-cell img { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; -webkit-user-drag: none; }

/* Admin: siste bestillinger, første rad uten strek over */
.admin-orders tr:first-child td { border-top: 0; }

/* Sakslisten i brukerstøtte og admin: streken under tittelen holder, tabellen trenger ingen egen kant øverst */
.support-list thead th {
  border-top: 0;
  border-bottom: 0;
}
