/* MMD UX v1.3 — MMD employee-portal design bridge for MMD Support.
 *
 * Uses the portal paper/ink/baobab palette while keeping GLPI's native
 * structure and plugin hooks intact.
 */

:root {
  --mmd-paper: #fafaf6;
  --mmd-paper-2: #f3f0e6;
  --mmd-ink: #0e0e0c;
  --mmd-ink-2: #2b2a26;
  --mmd-muted: #6e6b62;
  --mmd-faint: #a6a39a;
  --mmd-rule: #e5e2d8;
  --mmd-rule-2: #c8c2b5;
  --mmd-bg: var(--mmd-paper-2);
  --mmd-surface: var(--mmd-paper);
  --mmd-surface-2: #f7f4ea;
  --mmd-primary: #0e0e0c;
  --mmd-primary-2: #2b2a26;
  --mmd-primary-3: #000000;
  --mmd-accent: #c8102e;
  --mmd-accent-2: #9e0a23;
  --mmd-ok: #2f6b43;
  --mmd-warn: #b7791f;
  --mmd-danger: #c8102e;
  --mmd-font-display: "Fraunces", "PP Editorial New", Georgia, serif;
  --mmd-font-ui:
    "PP Neue Machina", "Neue Machina", "Avenir Next", "Helvetica Neue", Arial,
    system-ui, sans-serif;
  --mmd-font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", monospace;
  --mmd-focus: 0 0 0 3px rgba(200, 16, 46, 0.2);
}

html,
body,
.page,
.page-wrapper,
.page-body {
  background: var(--mmd-bg) !important;
  color: var(--mmd-ink) !important;
  font-family: var(--mmd-font-ui) !important;
  letter-spacing: 0 !important;
}

h1,
h2,
h3,
h4,
.page-title,
.card-title {
  font-family: var(--mmd-font-display) !important;
  color: var(--mmd-ink) !important;
  letter-spacing: 0 !important;
}

/* --------------------------------------------------------------------- *
 * 1. Buttons — readable text on every variant, clear hierarchy.
 *    Tabler's defaults make .btn-primary near-invisible text-wise.
 * --------------------------------------------------------------------- */

.btn-primary,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-secondary,
.btn-secondary:hover,
.btn-secondary:focus,
.btn-info,
.btn-info:hover,
.btn-info:focus,
.btn-dark,
.btn-dark:hover,
.btn-dark:focus,
.btn-success,
.btn-success:hover,
.btn-success:focus,
.btn-danger,
.btn-danger:hover,
.btn-danger:focus {
  color: #ffffff !important;
}
.btn-warning,
.btn-warning:hover,
.btn-warning:focus {
  color: var(--mmd-ink) !important;
}

/* Make .btn-primary follow the employee portal ink/baobab hierarchy. */
.btn-primary {
  background-color: var(--mmd-primary) !important;
  border-color: var(--mmd-primary) !important;
  font-weight: 500;
  letter-spacing: 0.005em;
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--mmd-primary-2) !important;
  border-color: var(--mmd-primary-2) !important;
}
.btn-primary:active {
  background-color: var(--mmd-primary-3) !important;
}
.btn-primary:focus-visible {
  box-shadow: var(--mmd-focus) !important;
}

/* Outline buttons stay readable on white */
.btn-outline-primary {
  color: var(--mmd-primary) !important;
  border-color: var(--mmd-primary) !important;
  font-weight: 500;
}
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
  background-color: var(--mmd-primary) !important;
  color: #ffffff !important;
  border-color: var(--mmd-primary) !important;
}

/* "Save" / form-submit buttons — make the primary action unmistakeable */
form button[type="submit"].btn-primary,
.form-actions button[type="submit"].btn-primary,
.glpi-form-renderer button[type="submit"].btn-primary {
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
  min-width: 8.5rem;
  font-weight: 600 !important;
}

.btn-primary[href*="ticket.form"],
.mmd-topbar-cta,
[data-mmd-dashcards] .mmd-card.is-primary {
  background-color: var(--mmd-accent) !important;
  border-color: var(--mmd-accent) !important;
}

.btn-primary[href*="ticket.form"]:hover,
.mmd-topbar-cta:hover,
[data-mmd-dashcards] .mmd-card.is-primary:hover {
  background-color: var(--mmd-accent-2) !important;
  border-color: var(--mmd-accent-2) !important;
}

/* --------------------------------------------------------------------- *
 * 2. Background utility classes (.bg-primary, .bg-dark etc.)
 *    — force readable text. Yellow stays dark-on.
 * --------------------------------------------------------------------- */

.bg-primary,
.bg-primary *,
.bg-secondary,
.bg-secondary *,
.bg-info,
.bg-info *,
.bg-dark,
.bg-dark *,
.bg-success,
.bg-success *,
.bg-danger,
.bg-danger *,
.bg-blue,
.bg-blue *,
.bg-indigo,
.bg-indigo * {
  color: #ffffff !important;
}

.bg-primary {
  background-color: var(--mmd-primary) !important;
}

.bg-warning,
.bg-warning a,
.bg-warning .text-body {
  color: var(--mmd-ink) !important;
}

.badge.bg-primary,
.badge.bg-secondary,
.badge.bg-info,
.badge.bg-dark,
.badge.bg-success,
.badge.bg-danger,
.badge.bg-blue,
span.badge-blue,
.tag.tag-primary,
.tag.tag-dark {
  color: #ffffff !important;
}

.mmd-dark-blue {
  color: #ffffff !important;
}

.text-danger,
a.text-danger,
.text-danger * {
  color: var(--mmd-danger) !important;
}

/* --------------------------------------------------------------------- *
 * 3. Forms — visible borders, calm focus state, readable labels.
 * --------------------------------------------------------------------- */

input.form-control,
select.form-select,
textarea.form-control,
.select2-container .select2-selection,
.tox-tinymce {
  border: 1px solid var(--mmd-rule-2) !important;
  background-color: var(--mmd-surface) !important;
  color: var(--mmd-ink-2) !important;
  box-shadow: inset 0 1px 0 rgba(15, 23, 34, 0.04);
}
input.form-control:focus,
select.form-select:focus,
textarea.form-control:focus,
.select2-container--focus .select2-selection,
.tox-tinymce:focus-within {
  border-color: var(--mmd-primary) !important;
  box-shadow: var(--mmd-focus) !important;
}
input.form-control::placeholder,
textarea.form-control::placeholder {
  color: var(--mmd-muted) !important;
  opacity: 1;
}

table.tab_cadre_fixe > tbody > tr > th[colspan]:not([class*="badge"]),
.itil-object-section-header,
.glpi-form-section-title,
.card .card-header h3,
.card .card-header h4,
.card .card-header .card-title {
  background-color: var(--mmd-surface-2) !important;
  color: var(--mmd-ink-2) !important;
  font-weight: 600 !important;
  font-size: 0.95rem !important;
  letter-spacing: 0.01em !important;
  border-bottom: 1px solid var(--mmd-rule-2) !important;
  padding: 0.55rem 0.85rem !important;
}

label.form-label,
.form-field label,
.tab_cadre_fixe label,
form label.col-form-label {
  color: var(--mmd-ink-2) !important;
  font-weight: 500 !important;
}

.page-body .container-xl,
.page-body .container-fluid > form,
.page-body > form,
form.tab_cadre_fixe,
.glpi-form-renderer {
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
}
form .row {
  row-gap: 0.5rem !important;
}
form .form-field,
form .row > [class*="col-"] {
  margin-bottom: 0.35rem !important;
}
.tox-tinymce {
  min-height: 180px !important;
  max-height: 320px !important;
}

