/* NexHost matte black / royal gold theme.
   Intentionally does not set body background: each page keeps its original background artwork/color. */
:root {
  color-scheme: dark;
  --nh-bg: #080807;
  --nh-panel: rgba(15, 15, 13, .92);
  --nh-panel-strong: rgba(11, 11, 10, .96);
  --nh-line: rgba(205, 177, 104, .15);
  --nh-line-hot: rgba(218, 184, 98, .5);
  --nh-gold: #c9a957;
  --nh-gold-bright: #e2c875;
  --nh-gold-dim: #9a7b39;
  --nh-text: #eee9dc;
  --nh-muted: #aaa596;
  --nh-shadow: 0 16px 40px rgba(0, 0, 0, .30);
}
html { scroll-behavior: smooth; }
/* Preserve all page-specific body backgrounds; only tune typography and selection. */
body { color: var(--nh-text); }
::selection { color: #100e08; background: rgba(211, 177, 87, .72); }
:where(.card, .panel, .stat-card, .stat, .box, .server-card, .product-card, .plan-card,
       .module-card, .content-card, .form-card, .info-card, .modal-box, .modal-content,
       .empty-state, .spec, .why-item, .feature-card, .widget, .menu-cat, .fh-server-row,
       .fh-server-card, .fh-card, .profile-card, .vps-card, .retry-card, .job-item) {
  color: var(--nh-text);
  background: linear-gradient(145deg, rgba(18, 18, 16, .94), rgba(11, 11, 10, .92)) !important;
  border-color: var(--nh-line) !important;
  box-shadow: var(--nh-shadow), inset 0 1px 0 rgba(232, 209, 145, .025);
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
:where(.card, .panel, .stat-card, .server-card, .product-card, .plan-card, .module-card,
       .fh-server-card, .fh-card, .profile-card, .vps-card, .retry-card, .job-item):hover {
  border-color: var(--nh-line-hot) !important;
  box-shadow: 0 20px 46px rgba(0, 0, 0, .36), 0 0 22px rgba(191, 154, 57, .075);
  transform: translateY(-2px);
}
:where(header, .header, .topbar, .app-header, .site-header, .navbar, .nav-bar,
       .sidebar, .side-nav, .drawer, .menu-panel, .mobile-nav, .desktop-nav-links,
       .nav-dropdown-menu) {
  background: rgba(10, 10, 9, .92) !important;
  border-color: var(--nh-line) !important;
}
:where(.menu-item, .nav-link, .sidebar a, .drawer a, .menu a) {
  border-radius: 11px;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}
:where(.menu-item, .nav-link, .sidebar a, .drawer a, .menu a):hover,
:where(.menu-item.active, .menu-item[aria-current="page"], .nav-link.active) {
  background: rgba(201, 169, 87, .10) !important;
  border-color: rgba(201, 169, 87, .24) !important;
  color: var(--nh-gold-bright) !important;
}
a { text-decoration-color: rgba(201, 169, 87, .42); }
a:hover { color: var(--nh-gold-bright); }
:where(.flex-row, .toolbar, .actions, .action-row, .button-row, .btn-group, .menu-row) {
  flex-wrap: wrap;
  align-items: center;
  gap: .6rem;
}
button, .btn, .action-btn, input[type="button"], input[type="submit"], input[type="reset"], a.btn {
  border-radius: 10px;
  border-color: rgba(201, 169, 87, .22);
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease, border-color .18s ease;
}
button:not(:disabled):not(.ok):not(.reject):hover, .btn:not(.ok):not(.reject):hover,
.action-btn:hover, input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover {
  filter: brightness(1.08);
  border-color: var(--nh-line-hot);
  box-shadow: 0 7px 20px rgba(0, 0, 0, .25);
  transform: translateY(-1px);
}
:where(.btn.primary, .btn-main, .primary, .fh-btn.primary) {
  color: #171208 !important;
  background: linear-gradient(135deg, #ddc16d, #b7933f) !important;
  border-color: rgba(239, 213, 135, .72) !important;
}
button:disabled, input:disabled, select:disabled { cursor: not-allowed; opacity: .58; }
:where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="reset"]), select, textarea, .fh-input, .form-control) {
  color: var(--nh-text) !important;
  background-color: rgba(10, 10, 9, .94) !important;
  border-color: rgba(201, 169, 87, .20) !important;
  border-radius: 10px;
  box-shadow: inset 0 1px 0 rgba(232, 209, 145, .025);
  transition: border-color .18s ease, box-shadow .18s ease;
}
:where(input, select, textarea, .fh-input, .form-control):focus {
  border-color: rgba(226, 200, 117, .72) !important;
  box-shadow: 0 0 0 3px rgba(201, 169, 87, .13) !important;
  outline: none;
}
::placeholder { color: rgba(190, 182, 160, .52) !important; }
:where(.text-gray-900, .text-gray-800, .text-gray-700, .text-ink-900, .text-black) { color: var(--nh-text) !important; }
:where(.text-gray-500, .text-gray-600, .muted, .dim, .text-muted, .stat-label, .spec-label) { color: var(--nh-muted) !important; }
:where(.card-title, .stat-value, .spec-val, h1, h2, h3, h4) { text-wrap: pretty; }
:where(.badge, .note, .alert, .msg-box, .info-row) { border-radius: 10px; }
table { border-collapse: separate; border-spacing: 0; }
thead th { color: #e6d7ad; border-color: var(--nh-line) !important; }
tbody td { border-color: rgba(205, 177, 104, .10) !important; }
tbody tr { transition: background-color .16s ease; }
tbody tr:hover { background-color: rgba(201, 169, 87, .055) !important; }
.table-wrap, .table-responsive { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
:focus-visible { outline: 2px solid rgba(226, 200, 117, .8); outline-offset: 2px; }
main, .page-shell, .page-wrap, .page-content { animation: nh-page-enter .28s ease-out both; }
@keyframes nh-page-enter { from { opacity: .82; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
/* Keep the existing login/register 3D flip and its original ambient background. */
#container {
  background: linear-gradient(145deg, rgba(16, 16, 14, .91), rgba(10, 10, 9, .93)) !important;
  border-color: var(--nh-line) !important;
  box-shadow: 0 30px 72px rgba(0, 0, 0, .46), inset 0 1px 0 rgba(232, 209, 145, .04) !important;
}
@media (max-width: 700px) {
  :where(.flex-row, .toolbar, .actions, .action-row, .button-row, .btn-group, .menu-row) { gap: .5rem; }
  button, .btn, .action-btn, input[type="button"], input[type="submit"], input[type="reset"] { min-height: 40px; }
  :where(.card, .panel, .stat-card, .server-card, .product-card, .plan-card, .module-card) { border-radius: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
