/* 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 {
  position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  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: 14px; }
.gov-lockup img { width: 52px; height: 52px; }
.gov-lockup b { display: block; font-size: 15px; letter-spacing: .12em; }
.gov-lockup span { font-size: 13px; opacity: .9; line-height: 1.4; }
.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;
}