/* =============================================================================
   KUTT VARIABLE OVERRIDES — Must come first to override defaults
   ============================================================================= */
:root {
  --bg-color: #0f172a !important;
  --text-color: #e2e8f0 !important;
  --color-primary: #3b82f6 !important;
  --outline-color: #22d3ee !important;
  --button-bg: linear-gradient(165deg, #334155 0%, #1e293b 100%) !important;
  --button-bg-box-shadow-color: rgba(15,23,42,.5) !important;
  --button-bg-primary: linear-gradient(165deg, #334155 0%, #1e293b 50%, #0f172a 100%) !important;
  --button-bg-primary-box-shadow-color: rgba(15,23,42,.4) !important;
  --button-bg-secondary: linear-gradient(165deg, #334155 0%, #1e293b 100%) !important;
  --button-bg-secondary-box-shadow-color: rgba(15,23,42,.3) !important;
  --button-bg-danger: linear-gradient(to right, #dc2626, #b91c1c) !important;
  --button-bg-danger-box-shadow-color: rgba(220,38,38,.3) !important;
  --button-bg-success: linear-gradient(to right, #16a34a, #15803d) !important;
  --button-bg-success-box-shadow-color: rgba(22,163,74,.3) !important;
  --button-action-shadow-color: rgba(0,0,0,.2) !important;
  --underline-color: #64748b !important;
  --secondary-text-color: #94a3b8 !important;
  --send-icon-hover-color: #60a5fa !important;
  --send-spinner-icon-color: #64748b !important;
  --success-icon-color: #22c55e !important;
  --error-icon-color: #ef4444 !important;
  --copy-icon-color: #22c55e !important;
  --copy-icon-bg-color: rgba(34,197,94,.1) !important;
  --copy-icon-shadow-color: rgba(0,0,0,.2) !important;
  --focus-outline-color: rgba(59,130,246,.4) !important;
  --checkbox-bg-color: #3b82f6 !important;
  --input-shadow-color: rgba(0,0,0,.3) !important;
  --input-hover-shadow-color: rgba(0,0,0,.4) !important;
  --input-label-color: #94a3b8 !important;
  --table-bg-color: rgba(30,41,59,.6) !important;
  --table-shadow-color: rgba(0,0,0,.3) !important;
  --table-tr-border-color: rgba(51,65,85,.6) !important;
  --table-tr-hover-bg-color: transparent !important;
  --table-head-tr-border-color: #334155 !important;
  --table-status-gray-bg-color: rgba(30,41,59,.6) !important;
}
/* =============================================================================
   Promethean Dynamic — Kutt Theme
   prodyn.link URL Shortener
   © 2026 Promethean Dynamic. All rights reserved.
   ============================================================================= */

:root {
  /* Core palette — Deep navy */
  --bg: #0f172a;
  --surface: #1e293b;
  --surface-soft: #334155;
  --border: #334155;
  --border-soft: rgba(51,65,85,.6);

  /* Brand — Blue primary, Orange accent */
  --primary: #3b82f6;
  --primary-soft: #60a5fa;
  --primary-muted: #2563eb;
  --accent: #f97316;
  --accent-soft: #fb923c;
  --cyan: #22d3ee;

  /* Text */
  --text: #e2e8f0;
  --text-bright: #f8fafc;
  --muted: #94a3b8;
  --muted-soft: #64748b;

  /* Status */
  --success: #22c55e;
  --warning: #f59e0b;
  --error: #ef4444;
}

/* =============================================================================
   RESET & BASE
   ============================================================================= */
*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  background: linear-gradient(180deg, #1e293b 0%, #0f172a 30%, #020617 100%) !important;
  color: var(--text) !important;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
}

a { color: var(--primary-soft); transition: color .15s ease; }
a:hover { color: var(--cyan); }

/* =============================================================================
   HEADER / NAV
   ============================================================================= */
header, nav, [class*="header"], [class*="Header"] {
  background: rgba(15,23,42,.95) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(51,65,85,.5) !important;
}

/* Logo glow */
header img, nav img, [class*="header"] img, [class*="logo"] img,
img[alt*="logo" i], img[alt*="Logo" i], img[alt*="Kutt" i] {
  filter: drop-shadow(0 0 12px rgba(249,115,22,.6)) !important;
  transition: filter .2s ease;
}
header img:hover, nav img:hover, [class*="logo"] img:hover {
  filter: drop-shadow(0 0 20px rgba(249,115,22,.8)) !important;
}

/* =============================================================================
   CARDS / CONTAINERS
   ============================================================================= */
[class*="card"], [class*="Card"], [class*="box"], [class*="Box"],
[class*="panel"], [class*="Panel"] {
  background: linear-gradient(135deg, rgba(30,41,59,.95) 0%, rgba(15,23,42,.98) 100%) !important;
  border: 1px solid var(--border-soft) !important;
  border-radius: 1rem !important;
  box-shadow: 0 20px 50px rgba(0,0,0,.4), 0 0 0 1px rgba(15,23,42,.8) !important;
}

/* =============================================================================
   BUTTONS
   ============================================================================= */
button, [type="submit"], [class*="btn"], [class*="Btn"], [class*="button"], [class*="Button"] {
  background: linear-gradient(165deg, #334155 0%, #1e293b 100%) !important;
  color: var(--text) !important;
  border: 1px solid rgba(51,65,85,.8) !important;
  border-radius: .65rem !important;
  font-weight: 500 !important;
  box-shadow: inset 0 1px 0 rgba(148,163,184,.08), 0 2px 8px rgba(0,0,0,.3) !important;
  transition: none !important;
  cursor: pointer;
}

button:hover, [type="submit"]:hover, [class*="btn"]:hover, [class*="Btn"]:hover,
[class*="button"]:hover, [class*="Button"]:hover {
  background: linear-gradient(165deg, #475569 0%, #334155 100%) !important;
  border-color: rgba(148,163,184,.3) !important;
  box-shadow: inset 0 1px 0 rgba(148,163,184,.12), 0 4px 12px rgba(0,0,0,.4) !important;
  transform: none;
  color: var(--text-bright) !important;
}

button:active, [type="submit"]:active {
  transform: translateY(0);
  background: linear-gradient(165deg, #1e293b 0%, #0f172a 100%) !important;
}

/* =============================================================================
   INPUTS
   ============================================================================= */
input, textarea, select {
  background: rgba(15,23,42,.85) !important;
  border: 1px solid var(--border) !important;
  border-radius: .5rem !important;
  color: var(--text) !important;
  font-family: inherit !important;
  transition: none !important;
}

input:focus, textarea:focus, select:focus {
  outline: none !important;
  border-color: var(--border) !important;
  box-shadow: none !important;
}

input::placeholder, textarea::placeholder {
  color: var(--muted-soft) !important;
}

/* =============================================================================
   URL INPUT — The main shortener input
   ============================================================================= */
input[type="text"], input[type="url"], input[type="email"], input[type="password"] {
  padding: .6rem .75rem !important;
}

/* =============================================================================
   LINKS LIST / STATS
   ============================================================================= */
table, [class*="table"], [class*="Table"] {
  border-collapse: collapse;
  width: 100%;
}

th {
  font-weight: 600 !important;
  font-size: .75rem !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  color: var(--muted) !important;
  background: rgba(15,23,42,.5) !important;
}

th, td {
  border-bottom: 1px solid var(--border-soft) !important;
}

tr:hover td {
  background: rgba(59,130,246,.03) !important;
}

/* =============================================================================
   FOOTER
   ============================================================================= */
footer, [class*="footer"], [class*="Footer"] {
  background: var(--bg) !important;
  border-top: 1px solid rgba(51,65,85,.5) !important;
  color: var(--muted) !important;
}

/* =============================================================================
   TEXT OVERRIDES
   ============================================================================= */
h1, h2, h3, h4, h5, h6 {
  color: var(--text-bright) !important;
  letter-spacing: .02em;
}

p, span, div, li, label {
  color: var(--text);
}

/* Muted / secondary text */
[class*="muted"], [class*="Muted"], [class*="secondary"], [class*="Secondary"],
[class*="description"], [class*="Description"], [class*="hint"], [class*="Hint"] {
  color: var(--muted) !important;
}

/* =============================================================================
   BADGES / TAGS
   ============================================================================= */
[class*="badge"], [class*="Badge"], [class*="tag"], [class*="Tag"],
[class*="chip"], [class*="Chip"] {
  background: rgba(15,23,42,.85) !important;
  border: 1px solid rgba(51,65,85,.8) !important;
  color: var(--primary-soft) !important;
  border-radius: 999px !important;
  font-size: .72rem !important;
  text-transform: uppercase !important;
  letter-spacing: .1em !important;
}

/* =============================================================================
   ALERTS / NOTICES
   ============================================================================= */
[class*="success"] {
  color: var(--success) !important;
}
[class*="error"], [class*="danger"] {
  color: var(--error) !important;
}
[class*="warning"] {
  color: var(--warning) !important;
}

/* =============================================================================
   SCROLLBAR
   ============================================================================= */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: var(--surface-soft); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--muted-soft); }

/* =============================================================================
   SELECTION
   ============================================================================= */
::selection {
  background: rgba(59,130,246,.3);
  color: var(--text-bright);
}

/* =============================================================================
   RESPONSIVE
   ============================================================================= */
@media (max-width: 768px) {
  body { font-size: 14px; }
}

/* =============================================================================
   HEADER — Full width bar, no pill
   ============================================================================= */
header {
  width: 100% !important;
  max-width: 100% !important;
  background: rgba(15,23,42,.95) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  border-bottom: 1px solid rgba(51,65,85,.5) !important;
}

/* Remove pill/border from logo and nav links */
header a.logo,
header a.nav,
header .logo-wrapper a,
header ul.logo-links a {
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Logo glow */
header .logo img {
  filter: drop-shadow(0 0 12px rgba(249,115,22,.6)) !important;
}
header .logo:hover img {
  filter: drop-shadow(0 0 20px rgba(249,115,22,.8)) !important;
}

/* Keep the primary button pill style for Log in / Sign up */
header nav a.button.primary {
  border: 1px solid rgba(51,65,85,.8) !important;
  border-radius: .65rem !important;
  background: linear-gradient(165deg, #334155 0%, #1e293b 100%) !important;
}

/* Fix: logo-wrapper should not get card treatment */
header .logo-wrapper,
.logo-wrapper {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* =============================================================================
   INTERIOR — Shortener, Links Table, Stats, Dialogs
   ============================================================================= */

/* Main wrapper */
.main-wrapper {
  background: transparent !important;
}

/* Shortener hero text */
main #shorturl h1 {
  color: var(--text-bright) !important;
  font-weight: 300 !important;
}
main #shorturl h1 span {
  color: var(--accent) !important;
  border-bottom-color: var(--accent-soft) !important;
}
main #shorturl h1.link {
  color: var(--cyan) !important;
}

/* Big URL input */
main form input#target {
  background: rgba(15,23,42,.7) !important;
  border: 1px solid var(--border) !important;
  border-radius: 100px !important;
  color: var(--text-bright) !important;
  box-shadow: 0 10px 35px rgba(0,0,0,.3) !important;
  border-bottom: 3px solid var(--surface-soft) !important;
}
main form input#target:focus {
  border-color: var(--border) !important;
  box-shadow: 0 10px 35px rgba(0,0,0,.3), 0 0 0 3px rgba(59,130,246,.15) !important;
}
main form input#target::placeholder {
  color: var(--muted-soft) !important;
}

/* Submit button inside input */
main form button.submit {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
main form button.submit svg {
  stroke: var(--primary-soft) !important;
}
main form button.submit:hover svg {
  stroke: var(--cyan) !important;
}

/* Advanced options */
main form label.checkbox {
  color: var(--muted) !important;
}
main form label.checkbox input[type="checkbox"] {
  accent-color: var(--primary) !important;
}
main form #advanced-options {
  background: transparent !important;
}
main form #advanced-options label {
  color: var(--muted) !important;
}
main form #advanced-options input,
main form #advanced-options select {
  background: rgba(15,23,42,.7) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}

/* Clipboard button */
.clipboard button {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.clipboard svg {
  stroke: var(--primary-soft) !important;
}

/* =============================================================================
   LINKS TABLE
   ============================================================================= */
#main-table-wrapper {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
#main-table-wrapper h2 {
  color: var(--text-bright) !important;
}

table {
  background: transparent !important;
}

thead th,
table th {
  background: rgba(15,23,42,.5) !important;
  color: var(--muted) !important;
  font-size: .75rem !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  border-bottom: 1px solid var(--border) !important;
}

tbody td,
table td {
  color: var(--text) !important;
  border-bottom: 1px solid var(--border-soft) !important;
}

tbody tr:hover td {
  background: rgba(59,130,246,.04) !important;
}

/* Link text in table */
table a {
  color: var(--primary-soft) !important;
}
table a:hover {
  color: var(--cyan) !important;
}

/* Action buttons in table */
a.button.action, button.action {
  border-radius: .4rem !important;
  border: 1px solid var(--border) !important;
}
a.button.action svg, button.action svg {
  stroke: var(--muted) !important;
}
a.button.action:hover, button.action:hover {
  border-color: var(--border) !important;
}
a.button.action:hover svg, button.action:hover svg {
  stroke: var(--primary-soft) !important;
}

/* Stats action button */
a.button.action.stats, button.action.stats {
  background: rgba(59,130,246,.08) !important;
}
a.button.action.stats svg, button.action.stats svg {
  stroke: var(--primary-soft) !important;
}

/* Edit button */
a.button.action.edit, button.action.edit {
  background: rgba(34,211,238,.08) !important;
}
a.button.action.edit svg, button.action.edit svg {
  stroke: var(--cyan) !important;
}

/* Delete/ban buttons */
a.button.action.delete, button.action.delete,
a.button.action.ban, button.action.ban {
  background: rgba(239,68,68,.08) !important;
}
a.button.action.delete svg, button.action.delete svg,
a.button.action.ban svg, button.action.ban svg {
  stroke: var(--error) !important;
}

/* Nav buttons (pagination) */
button.nav {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  border-radius: .4rem !important;
  box-shadow: none !important;
}
button.nav:hover {
  background: var(--surface-soft) !important;
  border-color: var(--border) !important;
}
button.nav:disabled {
  background: rgba(15,23,42,.3) !important;
  color: var(--muted-soft) !important;
  opacity: 0.5 !important;
}

/* Search input in table controls */
.links-controls input[name="search"] {
  background: rgba(15,23,42,.7) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}

/* =============================================================================
   STATS PAGE
   ============================================================================= */
.stats-info {
  color: var(--text) !important;
}
.stats-info h2 {
  color: var(--text-bright) !important;
}
.stats-info a {
  color: var(--cyan) !important;
}

#stats {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.stats-head {
  color: var(--text) !important;
}
.stats-head .total-number {
  color: var(--accent) !important;
}