.btn-link-info-i,
a.fa-info-circle,
a[title*="Show information"],
a[title*="Add"] > i,
.add-item-popup {
  color: var(--mmd-muted) !important;
  opacity: 0.7 !important;
}
.btn-link-info-i:hover,
a.fa-info-circle:hover,
a[title*="Show information"]:hover,
a[title*="Add"]:hover > i {
  opacity: 1 !important;
  color: var(--mmd-primary) !important;
}

input[type="text"].hasDatepicker[value=""]::placeholder,
input.flatpickr-input::placeholder {
  color: transparent;
}

/* --------------------------------------------------------------------- *
 * 4. Nav bar + sidebar — readability on dark surfaces.
 * --------------------------------------------------------------------- */

.navbar-dark .nav-link,
.navbar-dark .navbar-brand,
.navbar.bg-dark .nav-link,
.navbar.bg-primary .nav-link,
.aside.bg-dark .nav-link,
.aside.bg-primary .nav-link {
  color: rgba(255, 255, 255, 0.92) !important;
}
.navbar-dark .nav-link:hover,
.navbar.bg-dark .nav-link:hover,
.navbar.bg-primary .nav-link:hover {
  color: #ffffff !important;
}

.card-header.bg-primary,
.card-header.bg-dark,
.card-header.bg-info,
.card-header.bg-primary .card-title,
.card-header.bg-dark .card-title,
.card-header.bg-info .card-title {
  color: #ffffff !important;
}

header.navbar,
.navbar-dark,
.navbar.bg-dark,
.navbar.bg-primary,
.aside.bg-dark,
.aside.bg-primary {
  background: var(--mmd-ink) !important;
  border-color: var(--mmd-ink) !important;
}

.navbar-brand::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  margin-right: 10px;
  vertical-align: -6px;
  background: url("/plugins/mmdux/front/mmd-mark.svg") center / contain
    no-repeat;
}

.navbar-brand,
.navbar-brand:hover {
  color: var(--mmd-paper) !important;
  font-weight: 800 !important;
}

/* --------------------------------------------------------------------- *
 * 5. MMD topbar shortcut — the orphan "+ New ticket" that floated in
 *    the corner is replaced with an in-bar pill that lives in the
 *    navbar. JS injects [data-mmd-topbtn]; CSS controls the look.
 * --------------------------------------------------------------------- */

.mmd-topbar-cta,
[data-mmd-topbtn] {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  padding: 7px 16px;
  background: var(--mmd-primary);
  color: #ffffff !important;
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.01em;
  text-decoration: none;
  border-radius: 4px;
  border: 1px solid var(--mmd-primary);
  box-shadow: 0 1px 0 rgba(15, 23, 34, 0.05);
  transition:
    background-color 120ms ease,
    transform 120ms ease;
}
.mmd-topbar-cta:hover,
[data-mmd-topbtn]:hover {
  background: var(--mmd-primary-2) !important;
  color: #ffffff !important;
  text-decoration: none;
}
.mmd-topbar-cta:active,
[data-mmd-topbtn]:active {
  transform: translateY(1px);
}

/* Kill the legacy orphan "+ New ticket" that floated outside the navbar.
 * Pre-1.2 JS positioned it absolutely top-left; the new JS uses a class
 * but we also blunt-force-hide any stale node carrying the old marker. */
a[data-mmd-newticket]:not(.mmd-topbar-cta) {
  position: static !important;
  margin: 0 8px !important;
}

/* --------------------------------------------------------------------- *
 * 6. Admin dashboard — three big CTA cards above /front/central.php.
 *    Re-skinned to a clearer hierarchy: one primary (filled), one
 *    secondary (outlined), one tertiary (ghost).
 * --------------------------------------------------------------------- */

[data-mmd-dashcards] {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
  margin: 4px 12px 18px 12px;
}
[data-mmd-dashcards] .mmd-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 18px 22px;
  border-radius: 6px;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  line-height: 1.25;
  transition:
    transform 120ms ease,
    box-shadow 120ms ease,
    background-color 120ms ease;
}
[data-mmd-dashcards] .mmd-card .mmd-sub {
  font-size: 12px;
  font-weight: 500;
  opacity: 0.85;
  letter-spacing: 0.02em;
}
[data-mmd-dashcards] .mmd-card.is-primary {
  background: var(--mmd-primary);
  color: #ffffff;
  border: 1px solid var(--mmd-primary);
  box-shadow: none;
}
[data-mmd-dashcards] .mmd-card.is-primary:hover {
  background: var(--mmd-primary-2);
  transform: translateY(-1px);
  box-shadow:
    0 2px 4px rgba(15, 23, 34, 0.12),
    0 4px 10px rgba(15, 23, 34, 0.08);
  color: #ffffff;
}
[data-mmd-dashcards] .mmd-card.is-secondary {
  background: var(--mmd-surface);
  color: var(--mmd-primary);
  border: 1.5px solid var(--mmd-primary);
}
[data-mmd-dashcards] .mmd-card.is-secondary:hover {
  background: var(--mmd-surface-2);
}
[data-mmd-dashcards] .mmd-card.is-tertiary {
  background: var(--mmd-surface);
  color: var(--mmd-ink-2);
  border: 1px solid var(--mmd-rule);
}
[data-mmd-dashcards] .mmd-card.is-tertiary:hover {
  background: var(--mmd-surface-2);
  border-color: var(--mmd-rule-2);
}

/* --------------------------------------------------------------------- *
 * 7. Ticket-detail quick actions panel — flatten and align with palette.
 * --------------------------------------------------------------------- */

[data-mmd-actions] {
  border: 1px solid var(--mmd-rule) !important;
  background: var(--mmd-surface-2) !important;
  border-radius: 6px !important;
  padding: 14px 16px !important;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 10px 0 !important;
}
[data-mmd-actions] .mmd-actions-title {
  width: 100%;
  font-size: 12px;
  font-weight: 600;
  color: var(--mmd-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 4px;
}
[data-mmd-actions] .mmd-actions-title b {
  color: var(--mmd-ink-2);
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0;
}
[data-mmd-actions] a,
[data-mmd-actions] button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid transparent;
  transition:
    background-color 120ms ease,
    color 120ms ease,
    border-color 120ms ease;
}
[data-mmd-actions] .mmd-act-primary {
  background: var(--mmd-primary);
  color: #ffffff !important;
  border-color: var(--mmd-primary);
}
[data-mmd-actions] .mmd-act-primary:hover {
  background: var(--mmd-primary-2);
  border-color: var(--mmd-primary-2);
}
[data-mmd-actions] .mmd-act-secondary {
  background: var(--mmd-surface);
  color: var(--mmd-primary) !important;
  border-color: var(--mmd-primary);
}
[data-mmd-actions] .mmd-act-secondary:hover {
  background: var(--mmd-surface-2);
}
[data-mmd-actions] .mmd-act-tertiary {
  background: var(--mmd-surface);
  color: var(--mmd-muted) !important;
  border-color: var(--mmd-rule);
}
[data-mmd-actions] .mmd-act-tertiary:hover {
  color: var(--mmd-ink-2) !important;
  border-color: var(--mmd-rule-2);
}

/* --------------------------------------------------------------------- *
 * 8. Ticket list — denser rows, better readable date / priority dots.
 * --------------------------------------------------------------------- */

