/* YAAMon theme variables */
[data-theme="dark"] {
  --bg-primary:    #0d1117;
  --bg-secondary:  #161b22;
  --bg-card:       #1c2128;
  --border:        #30363d;
  --text-primary:  #e6edf3;
  --text-muted:    #7d8590;
  --accent-green:  #3fb950;
  --accent-red:    #f85149;
  --accent-yellow: #d29922;
  --accent-blue:   #58a6ff;
  --navbar-bg:     #161b22;
}

[data-theme="light"] {
  --bg-primary:    #ffffff;
  --bg-secondary:  #f6f8fa;
  --bg-card:       #ffffff;
  --border:        #d0d7de;
  --text-primary:  #1f2328;
  --text-muted:    #656d76;
  --accent-green:  #1a7f37;
  --accent-red:    #cf222e;
  --accent-yellow: #9a6700;
  --accent-blue:   #0969da;
  --navbar-bg:     #f6f8fa;
}

[data-theme="solarized"] {
  --bg-primary:    #002b36;
  --bg-secondary:  #073642;
  --bg-card:       #073642;
  --border:        #586e75;
  --text-primary:  #839496;
  --text-muted:    #657b83;
  --accent-green:  #859900;
  --accent-red:    #dc322f;
  --accent-yellow: #b58900;
  --accent-blue:   #268bd2;
  --navbar-bg:     #073642;
}

[data-theme="high-contrast"] {
  --bg-primary:    #000000;
  --bg-secondary:  #111111;
  --bg-card:       #111111;
  --border:        #ffffff;
  --text-primary:  #ffffff;
  --text-muted:    #cccccc;
  --accent-green:  #00ff00;
  --accent-red:    #ff0000;
  --accent-yellow: #ffff00;
  --accent-blue:   #00aaff;
  --navbar-bg:     #111111;
}

body {
  background-color: var(--bg-primary);
  color: var(--text-primary);
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100dvh; /* dynamic viewport height — accounts for mobile browser chrome */
}

.page-content {
  flex: 1;
}

.navbar-yaamon {
  background-color: var(--navbar-bg);
  border-bottom: 1px solid var(--border);
}
/* Bootstrap inherits flex-wrap:wrap from .navbar into .container-fluid;
   force single-row so items compress rather than wrap to new lines. */
.navbar-yaamon > .container-fluid {
  flex-wrap: nowrap;
}
/* Right-side controls never compress; switcher absorbs all available squeeze. */
.navbar-yaamon > .container-fluid > .ms-auto {
  flex-shrink: 0;
}

.navbar-yaamon .navbar-brand,
.navbar-yaamon .nav-link {
  color: var(--text-primary);
}

.card {
  background-color: var(--bg-card);
  border-color: var(--border);
  color: var(--text-primary);
}

.form-control,
.form-select {
  background-color: var(--bg-secondary);
  border-color: var(--border);
  color: var(--text-primary);
}

.form-control:disabled,
.form-control[readonly],
.form-select:disabled {
  background-color: var(--bg-secondary);
  border-color: var(--border);
  color: var(--text-muted);
  opacity: 1;
}

.form-control::placeholder,
.form-select::placeholder {
  color: var(--text-muted);
  opacity: 1; /* Firefox applies 0.54 opacity by default */
}

.form-control:focus,
.form-select:focus {
  background-color: var(--bg-secondary);
  color: var(--text-primary);
  border-color: var(--accent-blue);
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--accent-blue) 25%, transparent);
}

.table {
  --bs-table-bg: var(--bg-card);
  --bs-table-color: var(--text-primary);
  --bs-table-border-color: var(--border);
  --bs-table-striped-bg: var(--bg-secondary);
  --bs-table-hover-bg: color-mix(in srgb, var(--accent-blue) 10%, transparent);
}

.text-muted { color: var(--text-muted) !important; }

/* Dropdown menus themed to match the current palette */
.dropdown-menu {
  background-color: var(--bg-card);
  border-color: var(--border);
}
.dropdown-item {
  color: var(--text-primary);
}
.dropdown-item:hover,
.dropdown-item:focus {
  background-color: var(--bg-secondary);
  color: var(--text-primary);
}
.dropdown-item.active {
  background-color: var(--accent-blue);
  color: #fff;
}
.dropdown-divider {
  border-color: var(--border);
}
.dropdown-header {
  color: var(--text-muted);
}

/* Modals */
.modal-content {
  background-color: var(--bg-card);
  border-color: var(--border);
  color: var(--text-primary);
}
.modal-header {
  border-bottom-color: var(--border);
}
.modal-footer {
  border-top-color: var(--border);
}
.modal-title {
  color: var(--text-primary);
}

/* Form labels and helpers */
.form-label,
.form-check-label,
.col-form-label {
  color: var(--text-primary);
}
.form-text {
  color: var(--text-muted);
}

/* Table header */
.table-light {
  --bs-table-bg: var(--bg-secondary);
  --bs-table-color: var(--text-primary);
  --bs-table-border-color: var(--border);
}

/* Sortable table column headers */
th.sort-col {
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}
th.sort-col:hover { opacity: 0.8; }
th.sort-col .sort-icon { font-size: .65rem; opacity: .4; }
th.sort-col.sort-active .sort-icon { opacity: 1; }

/* Collapsible card headers */
.collapse-header {
  cursor: pointer;
  user-select: none;
}
.collapse-chevron {
  transition: transform 0.2s ease;
}
.collapse-header.collapsed .collapse-chevron {
  transform: rotate(-90deg);
}

/* Disabled dropdown items — use theme text color at reduced opacity so they
   remain legible in all color schemes (overrides Bootstrap's hardcoded grey). */
.dropdown-item:disabled,
.dropdown-item.disabled {
  color: var(--text-primary);
  opacity: 0.4;
}

/* Asterisk brand orange — used for the AMI connection indicator */
.text-asterisk { color: #f47f21; }

/* AllStarLink favicon indicator — grey when disconnected, full colour when connected */
.asl-logo {
  filter: grayscale(1);
  opacity: 0.35;
  transition: filter 0.15s ease, opacity 0.15s ease;
}
.asl-logo.connected {
  filter: none;
  opacity: 1;
}
@keyframes yaamon-spin {
  to { transform: rotate(360deg); }
}
.asl-logo.polling {
  animation: yaamon-spin 1.2s linear infinite;
  opacity: 0.5;
}

/* Summary landing page node cards */
.summary-node-card {
  transition: border-color 0.15s ease;
}
.summary-node-card:hover {
  border-color: var(--accent-blue);
}

/* Connected node row highlight */
tr.row-connected {
  --bs-table-bg: color-mix(in srgb, var(--accent-green) 12%, transparent);
  --bs-table-color: var(--text-primary);
}