.stats-period h2 {
  color: var(--text-bright) !important;
}
.stats-period .total-in-period {
  color: var(--accent) !important;
}
.stats-period .last-update {
  color: var(--muted) !important;
}

/* Stats nav buttons */
.stats-nav button.nav {
  background: var(--surface) !important;
  color: var(--text) !important;
}
.stats-nav button.nav:disabled {
  background: var(--primary-muted) !important;
  color: var(--text-bright) !important;
  opacity: 1 !important;
}

/* World map */
.map path {
  fill: var(--surface-soft) !important;
  stroke: var(--bg) !important;
}

a.back-to-home {
  color: var(--primary-soft) !important;
}

/* =============================================================================
   DIALOGS / MODALS
   ============================================================================= */
dialog, [class*="dialog"], [class*="Dialog"], [class*="modal"], [class*="Modal"] {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 1rem !important;
  color: var(--text) !important;
  box-shadow: 0 25px 60px rgba(0,0,0,.6) !important;
}
dialog::backdrop {
  background: rgba(2,6,23,.7) !important;
}

/* =============================================================================
   SETTINGS PAGE
   ============================================================================= */
[class*="setting"], [class*="Setting"] {
  color: var(--text) !important;
}

/* =============================================================================
   ADMIN PAGE
   ============================================================================= */