table.search-results tbody tr td,
.datatable tbody tr td {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
  vertical-align: middle;
  color: var(--mmd-ink-2);
}
table.search-results thead tr th,
.datatable thead tr th {
  background: var(--mmd-surface-2) !important;
  color: var(--mmd-ink) !important;
  font-weight: 600 !important;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-bottom: 1px solid var(--mmd-rule-2) !important;
}
table.search-results tbody tr:hover,
.datatable tbody tr:hover {
  background-color: rgba(42, 76, 106, 0.04) !important;
}
table.search-results tbody tr td a {
  color: var(--mmd-primary);
}
table.search-results tbody tr td a:hover {
  color: var(--mmd-primary-2);
  text-decoration: underline;
}

/* --------------------------------------------------------------------- *
 * 9. Helpdesk portal (Self-Service home + Service Catalog).
 *    The defaults are pale & generic. Tighten the hero, sharpen tiles.
 * --------------------------------------------------------------------- */

/* Hero search block on /Helpdesk */
.helpdesk-home-hero,
.tiles-container ~ div,
.page-body > div[style*="background"]:first-of-type {
  background: var(--mmd-paper) !important;
  border-bottom: 1px solid var(--mmd-ink) !important;
}

.helpdesk-home-hero h1,
.page-body h1 {
  color: var(--mmd-ink) !important;
  font-weight: 700 !important;
  letter-spacing: -0.015em;
}

/* Tile cards on the Helpdesk landing page */
.tiles-container .tile,
.tiles-container a.tile,
a.tile {
  border: 1px solid var(--mmd-rule) !important;
  border-radius: 6px !important;
  transition:
    border-color 120ms ease,
    box-shadow 120ms ease,
    transform 120ms ease;
  background: var(--mmd-surface) !important;
}
.tiles-container .tile:hover,
.tiles-container a.tile:hover,
a.tile:hover {
  border-color: var(--mmd-primary) !important;
  box-shadow:
    0 1px 2px rgba(15, 23, 34, 0.06),
    0 4px 12px rgba(15, 23, 34, 0.08);
  transform: translateY(-1px);
  text-decoration: none;
}
.tiles-container .tile h2,
.tiles-container .tile h3,
.tiles-container .tile .tile-title,
a.tile h2,
a.tile h3,
a.tile .tile-title {
  color: var(--mmd-ink) !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
}
.tiles-container .tile p,
.tiles-container .tile .tile-description,
a.tile p,
a.tile .tile-description {
  color: var(--mmd-muted) !important;
  font-size: 0.875rem !important;
  line-height: 1.45;
}

/* Service catalog grid headings */
.service-catalog-search input,
.service-catalog-search .form-control {
  height: 44px;
  font-size: 0.95rem;
}

/* Service catalog cards. GLPI's default Bootstrap columns leave only a narrow
   text strip beside the illustration in the central layout. Keep the catalog
   card-based, but make every item readable at tablet/desktop widths. */
body.mmd-service-catalog.vertical-layout.central main#page .page-body .container-xl > section.row.mb-5,
body.vertical-layout.central main#page .page-body .container-xl > section.row.mb-5 {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 8px !important;
  align-items: stretch !important;
  margin-inline: 0 !important;
}

body.vertical-layout.central
  main#page
  .page-body
  .container-xl
  > section.row.mb-5
  > [class*="col-"] {
  display: flex !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  padding: 0 !important;
}

body.vertical-layout.central
  main#page
  .page-body
  .container-xl
  > section.row.mb-5
  > [class*="col-"]
  > .card,
body.vertical-layout.central
  main#page
  .page-body
  .container-xl
  > section.row.mb-5
  > [class*="col-"]
  > .card-body {
  width: 100% !important;
  min-height: 88px !important;
  max-height: 124px !important;
  overflow: hidden !important;
}

body.mmd-service-catalog
  main#page
  .page-body
  .container-xl
  > section.row.mb-5
  .card-body {
  padding: 12px 14px !important;
}

body.vertical-layout.central
  main#page
  .page-body
  .container-xl
  > section.row.mb-5
  .card-body
  > .d-flex {
  display: block !important;
}

body.vertical-layout.central
  main#page
  .page-body
  .container-xl
  > section.row.mb-5
  .card-body
  > .d-flex
  > :not(.ms-4) {
  display: none !important;
}

body.vertical-layout.central
  main#page
  .page-body
  .container-xl
  > section.row.mb-5
  .card-body
  > .d-flex
  > .ms-4 {
  width: auto !important;
  min-width: 0 !important;
  margin-left: 0 !important;
}

body.vertical-layout.central
  main#page
  .page-body
  .container-xl
  > section.row.mb-5
  .card-title {
  font-size: 0.88rem !important;
  line-height: 1.25 !important;
  overflow-wrap: anywhere !important;
  padding-right: 26px !important;
}

body.vertical-layout.central
  main#page
  .page-body
  .container-xl
  > section.row.mb-5
  .card-body
  p,
body.vertical-layout.central
  main#page
  .page-body
  .container-xl
  > section.row.mb-5
  .card-body
  ol,
body.vertical-layout.central
  main#page
  .page-body
  .container-xl
  > section.row.mb-5
  .card-body
  ul {
  color: var(--mmd-muted) !important;
  display: -webkit-box !important;
  line-height: 1.45 !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 5 !important;
}

body.mmd-service-catalog
  main#page
  .page-body
  .container-xl
  > section.row.mb-5
  .card-body
  p,
body.mmd-service-catalog
  main#page
  .page-body
  .container-xl
  > section.row.mb-5
  .card-body
  ol,
body.mmd-service-catalog
  main#page
  .page-body
  .container-xl
  > section.row.mb-5
  .card-body
  ul {
  font-size: 0.76rem !important;
  line-height: 1.28 !important;
  -webkit-line-clamp: 2 !important;
}

body.mmd-service-catalog .mmd-catalog-fav-host {
  position: relative !important;
}

body.mmd-service-catalog .mmd-catalog-fav-btn {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  padding: 0;
  border: 1px solid var(--mmd-rule);
  border-radius: 999px;
  background: var(--mmd-surface);
  color: var(--mmd-muted);
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
}

body.mmd-service-catalog .mmd-catalog-fav-btn:hover,
body.mmd-service-catalog .mmd-catalog-fav-btn.is-favourite {
  border-color: var(--mmd-primary);
  background: #fff4c2;
  color: #7a4d00;
}

body.mmd-service-catalog [data-mmd-catalog-favourites] {
  margin: 10px 0 14px;
  padding: 10px 12px;
  border: 1px solid var(--mmd-rule);
  border-radius: 6px;
  background: var(--mmd-surface);
}

body.mmd-service-catalog .mmd-catalog-favourites-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

body.mmd-service-catalog .mmd-catalog-favourites-head strong {
  font-size: 0.9rem;
  color: var(--mmd-ink);
}

body.mmd-service-catalog .mmd-catalog-favourites-head span {
  font-size: 0.78rem;
  color: var(--mmd-muted);
}

body.mmd-service-catalog .mmd-catalog-favourites-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

body.mmd-service-catalog .mmd-catalog-favourites-list a {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid var(--mmd-rule);
  border-radius: 999px;
  background: var(--mmd-paper);
  color: var(--mmd-ink);
  font-size: 0.82rem;
  font-weight: 600;
  text-decoration: none;
}

