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

}
.totp-enroll p,.totp-details{font-size:.8em}.totp-qr-code{text-align:center}.totp-qr-code img{margin:1em;border:1px solid rgba(0,0,0,0.25);box-shadow:1px 1px 2px rgba(0,0,0,0.25);cursor:pointer}h3.totp-details-header{font-size:.8em}h3.totp-details-header::before{content:'▸ '}.totp-details-visible h3.totp-details-header::before{content:'▾ '}.totp-details,.totp-hide-details{display:none}.totp-details-visible .totp-details{display:table}.totp-details-visible .totp-hide-details{display:inline}.totp-details-visible .totp-show-details{display:none}.totp-hide-details,.totp-show-details{color:blue;text-decoration:underline;cursor:pointer;margin:0 .25em;font-weight:normal}.totp-details{margin:0 auto}.totp-details th{padding-right:.25em;text-align:left}.totp-details td{font-family:monospace}.totp-detail{display:inline-block;margin:0 .25em}/* Police et base */
body, .login-ui, .home .content { 
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  font-size: 15px;
  line-height: 1.45;
}

/* Conteneurs plus doux */
.container, .login-ui .login-dialog, .panel, .settings .section {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* Barre de titre / header */
.header, .login-ui .header {
  /*background: #7393B3;             /* bleu nuit */
  background: transparent !important; 
  color: #ffffff;
  border-bottom: none;
}
.header .title .logo {
  background-image: url("app/ext/guacamole-branding-example/resources/images/logo.png");
  background-size: contain;
  background-repeat: no-repeat;
  width: 40px; height: 40px; margin-right: 8px;
}

/* Boutons */
button, .button, input[type=submit] {
  border-radius: 10px !important;
  padding: 10px 14px !important;
  border: none !important;
  background: #2563eb !important;
  color: #fff !important;
  font-weight: 600;
  transition: transform .04s ease, opacity .2s;
}
button:hover, .button:hover, input[type=submit]:hover {
  opacity: .92;
}
button:active, .button:active, input[type=submit]:active {
  transform: translateY(1px);
}

/* Tuiles de connexions sur la page d'accueil */
.list .connection, .list .connection-group {
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.06);
  padding: 14px;
  transition: box-shadow .2s ease, transform .06s ease;
}
.list .connection:hover, .list .connection-group:hover {
  box-shadow: 0 10px 28px rgba(0,0,0,.08);
  transform: translateY(-2px);
}

/* Grille plus compacte et responsive */
.list .item { 
  margin: 10px; 
  min-width: 260px;
}

/* Champs de formulaire (login / paramètres) */
input[type=text], input[type=password], input[type=number], select {
  border-radius: 10px !important;
  border: 1px solid #e5e7eb !important;
  padding: 10px 12px !important;
}
input:focus, select:focus {
  outline: 2px solid #93c5fd !important;
  border-color: #93c5fd !important;
}