[class*="admin"], [class*="Admin"] {
  color: var(--text) !important;
}

/* Checkbox styling */
label.checkbox {
  color: var(--muted) !important;
}
input[type="checkbox"] {
  accent-color: var(--primary) !important;
  background: transparent !important;
}

/* =============================================================================
   HR / DIVIDERS
   ============================================================================= */
hr {
  border: none !important;
  height: 1px !important;
  background: var(--border) !important;
}

/* =============================================================================
   ERROR PAGES
   ============================================================================= */
.stats-error {
  color: var(--error) !important;
}

/* =============================================================================
   TOAST / NOTIFICATIONS
   ============================================================================= */
[class*="toast"], [class*="Toast"], [class*="notification"], [class*="Notification"] {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}

/* =============================================================================
   HARDCODED WHITE OVERRIDES — Kutt uses literal white, not variables
   ============================================================================= */

/* Inputs (search, text, email, password, select) */
input[type="text"],
input[type="email"],
input[type="password"],
select,
main form input#target {
  background-color: rgba(15,23,42,.7) !important;
  background: rgba(15,23,42,.7) !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
  border-bottom-color: #334155 !important;
}

/* Nav buttons (pagination 10/20/50 and arrows) */
button.nav {
  background-color: #1e293b !important;
  background: #1e293b !important;
  color: #e2e8f0 !important;
  border: 1px solid #334155 !important;
  box-shadow: none !important;
}
button.nav:hover {
  background-color: #334155 !important;
  background: #334155 !important;
}
button.nav:disabled {
  background-color: rgba(15,23,42,.4) !important;
  background: rgba(15,23,42,.4) !important;
  color: #64748b !important;
}