body.mmd-service-catalog [data-mmd-catalog-all-forms] {
  margin: 12px 0 18px;
  padding: 12px;
  border: 1px solid var(--mmd-rule);
  border-radius: 6px;
  background: var(--mmd-surface);
}

body.mmd-service-catalog .mmd-catalog-all-forms-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

body.mmd-service-catalog .mmd-catalog-all-forms-head strong {
  font-size: 0.92rem;
  color: var(--mmd-ink);
}

body.mmd-service-catalog .mmd-catalog-all-forms-head span {
  font-size: 0.78rem;
  color: var(--mmd-muted);
}

body.mmd-service-catalog .mmd-catalog-all-forms-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}

body.mmd-service-catalog .mmd-catalog-all-forms-group {
  padding: 8px;
  border: 1px solid #d6cfbd;
  border-radius: 6px;
  background: var(--mmd-paper);
}

body.mmd-service-catalog .mmd-catalog-all-forms-group strong {
  display: block;
  margin-bottom: 6px;
  font-family: var(--mmd-font-display);
  font-size: 0.86rem;
  color: var(--mmd-ink);
}

body.mmd-service-catalog .mmd-catalog-all-forms-group a {
  display: block;
  padding: 5px 0;
  color: var(--mmd-primary);
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.25;
  text-decoration: none;
}

body.mmd-service-catalog .mmd-catalog-all-forms-group a:hover,
body.mmd-service-catalog .mmd-catalog-all-forms-group a:focus {
  text-decoration: underline;
}

@media (max-width: 760px) {
  body.vertical-layout.central main#page .page-body .container-xl > section.row.mb-5 {
    grid-template-columns: 1fr !important;
  }
}

/* --------------------------------------------------------------------- *
 * 10. Login page — slightly tighter card, keep the brand intact.
 * --------------------------------------------------------------------- */

.login-card,
.card.login-card {
  border: 1px solid var(--mmd-rule) !important;
  box-shadow:
    0 1px 2px rgba(15, 23, 34, 0.05),
    0 8px 24px rgba(15, 23, 34, 0.06);
}
.login-card a,
.login-form a {
  color: var(--mmd-primary);
}

.card,
.search-card,
.list-group,
.modal-content,
.dropdown-menu,
.tab-content {
  background-color: var(--mmd-surface) !important;
  border-color: var(--mmd-rule) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

.table,
.datatable,
table.search-results {
  --tblr-table-bg: var(--mmd-surface);
  --tblr-table-striped-bg: var(--mmd-surface-2);
  border-color: var(--mmd-rule) !important;
}

.badge,
.tag,
.status {
  border-radius: 4px !important;
  font-family: var(--mmd-font-mono) !important;
  letter-spacing: 0.04em !important;
}

/* --------------------------------------------------------------------- *
 * 11. Misc readability — focus rings everywhere, link underlines on hover.
 * --------------------------------------------------------------------- */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible {
  outline: none;
  box-shadow: var(--mmd-focus);
  border-radius: 4px;
}
a {
  color: var(--mmd-primary);
}
a:hover {
  color: var(--mmd-primary-2);
  text-decoration: underline;
}

/* Tabs in admin views — clearer active state */
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
  color: var(--mmd-primary) !important;
  border-bottom: 2px solid var(--mmd-primary) !important;
  font-weight: 600;
}

/* --------------------------------------------------------------------- *
 * 12. Standard interface shell — adversarial pass 2026-05-26.
 *     Make the authenticated agent console read as MMD Support, not as a
 *     raw GLPI admin screen. This stays CSS-only and preserves GLPI hooks.
 * --------------------------------------------------------------------- */

body.vertical-layout.central {
  --tblr-body-bg: var(--mmd-paper);
  background:
    linear-gradient(90deg, var(--mmd-ink) 0 239px, transparent 239px),
    var(--mmd-paper) !important;
}

body.vertical-layout.central .page {
  background: var(--mmd-paper) !important;
}

body.vertical-layout.central .page-wrapper {
  background:
    radial-gradient(
      circle at 26px 24px,
      rgba(200, 16, 46, 0.09) 0 0,
      transparent 0
    ),
    var(--mmd-paper) !important;
}

body.vertical-layout.central aside.navbar-vertical.sidebar {
  background: var(--mmd-ink) !important;
  color: var(--mmd-paper) !important;
  border-right: 1px solid var(--mmd-ink) !important;
  box-shadow: none !important;
}

body.vertical-layout.central aside.navbar-vertical.sidebar .navbar-brand,
body.vertical-layout.central aside.navbar-vertical.sidebar .nav-link,
body.vertical-layout.central aside.navbar-vertical.sidebar .dropdown-toggle,
body.vertical-layout.central aside.navbar-vertical.sidebar .btn,
body.vertical-layout.central aside.navbar-vertical.sidebar .menu-label {
  color: rgba(250, 250, 246, 0.88) !important;
}

body.vertical-layout.central aside.navbar-vertical.sidebar .nav-link {
  border-radius: 4px !important;
  margin: 1px 10px !important;
  padding: 9px 12px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

body.vertical-layout.central aside.navbar-vertical.sidebar .nav-link:hover,
body.vertical-layout.central aside.navbar-vertical.sidebar .nav-link:focus,
body.vertical-layout.central aside.navbar-vertical.sidebar .nav-link.active {
  background: rgba(250, 250, 246, 0.08) !important;
  color: var(--mmd-paper) !important;
  text-decoration: none !important;
}

body.vertical-layout.central aside.navbar-vertical.sidebar .nav-link.active {
  background: var(--mmd-paper) !important;
  color: var(--mmd-ink) !important;
}

body.vertical-layout.central aside.navbar-vertical.sidebar .navbar-brand {
  min-height: 74px !important;
  align-items: center !important;
  padding-inline: 20px !important;
}

body.vertical-layout.central header.navbar,
body.vertical-layout.central .page-wrapper > .navbar,
body.vertical-layout.central .page-header {
  background: var(--mmd-paper) !important;
  color: var(--mmd-ink) !important;
  border-bottom: 1px solid var(--mmd-ink) !important;
  box-shadow: none !important;
}

body.vertical-layout.central .page-body {
  background: var(--mmd-paper) !important;
  padding-top: 22px !important;
}

body.vertical-layout.central .page-body > .container-xl,
body.vertical-layout.central .page-body > .container-fluid {
  max-width: 1240px !important;
}

body.vertical-layout.central .navbar .form-control,
body.vertical-layout.central .page-header .form-control {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--mmd-ink) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  min-width: 270px;
}

body.vertical-layout.central .avatar,
body.vertical-layout.central .avatar.bg-secondary,
body.vertical-layout.central .avatar.bg-dark {
  background: var(--mmd-ink-soft) !important;
  color: var(--mmd-paper) !important;
  border-radius: 6px !important;
  font-family: var(--mmd-font-ui) !important;
  font-weight: 700 !important;
}

body.vertical-layout.central [data-mmd-dashcards] {
  grid-template-columns: minmax(260px, 1.05fr) minmax(260px, 1fr) minmax(
      220px,
      0.85fr
    );
  gap: 16px;
  margin: 8px 0 22px !important;
}

body.vertical-layout.central [data-mmd-dashcards] .mmd-card {
  min-height: 104px;
  justify-content: center;
  padding: 20px 24px !important;
  border-radius: 6px !important;
  font-family: var(--mmd-font-ui) !important;
  font-size: 15px !important;
  box-shadow: none !important;
}

