/* Ministry of Finance theming over the Chainlit default theme.
   Official brand navy sampled from minfin.gov.gr logo assets: #243469. */
:root {
  --primary: #243469;
}

/* ---- App header: white like minfin.gov.gr, official logo, navy rule ---- */
#header, header {
  background-color: #ffffff !important;
  border-bottom: 3px solid #243469 !important;
}

/* primary buttons + user bubble in ministry navy */
button[type="submit"], .MuiButton-containedPrimary {
  background-color: #243469 !important;
}
[data-step-type="user_message"] .message-content,
.user-message {
  background-color: #e8ecf5 !important;
}

/* watermark off-brand for a gov pilot */
a[href*="chainlit"] { display: none !important; }

/* single-theme pilot: dark mode half-switched around the branded header and
   sidebar, so the toggle goes away (govgr-admin.js resets a stored choice) */
#theme-toggle { display: none !important; }

/* ---- Login page (V2): elevated card left, feature panel right ----
   The DOM hooks (.gov-login-v2, .gov-card, .gov-right, ...) are added by the
   login enhancer in govgr-admin.js. */
body.gov-login-v2 #root > .grid > div:first-child { background: #f4f6f9; }

.gov-card-holder { max-width: 400px !important; width: 100%; }
form.gov-card {
  background: #fff;
  border-radius: 6px;
  border-top: 4px solid #243469;
  box-shadow: 0 10px 34px rgba(22, 32, 63, .14);
  padding: 34px 34px 26px;
  gap: 18px !important;
}
form.gov-card > div:first-child { align-items: flex-start !important; gap: 4px !important; }
form.gov-card h1 { font-size: 18.5px !important; color: #243469; font-weight: 600; }
.gov-sub { font-size: 13px; color: #505a5f; margin: 0 0 6px; }
form.gov-card label { font-size: 13px; font-weight: 600; color: #3b4650; }
form.gov-card input { padding-left: 38px !important; border-radius: 4px !important; }
form.gov-card input:focus {
  outline: none !important;
  border-color: #243469 !important;
  box-shadow: 0 0 0 3px rgba(36, 52, 105, .18) !important;
}
.gov-field { position: relative; }
.gov-ico {
  /* anchored to the wrapper bottom: the input (h-10) sits at the bottom of
     its field wrapper, which may also contain the label */
  position: absolute; left: 12px; bottom: 12px;
  width: 16px; height: 16px; color: #8a949c; pointer-events: none; z-index: 2;
}
form.gov-card button[type="submit"],
form.gov-card > div.grid > button {
  background: #243469 !important; color: #fff !important;
  border-radius: 4px !important; font-weight: 600;
}
.gov-note {
  margin: 4px 0 0; font-size: 12px; color: #6b7477; text-align: center;
  line-height: 1.6; border-top: 1px solid #eef1f3; padding-top: 14px;
}

/* right panel: ministry navy with the assistant's three thematic pillars */
.gov-right {
  background: #243469 !important;
  display: flex !important; flex-direction: column; justify-content: center;
  gap: 26px; padding: 0 7%; color: #fff;
}
.gov-lockup {
  display: flex; align-items: center; gap: 13px;
  font-family: Roboto, "Segoe UI", Arial, sans-serif;
}
.gov-lockup img { width: 54px; height: 54px; flex: 0 0 54px; }
.gov-lockup b {
  display: block; font-size: 14.5px; font-weight: 700;
  letter-spacing: .08em; line-height: 1.15; margin: 0 0 4px;
}
.gov-lockup span { display: block; font-size: 12.5px; line-height: 1.3; opacity: .92; }
.gov-div { width: 52px; height: 4px; background: #ffffff; border-radius: 2px; }
.gov-right h2 { font-size: 21px; font-weight: 600; line-height: 1.4; margin: 0; color: #fff; }
.gov-feature { display: flex; gap: 14px; align-items: flex-start; }
.gov-feature .gov-dot {
  flex: 0 0 34px; height: 34px; border-radius: 8px;
  background: rgba(255, 255, 255, .12);
  display: flex; align-items: center; justify-content: center;
}
.gov-feature .gov-dot svg { width: 17px; height: 17px; color: #fff; }
.gov-feature b { display: block; font-size: 14.5px; margin-bottom: 2px; }
.gov-feature span { font-size: 13px; opacity: .75; line-height: 1.5; }
.gov-pilot { font-size: 12px; opacity: .65; letter-spacing: .1em; }

/* focus ring in ministry navy instead of the theme default */
body.gov-login-v2 * { --ring: 220 49% 28% !important; }

/* ministry logo inside welcome message / readme: fixed 70px, no frame, no gap */
img[src*="minfin-logo"]:not(.gov-logo) {
  height: 70px !important;
  width: auto !important;
  max-width: 90% !important;
  object-fit: contain;
}
div:not(.gov-right):has(> img[src*="minfin-logo"]:not(.gov-logo)),
div:not(.gov-right):has(> div > img[src*="minfin-logo"]:not(.gov-logo)) {
  background: transparent !important;
  height: 70px !important;
  max-height: 70px !important;
  width: auto !important;
  aspect-ratio: auto !important;
  border-radius: 0 !important;
}

/* ---- Validated answer: the one message a person signed off on ----
   It is delivered as a markdown blockquote (store.validated_block) so it can be
   told apart from the model's own text — otherwise the answer that went through
   human validation looks exactly like the one that did not. */
[data-step-type="assistant_message"] blockquote,
.message-content blockquote,
#root blockquote {
  border: 1px solid #b9c3d6 !important;
  border-left: 4px solid #00703c !important;
  border-radius: 4px;
  background: #f3f8f4;
  padding: 14px 18px !important;
  margin: 6px 0 !important;
  color: inherit !important;
  font-style: normal !important;
}
[data-step-type="assistant_message"] blockquote h3,
.message-content blockquote h3,
#root blockquote h3 {
  margin: 0 0 2px !important;
  font-size: 15px !important;
  color: #00703c !important;
}
.message-content blockquote em,
#root blockquote em { color: #505a5f; font-size: 13px; }
.message-content blockquote > :last-child,
#root blockquote > :last-child { margin-bottom: 0 !important; }

/* tool-step accordion headers («Χρησιμοποιήθηκε …»): smaller, muted */
h3.flex > button {
  font-size: 12.5px !important;
  font-weight: 400 !important;
  color: #6b7480 !important;
}
h3.flex > button svg { width: 14px !important; height: 14px !important; }

/* ministry navy as the app-wide accent (kills the default pink):
   Chainlit/shadcn theme runs on the --primary HSL variable */
:root, .dark, [data-theme] {
  --primary: 226 49% 28% !important;
  --ring: 226 49% 40% !important;
}
a { color: #243469; }

/* PDF/element side panel: turn the ambiguous back-arrow into a clear circular ✕
   pinned top-right of the panel */
aside:has(#side-view-content) { position: relative; }
aside:has(#side-view-content) button:has(path[d^="m12 19-7-7"]) {
  position: absolute !important;
  top: 10px; right: 10px; z-index: 40;
  width: 34px; height: 34px; padding: 0 !important;
  border-radius: 9999px !important;
  background: #243469 !important;
  box-shadow: 0 1px 4px rgba(0,0,0,.25);
}
aside:has(#side-view-content) button:has(path[d^="m12 19-7-7"]) svg { display: none; }
aside:has(#side-view-content) button:has(path[d^="m12 19-7-7"])::after {
  content: "✕";
  color: #ffffff;
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
}
aside:has(#side-view-content) button:has(path[d^="m12 19-7-7"]):hover {
  background: #00234f !important;
}

/* action rows under messages (follow-up suggestions, verdict buttons):
   outlined pill chips, matching the starter suggestions */
main div.-ml-1\.5.flex.items-center.flex-wrap { gap: 8px; row-gap: 8px; margin-top: 6px; }
main div.-ml-1\.5.flex.items-center.flex-wrap > button {
  border: 1px solid #c9d1dc !important;
  border-radius: 9999px !important;
  padding: 6px 14px !important;
  height: auto !important;
  font-size: 13px !important;
  color: #243469 !important;
  background: #fff !important;
}
main div.-ml-1\.5.flex.items-center.flex-wrap > button:hover {
  background: #eef2fb !important;
  border-color: #243469 !important;
}

/* external source links inside answers: link-out marker after the text
   (element previews render as "#" links and chip links carry rounded-full) */
main a[href^="http"]:not([class*="rounded-full"])::after {
  content: " \2197";
  font-size: .8em;
  opacity: .65;
}

/* destructive confirmation dialogs (thread deletion): the confirming action
   is red, per the destructive-action convention */
[role="alertdialog"] button[class*="bg-primary"] {
  background: #942514 !important;
  border-color: #942514 !important;
  color: #fff !important;
}
[role="alertdialog"] button[class*="bg-primary"]:hover {
  background: #7a1e10 !important;
}

/* retrieval trail as a station timeline: the step's left border is the rail,
   and each entry gets a station marker centred on it */
.step [role="region"] .border-l-2 {
  border-color: #b8bfd6;
}
.step [role="region"] .border-l-2 [role="article"] {
  position: relative;
}
.step [role="region"] .border-l-2 [role="article"]::before {
  content: "";
  position: absolute;
  left: calc(-1rem - 6px);
  top: 7px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #fff;
  border: 2.5px solid #243469;
  box-sizing: border-box;
}
/* terminus styling for the final entry */
.step [role="region"] .border-l-2 [role="article"]:last-child::before {
  background: #243469;
}


/* Πληροφορίες dialog: formal lockup styled after the login screen */
[role="dialog"] img[src*="ethnosimo-navy"] {
  height: 54px !important;
  width: auto !important;
  margin: 0 !important;
}
[role="dialog"] div:has(> img[src*="ethnosimo-navy"]),
[role="dialog"] p:has(> img[src*="ethnosimo-navy"]) {
  height: auto !important;
  max-height: none !important;
  margin: 0 0 10px !important;
}
[role="dialog"] h1 {
  color: #243469 !important;
  font-size: 24px !important;
  font-weight: 700;
  letter-spacing: .01em;
  border-bottom: 3px solid #243469;
  padding-bottom: 12px;
  margin: 4px 0 14px !important;
}
[role="dialog"] h1::before {
  content: "ΕΛΛΗΝΙΚΗ ΔΗΜΟΚΡΑΤΙΑ";
  display: block;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .18em;
  color: #505a5f;
  margin-bottom: 6px;
}
[role="dialog"] ul li::marker { color: #243469; }
[role="dialog"] hr { border-color: #b8bfd6; margin: 16px 0 10px; }
[role="dialog"] hr + p { font-size: 12.5px; color: #505a5f; }
[role="dialog"] h2 {
  color: #243469 !important;
  font-size: 16px !important;
  font-weight: 700;
  letter-spacing: .02em;
  margin: 18px 0 8px !important;
  padding-bottom: 4px;
  border-bottom: 1px solid #dbe1f0;
}
/* the readme image wrapper adds a grey aspect-ratio skeleton: strip it for the
   emblem (ancestors that hold the title are excluded so the panel keeps its bg) */
[role="dialog"] :is(div, p, span, a):has(img[src*="ethnosimo-navy"]):not(:has(h1)) {
  background: transparent !important;
  height: auto !important;
  max-height: none !important;
  width: auto !important;
  aspect-ratio: auto !important;
  padding: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
[role="dialog"] img[src*="ethnosimo-navy"] {
  position: static !important;
  display: block;
}
[role="dialog"] :is(div, p, span, a):has(> img[src*="ethnosimo-navy"]) {
  min-height: 58px !important;
  overflow: visible !important;
}

/* narrow screens: the header pills drop their labels — icon-only keeps the
   cluster inside the viewport */
@media (max-width: 640px) {
  #gov-docs-link span,
  button[data-gov-styled] span { display: none; }
  #gov-docs-link, button[data-gov-styled] { padding: 6px 9px !important; }
}

/* stacked (mobile) login: the navy panel is content-height, so the vertical
   centering does nothing — give it real breathing room instead */
@media (max-width: 640px) {
  .gov-right { padding: 42px 7% 46px !important; }
}