/* Table buttons (LINKS/USERS/DOMAINS tabs) */
button.table {
  background-color: #1e293b !important;
  color: #e2e8f0 !important;
  border: 1px solid #334155 !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.3) !important;
}
button.table:hover {
  background-color: #334155 !important;
}
button.table.primary {
  background: linear-gradient(165deg, #334155 0%, #1e293b 100%) !important;
  color: #f8fafc !important;
  border-color: rgba(148,163,184,.3) !important;
}
button.table.secondary {
  background: linear-gradient(165deg, #334155 0%, #1e293b 100%) !important;
}

/* Admin table wrapper / controls area */
#main-table-wrapper .links-controls,
.admin-table-wrapper .links-controls {
  background: transparent !important;
}

/* The bar with TOTAL LINKS */
#total {
  color: #e2e8f0 !important;
  background: transparent !important;
}

/* Filter dropdowns (Banned, Anonymous, Domain) */
select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
}

/* Bottom pagination bar */
tfoot, table tfoot td {
  background: transparent !important;
  border: none !important;
}

/* =============================================================================
   ADMIN CONTROLS — Nuclear specificity overrides
   ============================================================================= */

/* Base button — remove hardcoded color */
a.button, button {
  color: #e2e8f0 !important;
}

/* Tab buttons (LINKS / USERS / DOMAINS) — these are white pills */
#main-table-wrapper button.table,
.admin-table-wrapper button.table,
button.table {
  background-color: #1e293b !important;
  background: #1e293b !important;
  color: #94a3b8 !important;
  border: 1px solid #334155 !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}
#main-table-wrapper button.table:hover,
button.table:hover {
  background-color: #334155 !important;
  background: #334155 !important;
  color: #e2e8f0 !important;
}
#main-table-wrapper button.table.primary,
button.table.primary {
  background-color: #334155 !important;
  background: #334155 !important;
  color: #f8fafc !important;
  border-color: #475569 !important;
}

/* Select dropdowns (Banned/Anonymous/Domain filters) */
select,
select.table-input,
#main-table-wrapper select,
th select {
  background-color: rgba(15,23,42,.7) !important;
  background: rgba(15,23,42,.7) !important;
  color: #94a3b8 !important;
  border: 1px solid #334155 !important;
  border-bottom: 2px solid #334155 !important;
  box-shadow: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 8px center !important;
  background-size: 16px !important;
}
select option {
  background: #1e293b !important;
  color: #e2e8f0 !important;
}

/* Admin search inputs */
input.search,
input.search.admin,
input.table-input,
#main-table-wrapper input[type="text"],
th input {
  background-color: rgba(15,23,42,.7) !important;
  background: rgba(15,23,42,.7) !important;
  color: #e2e8f0 !important;
  border: 1px solid #334155 !important;
  border-bottom: 2px solid #334155 !important;
  box-shadow: none !important;
}

/* Color mismatch bands — table header row backgrounds */
#main-table-wrapper table thead,
#main-table-wrapper table thead tr,
#main-table-wrapper table thead th {
  background: rgba(15,23,42,.5) !important;
  border-color: #334155 !important;
}

