/* ============================================================================
 * Crafty "Minecraft" redesign — look & feel layer.
 * EVERY rule is scoped under html.minecraft so Bootstrap and the other themes
 * (default / dark / light / ronald) are completely unaffected. This file adds
 * the polish that CSS variables alone can't: bevels, pixel accents, hero
 * banners, biome-tinted cards, tactile buttons, themed scrollbars, motion.
 * ========================================================================== */

/* ---- design tokens (local to the redesign) ------------------------------- */
html.minecraft {
  --mc-grass: #4caf50;
  --mc-grass-rgb: 76, 175, 80; /* accent as an RGB triple, for rgba() glows/tints */
  --mc-grass-dark: #3e9a43; /* fallback for browsers without color-mix */
  --mc-grass-dark: color-mix(in srgb, var(--mc-grass), #000 16%);
  --mc-grass-deep: #2f7a34; /* fallback */
  --mc-grass-deep: color-mix(in srgb, var(--mc-grass), #000 36%);
  --mc-dirt: #c58b3a;
  --mc-redstone: #d34b3a;
  --mc-edge: #33402b;
  --mc-panel: #1a2016;
  --mc-panel-2: #20281b;
  --mc-ink: #11150f;
  --mc-radius: 8px;
  --mc-shadow: 0 14px 34px rgba(0, 0, 0, 0.45);
}

/* ---- canvas + typography ------------------------------------------------- */
html.minecraft body,
html.minecraft .container-scroller {
  background:
    radial-gradient(1100px 520px at 82% -8%, rgba(var(--mc-grass-rgb),0.10), transparent 60%),
    radial-gradient(900px 480px at -8% 112%, rgba(197, 139, 58, 0.07), transparent 60%),
    var(--deep-bg);
  color: var(--base-text);
}
html.minecraft h1, html.minecraft h2, html.minecraft h3,
html.minecraft h4, html.minecraft h5, html.minecraft h6,
html.minecraft .page-title {
  color: #eaf2e6;
  letter-spacing: 0.2px;
}
html.minecraft .text-muted,
html.minecraft .grey-text { color: #93a285 !important; }
html.minecraft a { color: #76c47a; }
html.minecraft a:hover { color: #9bdc9f; }
html.minecraft hr { border-color: var(--mc-edge); }
html.minecraft code, html.minecraft .text-monospace { color: #b6d39b; }

/* ---- cards: blocky biome panels ----------------------------------------- */
html.minecraft .card {
  background: linear-gradient(180deg, var(--card-banner-bg), var(--base-bg));
  border: 1px solid var(--mc-edge);
  border-radius: var(--mc-radius);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), var(--mc-shadow);
  position: relative;
  transition: transform 0.14s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
/* thin grass capstripe along the top of every card */
html.minecraft .card::before {
  content: "";
  position: absolute; left: 0; right: 0; top: 0; height: 3px;
  background: linear-gradient(90deg, var(--mc-grass), var(--mc-grass-deep));
  border-top-left-radius: var(--mc-radius);
  border-top-right-radius: var(--mc-radius);
  opacity: 0.85;
}
html.minecraft .card:hover {
  transform: translateY(-2px);
  border-color: #44572f;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 40px rgba(0, 0, 0, 0.5);
}
html.minecraft .card .card-title,
html.minecraft .card-header { color: #eaf2e6; border-color: var(--mc-edge); }
html.minecraft .card-banner,
html.minecraft .grid-margin .card { background-clip: padding-box; }

/* ---- hero banner (used by the redesigned dashboard) ---------------------- */
html.minecraft .mc-hero {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--mc-edge);
  border-radius: var(--mc-radius);
  background:
    linear-gradient(120deg, rgba(var(--mc-grass-rgb),0.18), rgba(197, 139, 58, 0.10) 60%, transparent),
    var(--card-banner-bg);
  box-shadow: var(--mc-shadow);
}
html.minecraft .mc-hero::after {
  content: "";
  position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
  background-size: 18px 18px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.6), transparent 70%);
}
html.minecraft .mc-stat { font-variant-numeric: tabular-nums; color: #eaf2e6; }
html.minecraft .mc-stat-label { color: #9fb08c; text-transform: uppercase; letter-spacing: 0.6px; font-size: 0.7rem; }

/* ---- buttons: tactile, pixel-beveled ------------------------------------ */
html.minecraft .btn {
  border-radius: 6px;
  font-weight: 600;
  transition: transform 0.06s ease, filter 0.14s ease, box-shadow 0.14s ease;
}
html.minecraft .btn-primary,
html.minecraft .btn-success {
  background: linear-gradient(180deg, var(--mc-grass), var(--mc-grass-dark));
  border: 1px solid var(--mc-grass-deep);
  box-shadow: 0 3px 0 var(--mc-grass-deep), inset 0 1px 0 rgba(255, 255, 255, 0.28);
  color: #0c160c;
}
html.minecraft .btn-primary:hover,
html.minecraft .btn-success:hover { filter: brightness(1.07); color: #0c160c; }
html.minecraft .btn-primary:active,
html.minecraft .btn-success:active {
  transform: translateY(3px);
  box-shadow: 0 0 0 var(--mc-grass-deep), inset 0 1px 0 rgba(255, 255, 255, 0.2);
}
html.minecraft .btn-warning {
  background: linear-gradient(180deg, #d79a48, var(--mc-dirt));
  border: 1px solid #9c6b2a; box-shadow: 0 3px 0 #9c6b2a; color: #1a1206;
}
html.minecraft .btn-danger {
  background: linear-gradient(180deg, #e0594a, var(--mc-redstone));
  border: 1px solid #9c3328; box-shadow: 0 3px 0 #9c3328; color: #fff;
}
html.minecraft .btn-warning:active,
html.minecraft .btn-danger:active { transform: translateY(3px); box-shadow: none; }
html.minecraft .btn-secondary,
html.minecraft .btn-outline-secondary {
  background: var(--mc-panel-2); border: 1px solid var(--mc-edge); color: var(--base-text);
}
html.minecraft .btn-secondary:hover { background: #28321f; color: #fff; }

/* ---- sidebar: the "inventory rail" -------------------------------------- */
html.minecraft .sidebar {
  background: var(--deep-bg);
  border-right: 1px solid var(--mc-edge);
}
html.minecraft .sidebar .nav .nav-item .nav-link {
  color: #c2cfb6;
  margin: 2px 10px;
  border-radius: 8px;
  transition: background 0.14s ease, color 0.14s ease;
}
html.minecraft .sidebar .nav .nav-item .nav-link .menu-icon,
html.minecraft .sidebar .nav .nav-item .nav-link i { color: #8fa67d; }
html.minecraft .sidebar .nav .nav-item .nav-link:hover {
  background: var(--card-banner-bg);
  color: #eaf2e6;
}
html.minecraft .sidebar .nav .nav-item.active > .nav-link,
html.minecraft .sidebar .nav .nav-item .nav-link.active {
  background: linear-gradient(90deg, rgba(var(--mc-grass-rgb),0.18), transparent);
  color: #eaf2e6;
  position: relative;
}
html.minecraft .sidebar .nav .nav-item.active > .nav-link::before,
html.minecraft .sidebar .nav .nav-item .nav-link.active::before {
  content: ""; position: absolute; left: 0; top: 8px; bottom: 8px; width: 3px;
  border-radius: 2px; background: var(--mc-grass);
}
html.minecraft .sidebar .nav .nav-item.active > .nav-link .menu-icon,
html.minecraft .sidebar .nav .nav-item .nav-link.active .menu-icon { color: var(--mc-grass); }
html.minecraft .sidebar .nav.sub-menu .nav-item .nav-link { color: #9fb08c; }

/* ---- topbar: the "hotbar" ------------------------------------------------ */
html.minecraft .navbar,
html.minecraft .navbar .navbar-menu-wrapper {
  background: var(--base-bg) !important;
  color: var(--base-text);
}
html.minecraft .navbar { border-bottom: 2px solid var(--mc-edge); position: relative; }
html.minecraft .navbar::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px;
  background: repeating-linear-gradient(90deg, var(--mc-grass) 0 10px, var(--mc-dirt) 10px 20px);
  opacity: 0.55;
}
html.minecraft .navbar .navbar-brand-wrapper { background: var(--deep-bg) !important; border-right: 1px solid var(--mc-edge); }
html.minecraft .navbar .nav-profile-img,
html.minecraft .navbar .profile-picture img {
  border-radius: 6px; border: 2px solid var(--mc-edge); box-shadow: 0 0 0 2px rgba(var(--mc-grass-rgb),0.25);
}
html.minecraft .navbar .count-indicator .count,
html.minecraft .badge-notify { background: var(--mc-redstone); }

/* ---- status pills -------------------------------------------------------- */
html.minecraft .badge { border-radius: 5px; font-weight: 600; letter-spacing: 0.2px; }
html.minecraft .badge-success, html.minecraft .label-success { background: rgba(var(--mc-grass-rgb),0.18); color: #8fe09a; border: 1px solid rgba(var(--mc-grass-rgb),0.4); }
html.minecraft .badge-danger,  html.minecraft .label-danger  { background: rgba(211, 75, 58, 0.16); color: #f0a79c; border: 1px solid rgba(211, 75, 58, 0.4); }
html.minecraft .badge-warning, html.minecraft .label-warning { background: rgba(197, 139, 58, 0.16); color: #e8c08a; border: 1px solid rgba(197, 139, 58, 0.4); }
html.minecraft .badge-info { background: rgba(79, 159, 214, 0.16); color: #a9d4f0; border: 1px solid rgba(79, 159, 214, 0.4); }
/* generic "online" dot helper for the dashboard rebuild */
html.minecraft .mc-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; box-shadow: 0 0 0 3px rgba(0,0,0,0.25); }
html.minecraft .mc-dot.online { background: var(--mc-grass); box-shadow: 0 0 8px var(--mc-grass); }
html.minecraft .mc-dot.offline { background: #6f7a5f; }
html.minecraft .mc-dot.crashed { background: var(--mc-redstone); box-shadow: 0 0 8px var(--mc-redstone); }

/* ---- forms / inputs ------------------------------------------------------ */
html.minecraft .form-control,
html.minecraft .form-select,
html.minecraft select,
html.minecraft textarea,
html.minecraft input[type="text"],
html.minecraft input[type="password"],
html.minecraft input[type="number"],
html.minecraft input[type="file"],
html.minecraft input[type="email"] {
  background: var(--deep-bg);
  border: 1px solid var(--mc-edge);
  color: var(--base-text);
  border-radius: 6px;
}
html.minecraft .form-control:focus,
html.minecraft select:focus,
html.minecraft textarea:focus,
html.minecraft input:focus {
  border-color: var(--mc-grass);
  box-shadow: 0 0 0 0.18rem rgba(var(--mc-grass-rgb),0.25);
  background: var(--deep-bg); color: var(--base-text);
}
html.minecraft .form-control::placeholder { color: #6f7a5f; }
html.minecraft label { color: #b9c7ab; }

/* ---- file inputs: theme the native "Choose File" button + filename text --- */
html.minecraft input[type="file"] {
  padding: 0.32rem 0.55rem;
  cursor: pointer;
  color: #b9c7ab;
}
html.minecraft input[type="file"]::file-selector-button {
  background: var(--card-banner-bg, #1a2016);
  color: var(--base-text);
  border: 1px solid var(--mc-edge);
  border-radius: 5px;
  padding: 0.32rem 0.85rem;
  margin-right: 0.75rem;
  cursor: pointer;
  font-weight: 600;
  transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}
html.minecraft input[type="file"]::file-selector-button:hover {
  background: var(--mc-grass);
  color: #10140d;
  border-color: var(--mc-grass);
}
/* WebKit/Blink fallback (older Chrome/Safari that lack ::file-selector-button) */
html.minecraft input[type="file"]::-webkit-file-upload-button {
  background: var(--card-banner-bg, #1a2016);
  color: var(--base-text);
  border: 1px solid var(--mc-edge);
  border-radius: 5px;
  padding: 0.32rem 0.85rem;
  margin-right: 0.75rem;
  cursor: pointer;
  font-weight: 600;
  -webkit-appearance: none;
  appearance: none;
  transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}
html.minecraft input[type="file"]::-webkit-file-upload-button:hover {
  background: var(--mc-grass);
  color: #10140d;
  border-color: var(--mc-grass);
}

/* ---- tables / DataTables ------------------------------------------------- */
html.minecraft .table { color: var(--base-text); }
html.minecraft .table thead th {
  background: var(--card-banner-bg); color: #cdd9c1;
  border-color: var(--mc-edge); text-transform: uppercase; letter-spacing: 0.4px; font-size: 0.74rem;
}
html.minecraft .table td, html.minecraft .table th { border-color: var(--mc-edge); }
html.minecraft .table tbody tr { transition: background 0.12s ease; }
html.minecraft .table tbody tr:hover { background: rgba(var(--mc-grass-rgb),0.06); }
html.minecraft .dataTables_wrapper .dataTables_paginate .paginate_button {
  background: var(--mc-panel-2) !important; border: 1px solid var(--mc-edge) !important; color: var(--base-text) !important; border-radius: 5px;
}
html.minecraft .dataTables_wrapper .dataTables_paginate .paginate_button.current {
  background: var(--mc-grass-dark) !important; color: #0c160c !important; border-color: var(--mc-grass-deep) !important;
}

/* ---- dropdowns / modals / popovers -------------------------------------- */
html.minecraft .dropdown-menu {
  background: var(--dropdown-bg); border: 1px solid var(--mc-edge);
  border-radius: var(--mc-radius); box-shadow: var(--mc-shadow);
}
html.minecraft .dropdown-item { color: var(--base-text); }
html.minecraft .dropdown-item:hover, html.minecraft .dropdown-item:focus { background: var(--card-banner-bg); color: #fff; }
html.minecraft .modal-content,
html.minecraft .bootbox .modal-content {
  background: var(--base-bg); border: 1px solid var(--mc-edge); border-radius: var(--mc-radius); box-shadow: var(--mc-shadow);
}
html.minecraft .modal-header, html.minecraft .modal-footer { border-color: var(--mc-edge); }
html.minecraft .tooltip-inner { background: var(--tooltip-bg); border: 1px solid var(--mc-edge); }

/* ---- progress / misc ----------------------------------------------------- */
html.minecraft .progress { background: #0e120b; border: 1px solid var(--mc-edge); border-radius: 5px; }
html.minecraft .progress-bar { background: linear-gradient(90deg, var(--mc-grass), var(--mc-grass-dark)); }
html.minecraft .nav-pills .nav-link.active { background: var(--mc-grass-dark); color: #0c160c; }
html.minecraft .nav-tabs .nav-link.active { background: var(--base-bg); border-color: var(--mc-edge) var(--mc-edge) var(--base-bg); color: #eaf2e6; }
html.minecraft .list-group-item { background: var(--base-bg); border-color: var(--mc-edge); color: var(--base-text); }

/* ---- themed scrollbars --------------------------------------------------- */
html.minecraft *::-webkit-scrollbar { width: 12px; height: 12px; }
html.minecraft *::-webkit-scrollbar-track { background: var(--deep-bg); }
html.minecraft *::-webkit-scrollbar-thumb {
  background: #3a4a30; border: 3px solid var(--deep-bg); border-radius: 7px;
}
html.minecraft *::-webkit-scrollbar-thumb:hover { background: #4a5e3c; }
html.minecraft { scrollbar-color: #3a4a30 var(--deep-bg); scrollbar-width: thin; }

/* ---- small reusable pixel-block accent ---------------------------------- */
html.minecraft .mc-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 3px 10px; border-radius: 6px; font-size: 0.78rem; font-weight: 600;
  background: var(--mc-panel-2); border: 1px solid var(--mc-edge); color: #cdd9c1;
}
@media (prefers-reduced-motion: reduce) {
  html.minecraft .card, html.minecraft .btn { transition: none; }
}

/* ============================================================================
 * Custom <select> dropdown (theme-variable driven — works in every theme).
 * Paired with js/shared/customSelect.js.
 * ========================================================================== */
.cs-native-hidden {
  position: absolute !important; width: 1px !important; height: 1px !important;
  min-height: 0 !important; padding: 0 !important; margin: -1px !important;
  overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important;
  white-space: nowrap !important; border: 0 !important; opacity: 0 !important; pointer-events: none !important;
}
/* Higher-specificity guard: out-specifies select.select-css (crafty-wizard.css) so the
   native control is hidden even if a stale customSelect.js is still cached. */
.cs-wrap select.cs-native-hidden, .cs-wrap > .cs-native-hidden {
  position: absolute !important; width: 1px !important; height: 1px !important; min-height: 0 !important;
  padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important; opacity: 0 !important; border: 0 !important; pointer-events: none !important;
  display: inline-block !important;
}
.cs-wrap { position: relative; display: block; width: 100%; }
.cs-button {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  background: var(--deep-bg, #1b1b1b); color: var(--base-text, #ddd);
  border: 1px solid var(--outline, #444); border-radius: 6px; padding: 9px 12px;
  font: inherit; line-height: 1.4; text-align: left; cursor: pointer;
  transition: border-color 0.12s ease, box-shadow 0.12s ease;
}
.cs-button:hover { border-color: var(--primary, #4caf50); }
.cs-wrap.cs-open .cs-button { border-color: var(--primary, #4caf50); box-shadow: 0 0 0 0.18rem rgba(var(--mc-grass-rgb),0.22); }
.cs-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cs-label.cs-placeholder { color: #7e886e; }
.cs-caret { font-size: 0.8em; opacity: 0.8; transition: transform 0.15s ease; flex: 0 0 auto; }
.cs-wrap.cs-open .cs-caret { transform: rotate(180deg); }
.cs-wrap.cs-disabled { opacity: 0.55; pointer-events: none; }
.cs-panel {
  position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 1200;
  background: var(--dropdown-bg, #1b1b1b); border: 1px solid var(--outline, #444);
  border-radius: 8px; box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5); padding: 6px; display: none;
  opacity: 0; transform: translateY(-6px); transition: opacity 0.12s ease, transform 0.12s ease;
}
.cs-panel.cs-up { top: auto; bottom: calc(100% + 6px); transform: translateY(6px); }
.cs-wrap.cs-open .cs-panel { display: block; opacity: 1; transform: translateY(0); }
.cs-search-wrap { padding: 2px 2px 6px; }
.cs-search { width: 100%; background: var(--deep-bg, #111); border: 1px solid var(--outline, #444); color: var(--base-text, #ddd); border-radius: 5px; padding: 7px 10px; font: inherit; }
.cs-search:focus { outline: none; border-color: var(--primary, #4caf50); }
.cs-list { max-height: 260px; overflow-y: auto; }
.cs-group { padding: 8px 10px 4px; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.5px; color: #8a9580; }
.cs-option { padding: 8px 11px; border-radius: 5px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: background 0.1s ease; }
.cs-option:hover, .cs-option.cs-active { background: rgba(127, 127, 127, 0.14); }
.cs-option.cs-selected { color: var(--primary, #4caf50); font-weight: 600; }
.cs-option.cs-selected::after { content: "\2714"; float: right; opacity: 0.9; margin-left: 8px; }
.cs-option.cs-opt-disabled { opacity: 0.4; cursor: not-allowed; }
html.minecraft .cs-button { background: linear-gradient(180deg, var(--deep-bg), #14180f); }
html.minecraft .cs-option.cs-active, html.minecraft .cs-option:hover { background: rgba(var(--mc-grass-rgb),0.16); }

/* match bootstrap-select (create-server wizard) to the theme */
.bootstrap-select > .dropdown-toggle { background: var(--deep-bg, #111) !important; color: var(--base-text, #ddd) !important; border: 1px solid var(--outline, #444) !important; border-radius: 6px !important; }
.bootstrap-select .dropdown-menu { background: var(--dropdown-bg, #1b1b1b); border: 1px solid var(--outline, #444); }
.bootstrap-select .dropdown-menu li a { color: var(--base-text, #ddd); }
.bootstrap-select .dropdown-menu li a:hover, .bootstrap-select .dropdown-menu li.selected a { background: rgba(var(--mc-grass-rgb),0.16); color: #fff; }

/* ============================================================================
 * Fast-navigation (pjax) loading bar + transition. Paired with navigation.js.
 * ========================================================================== */
.pjax-bar { position: fixed; top: 0; left: 0; height: 3px; width: 0; z-index: 3000; opacity: 0;
  background: linear-gradient(90deg, var(--primary, #4caf50), #7c5cff);
  box-shadow: 0 0 10px var(--primary, #4caf50);
  transition: width 0.18s ease, opacity 0.3s ease; pointer-events: none; }
.main-panel.pjax-leaving { opacity: 0.55; transition: opacity 0.12s ease; }

/* ============================================================================
 * Login screen (Minecraft). Applies when the standalone login uses class="minecraft".
 * ========================================================================== */
html.minecraft .content-wrapper.auth,
html.minecraft .auth.auth-bg-1 {
  background:
    radial-gradient(1200px 720px at 50% -12%, rgba(var(--mc-grass-rgb),0.16), transparent 60%),
    linear-gradient(180deg, #0e1209, #11150f 60%, #0c0f08) !important;
  position: relative;
}
html.minecraft .auth::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
  background-size: 22px 22px;
  -webkit-mask-image: radial-gradient(circle at 50% 32%, rgba(0, 0, 0, 0.55), transparent 70%);
  mask-image: radial-gradient(circle at 50% 32%, rgba(0, 0, 0, 0.55), transparent 70%);
}
html.minecraft #login-form-background,
html.minecraft .auto-form-wrapper.login-modal {
  background: linear-gradient(180deg, var(--card-banner-bg), var(--base-bg)) !important;
  border: 1px solid var(--mc-edge); border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 24px 60px rgba(0, 0, 0, 0.55);
  position: relative; overflow: hidden; padding: 32px 26px;
}
html.minecraft #login-form-background::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px;
  background: linear-gradient(90deg, var(--mc-grass), var(--mc-grass-deep));
}
html.minecraft .auto-form-logo img { max-width: 200px; filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.5)); }
html.minecraft .auth .label { color: #b9c7ab; font-weight: 600; }
html.minecraft .auth a, html.minecraft .auth .forgot-password { color: #84cf88; }
html.minecraft .auth .submit-btn { margin-top: 8px; }

/* ============================================================================
 * Create-server wizard + bootstrap-select theming.
 * ========================================================================== */
/* wizard type tabs (Java / Bedrock / Hytale) */
html.minecraft #creation-wrapper .nav-pills .nav-link,
html.minecraft .nav-pills.tab-simple-styled .nav-link {
  color: #b9c7ab; border: 1px solid transparent; border-radius: 8px; margin-right: 6px; font-weight: 600;
}
html.minecraft #creation-wrapper .nav-pills .nav-link:hover { background: var(--card-banner-bg); color: #eaf2e6; }
html.minecraft #creation-wrapper .nav-pills .nav-link.active {
  background: var(--mc-grass-dark); color: #0c160c; border-color: var(--mc-grass-deep);
}

/* let custom-select dropdowns escape the wizard cards instead of being clipped */
html.minecraft #creation_wizard,
html.minecraft #creation_wizard .card-body,
html.minecraft #creation-wrapper .stretch-card,
html.minecraft #creation-wrapper .grid-margin,
html.minecraft #creation-wrapper .input-group { overflow: visible; }

/* type-picker refresh button sits flush against the select */
html.minecraft .input-group-append .custom-picker {
  background: var(--mc-panel-2); border: 1px solid var(--mc-edge); color: #9fb08c;
  border-top-left-radius: 0; border-bottom-left-radius: 0;
}
html.minecraft .input-group-append .custom-picker:hover { background: #28321f; color: var(--mc-grass); }

/* a custom-select living inside an input-group (server type) shares the row */
.input-group > .cs-wrap { flex: 1 1 auto; width: 1%; }
.input-group > .cs-wrap .cs-button { border-top-right-radius: 0; border-bottom-right-radius: 0; }

/* dark native option lists (fallback for any select we don't enhance) */
html.minecraft select { color-scheme: dark; }
html.minecraft select option, html.minecraft select optgroup { background: var(--dropdown-bg); color: var(--base-text); }

/* ---- bootstrap-select (role multi-select etc.) full dark theme ---- */
.bootstrap-select { width: 100% !important; }
.bootstrap-select > .dropdown-toggle,
.bootstrap-select > button.dropdown-toggle.form-control {
  background: var(--deep-bg) !important; color: var(--base-text) !important;
  border: 1px solid var(--outline) !important; border-radius: 6px !important;
  box-shadow: none !important; padding: 9px 12px !important; font-weight: 400 !important; height: auto !important;
}
html.minecraft .bootstrap-select > .dropdown-toggle { background: linear-gradient(180deg, var(--deep-bg), #14180f) !important; }
.bootstrap-select > .dropdown-toggle:focus,
.bootstrap-select > .dropdown-toggle:focus-visible {
  outline: none !important; border-color: var(--primary) !important; box-shadow: 0 0 0 0.18rem rgba(var(--mc-grass-rgb),0.22) !important;
}
.bootstrap-select > .dropdown-toggle:after { border-top-color: var(--base-text) !important; margin-left: 8px; }
.bootstrap-select .filter-option-inner-inner { color: var(--base-text) !important; }
.bootstrap-select .dropdown-menu {
  background: var(--dropdown-bg) !important; border: 1px solid var(--outline) !important;
  border-radius: 8px !important; box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5) !important; padding: 6px !important;
}
.bootstrap-select .dropdown-menu .inner { max-height: 280px !important; }
.bootstrap-select .dropdown-menu li a { color: var(--base-text) !important; border-radius: 5px; padding: 8px 11px !important; }
.bootstrap-select .dropdown-menu li a .text { color: inherit !important; }
.bootstrap-select .dropdown-menu li a:hover,
.bootstrap-select .dropdown-menu li a:focus,
.bootstrap-select .dropdown-menu li.active a { background: rgba(var(--mc-grass-rgb),0.16) !important; color: #fff !important; }
.bootstrap-select .dropdown-menu li.selected a { background: rgba(var(--mc-grass-rgb),0.22) !important; color: #fff !important; }
.bootstrap-select .dropdown-menu li.disabled a { color: #6f7a5f !important; }
.bootstrap-select .bs-searchbox .form-control {
  background: var(--deep-bg) !important; border: 1px solid var(--outline) !important; color: var(--base-text) !important; border-radius: 5px;
}
.bootstrap-select .dropdown-menu .no-results { color: #8a9580 !important; background: transparent !important; }
.bootstrap-select .check-mark { color: var(--primary) !important; }

/* ============================================================================
 * Server-detail tab bar (Terminal / Logs / … / Update Center): one clean row
 * that scrolls horizontally only if needed — no more wrapped grid.
 * ========================================================================== */
html.minecraft .nav-tabs.tab-simple-styled {
  display: flex; flex-wrap: wrap; gap: 6px; overflow: visible;
  margin: 6px 0 18px !important; padding: 0 0 12px !important;
  border-bottom: 1px solid var(--mc-edge) !important;
}
html.minecraft .nav-tabs.tab-simple-styled .nav-item { margin: 0 !important; flex: 0 0 auto; }
html.minecraft .nav-tabs.tab-simple-styled .nav-item .nav-link {
  white-space: nowrap; color: #c2cfb6 !important;
  padding: 7px 13px !important; font-size: 0.85rem !important; line-height: 1.1;
  border-radius: 8px !important; border: 1px solid var(--mc-edge) !important;
  background: var(--card-banner-bg) !important;
  transition: background 0.14s ease, color 0.14s ease, border-color 0.14s ease, transform 0.06s ease;
}
html.minecraft .nav-tabs.tab-simple-styled .nav-item .nav-link i { margin-right: 7px !important; }
html.minecraft .nav-tabs.tab-simple-styled .nav-item .nav-link:hover {
  background: #28321f !important; color: #eaf2e6 !important; border-color: #44572f !important;
}
html.minecraft .nav-tabs.tab-simple-styled .nav-item .nav-link.active {
  background: linear-gradient(180deg, #57c25b, var(--mc-grass-dark)) !important;
  color: #0c160c !important; border-color: var(--mc-grass-deep) !important;
  box-shadow: 0 2px 0 var(--mc-grass-deep);
}
html.minecraft .nav-tabs.tab-simple-styled .nav-item .nav-link.active i { color: #0c160c !important; }

/* ============================================================================
 * Polish: a compact server-detail top so content fits, and the Metrics
 * (performance) chart sizes to the remaining viewport instead of overflowing.
 * ========================================================================== */
html.minecraft .page-title-header { margin-bottom: 8px !important; }
html.minecraft .page-title-header .page-title { font-size: 1.45rem; margin-bottom: 2px; }
html.minecraft .page-title-header .page-title small { font-size: 0.72rem; color: #8a9580; font-weight: 400; }
/* tighten the server status banner */
html.minecraft .content-wrapper .card .card-body.pt-3.pb-3 { padding-top: 14px !important; padding-bottom: 14px !important; }
/* metrics graph fills the space that's left, so the page needs no scroll */
html.minecraft .chart-wrapper { height: calc(100vh - 350px) !important; min-height: 300px; }
/* consistent, comfortable card rhythm */
html.minecraft .grid-margin { margin-bottom: 18px; }

/* ============================================================================
 * Sidebar "Servers" sub-menu — roomier so it no longer feels squished.
 * ========================================================================== */
html.minecraft .sidebar .sub-menu { padding: 4px 0 8px !important; }
html.minecraft .sidebar .sub-menu .nav-item { margin: 0 !important; }
html.minecraft .sidebar .sub-menu .nav-item .nav-link {
  padding: 10px 14px 10px 30px !important;
  font-size: 0.9rem !important; line-height: 1.25;
  color: #b6c4a8 !important; border-radius: 8px; margin: 3px 10px !important;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  transition: background 0.14s ease, color 0.14s ease;
}
html.minecraft .sidebar .sub-menu .nav-item .nav-link i {
  font-size: 1.05rem !important; color: #8fa67d !important; margin-right: 6px; vertical-align: -1px;
}
html.minecraft .sidebar .sub-menu .nav-item .nav-link:hover {
  background: var(--card-banner-bg) !important; color: #eaf2e6 !important;
}
html.minecraft .sidebar .sub-menu .nav-item .nav-link:hover i { color: var(--mc-grass) !important; }
html.minecraft .sidebar .sub-menu .nav-item .nav-link.active {
  background: linear-gradient(90deg, rgba(var(--mc-grass-rgb),0.18), transparent) !important; color: #eaf2e6 !important;
}
/* StarAdmin draws a 2px tree-connector line (::before) at left:35px; after our
   tighter sub-menu padding it overlapped the icon/text — remove it. */
html.minecraft .sidebar .sub-menu .nav-item .nav-link::before { display: none !important; }

/* create-wizard smart-default notes (recommended RAM + live port availability),
   shared by wizardSmart.js across all wizards; theme-aware with safe fallbacks. */
.wiz-note { display: block; margin-top: 6px; font-size: .82rem; line-height: 1.35; }
.mem-rec-hint { color: var(--mc-muted, #9bb08c); }
.mem-rec-hint .muted { opacity: .7; }
.mem-rec-hint i, .port-status.ok i { color: var(--mc-grass, #4caf50); }
.mem-rec-hint .rec-apply { margin-left: 6px; cursor: pointer; text-decoration: underline; color: var(--mc-grass, #4caf50); }
.port-status.ok { color: var(--mc-grass, #4caf50); }
.port-status.bad { color: #e2574c; }
.port-status.checking { color: var(--mc-muted, #9bb08c); }
.form-control.is-port-invalid { border-color: #e2574c !important; box-shadow: 0 0 0 1px #e2574c33 !important; }
.form-control.is-port-valid { border-color: var(--mc-grass, #4caf50) !important; }
.ph-spin { display: inline-block; animation: wiz-ph-spin 1s linear infinite; }
@keyframes wiz-ph-spin { to { transform: rotate(360deg); } }
