/* IMK_UNBLOCK_DOC_INLINE_STYLES_V142: documentets inline-stilar från DB får styra färg/font. */
/* IMK_UPLOAD_LEGACY_ADAPTER_RUNTIME_SHELL_V117
   Tillfällig adapter för gamla upload-sidor som fortfarande använder class="card".
   Ny huvudstruktur ska använda:
   - imk-page-shell
   - imk-page-card
   - imk-content-card
   - imk-info-card

   Denna fil ligger i gemensam runtime-shell och inte i upload-specifik CSS.
*/

:root {
  --imk-page-bg: radial-gradient(circle at top, var(--bg-top, #1d4ed8) 0%, var(--bg-bottom, #172554) 100%);

  --imk-page-card-bg: var(--hero-card-bg, radial-gradient(circle at top,#2563eb 0%,#1d4ed8 45%,#172554 100%));
  --imk-page-card-border: var(--hero-card-border, rgba(191,219,254,0.18));

  --imk-content-card-bg: var(--inner-card-bg, linear-gradient(135deg,#3b82f6 0%,#2563eb 52%,#1e3a8a 100%));
  --imk-content-card-border: var(--inner-card-border, rgba(191,219,254,0.22));

  --imk-info-card-bg: var(--card-panel-bg, linear-gradient(180deg,rgba(29,78,216,0.44),rgba(23,37,84,0.74)));
  --imk-info-card-border: var(--card-panel-border, rgba(191,219,254,0.18));

  --imk-text-main: var(--text-main, #eff6ff);
  --imk-text-soft: var(--text-soft, #bfdbfe);
  --imk-title-color: var(--title-color, #93c5fd);
  --imk-accent-color: var(--accent-color, #60a5fa);
  --imk-button-bg: var(--button-bg, rgba(23,37,84,0.56));
  --imk-button-border: var(--button-border, rgba(96,165,250,0.24));
  --imk-button-text: var(--button-text, #eff6ff);
  --imk-button-hover-bg: var(--button-hover-bg, rgba(23,37,84,0.80));
}

html body.imk-runtime-shell {
  min-height: 100vh !important;
  margin: 0 !important;
  background: var(--imk-page-bg) !important;
  color: var(--imk-text-main) !important;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

html body.imk-runtime-shell .imk-page-shell {
  width: min(100%, 980px) !important;
  max-width: 980px !important;
  margin: 0 auto 28px auto !important;
  padding: 12px 20px 24px !important;
  color: var(--imk-text-main) !important;
  box-sizing: border-box !important;
}

/* Ny ren nivå: page-card */
html body.imk-runtime-shell .imk-page-card,
html body.imk-runtime-shell .imk-page-shell > .card:not(.doc-preview):not(.inner-card):not(.info-card):not(.imk-visibility-inner-card):not(.imk-visibility-info-card),
html body.imk-runtime-shell section.card.imk-review-help {
  width: 100% !important;
  max-width: 820px !important;
  margin: 16px auto 24px auto !important;
  padding: 22px !important;
  background: var(--imk-page-card-bg) !important;
  border: 1px solid var(--imk-page-card-border) !important;
  border-radius: 34px !important;
  color: var(--imk-text-main) !important;
  box-shadow:
    0 18px 36px rgba(0,0,0,0.24),
    inset 0 1px rgba(255,255,255,0.08) !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  position: relative !important;
}

/* Ny ren nivå: content-card */
html body.imk-runtime-shell .imk-content-card,
html body.imk-runtime-shell .imk-visibility-inner-card.inner-card,
html body.imk-runtime-shell main .card:has(a[href*="translation-test"]):has(a[href*="logo-audit"]):has(a[href*="/logs"]) {
  width: 100% !important;
  max-width: 760px !important;
  margin: 16px auto !important;
  padding: 26px !important;
  background: var(--imk-content-card-bg) !important;
  border: 1px solid var(--imk-content-card-border) !important;
  border-radius: 28px !important;
  color: var(--imk-text-main) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.05),
    0 0 24px rgba(24,183,255,0.08) !important;
  box-sizing: border-box !important;
}

/* Ny ren nivå: info-card */
html body.imk-runtime-shell .imk-info-card,
html body.imk-runtime-shell .imk-visibility-info-card.info-card {
  background: var(--imk-info-card-bg) !important;
  border: 1px solid var(--imk-info-card-border) !important;
  border-radius: 20px !important;
  color: var(--imk-text-main) !important;
  box-shadow:
    0 10px 20px rgba(0,0,0,0.16),
    inset 0 1px rgba(255,255,255,0.05) !important;
  box-sizing: border-box !important;
}

html body.imk-runtime-shell .card:not(.doc-preview) *,
html body.imk-runtime-shell .imk-page-card *,
html body.imk-runtime-shell .imk-content-card *,
html body.imk-runtime-shell .imk-info-card *,
html body.imk-runtime-shell .imk-visibility-inner-card *,
html body.imk-runtime-shell .imk-visibility-info-card * {
  color: var(--imk-text-main) !important;
}

html body.imk-runtime-shell h1,
html body.imk-runtime-shell h2,
html body.imk-runtime-shell h3,
html body.imk-runtime-shell .card:not(.doc-preview) h1,
html body.imk-runtime-shell .card:not(.doc-preview) h2,
html body.imk-runtime-shell .card:not(.doc-preview) h3 {
  color: var(--imk-title-color) !important;
}

html body.imk-runtime-shell a {
  color: var(--imk-accent-color) !important;
}

html body.imk-runtime-shell button,
html body.imk-runtime-shell input[type="submit"],
html body.imk-runtime-shell .upload-main-button {
  background: var(--imk-button-bg) !important;
  border: 1px solid var(--imk-button-border) !important;
  color: var(--imk-button-text) !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}

html body.imk-runtime-shell button:hover,
html body.imk-runtime-shell input[type="submit"]:hover,
html body.imk-runtime-shell .upload-main-button:hover {
  background: var(--imk-button-hover-bg) !important;
}

/* Dokumentförhandsvisning ska fortfarande vara dokumentyta, inte appkort. */
html body.imk-runtime-shell .doc-preview,
html body.imk-runtime-shell .doc-paper {
  background: #ffffff !important;
}

html body.imk-runtime-shell .doc-preview *,
html body.imk-runtime-shell .doc-paper * {
}

@media (max-width: 800px) {
  html body.imk-runtime-shell .imk-page-shell {
    padding: 12px 12px 20px !important;
  }

  html body.imk-runtime-shell .imk-page-card,
  html body.imk-runtime-shell .imk-page-shell > .card:not(.doc-preview),
  html body.imk-runtime-shell section.card.imk-review-help {
    border-radius: 24px !important;
    padding: 16px 14px !important;
  }

  html body.imk-runtime-shell .imk-content-card,
  html body.imk-runtime-shell .imk-visibility-inner-card.inner-card {
    border-radius: 22px !important;
    padding: 18px 14px !important;
  }
}

/* IMK_UPLOAD_FILE_BUTTON_EXTERNAL_CSS_V1
   Svensk/större filknapp via extern CSS.
   Ingen CSS/JS i Python.
*/

input[type="file"],
.hidden-file-input {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
}

.upload-main-button,
.imk-file-select-button,
label.upload-main-button,
.upload-zone label {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 58px !important;
  min-width: 280px !important;
  padding: 16px 30px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(147,197,253,.9) !important;
  background: linear-gradient(180deg, #1d4ed8, #1e40af) !important;
  color: #ffffff !important;
  font-size: 1.15rem !important;
  font-weight: 800 !important;
  cursor: pointer !important;
  text-decoration: none !important;
  box-shadow: 0 12px 24px rgba(0,0,0,.22) !important;
}

.upload-main-button:hover,
.imk-file-select-button:hover,
label.upload-main-button:hover,
.upload-zone label:hover {
  filter: brightness(1.12) !important;
}

/* IMK_UPLOAD_INPUT_TEXT_VISIBLE_V1
   Gör text i användarnamn/lösenord/fält synlig.
   Endast CSS. Ingen användartext här.
*/

html body.imk-runtime-shell input,
html body.imk-runtime-shell input[type="text"],
html body.imk-runtime-shell input[type="email"],
html body.imk-runtime-shell input[type="password"],
html body.imk-runtime-shell input[type="search"],
html body.imk-runtime-shell textarea,
html body.imk-runtime-shell select {
  background: #ffffff !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  border: 1px solid rgba(96, 165, 250, 0.75) !important;
}

html body.imk-runtime-shell input::placeholder,
html body.imk-runtime-shell textarea::placeholder {
  color: #475569 !important;
  opacity: 1 !important;
}

html body.imk-runtime-shell input:focus,
html body.imk-runtime-shell textarea:focus,
html body.imk-runtime-shell select:focus {
  outline: 3px solid rgba(96, 165, 250, 0.32) !important;
  border-color: #60a5fa !important;
}

html body.imk-runtime-shell input:-webkit-autofill,
html body.imk-runtime-shell input:-webkit-autofill:hover,
html body.imk-runtime-shell input:-webkit-autofill:focus {
  -webkit-text-fill-color: #0f172a !important;
  box-shadow: 0 0 0 1000px #ffffff inset !important;
}

/* IMK_UPLOAD_PROCESSING_OVERLAY_CONTRAST_V1
   Säker kontrast för uppladdningsrutan.
   Endast visuell CSS. Ändrar inte texter eller Pythonlogik.
*/
html body.imk-runtime-shell .processing-overlay .processing-card {
  background: linear-gradient(180deg, #082f6f, #021450) !important;
  color: #f3f8ff !important;
  border: 1px solid rgba(147, 197, 253, .75) !important;
}

html body.imk-runtime-shell .processing-overlay .processing-card *,
html body.imk-runtime-shell .processing-overlay .processing-card h1,
html body.imk-runtime-shell .processing-overlay .processing-card h2,
html body.imk-runtime-shell .processing-overlay .processing-card h3,
html body.imk-runtime-shell .processing-overlay .processing-card p,
html body.imk-runtime-shell .processing-overlay .processing-card div,
html body.imk-runtime-shell .processing-overlay .processing-card span {
  color: #f3f8ff !important;
  -webkit-text-fill-color: #f3f8ff !important;
}

html body.imk-runtime-shell .processing-overlay .processing-percent-number {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body.imk-runtime-shell .processing-overlay .processing-stage-text,
html body.imk-runtime-shell .processing-overlay .processing-progress-text {
  color: #d9ecff !important;
  -webkit-text-fill-color: #d9ecff !important;
}

/* IMK_SELECT_DROPDOWN_VISIBLE_TEXT_V153_START
   Gör dropdown-listor läsbara: mörk text på ljus bakgrund.
   Påverkar inte dokumentets extraherade textfärger.
*/
html body.imk-runtime-shell select,
html body.imk-runtime-shell .card select,
html body.imk-runtime-shell .imk-page-shell select {
  background-color: #ffffff !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  border-color: #60a5fa !important;
  color-scheme: light !important;
}

html body.imk-runtime-shell select option,
html body.imk-runtime-shell select optgroup {
  background-color: #ffffff !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

html body.imk-runtime-shell select:focus {
  outline: 2px solid #60a5fa !important;
  outline-offset: 2px !important;
}
/* IMK_SELECT_DROPDOWN_VISIBLE_TEXT_V153_END */

/* IMK_SELECT_DROPDOWN_VISIBLE_TEXT_V153_START
   Gör dropdown-listor läsbara: mörk text på ljus bakgrund.
   Påverkar inte dokumentets extraherade textfärger.
*/
html body.imk-runtime-shell select,
html body.imk-runtime-shell .card select,
html body.imk-runtime-shell .imk-page-shell select {
  background-color: #ffffff !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  border-color: #60a5fa !important;
  color-scheme: light !important;
}

html body.imk-runtime-shell select option,
html body.imk-runtime-shell select optgroup {
  background-color: #ffffff !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

html body.imk-runtime-shell select:focus {
  outline: 2px solid #60a5fa !important;
  outline-offset: 2px !important;
}
/* IMK_SELECT_DROPDOWN_VISIBLE_TEXT_V153_END */


/* IMK_SELECT_READABLE_ARROW_V155_START */
html body.imk-runtime-shell select,
html body.imk-runtime-shell .card select,
html body.imk-runtime-shell .doc-preview select,
html body.imk-runtime-shell .doc-paper select {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;

  display: inline-block !important;
  min-height: 48px !important;
  min-width: 300px !important;
  max-width: 100% !important;

  background-color: #ffffff !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;

  border: 1px solid #2563eb !important;
  border-radius: 12px !important;
  padding: 10px 44px 10px 14px !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  cursor: pointer !important;

  background-image: linear-gradient(45deg, transparent 50%, #0f172a 50%),
                    linear-gradient(135deg, #0f172a 50%, transparent 50%) !important;
  background-position: calc(100% - 22px) 50%, calc(100% - 15px) 50% !important;
  background-size: 7px 7px, 7px 7px !important;
  background-repeat: no-repeat !important;
}

html body.imk-runtime-shell select option,
html body.imk-runtime-shell .card select option,
html body.imk-runtime-shell .doc-preview select option,
html body.imk-runtime-shell .doc-paper select option {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
}

html body.imk-runtime-shell select:focus {
  outline: 3px solid rgba(37, 99, 235, .30) !important;
  outline-offset: 2px !important;
}
/* IMK_SELECT_READABLE_ARROW_V155_END */