/* Table controls bar (where search + pagination live) */
#main-table-wrapper table tfoot,
#main-table-wrapper table tfoot tr,
#main-table-wrapper table tfoot td {
  background: transparent !important;
  border-color: #334155 !important;
}

/* Pagination nav in table footer */
#main-table-wrapper button.nav,
tfoot button.nav {
  background-color: #1e293b !important;
  background: #1e293b !important;
  color: #e2e8f0 !important;
  border: 1px solid #334155 !important;
}

/* =============================================================================
   FINAL NUKE — Direct background override on every button/select element
   ============================================================================= */

/* ALL buttons get dark base */
a.button,
button,
a.button:not(.primary):not(.secondary):not(.danger):not(.success),
button:not(.primary):not(.secondary):not(.danger):not(.success) {
  background: #1e293b !important;
  background-color: #1e293b !important;
  color: #94a3b8 !important;
  border: 1px solid #334155 !important;
  box-shadow: 0 2px 4px rgba(0,0,0,.2) !important;
}

/* Primary buttons — slightly lighter slate */
a.button.primary,
button.primary,
button.table.primary {
  background: #334155 !important;
  background-color: #334155 !important;
  color: #f1f5f9 !important;
  border: 1px solid #475569 !important;
}

/* Secondary */
a.button.secondary,
button.secondary {
  background: #1e293b !important;
  background-color: #1e293b !important;
  color: #cbd5e1 !important;
  border: 1px solid #334155 !important;
}

