/**
 * Sultan widget styles.
 *
 * Logical properties throughout (inline-start / inline-end) so a single
 * stylesheet serves both LTR and RTL - the panel flips with `dir` rather than
 * needing an RTL override sheet.
 *
 * The launcher sits at --sultan-offset from the bottom, defaulting to 96px, so
 * it clears the consent banner and its revisit tab, which live in the same
 * corner.
 */

.innovant-sultan {
  --sultan-navy: #0b2a4a;
  --sultan-navy-soft: #14395f;
  --sultan-accent: #c8952f;
  --sultan-ink: #17242f;
  --sultan-muted: #5a6b7c;
  --sultan-line: #dde4ec;
  --sultan-bg: #ffffff;
  --sultan-wash: #f5f8fb;
  --sultan-offset: 96px;

  position: fixed;
  inset-block-end: var(--sultan-offset);
  z-index: 99000; /* below a consent banner, above page content */
  font-family: inherit;
  font-size: 13.5px;
  line-height: 1.55;
}

.innovant-sultan--bottom-start { inset-inline-start: 20px; }
.innovant-sultan--bottom-end   { inset-inline-end: 20px; }

/* The script opens and closes the panel by toggling the `hidden` attribute.
   The panel also declares `display: flex`, and an author display rule beats
   the browser's built-in [hidden] rule - so without this the attribute does
   nothing and the panel is on screen from page load. */
.innovant-sultan [hidden] { display: none !important; }

/* The field's label is for screen readers. Themes usually define this class,
   but the widget must not depend on the theme for it. */
.innovant-sultan .screen-reader-text {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ------------------------------------------------------------- launcher --- */

.innovant-sultan__launcher {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 4px;
  padding-inline-end: 17px;
  border: 0;
  border-radius: 999px;
  background: var(--sultan-navy);
  color: #fff;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(11, 42, 74, 0.3);
  transition: transform 0.18s ease, background 0.18s ease;
}

.innovant-sultan__launcher:hover { background: var(--sultan-navy-soft); transform: translateY(-1px); }
.innovant-sultan__launcher:focus-visible { outline: 3px solid var(--sultan-accent); outline-offset: 3px; }
.innovant-sultan[data-state="open"] .innovant-sultan__launcher { display: none; }

/* ------------------------------------------------------------ invitation -- */

/* A speech bubble above the button, worded from the page. Shown by the
   script a few seconds in; a tap opens the panel, the cross dismisses it. */
.innovant-sultan__nudge {
  position: absolute;
  inset-block-end: calc(100% + 12px);
  inset-inline-start: 0;
  inline-size: max-content;
  max-inline-size: min(300px, calc(100vw - 40px));
  display: flex;
  align-items: flex-start;
  gap: 6px;
  padding: 10px 10px 10px 13px;
  background: var(--sultan-bg);
  border: 1px solid var(--sultan-line);
  border-radius: 14px;
  box-shadow: 0 12px 32px rgba(11, 42, 74, 0.22);
  animation: innovant-sultan-nudge 0.32s ease-out;
}

.innovant-sultan__nudge::after {
  content: "";
  position: absolute;
  inset-block-end: -7px;
  inset-inline-start: 26px;
  inline-size: 12px;
  block-size: 12px;
  background: var(--sultan-bg);
  border-inline-end: 1px solid var(--sultan-line);
  border-block-end: 1px solid var(--sultan-line);
  transform: rotate(45deg);
}

.innovant-sultan__nudge-text {
  flex: 1;
  margin: 0;
  padding: 2px 0;
  border: 0;
  background: none;
  font: inherit;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.5;
  color: var(--sultan-navy);
  text-align: start;
  cursor: pointer;
}

.innovant-sultan__nudge-text:hover { text-decoration: underline; }
.innovant-sultan__nudge-text:focus-visible { outline: 2px solid var(--sultan-accent); outline-offset: 2px; border-radius: 6px; }

.innovant-sultan__nudge-close {
  flex: none;
  inline-size: 24px;
  block-size: 24px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--sultan-wash);
  color: var(--sultan-muted);
  font: inherit;
  font-size: 17px;
  line-height: 1;
  cursor: pointer;
}