body.vertical-layout.central [data-mmd-dashcards] .mmd-card::before {
  content: "";
  width: 24px;
  height: 3px;
  background: currentColor;
  opacity: 0.55;
  margin-bottom: 6px;
}

body.vertical-layout.central [data-mmd-dashcards] .mmd-card.is-primary {
  background: var(--mmd-accent) !important;
  border-color: var(--mmd-accent) !important;
}

body.vertical-layout.central [data-mmd-dashcards] .mmd-card.is-secondary {
  border: 1px solid var(--mmd-ink) !important;
  background: var(--mmd-paper) !important;
}

body.vertical-layout.central [data-mmd-dashcards] .mmd-card.is-tertiary {
  background: var(--mmd-surface-2) !important;
  border: 1px solid var(--mmd-rule) !important;
}

body.vertical-layout.central .tab-content.card,
body.vertical-layout.central .dashboard .card,
body.vertical-layout.central .grid-stack .card {
  background: var(--mmd-paper) !important;
  border: 1px solid var(--mmd-rule) !important;
  border-radius: 6px !important;
}

body.vertical-layout.central .tab-content.card {
  padding: 16px !important;
}

body.vertical-layout.central .nav-tabs,
body.vertical-layout.central .dashboard .nav-tabs {
  border-bottom: 1px solid var(--mmd-rule) !important;
  gap: 2px;
}

body.vertical-layout.central .nav-tabs .nav-link {
  border: 0 !important;
  border-radius: 4px 4px 0 0 !important;
  color: var(--mmd-muted) !important;
  font-size: 13px !important;
  padding: 10px 14px !important;
}

body.vertical-layout.central .nav-tabs .nav-link.active {
  background: var(--mmd-paper) !important;
  color: var(--mmd-ink) !important;
  border-bottom: 2px solid var(--mmd-ink) !important;
}

body.vertical-layout.central .grid-stack-item .card.big-number {
  display: grid !important;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 4px 12px;
  padding: 12px 14px !important;
  background: var(--mmd-surface) !important;
  border: 1px solid var(--mmd-rule) !important;
}

body.vertical-layout.central
  .grid-stack-item
  .card.big-number
  .big-number-value,
body.vertical-layout.central .grid-stack-item .card.big-number .number,
body.vertical-layout.central .grid-stack-item .card.big-number strong,
body.vertical-layout.central .grid-stack-item .card.big-number > :first-child {
  font-family: var(--mmd-font-mono) !important;
  color: var(--mmd-ink) !important;
  font-weight: 700 !important;
}

body.vertical-layout.central .grid-stack-item .card.big-number,
body.vertical-layout.central .grid-stack-item .card.big-number * {
  color: var(--mmd-ink-soft) !important;
}

body.vertical-layout.central .grid-stack-item .g-chart,
body.vertical-layout.central .grid-stack-item .card:not(.big-number) {
  background: var(--mmd-surface) !important;
  border-color: var(--mmd-rule) !important;
}

body.vertical-layout.central .grid-stack-item .card:hover,
body.vertical-layout.central [data-mmd-dashcards] .mmd-card:hover {
  border-color: var(--mmd-ink) !important;
  box-shadow: 0 2px 8px rgba(14, 14, 12, 0.08) !important;
  transform: translateY(-1px);
}

body.vertical-layout.central .grid-stack-item .card .card-title,
body.vertical-layout.central .grid-stack-item .card h2,
body.vertical-layout.central .grid-stack-item .card h3 {
  font-family: var(--mmd-font-ui) !important;
  font-size: 12px !important;
  color: var(--mmd-muted) !important;
  letter-spacing: 0.02em !important;
}

body.vertical-layout.central .grid-stack .grid-stack-item-content {
  inset: 4px !important;
}

body.vertical-layout.central .btn-icon,
body.vertical-layout.central .dashboard .btn,
body.vertical-layout.central .dashboard a[role="button"] {
  border-radius: 4px !important;
}

@media (max-width: 991px) {
  body.vertical-layout.central {
    background: var(--mmd-paper) !important;
  }
  body.vertical-layout.central [data-mmd-dashcards] {
    grid-template-columns: 1fr !important;
  }
}

/* --------------------------------------------------------------------- *
 * 13. Standard interface shell — beige/contrast adversarial pass.
 *     Fixes left submenu white-on-white and extends portal paper surfaces
 *     beyond the dashboard into list/table pages.
 * --------------------------------------------------------------------- */

body.vertical-layout {
  --tblr-body-bg: var(--mmd-bg);
  --tblr-bg-surface: var(--mmd-surface);
  --tblr-border-color: var(--mmd-rule);
  background: var(--mmd-bg) !important;
  color: var(--mmd-ink) !important;
}

body.vertical-layout .page,
body.vertical-layout .page-wrapper,
body.vertical-layout .page-body {
  background: var(--mmd-bg) !important;
  color: var(--mmd-ink) !important;
}

body.vertical-layout header.navbar,
body.vertical-layout .page-wrapper > .navbar,
body.vertical-layout .page-header {
  background: var(--mmd-paper) !important;
  color: var(--mmd-ink) !important;
}

body.vertical-layout aside.navbar-vertical.sidebar {
  background: var(--mmd-ink) !important;
  color: var(--mmd-paper) !important;
}

body.vertical-layout aside.navbar-vertical.sidebar .nav-link,
body.vertical-layout aside.navbar-vertical.sidebar .nav-link-title,
body.vertical-layout aside.navbar-vertical.sidebar .nav-link-icon,
body.vertical-layout aside.navbar-vertical.sidebar .menu-label,
body.vertical-layout aside.navbar-vertical.sidebar > *:not(.dropdown-menu) a {
  color: rgba(250, 250, 246, 0.9) !important;
}

body.vertical-layout aside.navbar-vertical.sidebar .dropdown-menu,
body.vertical-layout aside.navbar-vertical.sidebar .dropdown-menu-column,
body.vertical-layout
  aside.navbar-vertical.sidebar
  .dropdown-menu
  .dropdown-menu,
body.vertical-layout
  aside.navbar-vertical.sidebar
  .nav-item.show
  > .dropdown-menu {
  background: var(--mmd-paper-2) !important;
  color: var(--mmd-ink) !important;
  border: 1px solid var(--mmd-rule-2) !important;
  box-shadow: none !important;
}

body.vertical-layout aside.navbar-vertical.sidebar .dropdown-menu .nav-link,
body.vertical-layout
  aside.navbar-vertical.sidebar
  .dropdown-menu
  .dropdown-item,
body.vertical-layout aside.navbar-vertical.sidebar .dropdown-menu .menu-label,
body.vertical-layout aside.navbar-vertical.sidebar .dropdown-menu a,
body.vertical-layout aside.navbar-vertical.sidebar .dropdown-menu .ti,
body.vertical-layout aside.navbar-vertical.sidebar .dropdown-menu svg {
  color: var(--mmd-ink) !important;
  opacity: 1 !important;
}

body.vertical-layout
  aside.navbar-vertical.sidebar
  .dropdown-menu
  .nav-link:hover,
body.vertical-layout
  aside.navbar-vertical.sidebar
  .dropdown-menu
  .nav-link:focus,
body.vertical-layout
  aside.navbar-vertical.sidebar
  .dropdown-menu
  .dropdown-item:hover,
body.vertical-layout
  aside.navbar-vertical.sidebar
  .dropdown-menu
  .dropdown-item:focus,