/* Table tabs (LINKS/USERS/DOMAINS) */
button.table {
  background: #1e293b !important;
  background-color: #1e293b !important;
  color: #94a3b8 !important;
  border-radius: 100px !important;
}
button.table.primary {
  background: #334155 !important;
  background-color: #334155 !important;
  color: #f1f5f9 !important;
}

/* ALL selects */
select {
  background-color: rgba(15,23,42,.7) !important;
  color: #94a3b8 !important;
  border: 1px solid #334155 !important;
  border-bottom: 2px solid #334155 !important;
}

/* =============================================================================
   TAB LINKS — These are <a role="tab">, NOT <button>!
   ============================================================================= */
a[role="tab"],
#tab-links, #tab-users, #tab-domains,
.admin-table-wrapper a[role="tab"],
#main-table-wrapper a[role="tab"] {
  background: #1e293b !important;
  background-color: #1e293b !important;
  color: #94a3b8 !important;
  border: 1px solid #334155 !important;
  border-radius: 100px !important;
  box-shadow: 0 2px 4px rgba(0,0,0,.2) !important;
}
a[role="tab"]:hover,
a[role="tab"][aria-selected="true"],
a[role="tab"].active {
  background: #334155 !important;
  background-color: #334155 !important;
  color: #f1f5f9 !important;
  border-color: #475569 !important;
}

/* =============================================================================
   TAB LINKS — exact selectors from Kutt source: table .tab a
   ============================================================================= */
table .tab a,
table .tab a[role="tab"],
#main-table-wrapper table .tab a {
  background-color: #1e293b !important;
  background: #1e293b !important;
  color: #94a3b8 !important;
  border: 1px solid #334155 !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}
table .tab a.active,
table .tab a[role="tab"].active,
#main-table-wrapper table .tab a.active {
  background-color: #334155 !important;
  background: #334155 !important;
  color: #f1f5f9 !important;
  border-color: #475569 !important;
  box-shadow: none !important;
}
table .tab a:not(.active):hover {
  background-color: #334155 !important;
  background: #334155 !important;
  color: #e2e8f0 !important;
}

/* Clear button X icons — currently stroke="#000" */
.search-input-wrapper button.clear svg {
  stroke: #64748b !important;
}
.search-input-wrapper button.clear:hover svg {
  stroke: #e2e8f0 !important;
}

