@charset "UTF-8";
/*!
 * Clutx — custom GLPI 11 theme ("Soporte Clutx")
 * Brand: cyan #00acc8 (primary), green #62a329 (accent), dark cyan #008a9e (links)
 * Drop in GLPI_THEMES_DIR (/var/glpi/files/_themes); selectable as palette "clutx".
 */
:root[data-glpi-theme=clutx] {
  --glpi-logo-light: url("/pics/clutx/clutx-white.png");
  --glpi-logo-light-reduced: url("/pics/clutx/clutx-white.png");
  --glpi-logo-dark: url("/pics/clutx/clutx-black.png");
  --glpi-logo-dark-reduced: url("/pics/clutx/clutx-black.png");
  --glpi-logo-light-login: url("/pics/clutx/clutx-white.png");
  --glpi-logo-dark-login: url("/pics/clutx/clutx-black.png");
  --glpi-logo: var(--glpi-logo-light);
  --glpi-logo-reduced: var(--glpi-logo-light-reduced);
  --tblr-primary-rgb: 0, 172, 200;
  --tblr-primary-fg: #ffffff;
  --tblr-secondary: #62a329;
  --tblr-secondary-fg: #ffffff;
  --tblr-link-color-rgb: 0, 138, 158;
  --tblr-badge-bg: #e2f5f9;
  --tblr-badge-color: rgb(0, 79, 92);
  --glpi-mainmenu-bg: #00acc8;
  --glpi-mainmenu-fg: #ffffff;
  --glpi-helpdesk-header: hsl(188deg, 60%, 85%);
  --glpi-palette-color-1: #00acc8;
  --glpi-palette-color-2: #62a329;
  --glpi-palette-color-3: #5ac8fa;
  --glpi-palette-color-4: #ffffff;
  --glpi-illustrations-gradient-1: hsl(188deg, 60%, 92%);
  --glpi-illustrations-gradient-2: hsl(188deg, 70%, 65%);
  --glpi-illustrations-gradient-3: hsl(188deg, 100%, 39%);
}

/*
 * Logo proportions.
 * The Clutx wordmark is wide (~4.8:1) but GLPI's logo slots are near-square, which
 * crops it in the expanded menu and stretches it on the login card. Force the whole
 * mark to fit while preserving its aspect ratio (contain, never fill/crop).
 */
:root[data-glpi-theme=clutx] .page-anonymous .glpi-logo {
  object-fit: contain;
  width: 220px;
  height: 64px;
}

:root[data-glpi-theme=clutx] .navbar-brand .glpi-logo,
:root[data-glpi-theme=clutx] .page .glpi-logo {
  background-size: contain !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  width: 140px !important;
  height: 40px !important;
}

:root[data-glpi-theme=clutx] body.navbar-collapsed .navbar-brand .glpi-logo {
  background-size: contain !important;
  background-position: center center !important;
  width: 56px !important;
  height: 38px !important;
}

/*
 * Submenu contrast.
 * When the side menu is collapsed, GLPI renders fly-out submenus as a white panel
 * (`background: --glpi-mainmenu-fg`) with text in `--glpi-mainmenu-bg` (our brand cyan),
 * which is only ~2.9:1 on white. On that white panel, use near-black text for maximum
 * readability — the cyan side rail itself is untouched.
 */
:root[data-glpi-theme=clutx] body.navbar-collapsed .sidebar #navbar-menu .nav-link + .dropdown-menu,
:root[data-glpi-theme=clutx] body.navbar-collapsed .sidebar #navbar-menu .nav-link + .dropdown-menu .dropdown-item,
:root[data-glpi-theme=clutx] body.navbar-collapsed .sidebar #navbar-menu .nav-link + .dropdown-menu .dropdown-header {
  color: #1a1a1a !important;
}