body.vertical-layout aside.navbar-vertical.sidebar .dropdown-menu .active,
body.vertical-layout
  aside.navbar-vertical.sidebar
  .dropdown-menu
  .nav-link.active {
  background: #ded8c8 !important;
  color: var(--mmd-ink) !important;
}

body.vertical-layout .card,
body.vertical-layout .search-container,
body.vertical-layout .table-responsive,
body.vertical-layout .list-group,
body.vertical-layout .tab-content {
  background: var(--mmd-paper) !important;
  color: var(--mmd-ink) !important;
  border-color: var(--mmd-rule) !important;
}

body.vertical-layout .table,
body.vertical-layout table {
  --tblr-table-bg: var(--mmd-paper);
  --tblr-table-striped-bg: var(--mmd-surface-2);
  --tblr-table-hover-bg: #ede7d8;
  color: var(--mmd-ink) !important;
}

body.vertical-layout .table thead th,
body.vertical-layout table thead th,
body.vertical-layout .table th {
  background: var(--mmd-paper-2) !important;
  color: var(--mmd-ink) !important;
  border-color: var(--mmd-rule-2) !important;
}

body.vertical-layout .table tbody tr,
body.vertical-layout table tbody tr,
body.vertical-layout .table td,
body.vertical-layout table td {
  color: var(--mmd-ink-2) !important;
  border-color: var(--mmd-rule) !important;
}

body.vertical-layout .table-striped > tbody > tr:nth-of-type(odd) > *,
body.vertical-layout .table tbody tr:nth-child(odd) > td {
  background: var(--mmd-paper) !important;
}

body.vertical-layout .table-striped > tbody > tr:nth-of-type(even) > *,
body.vertical-layout .table tbody tr:nth-child(even) > td {
  background: var(--mmd-surface-2) !important;
}

body.vertical-layout .btn,
body.vertical-layout .form-control,
body.vertical-layout .form-select,
body.vertical-layout
  .dropdown-menu:not(aside.navbar-vertical.sidebar .dropdown-menu) {
  background-color: var(--mmd-paper) !important;
  color: var(--mmd-ink) !important;
  border-color: var(--mmd-rule-2) !important;
}

body.vertical-layout .btn-primary,
body.vertical-layout .mmd-topbar-cta,
body.vertical-layout [data-mmd-topbtn] {
  background-color: var(--mmd-accent) !important;
  border-color: var(--mmd-accent) !important;
  color: #fff !important;
}

body.vertical-layout aside.navbar-vertical.sidebar .btn,
body.vertical-layout aside.navbar-vertical.sidebar .btn-ghost-secondary,
body.vertical-layout aside.navbar-vertical.sidebar .trigger-fuzzy,
body.vertical-layout aside.navbar-vertical.sidebar .reduce-menu {
  background: transparent !important;
  border-color: transparent !important;
  color: rgba(250, 250, 246, 0.9) !important;
}

body.vertical-layout aside.navbar-vertical.sidebar .btn:hover,
body.vertical-layout aside.navbar-vertical.sidebar .btn:focus,
body.vertical-layout aside.navbar-vertical.sidebar .btn-ghost-secondary:hover,
body.vertical-layout aside.navbar-vertical.sidebar .btn-ghost-secondary:focus {
  background: rgba(250, 250, 246, 0.1) !important;
  color: var(--mmd-paper) !important;
}

body.vertical-layout
  aside.navbar-vertical.sidebar
  > .navbar-nav
  .nav-link.active,
body.vertical-layout aside.navbar-vertical.sidebar > .navbar-nav .nav-link.show,
body.vertical-layout
  aside.navbar-vertical.sidebar
  > .navbar-nav
  .nav-link[aria-expanded="true"] {
  background: var(--mmd-paper-2) !important;
  color: var(--mmd-ink) !important;
}

body.vertical-layout
  aside.navbar-vertical.sidebar
  > .navbar-nav
  .nav-link.active
  *,
body.vertical-layout
  aside.navbar-vertical.sidebar
  > .navbar-nav
  .nav-link.show
  *,
body.vertical-layout
  aside.navbar-vertical.sidebar
  > .navbar-nav
  .nav-link[aria-expanded="true"]
  * {
  color: var(--mmd-ink) !important;
}

body.vertical-layout
  aside.navbar-vertical.sidebar
  .nav-link.active
  > .menu-label,
body.vertical-layout aside.navbar-vertical.sidebar .nav-link.show > .menu-label,
body.vertical-layout
  aside.navbar-vertical.sidebar
  .nav-link[aria-expanded="true"]
  > .menu-label,
body.vertical-layout aside.navbar-vertical.sidebar .nav-link.active > .ti,
body.vertical-layout aside.navbar-vertical.sidebar .nav-link.show > .ti,
body.vertical-layout
  aside.navbar-vertical.sidebar
  .nav-link[aria-expanded="true"]
  > .ti,
body.vertical-layout aside.navbar-vertical.sidebar .nav-link.active > svg,
body.vertical-layout aside.navbar-vertical.sidebar .nav-link.show > svg,
body.vertical-layout
  aside.navbar-vertical.sidebar
  .nav-link[aria-expanded="true"]
  > svg {
  color: var(--mmd-ink) !important;
}

body.vertical-layout .nav-tabs .nav-link:not(.active),
body.vertical-layout .nav-pills .nav-link:not(.active) {
  color: #4f4c45 !important;
  background: #e9e4d7 !important;
}

body.vertical-layout .toast-header.bg-info,
body.vertical-layout .toast-header.text-white,
body.vertical-layout .toast.bg-info,
body.vertical-layout .alert-info {
  background: var(--mmd-ink) !important;
  border-color: var(--mmd-ink) !important;
  color: var(--mmd-paper) !important;
}

body.vertical-layout .toast-header.bg-info *,
body.vertical-layout .toast-header.text-white *,
body.vertical-layout .toast.bg-info *,
body.vertical-layout .alert-info * {
  color: var(--mmd-paper) !important;
}

body.vertical-layout aside.navbar-vertical.sidebar .nav-link.active,
body.vertical-layout aside.navbar-vertical.sidebar .nav-link.show,
body.vertical-layout
  aside.navbar-vertical.sidebar
  .nav-link[aria-expanded="true"] {
  background: var(--mmd-paper-2) !important;
  color: var(--mmd-ink) !important;
}

body.vertical-layout aside.navbar-vertical.sidebar .nav-link.active *,
body.vertical-layout aside.navbar-vertical.sidebar .nav-link.show *,
body.vertical-layout
  aside.navbar-vertical.sidebar
  .nav-link[aria-expanded="true"]
  * {
  color: var(--mmd-ink) !important;
}

body.vertical-layout .pagination .page-item.disabled,
body.vertical-layout .pagination .page-item.disabled .page-link,
body.vertical-layout .pagination .page-item.disabled span,
body.vertical-layout .pagination .page-link.disabled {
  color: var(--mmd-muted) !important;
  background: transparent !important;
  border-color: transparent !important;
}

body.vertical-layout li.page-item.disabled,
body.vertical-layout li.page-item.disabled *,
body.vertical-layout .page-item.disabled,
body.vertical-layout .page-item.disabled * {
  color: var(--mmd-muted) !important;
}

#page body.vertical-layout li.page-item.disabled,
#page body.vertical-layout li.page-item.disabled *,
#page body.vertical-layout .page-item.disabled,
#page body.vertical-layout .page-item.disabled *,
#page .pagination .disabled:not(.list-group-item),
#page .pagination .disabled:not(.list-group-item) * {
  color: var(--mmd-muted) !important;
}