.innovant-sultan__nudge-close:hover { background: var(--sultan-line); color: var(--sultan-ink); }
.innovant-sultan__nudge-close:focus-visible { outline: 2px solid var(--sultan-accent); outline-offset: 2px; }

@keyframes innovant-sultan-nudge {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .innovant-sultan__nudge { animation: none; }
}

/* The face: a portrait when one is configured, a drawn mark otherwise. */
.innovant-sultan__face {
  display: grid;
  place-items: center;
  flex: none;
  inline-size: 46px;
  block-size: 46px;
  border-radius: 50%;
  overflow: hidden;
  background: #fff;
  color: var(--sultan-navy);
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.28);
}

.innovant-sultan__face img {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}

/* The face changes with the conversation; a short pop marks the change. */
.innovant-sultan__face img.is-changing { animation: innovant-sultan-mood 0.34s ease-out; }

@keyframes innovant-sultan-mood {
  0% { transform: scale(0.78); opacity: 0.35; }
  100% { transform: scale(1); opacity: 1; }
}

/* ---------------------------------------------------------------- panel --- */

.innovant-sultan__panel {
  display: flex;
  flex-direction: column;
  inline-size: min(352px, calc(100vw - 32px));
  /* Height follows the conversation and never exceeds the room available.
     dvh tracks mobile browser chrome as it collapses. */
  max-block-size: calc(100dvh - var(--sultan-offset) - var(--sultan-top-clear, 24px));
  background: var(--sultan-bg);
  border: 1px solid var(--sultan-line);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 18px 48px rgba(11, 42, 74, 0.24);
}

.innovant-sultan__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  background: var(--sultan-navy);
  color: #fff;
}

.innovant-sultan__identity { display: flex; align-items: center; gap: 9px; min-inline-size: 0; }
.innovant-sultan__head .innovant-sultan__face { inline-size: 46px; block-size: 46px; }

.innovant-sultan__name { margin: 0; font-size: 14px; font-weight: 700; line-height: 1.25; color: #fff; }

.innovant-sultan__role {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  font-size: 11px;
  line-height: 1.3;
  color: rgba(255, 255, 255, 0.8);
}

/* "available" dot */
.innovant-sultan__role::before {
  content: "";
  flex: none;
  inline-size: 6px;
  block-size: 6px;
  border-radius: 50%;
  background: #4ade80;
}

.innovant-sultan__head-actions { display: flex; align-items: center; gap: 5px; flex: none; }

.innovant-sultan__reset,
.innovant-sultan__close {
  display: grid;
  place-items: center;
  inline-size: 30px;
  block-size: 30px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  cursor: pointer;
}

.innovant-sultan__reset:hover,
.innovant-sultan__close:hover { background: rgba(255, 255, 255, 0.26); }
.innovant-sultan__reset:focus-visible,
.innovant-sultan__close:focus-visible { outline: 2px solid var(--sultan-accent); outline-offset: 2px; }

.innovant-sultan__disclosure {
  margin: 0;
  padding: 7px 12px;
  background: var(--sultan-wash);
  border-block-end: 1px solid var(--sultan-line);
  font-size: 10.5px;
  line-height: 1.45;
  color: var(--sultan-muted);
}

/* ------------------------------------------------- the visitor's details --- */

/* While the details are asked for, the conversation itself is not on screen. */
.innovant-sultan[data-lead="ask"] .innovant-sultan__log,
.innovant-sultan[data-lead="ask"] .innovant-sultan__quick,
.innovant-sultan[data-lead="ask"] .innovant-sultan__form { display: none; }

.innovant-sultan__lead {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  background: #fbfcfe;
  flex: 0 1 auto;
  min-block-size: 0;
  overflow: hidden;
}

/* The fields scroll when the panel is short (a consent notice can leave it
   half its height); the buttons below them never leave the screen. */
.innovant-sultan__lead-fields {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 14px 14px 10px;
  min-block-size: 0;
  overflow-y: auto;
  scrollbar-width: thin;
}

.innovant-sultan__lead-title {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--sultan-navy);
}

