/*
 * 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;

}
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap');

:root {
  --rja-bg: #0c0b0a;
  --rja-ink: #f3ebe0;
  --rja-cream: #e8dcc8;
  --rja-muted: #9a8f82;
  --rja-ember: #e85a1a;
  --rja-ember-hot: #ff7a35;
  --rja-btn-label: #ffffff;
  --rja-ember-soft: rgba(232, 90, 26, 0.16);
  --rja-line: rgba(232, 220, 200, 0.1);
  --rja-mark: #1a1612;
}

body, .login-ui, .header, #content, .menu, .user-menu {
  font-family: "Outfit", system-ui, -apple-system, "Segoe UI", sans-serif !important;
}

/* --- Login --- */
div.login-ui {
  background: var(--rja-bg) !important;
  color: var(--rja-ink) !important;
}

.login-ui .login-dialog {
  background: var(--rja-mark) !important;
  border: 1px solid var(--rja-line) !important;
  color: var(--rja-ink) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.45) !important;
}

.login-ui .login-dialog .logo {
  width: 6.5em !important;
  height: 6.5em !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-image: url('app/ext/rockingja/images/logo.png') !important;
  margin: 0.5em auto 0.25em auto !important;
}

.rja-login-title {
  text-align: center;
  font-size: 1.35em;
  font-weight: 600;
  color: var(--rja-cream);
  letter-spacing: 0.02em;
  margin: 0.15em 0 0 0;
}

.rja-login-sub {
  text-align: center;
  font-size: 0.85em;
  font-weight: 400;
  color: var(--rja-muted);
  margin: 0.1em 0 0.85em 0;
}

.login-ui .login-dialog .login-fields,
.login-ui .login-dialog .login-fields .labeled-field .field-header,
.login-ui .login-dialog label,
.login-ui .login-dialog .version {
  color: var(--rja-muted) !important;
}

.login-ui .login-fields .labeled-field input,
.login-ui .login-fields input,
.login-ui input[type="text"],
.login-ui input[type="password"],
.login-ui input[type="email"] {
  background: #14110e !important;
  color: var(--rja-ink) !important;
  border: 1px solid var(--rja-line) !important;
  border-radius: 0.35em !important;
}

.login-ui .login-fields .labeled-field input:focus,
.login-ui input:focus {
  background: #1a1612 !important;
  border-color: var(--rja-ember) !important;
  outline: none !important;
  box-shadow: 0 0 0 2px var(--rja-ember-soft) !important;
}

.login-ui .login-fields .labeled-field.empty input {
  background: #14110e !important;
}

input[type="submit"], button, a.button {
  background-color: var(--rja-ember) !important;
  border: 1px solid var(--rja-ember) !important;
  color: var(--rja-btn-label) !important;
  font-family: "Outfit", system-ui, sans-serif !important;
  font-weight: 600 !important;
  border-radius: 0.35em !important;
}

input[type="submit"]:hover, button:hover, a.button:hover {
  background-color: var(--rja-ember-hot) !important;
  border-color: var(--rja-ember-hot) !important;
  color: var(--rja-btn-label) !important;
}

input[type="submit"]:active, button:active, a.button:active {
  background-color: var(--rja-ember) !important;
}

button.danger, a.button.danger {
  background: #b33a12 !important;
  border-color: #b33a12 !important;
  color: #fff !important;
}

.login-ui.error p.login-error {
  background: #2a1510 !important;
  border: 1px solid var(--rja-ember) !important;
  color: var(--rja-cream) !important;
}

/* Duo / continue prompts share login UI */
.login-ui a, .login-ui .continue {
  color: var(--rja-ink) !important;
}
.login-ui a:hover {
  color: var(--rja-ember-hot) !important;
}

/* --- Post-login chrome --- */
body {
  background: var(--rja-bg) !important;
  color: var(--rja-ink) !important;
}

.header {
  background: var(--rja-mark) !important;
  border-bottom: 1px solid var(--rja-line) !important;
  color: var(--rja-cream) !important;
  box-shadow: none !important;
}

.header h2, .header .title, .header a {
  color: var(--rja-cream) !important;
}

.menu, .menu .menu-content, .user-menu, .dropdown, .guac-menu {
  background: var(--rja-mark) !important;
  color: var(--rja-ink) !important;
  border-color: var(--rja-line) !important;
}

a {
  color: var(--rja-ink);
}
a:hover {
  color: var(--rja-ember-hot);
}

#content, .main, .page, .settings, .connection-list-ui {
  background: var(--rja-bg) !important;
  color: var(--rja-ink) !important;
}

h1, h2, h3, .page-title {
  color: var(--rja-cream) !important;
}

.list-item, .connection, .empty, .caption, .hint, .description {
  color: var(--rja-muted);
}

/* Form fields post-login */
input[type="text"], input[type="password"], input[type="email"],
input[type="number"], textarea, select {
  background: #14110e;
  color: var(--rja-ink);
  border: 1px solid var(--rja-line);
}

/* Tabs / nav accents */
.tabs .tab.current, .tabs li.current, .navigation .current {
  border-bottom-color: var(--rja-ember) !important;
  color: var(--rja-cream) !important;
}