/* Mode sombre automatique si le système est en dark mode */
@media (prefers-color-scheme: dark) {
  body, .login-ui, .home .content { background: #0b1220; color: #e5e7eb; }
  .container, .panel, .settings .section, .list .connection, .list .connection-group {
    /*background: #FC8EAC; border-color: #172039;*/
    /*background: #7393B3; */
    background: transparent !important;
    border-color: #172039;
  }
  input, select {
    background: #111827 !important; color: #e5e7eb !important; border-color: #1f2937 !important;
  }
  .header, .login-ui .header { background: #090f1c; }
}

/* Logo sur l’écran de login */
.login-ui .login-dialog .logo {
  background-image: url("app/ext/guacamole-branding-example/resources/images/logo.png") !important;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  height: 64px; width: 100%;
  margin-bottom: 0px;
  /*background: transparent !important; */
}
/* Supprimer fond, bordure et ombre du login dialog */
.login-ui .login-dialog {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Les sections internes aussi transparentes */
.login-ui .login-dialog .login-fields,
.login-ui .login-dialog .footer,
.login-ui .login-dialog .header {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.warning {
  color: #fff !important;
}

/* Par défaut : tout en blanc */
body, .login-ui, .client-ui, .home .content,
.login-ui .login-dialog,
.client-ui .client-status,
.connection-list,
.connection-group,
.connection-list-item,
.client-menu,
.menu-content,
.settings-section {
    color: white !important;
}

/* Textes issus des traductions (attribut data-translation) → en noir */
[data-translation] {
    color: white !important;
}

/* Texte des noms de connexion en blanc */
.connection-name,
.connection-entry span {
    color: white !important;
}
.page-tabs .page-list ul,
.section-tabs ul {
    color: white !important
 }
.page-tabs .page-list li a[href]:visited {
    color: white !important;
}
.page-tabs .page-list li a[href].current,
.page-tabs .page-list li a[href].current:hover,
.section-tabs li a.current,
.section-tabs li a.current:hover {
    color: white !important;
}
.settings.users table.user-list,
.settings.users table.user-list th.last-active,
.settings.users table.user-list td.last-active,
.settings.users table.user-list th,
.settings.users table.user-list td,
.settings.users table.user-list tr.user td.username a[href],
.settings.users table.user-list tr.user.disabled,
.settings.users table.user-list tr.user.disabled td.username a[href] {
    color: white !important;
    font-style: italic;
}
/*
.settings .connections .connection-list, 
.settings .connections .connection-list .group-list
{
    color: white !important;
}
.settings.connections .connection-list,
.settings.connections .connection-list .group-list,
.settings.connections .connection-list .new-connection,
.settings.connections .connection-list .new-connection-group,
.settings.connections .connection-list .new-sharing-profile,
.settings.connections .connection-list .new-connection a,
.settings.connections .connection-list .new-connection a:hover,
.settings.connections .connection-list .new-connection a:visited,
.settings.connections .connection-list .new-connection-group a,
.settings.connections .connection-list .new-connection-group a:hover,
.settings.connections .connection-list .new-connection-group a:visited,
.settings.connections .connection-list .new-sharing-profile a,
.settings.connections .connection-list .new-sharing-profile a:hover,
.settings.connections .connection-list .new-sharing-profile a:visited {
    text-decoration:none;
    color: white !important;
}*/
/* Sélectionne tous les textes dans connection-list */
.connection-list .name,
.connection-list a,
.connection-list span,
.connection-list div {
    color: white !important;
}
/* Tous les textes des colonnes user-group-name en blanc */
.user-group-list .user-group-name,
.user-group-list .user-group-name a,
.user-group-list .user-group-name span {
    color: white !important;
}
/* Cible la div racine et tous ses descendants */
.group-list-page, 
.group-list-page * {
    color: white !important;       /* Texte en blanc */
    background-color: transparent !important; /* Fond transparent pour ne pas cacher le blanc */
    border-color: white !important; /* Si certains éléments ont des bordures */
}
/* Input texte principal */
.search-string {
    color: white !important;         /* texte saisi en blanc */
    padding-right: 33px !important;    /* décale le texte de 3px à droite */
    /*padding: .5em .5em .5em 2.25em;*/
    background: transparent !important;    /* si nécessaire */
    border-color: white;              /* optionnel si tu veux bordure blanche */
}

/* Placeholder */
.search-string::placeholder {
    color: white !important;         /* placeholder en blanc */
    opacity: 1;                      /* pour certains navigateurs */
}
.recent-connections, .recent-connections * {
    color: white !important;
}
.header {
    box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.6);
}

/* Texte noir dans la liste déroulante Location */
.location-chooser-connection-group.name {
    color: black !important;
}

/* Si la liste a un fond clair, tu peux enlever le !important */
.dropdown .caption,
.dropdown .list-item,
.dropdown .location-chooser-connection-group.name {
    color: black !important;
}
.location-chooser .location.ng-binding {
    color: black !important;
}
/* === Style du menu déroulant (select) === */
select {
  background-color: #000;    /* fond noir */
  color: #fff;               /* texte blanc */
  border: 1px solid #555;    /* bordure grise */
  border-radius: 4px;
  padding: 4px 8px;
  cursor: pointer;
}

/* === Style des options dans la liste === */
select option {
  background-color: #000;  /* fond noir */
  color: #fff;             /* texte blanc */
}

/* === Style lors de la sélection ou du focus === */
select:focus,
select:active,
select option:checked {
  background-color: #000;
  color: #fff !important;  /* garantit que le texte reste visible */
}

/* === Pour forcer la couleur de l’option affichée après sélection === */
select option:checked,
select option[selected] {
  color: #fff;
}

/* === (Optionnel) effet visuel au survol dans la liste === */
select option:hover {
  background-color: #222;
}

body .login-ui {
background: url('app/ext/guacamole-branding-example/resources/images/background.png') no-repeat center center fixed;
    background-size: cover !important;
/*    background: red !important;*/
}
body .client-ui {
    background: url('app/ext/guacamole-branding-example/resources/images/background.png') no-repeat center center fixed;
    background-size: cover !important;
/*    background: red !important;*/
}
body {
    background: url('app/ext/guacamole-branding-example/resources/images/background.png') no-repeat center center fixed;
    background-size: cover !important;
/*    background: red !important;*/
}
.logged-out-modal guac-modal {
    background: url('app/ext/guacamole-branding-example/resources/images/background.png') no-repeat center center fixed;
    background-size: cover !important;
/*    background: red !important;*/
}
/* Supprimer les couleurs de fond qui recouvrent */
/* Supprimer les couleurs de fond qui recouvrent */
/*.client-ui {
    background: transparent !important;
}

.client-ui .client-display {
    background: transparent !important;
}

.client-ui .display, 
.client-ui .display div {
    background: transparent !important;
}*/