.innovant-sultan__lead-sub {
  margin: -5px 0 2px;
  font-size: 12px;
  line-height: 1.55;
  color: var(--sultan-muted);
}

.innovant-sultan__field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  color: var(--sultan-ink);
}

/* Spelled out in full: the theme styles every input on the site. */
.innovant-sultan .innovant-sultan__field input {
  box-sizing: border-box;
  inline-size: 100%;
  block-size: auto;
  min-block-size: 0;
  margin: 0;
  border: 1px solid var(--sultan-line);
  border-radius: 10px;
  padding: 8px 11px;
  font: inherit;
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.45;
  color: var(--sultan-ink);
  background: #fff;
  box-shadow: none;
}

.innovant-sultan .innovant-sultan__field input:focus-visible { outline: 2px solid var(--sultan-navy); outline-offset: 1px; }
.innovant-sultan .innovant-sultan__field input[aria-invalid="true"] { border-color: #c0392b; }
/* an address and a number are written left to right in either language */
.innovant-sultan .innovant-sultan__field input[dir="ltr"] { text-align: left; }

.innovant-sultan__consent {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 2px 0 0;
  font-size: 11.5px;
  font-weight: 400;
  line-height: 1.55;
  color: var(--sultan-muted);
  cursor: pointer;
}

.innovant-sultan .innovant-sultan__consent input {
  flex: none;
  inline-size: 15px;
  block-size: 15px;
  margin: 2px 0 0;
  accent-color: var(--sultan-navy);
}

.innovant-sultan .innovant-sultan__consent input[aria-invalid="true"] { outline: 2px solid #c0392b; outline-offset: 1px; }
.innovant-sultan__consent a { color: var(--sultan-navy); text-decoration: underline; white-space: nowrap; }

.innovant-sultan__lead-error { margin: 0; font-size: 12px; line-height: 1.5; color: #a8261c; }

.innovant-sultan__lead-submit {
  margin-block-start: 2px;
  border: 0;
  border-radius: 11px;
  padding: 10px 14px;
  background: var(--sultan-navy);
  color: #fff;
  font: inherit;
  font-size: 13.5px;
  font-weight: 700;
  cursor: pointer;
}

.innovant-sultan__lead-submit:hover { background: var(--sultan-navy-soft); }
.innovant-sultan__lead-submit:focus-visible { outline: 3px solid var(--sultan-accent); outline-offset: 2px; }
.innovant-sultan__lead-submit[disabled] { opacity: 0.65; cursor: default; }

.innovant-sultan__lead-actions {
  flex: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 6px 14px 12px;
  background: #fbfcfe;
}

/* Mode "after": the same form as a card inside the conversation. */
.innovant-sultan__lead--inline {
  flex: none;
  margin: 10px 0 2px;
  padding: 12px 12px 10px;
  border: 1px solid var(--sultan-line);
  border-radius: 14px;
  background: #fbfcfe;
  overflow: visible;
}

.innovant-sultan__lead--inline .innovant-sultan__lead-fields { padding: 0; overflow: visible; }
.innovant-sultan__lead--inline .innovant-sultan__lead-actions { padding: 8px 0 0; }

.innovant-sultan__lead-skip {
  align-self: center;
  border: 0;
  padding: 2px;
  background: none;
  color: var(--sultan-muted);
  font: inherit;
  font-size: 12px;
  text-decoration: underline;
  cursor: pointer;
}

/* ------------------------------------------------------------------ log --- */

.innovant-sultan__log {
  /* positioned, so a message's offsetTop is measured from the log itself and
     "scroll to the start of the answer" lands on the answer */
  position: relative;
  flex: 0 1 auto;
  min-block-size: 84px;
  max-block-size: 50vh;
  overflow-y: auto;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: #fbfcfe;
  scrollbar-width: thin;
}

.innovant-sultan__msg { display: flex; flex-direction: column; max-inline-size: 92%; }
.innovant-sultan__msg--user { align-self: flex-end; align-items: flex-end; max-inline-size: 84%; }
.innovant-sultan__msg--bot,
.innovant-sultan__msg--system { align-self: flex-start; }

.innovant-sultan__bubble {
  padding: 9px 12px;
  border-radius: 14px;
  font-size: 13.5px;
  overflow-wrap: anywhere;
}

.innovant-sultan__msg--user .innovant-sultan__bubble {
  background: var(--sultan-navy);
  color: #fff;
  border-end-end-radius: 4px;
  white-space: pre-wrap;
}

.innovant-sultan__msg--bot .innovant-sultan__bubble {
  background: #fff;
  border: 1px solid var(--sultan-line);
  color: var(--sultan-ink);
  border-end-start-radius: 4px;
}

.innovant-sultan__msg--system .innovant-sultan__bubble {
  background: #fff6e6;
  border: 1px solid #f0dcb4;
  color: #6b5220;
  font-size: 12.5px;
}

/* Rich replies: paragraphs and lists inside a bot bubble. */
.innovant-sultan__bubble p { margin: 0 0 7px; }
.innovant-sultan__bubble p:last-child { margin-block-end: 0; }

.innovant-sultan__bubble ul,
.innovant-sultan__bubble ol {
  margin: 0 0 7px;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 6px;
}

.innovant-sultan__bubble ul:last-child,
.innovant-sultan__bubble ol:last-child { margin-block-end: 0; }

.innovant-sultan__bubble li {
  position: relative;
  padding-inline-start: 14px;
}

.innovant-sultan__bubble ul > li::before {
  content: "";
  position: absolute;
  inset-inline-start: 2px;
  inset-block-start: 0.62em;
  inline-size: 5px;
  block-size: 5px;
  border-radius: 50%;
  background: var(--sultan-accent);
}

.innovant-sultan__bubble ol { counter-reset: sultan-step; }
.innovant-sultan__bubble ol > li { counter-increment: sultan-step; padding-inline-start: 20px; }

.innovant-sultan__bubble ol > li::before {
  content: counter(sultan-step) ".";
  position: absolute;
  inset-inline-start: 0;
  font-weight: 700;
  color: var(--sultan-accent);
}

.innovant-sultan__bubble strong { font-weight: 700; color: var(--sultan-navy); }
.innovant-sultan__bubble a { color: #1c5fa8; }

/* ------------------------------------------------------------ citations --- */

.innovant-sultan__cites { margin-block-start: 7px; font-size: 11.5px; }

.innovant-sultan__cites-label {
  margin: 0 0 3px;
  color: var(--sultan-muted);
  font-weight: 700;
  font-size: 10.5px;
  letter-spacing: 0.04em;
}

.innovant-sultan__cites ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; }

.innovant-sultan__cites a {
  color: #1c5fa8;
  text-decoration: none;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.innovant-sultan__cites a:hover { text-decoration: underline; }

.innovant-sultan__fb { margin-block-start: 7px; display: flex; align-items: center; gap: 6px; font-size: 11.5px; }
.innovant-sultan__fb-label { color: var(--sultan-muted); }

.innovant-sultan__fb-btn {
  border: 1px solid var(--sultan-line);
  background: #fff;
  border-radius: 999px;
  padding: 2px 10px;
  font: inherit;
  font-size: 11.5px;
  color: var(--sultan-ink);
  cursor: pointer;
}

.innovant-sultan__fb-btn:hover { border-color: var(--sultan-navy); }

/* --------------------------------------------------------------- typing --- */

.innovant-sultan__typing { display: flex; align-items: flex-end; gap: 7px; align-self: flex-start; }

.innovant-sultan__typing-face,
.innovant-sultan__fb-face {
  flex: none;
  border-radius: 50%;
  object-fit: cover;
  background: #fff;
  border: 1px solid var(--sultan-line);
}

.innovant-sultan__typing-face { inline-size: 34px; block-size: 34px; }
.innovant-sultan__fb-face { inline-size: 24px; block-size: 24px; }

.innovant-sultan__typing-bubble {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 9px 12px;
  border: 1px solid var(--sultan-line);
  border-radius: 14px;
  border-end-start-radius: 4px;
  background: #fff;
  color: var(--sultan-muted);
  font-size: 12.5px;
}

.innovant-sultan__dots { display: inline-flex; align-items: center; gap: 4px; }

.innovant-sultan__dot {
  inline-size: 6px;
  block-size: 6px;
  border-radius: 50%;
  background: var(--sultan-accent);
  animation: innovant-sultan-typing 1.2s infinite ease-in-out;
}

.innovant-sultan__dot:nth-child(2) { animation-delay: 0.16s; }
.innovant-sultan__dot:nth-child(3) { animation-delay: 0.32s; }

/* A small lift and fade, eased smoothly: no overshoot, no elastic return. */
@keyframes innovant-sultan-typing {
  0%, 60%, 100% { transform: translateY(0); opacity: 0.35; }
  30% { transform: translateY(-4px); opacity: 1; }
}

/* ------------------------------------------------------- quick + compose --- */

.innovant-sultan__quick {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  padding: 9px 12px 0;
  background: #fff;
}

/* Suggestions are for the first question only. */
.innovant-sultan[data-asked] .innovant-sultan__quick { display: none; }

.innovant-sultan__chip {
  border: 1px solid var(--sultan-line);
  background: #fff;
  border-radius: 999px;
  padding: 5px 11px;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
  color: var(--sultan-ink);
}

.innovant-sultan__chip:hover { border-color: var(--sultan-navy); background: var(--sultan-wash); }

.innovant-sultan__form {
  display: flex;
  align-items: flex-end;
  gap: 7px;
  padding: 10px 12px;
  border-block-start: 1px solid var(--sultan-line);
  background: #fff;
}

.innovant-sultan[data-asked] .innovant-sultan__form { border-block-start: 1px solid var(--sultan-line); }
.innovant-sultan:not([data-asked]) .innovant-sultan__form { border-block-start: 0; }

.innovant-sultan__input {
  flex: 1;
  min-inline-size: 0;
  resize: none;
  overflow-y: hidden;
  border: 1px solid var(--sultan-line);
  border-radius: 12px;
  padding: 8px 11px;
  font: inherit;
  font-size: 13.5px;
  line-height: 1.45;
  max-block-size: 110px;
  color: var(--sultan-ink);
  background: #fff;
  scrollbar-width: thin;
}

.innovant-sultan__input:focus-visible { outline: 2px solid var(--sultan-navy); outline-offset: 1px; }

.innovant-sultan__send {
  display: grid;
  place-items: center;
  inline-size: 36px;
  block-size: 36px;
  flex: none;
  border: 0;
  border-radius: 11px;
  background: var(--sultan-navy);
  color: #fff;
  cursor: pointer;
}

.innovant-sultan__send:hover { background: var(--sultan-navy-soft); }

/* RTL: the paper-plane glyph must point the way the language reads. */
.innovant-sultan[dir="rtl"] .innovant-sultan__send svg { transform: scaleX(-1); }

/* Ask by voice. Rendered hidden; the script shows it where the browser can
   recognise speech. Red while it is listening, so it is obvious it is live. */
.innovant-sultan__mic {
  display: grid;
  place-items: center;
  inline-size: 36px;
  block-size: 36px;
  flex: none;
  border: 1px solid var(--sultan-line);
  border-radius: 11px;
  background: #fff;
  color: var(--sultan-navy);
  cursor: pointer;
}

.innovant-sultan__mic:hover { border-color: var(--sultan-navy); background: var(--sultan-wash); }
.innovant-sultan__mic:focus-visible { outline: 2px solid var(--sultan-accent); outline-offset: 2px; }

.innovant-sultan[data-listening] .innovant-sultan__mic {
  border-color: #c0392b;
  background: #c0392b;
  color: #fff;
  animation: innovant-sultan-listen 1.4s ease-out infinite;
}

.innovant-sultan[data-listening] .innovant-sultan__input { border-color: #c0392b; }

@keyframes innovant-sultan-listen {
  0% { box-shadow: 0 0 0 0 rgba(192, 57, 43, 0.45); }
  100% { box-shadow: 0 0 0 10px rgba(192, 57, 43, 0); }
}

.innovant-sultan__foot {
  display: flex;
  gap: 7px;
  padding: 0 12px 11px;
  background: #fff;
}

.innovant-sultan__handoff {
  flex: 1;
  border: 1px solid var(--sultan-line);
  background: var(--sultan-wash);
  color: var(--sultan-navy);
  border-radius: 10px;
  padding: 7px 10px;
  font: inherit;
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
}

.innovant-sultan__handoff:hover { background: var(--sultan-navy); border-color: var(--sultan-navy); color: #fff; }
.innovant-sultan__handoff-row { display: flex; gap: 7px; margin-block-start: 9px; }

/* ------------------------------------------------------------- responsive -- */

@media (max-width: 560px) {
  .innovant-sultan { inset-inline: 12px; inset-block-end: calc(var(--sultan-offset) - 20px); }
  .innovant-sultan--bottom-start { inset-inline-end: auto; }
  .innovant-sultan--bottom-end { inset-inline-start: auto; }
  .innovant-sultan[data-state="open"] { inset-inline: 12px; }
  .innovant-sultan__panel { inline-size: 100%; }
  .innovant-sultan__launcher { padding-inline-end: 4px; }
  .innovant-sultan__launcher-text { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .innovant-sultan__launcher { transition: none; }
  .innovant-sultan__dot { animation: none; opacity: 0.7; }
  .innovant-sultan__face img.is-changing { animation: none; }
  .innovant-sultan[data-listening] .innovant-sultan__mic { animation: none; }
}

/* Summary block rendered on the contact page after a handoff. */
.innovant-sultan-context {
  border: 1px solid var(--sultan-line, #dbe3ec);
  border-radius: 12px;
  padding: 14px 16px;
  margin-block-end: 20px;
  background: #f7f9fc;
}

.innovant-sultan-context h3 { margin: 0 0 8px; font-size: 15px; }

.innovant-sultan-context__body {
  margin: 0;
  white-space: pre-wrap;
  font: inherit;
  font-size: 13px;
  color: #45525f;
}

/* Clearance for the WordPress admin bar, which only logged-in users see. */
body.admin-bar { --sultan-top-clear: 56px; }

@media screen and (max-width: 782px) {
  body.admin-bar { --sultan-top-clear: 70px; }
}

/* "Not Ahmed?" under the greeting: lets whoever is at a shared computer start as themselves */
.innovant-sultan .innovant-sultan__notme {
  align-self: flex-start;
  margin-block-start: 4px;
  padding: 2px 4px;
  border: 0;
  background: none;
  color: var(--sultan-muted);
  font: inherit;
  font-size: 12px;
  text-decoration: underline;
  cursor: pointer;
}
.innovant-sultan .innovant-sultan__notme:hover { color: var(--sultan-navy); }
.innovant-sultan .innovant-sultan__notme:focus-visible { outline: 2px solid var(--sultan-navy); outline-offset: 1px; }