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

}
/* SADMIN Cloud — wygląd Guacamole dopasowany do portal.sadmin.cloud (Mantine, primary indigo, radius md).
   Rozszerzenie brandingowe (skill /principia, guacamole-branding/). Zasoby: app/ext/sadmin-cloud/... */

:root {
  --sc-bg: #f3f4f7;            /* --app-bg portalu */
  --sc-card: #ffffff;
  --sc-border: #dee2e6;        /* mantine gray-3 */
  --sc-text: #212529;          /* gray-9 */
  --sc-dimmed: #868e96;        /* gray-6 */
  --sc-primary: #4c6ef5;       /* indigo-6 */
  --sc-primary-hover: #4263eb; /* indigo-7 */
  --sc-radius: 8px;            /* radius md */
  --sc-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* ---------- ekran logowania ---------- */
body.login-ui, .login-ui {
  background: var(--sc-bg) !important;
  font-family: var(--sc-font) !important;
  color: var(--sc-text);
}
.login-ui .login-dialog-middle { background: transparent; }
.login-ui .login-dialog {
  width: 420px;
  max-width: calc(100% - 32px);
  background: var(--sc-card) !important;
  border: 1px solid var(--sc-border) !important;
  border-radius: var(--sc-radius) !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.05), 0 1px 2px rgba(0,0,0,.1) !important;
  padding: 32px 32px 28px !important;
}
.login-ui .login-dialog .logo {
  width: 84px; height: 96px;
  margin: 0 auto 10px;
  background: url('app/ext/sadmin-cloud/images/logo.png') center / contain no-repeat !important;
}
.login-ui .login-dialog .version .app-name {
  font-family: var(--sc-font) !important;
  font-size: 1.45em; font-weight: 600; letter-spacing: 0; text-transform: none !important;
  color: var(--sc-text) !important;
}
.login-ui .login-dialog .version .version-number { display: none; }
.login-ui .login-dialog .version::after {
  content: "Zaloguj się, aby otworzyć swoją maszynę szkoleniową";
  display: block; margin-top: 6px; font-size: 0.875em; color: var(--sc-dimmed);
}

/* pola */
.login-ui .login-dialog .login-fields { margin-top: 20px; }
.login-ui .login-dialog .login-fields .labeled-field { margin-bottom: 14px; }
/* Guacamole trzyma etykietę ZA polem (position:absolute, z-index -1, opacity .5) jako pseudo-placeholder widoczny przy
   przezroczystym tle pustego pola. Robimy z niej zwykłą etykietę nad polem, jak w Mantine TextInput. */
.login-ui .login-fields .labeled-field .field-header {
  position: static !important; z-index: auto !important; opacity: 1 !important;
  margin: 0 0 4px !important; font-size: 0.875em; font-weight: 500; color: var(--sc-text);
}
.login-ui .login-fields .labeled-field.empty input { background: #fff !important; }
.login-ui .login-dialog .login-fields input[type=text],
.login-ui .login-dialog .login-fields input[type=password] {
  font-family: var(--sc-font);
  font-size: 0.95em; height: 36px; padding: 0 12px;
  border: 1px solid #ced4da !important; border-radius: var(--sc-radius) !important;
  background: #fff; color: var(--sc-text); box-shadow: none !important;
}
.login-ui .login-dialog .login-fields input:focus {
  border-color: var(--sc-primary) !important; outline: none;
}

/* przycisk jak Mantine Button filled indigo */
.login-ui .login-dialog .buttons { text-align: center; margin-top: 6px; }
.login-ui .login-dialog .buttons input[type=submit],
.login-ui .login-dialog .buttons button {
  width: 100%; height: 36px;
  font-family: var(--sc-font); font-size: 0.95em; font-weight: 600;
  background: var(--sc-primary) !important; color: #fff !important;
  border: none !important; border-radius: var(--sc-radius) !important; box-shadow: none !important;
  cursor: pointer;
}
.login-ui .login-dialog .buttons input[type=submit]:hover,
.login-ui .login-dialog .buttons button:hover { background: var(--sc-primary-hover) !important; }

/* komunikat błędu jak Mantine Alert light red */
.login-ui .login-dialog .login-error {
  background: rgba(250,82,82,.1); color: #c92a2a;
  border-radius: var(--sc-radius); padding: 10px 12px; font-size: 0.875em; margin-bottom: 12px;
}
.login-ui .login-dialog .login-error .message { color: inherit; }

/* stopka pod ramką */
.login-ui .login-dialog::after {
  content: "Środowisko chronione. Dostęp wyłącznie dla uczestników szkoleń.";
  display: block; text-align: center; margin-top: 18px; font-size: 0.75em; color: var(--sc-dimmed);
}

/* ---------- reszta interfejsu (lista połączeń, pasek, menu) ---------- */
body { font-family: var(--sc-font); }
.header, .page-tabs { background: var(--sc-card); border-bottom: 1px solid var(--sc-border); }
.header .logo, .user-menu .logo { background: url('app/ext/sadmin-cloud/images/logo.png') center / contain no-repeat; }
.header .app-name, .home .app-name { font-weight: 600; color: var(--sc-text); text-transform: none; }
.header a, .page-tabs a, .menu a { color: var(--sc-primary); }
button, input[type=submit], .button {
  border-radius: var(--sc-radius);
}
button.primary, input[type=submit] { background: var(--sc-primary); color: #fff; border: none; }
button.primary:hover, input[type=submit]:hover { background: var(--sc-primary-hover); }
.recent-connections .connection, .connection-list .list-item { border-radius: var(--sc-radius); }
.notification-modal .notification { border-radius: var(--sc-radius); }

/* menu boczne w sesji (Ctrl+Alt+Shift) — tylko kolory akcentu */
#guac-menu .menu-section h3 { color: var(--sc-text); }
#guac-menu .menu-title { background: var(--sc-primary); }