/* Dialog box */
.dialog .box {
  background: #1e293b !important;
  border: 1px solid #334155 !important;
  border-radius: 1rem !important;
  box-shadow: 0 25px 60px rgba(0,0,0,.6) !important;
  color: #e2e8f0 !important;
}

/* =============================================================================
   TABLE STRUCTURE — Remove color banding and stray borders
   ============================================================================= */

/* Table head/foot backgrounds — blend with page */
table thead,
#main-table-wrapper table thead {
  background-color: transparent !important;
  background: transparent !important;
}
table tfoot,
#main-table-wrapper table tfoot {
  background-color: transparent !important;
  background: transparent !important;
}

/* Remove all internal row borders */
table thead tr,
table tbody tr,
table tfoot tr,
#main-table-wrapper table thead tr,
#main-table-wrapper table tfoot tr {
  border: none !important;
  border-bottom: 1px solid rgba(51,65,85,.4) !important;
}

/* Category row (TOTAL LINKS + tabs) — subtle bottom border only */
#main-table-wrapper table thead tr.category {
  border-bottom: 1px solid rgba(51,65,85,.4) !important;
}

/* Controls row (search + filters) */
#main-table-wrapper table thead tr.controls {
  border-bottom: 1px solid rgba(51,65,85,.4) !important;
}

/* Column header row */
#main-table-wrapper table thead tr:last-child {
  border-bottom: 1px solid rgba(51,65,85,.6) !important;
}

/* Footer controls — no top border banding */
#main-table-wrapper table tfoot tr.controls {
  border-bottom: none !important;
  border-top: 1px solid rgba(51,65,85,.4) !important;
}

/* Nav divider between pagination groups */
#main-table-wrapper table .nav-divider,
.nav-divider {
  background-color: #334155 !important;
  opacity: 0.5 !important;
}

/* =============================================================================
   EDIT PANEL (inline row expansion)
   ============================================================================= */
#main-table-wrapper table tr.edit,
table tr.edit {
  background-color: #0f172a !important;
  background: #0f172a !important;
}

#main-table-wrapper table tr.edit td {
  background: transparent !important;
}

/* Edit form labels */
#main-table-wrapper table tr.edit label {
  color: #94a3b8 !important;
}

/* Edit form inputs */
#main-table-wrapper table tr.edit input,
#main-table-wrapper table tr.edit input[type="text"],
#main-table-wrapper table tr.edit input[type="password"] {
  background-color: rgba(15,23,42,.7) !important;
  background: rgba(15,23,42,.7) !important;
  color: #e2e8f0 !important;
  border: 1px solid #334155 !important;
  border-bottom: 2px solid #334155 !important;
  border-radius: 100px !important;
}

/* Edit form buttons */
#main-table-wrapper table tr.edit button {
  background: #1e293b !important;
  background-color: #1e293b !important;
  color: #94a3b8 !important;
  border: 1px solid #334155 !important;
}
#main-table-wrapper table tr.edit button.primary {
  background: #334155 !important;
  background-color: #334155 !important;
  color: #f1f5f9 !important;
  border-color: #475569 !important;
}

/* Domain prefix text (e.g. "prodyn.link/") */
#main-table-wrapper table tr.edit label span {
  color: #64748b !important;
}

/* Error label text */
#main-table-wrapper table tr.edit label.error {
  color: #ef4444 !important;
}

/* Selected/active row highlight */
#main-table-wrapper table tbody tr:has(+ tr.edit),
#main-table-wrapper table tbody tr.show {
  background-color: rgba(30,41,59,.8) !important;
}

/* =============================================================================
   TABLE ROW BACKGROUNDS & RIGHT-FADE FIX
   ============================================================================= */

/* Right-fade overlay — was hardcoded white gradient */
#main-table-wrapper table tbody td.right-fade:after {
  background: linear-gradient(to left, #0f172a, rgba(15,23,42,0.001)) !important;
}
#main-table-wrapper table tbody tr:hover td.right-fade:after {
  background: linear-gradient(to left, rgba(59,130,246,.05), rgba(15,23,42,0.001)) !important;
}

/* Ensure tbody rows are transparent */
#main-table-wrapper table tbody tr,
table tbody tr {
  background: transparent !important;
  background-color: transparent !important;
}
#main-table-wrapper table tbody tr:hover,
table tbody tr:hover {
  background-color: rgba(59,130,246,.04) !important;
}