body.vertical-layout .mmd-topbar-cta,
body.vertical-layout [data-mmd-topbtn] {
  min-width: 118px !important;
  max-width: none !important;
  white-space: nowrap !important;
  line-height: 1.1 !important;
}

body.vertical-layout .mmd-topbar-cta *,
body.vertical-layout [data-mmd-topbtn] * {
  white-space: nowrap !important;
}

body.vertical-layout .card-header:not(.search-header),
body.vertical-layout .card-header:not(.search-header) h1,
body.vertical-layout .card-header:not(.search-header) h2,
body.vertical-layout .card-header:not(.search-header) h3,
body.vertical-layout .card-header:not(.search-header) h4,
body.vertical-layout .card-subtitle,
body.vertical-layout .planning h3,
body.vertical-layout #planning_filter h3,
body.vertical-layout .planning_filter h3 {
  background: var(--mmd-paper-2) !important;
  color: var(--mmd-ink) !important;
  border-color: var(--mmd-rule-2) !important;
}

body.vertical-layout .card-header:not(.search-header) {
  border-bottom: 1px solid var(--mmd-rule-2) !important;
}

body.vertical-layout .badge_block {
  background: var(--mmd-paper) !important;
  border: 1px solid var(--mmd-ink) !important;
  color: var(--mmd-ink) !important;
  min-width: 82px !important;
  padding: 1px 6px !important;
}

body.vertical-layout .badge_block span[style*="background"] {
  background: var(--mmd-muted) !important;
}

body.vertical-layout .fc-button,
body.vertical-layout .fc .fc-button,
body.vertical-layout .fc-button-primary,
body.vertical-layout .fc-toolbar .btn,
body.vertical-layout .planning-controls .btn {
  background: var(--mmd-ink-soft) !important;
  border-color: var(--mmd-ink-soft) !important;
  color: var(--mmd-paper) !important;
}

body.vertical-layout .fc-button-active,
body.vertical-layout .fc .fc-button-primary:not(:disabled).fc-button-active,
body.vertical-layout .fc .fc-button-primary:not(:disabled):active {
  background: var(--mmd-ink) !important;
  border-color: var(--mmd-ink) !important;
  color: var(--mmd-paper) !important;
}

body.vertical-layout .alert-danger,
body.vertical-layout .alert-important.alert-danger,
body.vertical-layout .alert.alert-danger {
  background: #d63939 !important;
  border-color: #d63939 !important;
  color: #fff !important;
}

body.vertical-layout .alert-danger *,
body.vertical-layout .alert-danger a,
body.vertical-layout .alert-important.alert-danger *,
body.vertical-layout .alert-important.alert-danger a {
  color: #fff !important;
}

body.vertical-layout .alert-danger a,
body.vertical-layout .alert-important.alert-danger a {
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

body.vertical-layout aside.navbar-vertical.sidebar a[href$="/front/plugin.php"],
body.vertical-layout
  aside.navbar-vertical.sidebar
  a[href*="/front/plugin.php?"] {
  display: none !important;
}

body.vertical-layout #planning_filter span[style*="background"],
body.vertical-layout .planning_filter span[style*="background"],
body.vertical-layout .planning span[style*="background"] {
  background: var(--mmd-paper-2) !important;
  border: 1px solid var(--mmd-muted) !important;
}

body.vertical-layout .fc-day-today,
body.vertical-layout .fc .fc-day-today,
body.vertical-layout .fc-timegrid-col.fc-day-today {
  background: #ebe6d9 !important;
}

body.vertical-layout .fc .fc-col-header-cell,
body.vertical-layout .fc .fc-scrollgrid-section-header th,
body.vertical-layout .fc .fc-timegrid-axis,
body.vertical-layout .fc .fc-timegrid-slot-label {
  background: var(--mmd-paper-2) !important;
  color: var(--mmd-ink) !important;
}

body.vertical-layout .badge.user-select-auto,
body.vertical-layout span.badge.user-select-auto.text-wrap,
body.vertical-layout .itil-timeline .badge.user-select-auto {
  background: var(--mmd-paper-2) !important;
  color: var(--mmd-ink) !important;
  border: 1px solid var(--mmd-rule-2) !important;
}

body.vertical-layout .badge.user-select-auto *,
body.vertical-layout span.badge.user-select-auto.text-wrap *,
body.vertical-layout .itil-timeline .badge.user-select-auto * {
  color: var(--mmd-ink) !important;
}

body.vertical-layout .badge.bg-secondary,
body.vertical-layout .badge.text-secondary-fg,
body.vertical-layout span.badge.bg-secondary.text-secondary-fg {
  background: var(--mmd-ink-soft) !important;
  color: var(--mmd-paper) !important;
  border: 1px solid var(--mmd-ink-soft) !important;
}

body.vertical-layout .select2-selection__choice,
body.vertical-layout .select2-selection__choice *,
body.vertical-layout .select2-selection__choice__display,
body.vertical-layout .select2-selection__choice__remove,
body.vertical-layout .select2-selection__choice .actor_text {
  background: var(--mmd-paper-2) !important;
  color: var(--mmd-ink) !important;
  border-color: var(--mmd-rule-2) !important;
}

body.vertical-layout .select2-selection__choice {
  border: 1px solid var(--mmd-rule-2) !important;
}

.mmd-service-catalog .page-body {
  background:
    linear-gradient(180deg, var(--mmd-paper) 0 112px, var(--mmd-paper-2) 112px),
    var(--mmd-paper-2) !important;
}

.mmd-service-catalog main#page .page-body .container-xl,
.mmd-service-catalog main#page .page-body .container-fluid {
  background: transparent !important;
}

[data-mmd-catalog-guide] {
  display: grid;
  gap: 12px;
  margin: 14px 0 22px;
  padding: 14px;
  background: #ede7d8;
  border: 1px solid #d6cfbd;
  border-radius: 6px;
}

[data-mmd-catalog-guide] .mmd-catalog-guide-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
}

[data-mmd-catalog-guide] strong {
  display: block;
  color: var(--mmd-ink);
  font-family: var(--mmd-font-display);
  font-size: 1rem;
  line-height: 1.2;
}

[data-mmd-catalog-guide] span {
  display: block;
  max-width: 760px;
  color: var(--mmd-ink-2);
  font-size: 0.875rem;
  line-height: 1.45;
  margin-top: 2px;
}

[data-mmd-catalog-guide] .mmd-catalog-guide-link,
[data-mmd-catalog-guide] .mmd-catalog-guide-link:hover {
  color: var(--mmd-ink) !important;
  font-size: 0.8125rem;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
  white-space: nowrap;
}

[data-mmd-catalog-guide] .mmd-catalog-guide-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 8px;
}

[data-mmd-catalog-guide] .mmd-catalog-guide-grid a {
  display: flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  padding: 8px 10px;
  background: var(--mmd-paper);
  color: var(--mmd-ink) !important;
  border: 1px solid #c9c1af;
  border-radius: 4px;
  font-weight: 700;
  font-size: 0.875rem;
  text-align: center;
  text-decoration: none !important;
}

[data-mmd-catalog-guide] .mmd-catalog-guide-grid a:hover,
[data-mmd-catalog-guide] .mmd-catalog-guide-grid a:focus {
  background: var(--mmd-ink) !important;
  color: var(--mmd-paper) !important;
  border-color: var(--mmd-ink) !important;
}

