/*
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 *   http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on an
 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied.  See the License for the
 * specific language governing permissions and limitations
 * under the License.
 */

/* Label/tag denoting the user that shared a connection */
.jdbc-share-tag {

    background: #0095ff;
    padding: 0.25em;

    -moz-border-radius:    0.25em;
    -webkit-border-radius: 0.25em;
    -khtml-border-radius:  0.25em;
    border-radius:         0.25em;

    color: white;
    font-size: 0.75em;
    font-weight: bold;

}
/* ========= Network Nuts — Polished Dark Theme (Full CSS) ========= */
/* Brand palette */
:root {
  --nn-bg: #0b0b0c;        /* page background */
  --nn-panel: #141416;     /* card background */
  --nn-panel-2: #1b1c1f;   /* hover/alt background */
  --nn-text: #e6e6e6;      /* primary text */
  --nn-text-dim: #b7b7b7;  /* secondary text */
  --nn-border: #2a2b2f;    /* subtle borders */
  --nn-accent: #e11d2e;    /* primary red */
  --nn-accent-2: #ff4d5e;  /* lighter red (hover/focus) */
  --nn-success: #22c55e;
  --nn-warning: #f59e0b;
  --nn-error: #ef4444;
  --nn-shadow: 0 12px 36px rgba(0,0,0,.45);
}