/* tbody itself */
#main-table-wrapper table tbody,
table tbody {
  background: transparent !important;
  background-color: transparent !important;
}

/* Kill hover/focus effects on edit panel inputs */
#main-table-wrapper table tr.edit input:hover,
#main-table-wrapper table tr.edit input:focus,
#main-table-wrapper table tr.edit input:active {
  transform: none !important;
  box-shadow: none !important;
  border-color: #334155 !important;
  outline: none !important;
}

/* =============================================================================
   GLOBAL INPUT HOVER/FOCUS — Kill the big shadow glow everywhere
   ============================================================================= */
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
select:focus {
  outline: none !important;
  box-shadow: none !important;
}
input[type="text"]:hover,
input[type="email"]:hover,
input[type="password"]:hover,
select:hover {
  box-shadow: none !important;
  transform: none !important;
}
input[type="text"]::placeholder,
input[type="email"]::placeholder,
input[type="password"]::placeholder {
  color: #64748b !important;
}

/* =============================================================================
   DATA ROW + ACTION ICONS — Dark treatment
   ============================================================================= */

/* All table body rows — no background */
#main-table-wrapper table tbody tr {
  background: transparent !important;
  background-color: transparent !important;
}

/* SVGs with hardcoded black strokes */
.action svg,
.action.stats svg,
.clipboard svg,
.clipboard .check {
  stroke: #94a3b8 !important;
}
.action.qrcode svg {
  fill: #94a3b8 !important;
  stroke: none !important;
}
.action:hover svg {
  stroke: #e2e8f0 !important;
}
.action.qrcode:hover svg {
  fill: #e2e8f0 !important;
}
.action.delete svg,
.action.delete:hover svg {
  stroke: #ef4444 !important;
}
.action.edit svg {
  stroke: #22d3ee !important;
}

/* Action button backgrounds — all subtle dark */
button.action,
a.button.action {
  background: rgba(30,41,59,.5) !important;
  border: 1px solid #334155 !important;
}
button.action:hover,
a.button.action:hover {
  background: rgba(51,65,85,.5) !important;
}

/* Password disabled button */
button.action.password:disabled {
  opacity: 0.3 !important;
}

/* Clipboard copy button in short-link cell */
.clipboard.small button {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Kill ALL table row hover effects */
#main-table-wrapper table tbody tr:hover,
#main-table-wrapper table tbody tr:hover td,
table tbody tr:hover,
table tbody tr:hover td {
  background: transparent !important;
  background-color: transparent !important;
}

/* Right-fade: hover same as non-hover */
#main-table-wrapper table tbody tr:hover td.right-fade:after {
  background: linear-gradient(to left, #0f172a, rgba(15,23,42,0.001)) !important;
}

/* =============================================================================
   NUCLEAR: Kill ALL input hover/focus visual changes everywhere
   ============================================================================= */
input:hover, input:focus, input:active,
select:hover, select:focus, select:active,
input[type="text"]:hover, input[type="text"]:focus,
input[type="password"]:hover, input[type="password"]:focus,
input[type="email"]:hover, input[type="email"]:focus,
table input:hover, table input:focus,
table select:hover, table select:focus,
tr.edit input:hover, tr.edit input:focus,
tr.edit td input:hover, tr.edit td input:focus,
#main-table-wrapper input:hover, #main-table-wrapper input:focus,
#main-table-wrapper table tr.edit input:hover,
#main-table-wrapper table tr.edit input:focus,
#main-table-wrapper table tr.edit input:active,
#main-table-wrapper table tr.edit td input:hover,
#main-table-wrapper table tr.edit td input:focus,
form input:hover, form input:focus {
  background-color: rgba(15,23,42,.7) !important;
  background: rgba(15,23,42,.7) !important;
  border-color: #334155 !important;
  box-shadow: none !important;
  transform: none !important;
  outline: none !important;
  color: #e2e8f0 !important;
}

/* Kill transitions and bottom border on ALL inputs */
input[type="text"],
input[type="email"],
input[type="password"],
select {
  transition: none !important;
  border-bottom: 2px solid #334155 !important;
  border-bottom-width: 2px !important;
}