.mmd-service-catalog .mmd-topbar-cta,
.mmd-service-catalog [data-mmd-topbtn] {
  background: var(--mmd-paper-2) !important;
  color: var(--mmd-ink) !important;
  border-color: var(--mmd-rule-2) !important;
}

.mmd-service-catalog .mmd-topbar-cta svg path,
.mmd-service-catalog [data-mmd-topbtn] svg path {
  stroke: var(--mmd-ink) !important;
}

.mmd-service-catalog .mmd-topbar-cta:hover,
.mmd-service-catalog [data-mmd-topbtn]:hover {
  background: #ded8c8 !important;
  color: var(--mmd-ink) !important;
}

.mmd-service-catalog .mmd-catalog-category-item.card,
.mmd-service-catalog a.mmd-catalog-category-item {
  background: var(--mmd-paper) !important;
  border-color: #d8d1c2 !important;
}

.mmd-service-catalog .mmd-catalog-category-item.card:hover,
.mmd-service-catalog a.mmd-catalog-category-item:hover {
  background: #fffef8 !important;
  border-color: var(--mmd-ink) !important;
}

.mmd-service-catalog .mmd-catalog-kb-item {
  background: #f1eddf !important;
  border: 1px dashed #c7bfad !important;
}

.mmd-service-catalog .mmd-catalog-kb-card::before {
  content: none !important;
  display: none !important;
}

.mmd-service-catalog .mmd-catalog-kb-item .card-title,
.mmd-service-catalog .mmd-catalog-kb-item h2,
.mmd-service-catalog .mmd-catalog-kb-item h3 {
  font-family: var(--mmd-font-ui) !important;
  font-size: 0.9375rem !important;
}

.mmd-service-catalog .mmd-catalog-kb-item ol,
.mmd-service-catalog .mmd-catalog-kb-item ul,
.mmd-service-catalog .mmd-catalog-kb-item p {
  -webkit-line-clamp: 3 !important;
}

.mmd-service-catalog .pagination .page-link {
  background: var(--mmd-paper) !important;
  color: var(--mmd-ink) !important;
  border-color: var(--mmd-rule-2) !important;
}

@media (max-width: 920px) {
  [data-mmd-catalog-guide] .mmd-catalog-guide-grid {
    grid-template-columns: repeat(2, minmax(140px, 1fr));
  }
}

@media (max-width: 620px) {
  [data-mmd-catalog-guide] .mmd-catalog-guide-head {
    display: block;
  }

  [data-mmd-catalog-guide] .mmd-catalog-guide-link {
    display: inline-block;
    margin-top: 8px;
  }

  [data-mmd-catalog-guide] .mmd-catalog-guide-grid {
    grid-template-columns: 1fr;
  }
}

.text-muted-menu,
.user-info .text-muted-menu,
header .text-muted-menu,
.navbar .text-muted-menu {
  color: var(--mmd-muted) !important;
  opacity: 1 !important;
}

/* Self-Service shell: align the public Helpdesk hero with the beige MMD portal
   surfaces instead of GLPI's cool blue wash. */
body.helpdesk,
body.helpdesk .page,
body.helpdesk .page-wrapper,
body.helpdesk .page-body,
body.horizontal-layout.helpdesk,
body.horizontal-layout.helpdesk .page,
body.horizontal-layout.helpdesk .page-wrapper,
body.horizontal-layout.helpdesk .page-body {
  background: var(--mmd-bg) !important;
  color: var(--mmd-ink) !important;
}

body.helpdesk .search-banner,
body.horizontal-layout.helpdesk .search-banner {
  background: var(--mmd-paper) !important;
  color: var(--mmd-ink) !important;
  border-bottom: 1px solid var(--mmd-ink) !important;
}

body.helpdesk .search-banner .form-control,
body.horizontal-layout.helpdesk .search-banner .form-control {
  background: var(--mmd-surface) !important;
  color: var(--mmd-ink) !important;
  border-color: var(--mmd-rule-2) !important;
}

body.helpdesk .search-banner .form-control::placeholder,
body.horizontal-layout.helpdesk .search-banner .form-control::placeholder {
  color: var(--mmd-muted) !important;
}

/* Final catalog overrides live at the end so they win over generic button
   and primary CTA rules loaded earlier in the bridge. */
body.mmd-service-catalog a.mmd-topbar-cta,
body.mmd-service-catalog a[data-mmd-topbtn],
body.mmd-service-catalog .navbar a.mmd-topbar-cta,
body.mmd-service-catalog header.navbar a.mmd-topbar-cta {
  background: var(--mmd-paper-2) !important;
  background-color: var(--mmd-paper-2) !important;
  color: var(--mmd-ink) !important;
  border: 1px solid var(--mmd-rule-2) !important;
  border-color: var(--mmd-rule-2) !important;
  box-shadow: none !important;
}

body.mmd-service-catalog a.mmd-topbar-cta svg path,
body.mmd-service-catalog a[data-mmd-topbtn] svg path {
  stroke: var(--mmd-ink) !important;
}

body.mmd-service-catalog a.mmd-topbar-cta:hover,
body.mmd-service-catalog a[data-mmd-topbtn]:hover {
  background: #ded8c8 !important;
  background-color: #ded8c8 !important;
  color: var(--mmd-ink) !important;
}

body.mmd-service-catalog [data-mmd-catalog-guide] {
  background: #e8e1d2 !important;
  border-color: #c9c1af !important;
}

body.mmd-service-catalog [data-mmd-catalog-guide] .mmd-catalog-guide-grid a {
  justify-content: space-between;
  background: #fafaf6 !important;
  color: var(--mmd-ink) !important;
  border-color: #c9c1af !important;
  box-shadow: inset 4px 0 0 var(--mmd-ink);
}

body.mmd-service-catalog [data-mmd-catalog-guide] .mmd-catalog-guide-grid a:hover,
body.mmd-service-catalog [data-mmd-catalog-guide] .mmd-catalog-guide-grid a:focus,
body.mmd-service-catalog [data-mmd-catalog-guide] .mmd-catalog-guide-grid a:focus-visible {
  background: #2f3b4d !important;
  color: #ffffff !important;
  border-color: #2f3b4d !important;
  box-shadow:
    inset 4px 0 0 #101820,
    0 0 0 3px rgba(47, 59, 77, 0.18) !important;
  text-decoration: none !important;
}

body.mmd-service-catalog [data-mmd-catalog-guide] .mmd-catalog-guide-grid a:hover *,
body.mmd-service-catalog [data-mmd-catalog-guide] .mmd-catalog-guide-grid a:focus *,
body.mmd-service-catalog [data-mmd-catalog-guide] .mmd-catalog-guide-grid a:focus-visible * {
  color: #ffffff !important;
}

body.mmd-service-catalog
  [data-mmd-catalog-guide]
  .mmd-catalog-guide-grid
  a::after {
  content: "›";
  font-size: 1.1rem;
  line-height: 1;
}

body .text-danger,
body a.text-danger,
body .text-danger * {
  color: var(--mmd-danger) !important;
}

html[data-glpi-theme="mmd"] body .text-danger,
html[data-glpi-theme="mmd"] body a.text-danger,
html[data-glpi-theme="mmd"] body .text-danger * {
  color: var(--mmd-danger) !important;
}

html[data-glpi-theme="mmd"] body .bg-primary {
  background-color: var(--mmd-primary) !important;
  color: #ffffff !important;
}