/* Base */
html, body {
  background: var(--nn-bg) !important;
  color: var(--nn-text);
  font-family: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* Center the login panel */
.login-ui {
  display: grid;
  place-items: center;
  min-height: 100vh;
}

/* Login card */
.login-ui .login-dialog {
  background: var(--nn-panel);
  border: 1px solid var(--nn-border);
  border-radius: 16px;
  box-shadow: var(--nn-shadow);
  padding: 28px 28px 24px;
  width: min(440px, 92vw);
}

/* Logo — uses extension namespace assets */
.login-ui .login-dialog .login-logo {
  text-align: center;
  margin-top: 6px;
  margin-bottom: 14px;
}
.login-ui .login-dialog .login-logo img {
  /* show your logo from the extension (namespace: networknuts) */
  content: url("app/ext/networknuts/images/logo.png");
  width: 72px;
  height: 72px;
  border-radius: 14px;
  background: transparent;
  display: inline-block;
}

/* Title (works with default heading or custom login.html) */
.login-ui .login-dialog h1,
.login-ui .login-dialog .login-title {
  text-align: center;
  margin: 8px 0 18px;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: .3px;
  color: var(--nn-text);
}

/* Inputs — WHITE fields */
.login-ui input[type="text"],
.login-ui input[type="password"] {
  background: #ffffff !important;
  color: #111 !important;
  border: 1px solid #d1d5db !important;   /* neutral-300 */
  border-radius: 12px;
  padding: 12px 14px;
  width: 100%;
  outline: none;
  box-shadow: 0 1px 2px rgba(0,0,0,.06) inset;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
  margin-bottom: 14px;
}
.login-ui input::placeholder { color: #6b7280 !important; } /* neutral-500 */
.login-ui input:focus {
  border-color: var(--nn-accent) !important;
  box-shadow: 0 0 0 3px rgba(225, 29, 46, .25) !important;
}

/* Primary button */
.login-ui input[type="submit"],
.login-ui button {
  background: linear-gradient(180deg, var(--nn-accent), #c81627);
  color: #fff;
  border: 1px solid #c81627;
  border-radius: 14px;
  padding: 12px 16px;
  width: 100%;
  font-weight: 800;
  letter-spacing: .3px;
  cursor: pointer;
  transition: transform .06s ease, box-shadow .15s ease, background .2s ease, filter .15s ease;
  box-shadow: 0 14px 36px rgba(225, 29, 46, .35);
}
.login-ui input[type="submit"]:hover,
.login-ui button:hover {
  background: linear-gradient(180deg, var(--nn-accent-2), var(--nn-accent));
  transform: translateY(-1px);
  filter: brightness(1.02);
}
.login-ui input[type="submit"]:active,
.login-ui button:active { transform: translateY(0); }
.login-ui input[type="submit"]:disabled,
.login-ui button:disabled {
  opacity: .6; cursor: not-allowed; box-shadow: none;
}

/* Links */
a, .login-ui a { color: var(--nn-accent-2); text-decoration: none; }
a:hover, .login-ui a:hover { text-decoration: underline; }

/* Messages (alerts on login) */
body .message, .login-ui .message {
  border-radius: 12px !important;
  border: 1px solid var(--nn-border) !important;
  background: var(--nn-panel-2) !important;
  color: var(--nn-text) !important;
  box-shadow: var(--nn-shadow);
}
body .message.success { border-left: 4px solid var(--nn-success) !important; }
body .message.warning { border-left: 4px solid var(--nn-warning) !important; }
body .message.error   { border-left: 4px solid var(--nn-error)   !important; }

/* Footer/version on login */
.login-ui .login-dialog .version,
.login-ui .login-dialog .footer { color: var(--nn-text-dim); }

/* Accessibility: keyboard focus */
:focus-visible {
  outline: 3px solid rgba(225, 29, 46, .45);
  outline-offset: 2px;
}

/* Scrollbar (WebKit) */
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb { background: #2b2c30; border-radius: 8px; }
*::-webkit-scrollbar-thumb:hover { background: #3a3b41; }

/* ====== Post-login light touch (keeps the vibe) ====== */
.header { background: var(--nn-panel) !important; border-bottom: 1px solid var(--nn-border) !important; }
.menu, .menu .menu-dropdown { background: var(--nn-panel) !important; border-color: var(--nn-border) !important; }
.recent-connections, .list .item, .list .item a { color: var(--nn-text) !important; }
button.action, .button, .menu .action {
  background: var(--nn-panel-2) !important;
  border: 1px solid var(--nn-border) !important;
  color: var(--nn-text) !important;
  border-radius: 10px !important;
}
button.action:hover, .button:hover, .menu .action:hover { border-color: var(--nn-accent) !important; }

/* Responsive niceties */
@media (max-width: 420px) {
  .login-ui .login-dialog { padding: 22px 18px 20px; }
  .login-ui .login-dialog h1, .login-ui .login-dialog .login-title { font-size: 24px; }
}

/* ==== Global text contrast on dark backgrounds ==== */
body, .header, .footer, .content, .menu,
.list, .datatable, .settings, .settings .section,
.form, .dialog, .field, .caption, .help,
.toolbar, .breadcrumb {
  color: var(--nn-text) !important;
}

/* Headings, labels, table headers */
h1,h2,h3,h4,h5,h6,
label, .name, .title, .section .header,
.list .header, .datatable thead th {
  color: var(--nn-text) !important;
}

/* Secondary/dim text (descriptions, captions) */
.caption, .help, .hint, .description,
.settings .tabs .tab .subtitle,
.list .item .description {
  color: var(--nn-text-dim) !important;
}

/* Links */
a, .list .item a, .menu a, .breadcrumb a {
  color: var(--nn-text) !important;
}
a:hover, .list .item a:hover { color: var(--nn-accent-2) !important; }

/* Tables / lists */
.list, .datatable {
  background: var(--nn-panel) !important;
  border: 1px solid var(--nn-border) !important;
}
.list .header, .datatable thead th {
  background: var(--nn-panel-2) !important;
  border-bottom: 1px solid var(--nn-border) !important;
}
.list .item, .datatable tbody td {
  border-top: 1px solid var(--nn-border) !important;
  color: var(--nn-text) !important;
}
.list .item:hover, .datatable tbody tr:hover {
  background: #1a1b1f !important;
}

/* Filters / search bars */
.filter input[type="text"], .filter input[type="search"],
.search input[type="text"], .search input[type="search"] {
  background: #fff !important;
  color: #111 !important;
  border: 1px solid #d1d5db !important;
  border-radius: 10px !important;
  padding: 10px 12px !important;
}
.filter input::placeholder, .search input::placeholder {
  color: #6b7280 !important;
}

/* General form controls after login (white for readability) */
.form input[type="text"], .form input[type="password"],
.form input[type="number"], .form input[type="email"],
.form textarea, .form select,
.settings input[type="text"], .settings input[type="password"],
.settings textarea, .settings select {
  background: #fff !important;
  color: #111 !important;
  border: 1px solid #d1d5db !important;
  border-radius: 10px !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.06) inset !important;
}
.form select, .settings select { appearance: none; }

/* Buttons (primary/neutral) */
.button, button, .action, .menu .action {
  background: var(--nn-panel-2) !important;
  color: var(--nn-text) !important;
  border: 1px solid var(--nn-border) !important;
  border-radius: 10px !important;
}
.button:hover, button:hover, .action:hover {
  border-color: var(--nn-accent) !important;
}

/* Destructive/primary emphasis */
.button.primary, .action.primary, .save, .create {
  background: linear-gradient(180deg, var(--nn-accent), #c81627) !important;
  color: #fff !important;
  border: 1px solid #c81627 !important;
  box-shadow: 0 10px 24px rgba(225,29,46,.28) !important;
}
.button.primary:hover, .action.primary:hover { filter: brightness(1.03); }

/* Tabs in Settings */
.settings .tabs {
  background: var(--nn-panel) !important;
  border-bottom: 1px solid var(--nn-border) !important;
}
.settings .tabs .tab {
  color: var(--nn-text-dim) !important;
}
.settings .tabs .tab.selected,
.settings .tabs .tab:hover {
  color: var(--nn-text) !important;
  border-bottom: 2px solid var(--nn-accent) !important;
}

/* Menus, dropdowns */
.menu, .menu .menu-dropdown {
  background: var(--nn-panel) !important;
  border: 1px solid var(--nn-border) !important;
  color: var(--nn-text) !important;
}
.menu .caption, .menu .menu-item { color: var(--nn-text) !important; }
.menu .menu-item:hover { background: var(--nn-panel-2) !important; }

/* Header bar */
.header, .header .title, .header .right,
.header .user, .header .breadcrumbs {
  background: var(--nn-panel) !important;
  color: var(--nn-text) !important;
  border-bottom: 1px solid var(--nn-border) !important;
}

/* Dialogs / modals */
.dialog, .dialog .titlebar, .dialog .contents {
  background: var(--nn-panel) !important;
  color: var(--nn-text) !important;
  border: 1px solid var(--nn-border) !important;
}
.dialog .titlebar { border-bottom: 1px solid var(--nn-border) !important; }

/* Status chips */
.tag, .badge {
  background: var(--nn-panel-2) !important;
  color: var(--nn-text) !important;
  border: 1px solid var(--nn-border) !important;
}

/* Ensure icons next to text remain visible */
.list .item .icon, .menu .icon, .button .icon {
  filter: brightness(1.1) contrast(1.1);
}

