/* ============================================================================
   TrueTalent Portal V93 - professional consistency pass
   Loaded last. Keeps Admin and Talent on the same shell, stabilizes template
   management, full-page forms, contract preview and signature dialogs.
   ============================================================================ */

:root {
  --tt-header-h: 64px !important;
  --tt-sidebar-w: 232px !important;
  --tt-page-bg: #f5f7fb !important;
  --tt-sidebar-bg: #151b2a !important;
  --tt-sidebar-border: rgba(255, 255, 255, 0.08) !important;
  --tt-nav-text: #c3c9d6 !important;
  --tt-nav-hover-bg: rgba(255, 255, 255, 0.055) !important;
  --tt-nav-active-bg: rgba(88, 166, 255, 0.16) !important;
  --tt-nav-active-border: #60a5fa !important;
  --tt-content-pad: 18px !important;
  --tt-card-radius: 8px !important;
  --tt-line: #e4e8f0 !important;
  --tt-line-strong: #cfd6e2 !important;
  --tt-text: #111827 !important;
  --tt-muted: #6b7280 !important;
  --tt-soft-shadow: 0 10px 30px rgba(15, 23, 42, 0.06) !important;
}

html,
body {
  overflow-x: hidden !important;
  background: var(--tt-page-bg) !important;
}

button,
input,
select,
textarea {
  font-family: inherit !important;
  box-sizing: border-box !important;
}

/* ---------------------------------------------------------------------------
   Shared Admin/Talent shell
   --------------------------------------------------------------------------- */

#dashboard-view > .container > header,
#dashboard-view .talent-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 130 !important;
  height: var(--tt-header-h) !important;
  min-height: var(--tt-header-h) !important;
  padding: 0 18px !important;
  background: rgba(255, 255, 255, 0.97) !important;
  border-bottom: 1px solid var(--tt-line) !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03) !important;
  backdrop-filter: saturate(160%) blur(12px) !important;
}

#dashboard-view .header-content,
#dashboard-view .talent-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  width: 100% !important;
  max-width: none !important;
}

#dashboard-view .header-content {
  height: var(--tt-header-h) !important;
}

#dashboard-view .header-content .logo,
#dashboard-view .talent-header-logo {
  width: auto !important;
  height: 44px !important;
  max-width: 210px !important;
  object-fit: contain !important;
}

#dashboard-view .talent-header-brand {
  min-width: 0 !important;
}

#dashboard-view .talent-header-brand h1,
#dashboard-view .talent-header-brand p {
  display: none !important;
}

#dashboard-view .header-actions,
#dashboard-view .talent-header-actions {
  min-height: 40px !important;
  gap: 8px !important;
}

#dashboard-view > .container > main,
#dashboard-view .talent-main {
  display: flex !important;
  align-items: stretch !important;
  gap: 0 !important;
  min-height: calc(100vh - var(--tt-header-h)) !important;
  width: 100vw !important;
  max-width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--tt-page-bg) !important;
}

#dashboard-view .admin-main-nav,
#dashboard-view .talent-main > .dashboard-tabs {
  position: sticky !important;
  top: var(--tt-header-h) !important;
  flex: 0 0 var(--tt-sidebar-w) !important;
  width: var(--tt-sidebar-w) !important;
  min-width: var(--tt-sidebar-w) !important;
  max-width: var(--tt-sidebar-w) !important;
  height: calc(100vh - var(--tt-header-h)) !important;
  margin: 0 !important;
  padding: 12px 10px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  border: 0 !important;
  border-right: 1px solid var(--tt-sidebar-border) !important;
  border-radius: 0 !important;
  background: var(--tt-sidebar-bg) !important;
  box-shadow: none !important;
}

#dashboard-view .admin-main-nav:hover,
#dashboard-view .admin-main-nav:focus-within,
#dashboard-view .talent-main > .dashboard-tabs:hover,
#dashboard-view .talent-main > .dashboard-tabs:focus-within {
  flex-basis: var(--tt-sidebar-w) !important;
  width: var(--tt-sidebar-w) !important;
  min-width: var(--tt-sidebar-w) !important;
  max-width: var(--tt-sidebar-w) !important;
  box-shadow: none !important;
}

#dashboard-view .admin-main-nav .view-btn,
#dashboard-view .admin-main-nav .admin-nav-subitem,
#dashboard-view .talent-main > .dashboard-tabs .dashboard-tab,
#dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab {
  width: 100% !important;
  min-height: 34px !important;
  padding: 0 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  color: var(--tt-nav-text) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 7px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  transition: background 140ms ease, color 140ms ease, box-shadow 140ms ease !important;
}

#dashboard-view .admin-main-nav .view-btn:hover,
#dashboard-view .admin-main-nav .admin-nav-subitem:hover,
#dashboard-view .talent-main > .dashboard-tabs .dashboard-tab:hover,
#dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab:hover {
  color: #ffffff !important;
  background: var(--tt-nav-hover-bg) !important;
}

#dashboard-view .admin-main-nav .view-btn.active,
#dashboard-view .admin-main-nav .admin-nav-subitem.active,
#dashboard-view .talent-main > .dashboard-tabs .dashboard-tab.active,
#dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab.active {
  color: #ffffff !important;
  background: var(--tt-nav-active-bg) !important;
  box-shadow: inset 3px 0 0 var(--tt-nav-active-border) !important;
}

#dashboard-view .admin-main-nav .nav-icon,
#dashboard-view .talent-main > .dashboard-tabs .nav-icon {
  width: 18px !important;
  height: 18px !important;
  flex: 0 0 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#dashboard-view .admin-main-nav .nav-label,
#dashboard-view .talent-main > .dashboard-tabs .nav-label {
  display: inline !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  opacity: 1 !important;
}

/* Scoped sidebar expansion: old CSS opened every subgroup on sidebar hover. */
#dashboard-view .admin-main-nav .admin-nav-subgroup,
#dashboard-view .talent-main > .dashboard-tabs .dashboard-subgroup {
  display: none !important;
  flex-direction: column !important;
  gap: 2px !important;
  margin: 0 0 0 28px !important;
  padding-left: 10px !important;
  max-height: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  border-left: 1px solid rgba(255, 255, 255, 0.12) !important;
  transition: max-height 150ms ease, opacity 120ms ease, margin 150ms ease !important;
}

#dashboard-view .admin-main-nav .admin-nav-subgroup.is-active-parent,
#dashboard-view .admin-main-nav .admin-nav-subgroup.tt-hover-open,
#dashboard-view .talent-main > .dashboard-tabs .dashboard-subgroup.is-active-parent,
#dashboard-view .talent-main > .dashboard-tabs .dashboard-subgroup.tt-hover-open {
  display: flex !important;
  max-height: 420px !important;
  opacity: 1 !important;
  margin: 4px 0 8px 28px !important;
  overflow: visible !important;
}

#dashboard-view main > .admin-main-section,
#dashboard-view .talent-main > .talent-panel {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  padding: var(--tt-content-pad) !important;
  margin: 0 !important;
  background: var(--tt-page-bg) !important;
}

#dashboard-view .card,
#dashboard-view .talent-panel,
#dashboard-view .dash-chart-card,
#dashboard-view .dash-kpi {
  border-radius: var(--tt-card-radius) !important;
  border-color: var(--tt-line) !important;
  box-shadow: none !important;
}

/* ---------------------------------------------------------------------------
   Template management
   --------------------------------------------------------------------------- */

#templates-container.tt-template-app {
  display: block !important;
  min-height: calc(100vh - 132px) !important;
  background: transparent !important;
  border: 0 !important;
}

#templates-container.tt-template-app.hidden {
  display: none !important;
}

#contracts-admin-section .card:has(#templates-container:not(.hidden)) {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#templates-container .tt-view {
  background: #ffffff !important;
  border: 1px solid var(--tt-line) !important;
  border-radius: var(--tt-card-radius) !important;
  min-height: calc(100vh - 144px) !important;
  overflow: hidden !important;
}

#templates-container .tt-view.hidden {
  display: none !important;
}

#templates-container .tt-view-header {
  display: grid !important;
  grid-template-columns: minmax(240px, 1fr) auto !important;
  align-items: center !important;
  gap: 16px !important;
  min-height: 64px !important;
  margin: 0 !important;
  padding: 14px 20px !important;
  background: #ffffff !important;
  border: 0 !important;
  border-bottom: 1px solid var(--tt-line) !important;
  border-radius: 0 !important;
}

#templates-container .tt-view-header-left,
#templates-container .tt-view-header-title {
  min-width: 0 !important;
}

#templates-container .tt-view-header-title {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 2px !important;
  text-align: left !important;
}

#templates-container .tt-view-header h1 {
  margin: 0 !important;
  color: var(--tt-text) !important;
  font-size: 18px !important;
  font-weight: 750 !important;
  line-height: 1.08 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

#templates-container .tt-view-header p,
#templates-container .tt-editor-meta {
  margin: 0 !important;
  color: var(--tt-muted) !important;
  font-size: 12.5px !important;
  line-height: 1.35 !important;
  max-width: 760px !important;
  display: block !important;
  overflow: visible !important;
  -webkit-line-clamp: unset !important;
}

#templates-container .tt-view-header-actions {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  min-width: 0 !important;
}

#templates-container .tt-view-header-actions .tt-search-input,
#templates-container .tt-view-header input[type="search"] {
  width: 230px !important;
  min-width: 190px !important;
  height: 36px !important;
  border-radius: 6px !important;
  font-size: 13px !important;
}

#templates-container .tt-view-header button,
#templates-container .tt-view-header .btn-primary,
#templates-container .tt-view-header .btn-secondary,
#templates-container .tt-view-header .btn-danger {
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 13px !important;
  border-radius: 6px !important;
  font-size: 13px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

#template-type-list.tt-template-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)) !important;
  gap: 12px !important;
  padding: 16px !important;
}

#template-type-list .tt-template-card {
  min-height: 164px !important;
  border-radius: var(--tt-card-radius) !important;
  border: 1px solid var(--tt-line) !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

#template-type-list .tt-template-card-main,
#template-type-list .tt-template-card-head,
#template-type-list .tt-template-card-body {
  padding: 16px !important;
}

#template-type-list .tt-template-card-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding-bottom: 0 !important;
}

#template-type-list .tt-template-card-body {
  min-height: 88px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  gap: 5px !important;
}

#template-type-list .tt-template-card-title,
#template-type-list .tt-template-card h3,
#template-type-list .tt-template-card-body strong {
  font-size: 15px !important;
  line-height: 1.25 !important;
  margin: 0 !important;
  white-space: normal !important;
  overflow: visible !important;
}

#template-type-list .tt-template-card-meta,
#template-type-list .tt-template-card-body small {
  font-size: 12px !important;
  line-height: 1.35 !important;
  white-space: normal !important;
  color: var(--tt-muted) !important;
}

#template-type-list .tt-template-card-footer,
#template-type-list .tt-template-card-foot {
  min-height: 48px !important;
  padding: 10px 12px !important;
  gap: 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-top: 1px solid #eef1f5 !important;
  background: #fbfcfe !important;
}

#template-type-list .tt-template-card-actions {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}

#template-type-list .tt-template-card-footer button,
#template-type-list .tt-template-card-foot button {
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 12px !important;
  border-radius: 6px !important;
  font-size: 12.5px !important;
}

#tt-view-placeholders .placeholder-table-wrap {
  margin: 16px !important;
  max-height: calc(100vh - 238px) !important;
  overflow: auto !important;
  border: 1px solid var(--tt-line) !important;
  border-radius: var(--tt-card-radius) !important;
  background: #ffffff !important;
}

#tt-view-placeholders .placeholder-table {
  min-width: 920px !important;
  border-collapse: collapse !important;
}

#tt-view-placeholders .placeholder-table thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 2 !important;
  height: 38px !important;
  padding: 0 12px !important;
  background: #f8fafc !important;
  border-bottom: 1px solid var(--tt-line) !important;
  color: #667085 !important;
  font-size: 11px !important;
  letter-spacing: 0.06em !important;
}

#tt-view-placeholders .placeholder-table td {
  padding: 10px 12px !important;
  border-bottom: 1px solid #edf0f5 !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  vertical-align: middle !important;
}

#tt-view-placeholders .placeholder-tag {
  font-size: 12px !important;
  line-height: 1.2 !important;
  padding: 5px 8px !important;
  border-radius: 5px !important;
}

/* Template editor */
#tt-view-editor {
  min-height: calc(100vh - 112px) !important;
}

#tt-view-editor .tt-view-header--editor {
  grid-template-columns: minmax(320px, 1fr) auto !important;
}

#tt-view-editor .tt-editor-title-block {
  min-width: 0 !important;
}

#tt-editor-meta-panel {
  margin: 0 !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid var(--tt-line) !important;
  background: #fbfcfe !important;
}

#tt-editor-meta-panel .template-meta-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
  gap: 10px !important;
}

#tt-editor-meta-panel input {
  height: 34px !important;
}

#tt-view-editor .tt-editor-lang-bar {
  margin: 0 !important;
  padding: 10px 16px !important;
  border-bottom: 1px solid var(--tt-line) !important;
  background: #fff !important;
}

/* V95c: was 214px chrome budget — now 148px (52 app + 48 header + 24 lang + 24 toolbar) */
#tt-editor-paper-stage.tt-paper-stage {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 18px !important;
  height: calc(100vh - 148px) !important;
  min-height: 560px !important;
  padding: 12px 18px !important;
  overflow: auto !important;
  background: #eef2f7 !important;
}

#tt-editor-paper-stage .tt-paper-workspace {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  min-width: 0 !important;
}

/* V94s: rail moved INSIDE the editor stage area (not on the left margin)
   so it can never be hidden behind the sidebar on narrow viewports. */
#tt-editor-page-rail.tt-editor-page-rail {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  position: sticky !important;
  top: 6px !important;
  width: 96px !important;
  flex: 0 0 96px !important;
  padding-top: 2px !important;
  margin-right: 14px !important;
  z-index: 5 !important;
}

#tt-editor-page-rail .tt-page-marker {
  width: 100% !important;
  height: 30px !important;
  padding: 0 10px !important;
  border-radius: 6px !important;
  border: 1px solid transparent !important;
  background: rgba(255, 255, 255, 0.6) !important;
  color: #475569 !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  text-align: center !important;          /* centered so 'Seite N' fits even when narrow */
  cursor: pointer !important;
  white-space: nowrap !important;
  overflow: visible !important;
  letter-spacing: 0 !important;
}

#tt-editor-page-rail .tt-page-marker.active {
  border-color: #cbd5e1 !important;
  background: #ffffff !important;
  color: #111827 !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06) !important;
}

#tt-editor-paper-stage .tt-paper-sheet {
  width: 794px !important;
  min-height: 1123px !important;
  flex: 0 0 794px !important;
  border-radius: 4px !important;
  box-shadow: 0 14px 44px rgba(15, 23, 42, 0.12), 0 0 0 1px rgba(15, 23, 42, 0.08) !important;
}

/* V94q WYSIWYG: editor metrics now match the PDF (Arial 12px/1.45,
   padding = Puppeteer margins 48/16/24/16mm at 96dpi = 181/60/91/60px).
   Content area per sheet = 794-2*60 × 1123-181-91 = 674 × 851 px =
   178 × 225 mm. Identical to the PDF's printable area, so a line that
   wraps at "Vereinbarung" in the editor wraps at "Vereinbarung" in the PDF
   and Seite N in the editor IS Seite N in the PDF. */
#template-rich-editor.tt-paper-content {
  column-count: 1 !important;
  columns: auto !important;
  column-width: auto !important;
  width: 100% !important;
  /* V95e2: override portal-v87-fixes calc(100vw - 360px) which can clamp to
     negative on narrow viewports. With the V94w paper-sheet wrapper, the
     editor's max-width is bounded by the sheet (794px) not the viewport. */
  max-width: none !important;
  min-height: 1123px !important;
  padding: 181px 60px 91px 60px !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  color: #111 !important;
}
/* Force inline elements to inherit too (matches contract-de.html master) */
#template-rich-editor.tt-paper-content p,
#template-rich-editor.tt-paper-content li,
#template-rich-editor.tt-paper-content span,
#template-rich-editor.tt-paper-content strong,
#template-rich-editor.tt-paper-content em {
  font-family: inherit !important;
  font-size: 12px !important;
  line-height: 18px !important;
}

.tt-editor-side-toolbar {
  position: sticky !important;
  top: 0 !important;
  width: 214px !important;
  flex: 0 0 214px !important;
  margin: 0 !important;
  padding: 14px !important;
  border: 1px solid var(--tt-line) !important;
  border-radius: var(--tt-card-radius) !important;
  background: #ffffff !important;
  box-shadow: var(--tt-soft-shadow) !important;
}

.tt-editor-side-toolbar .tt-side-section {
  padding: 0 0 13px !important;
  margin: 0 0 13px !important;
  border-bottom: 1px solid #eef1f5 !important;
}

.tt-editor-side-toolbar .tt-side-section:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
}

.tt-editor-side-toolbar h4 {
  margin: 0 0 8px !important;
  color: #6b7280 !important;
  font-size: 11px !important;
  font-weight: 760 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.tt-editor-side-toolbar .tt-side-row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
}

.tt-editor-side-toolbar select,
.tt-editor-side-toolbar input[type="color"] {
  height: 34px !important;
  border-radius: 6px !important;
  border: 1px solid var(--tt-line-strong) !important;
  background: #fff !important;
  color: #111827 !important;
  font-size: 12.5px !important;
}

.tt-editor-side-toolbar select {
  width: 100% !important;
  padding: 0 9px !important;
}

.tt-editor-side-toolbar button {
  height: 30px !important;
  min-width: 30px !important;
  border-radius: 6px !important;
  border: 1px solid transparent !important;
  background: #ffffff !important;
  color: #374151 !important;
  font-size: 13px !important;
  line-height: 1 !important;
}

.tt-editor-side-toolbar button:hover {
  background: #f3f6fa !important;
  border-color: #d7dee9 !important;
}

.tt-editor-side-toolbar .tt-side-action-btn,
.tt-editor-side-toolbar #tt-editor-pagebreak-btn,
.tt-editor-side-toolbar #tt-side-placeholder-btn {
  width: 100% !important;
  min-width: 100% !important;
  height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 10px !important;
  border: 1px solid var(--tt-line-strong) !important;
  border-radius: 6px !important;
  background: #ffffff !important;
  color: #111827 !important;
  font-size: 12.5px !important;
  font-weight: 650 !important;
  white-space: nowrap !important;
}

.tt-side-page-status {
  min-height: 34px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid #cfd6e2 !important;
  border-radius: 6px !important;
  background: #f8fafc !important;
  color: #111827 !important;
  font-size: 12.5px !important;
  font-weight: 750 !important;
}

#tt-editor-page-info {
  position: static !important;
  display: none !important;
}

/* ---------------------------------------------------------------------------
   Full-page forms and dense modals
   --------------------------------------------------------------------------- */

.tt-fullpage-modal {
  background: var(--tt-page-bg) !important;
}

.tt-fullpage-modal .modal,
.tt-fullpage-modal .modal-content,
.tt-fullpage-modal .campaign-modal,
.tt-fullpage-modal .brand-modal,
.tt-fullpage-modal .talent-modal {
  width: min(1120px, calc(100vw - var(--tt-sidebar-w) - 44px)) !important;
  max-width: 1120px !important;
  margin: 18px auto !important;
  border: 1px solid var(--tt-line) !important;
  border-radius: var(--tt-card-radius) !important;
  background: #ffffff !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

.tt-fullpage-modal .modal-header,
.tt-fullpage-modal .campaign-modal-header,
.tt-fullpage-modal .brand-modal-header,
.tt-fullpage-modal .talent-modal-header {
  min-height: 58px !important;
  padding: 14px 18px !important;
  border-bottom: 1px solid var(--tt-line) !important;
  background: #ffffff !important;
}

.tt-fullpage-modal .modal-header h2,
.tt-fullpage-modal .modal-header h3 {
  margin: 0 !important;
  font-size: 18px !important;
  line-height: 1.2 !important;
}

.tt-fullpage-modal .modal-body,
.tt-fullpage-modal form,
.tt-fullpage-modal .modal-form {
  padding: 16px 18px 88px !important;
}

.tt-fullpage-modal .form-section,
.tt-fullpage-modal .cform-section,
.tt-fullpage-modal details,
.tt-fullpage-modal .cv2-section {
  margin: 0 0 10px !important;
  border: 1px solid var(--tt-line) !important;
  border-radius: var(--tt-card-radius) !important;
  background: #ffffff !important;
  overflow: hidden !important;
}

.tt-fullpage-modal .form-section summary,
.tt-fullpage-modal .cform-section summary,
.tt-fullpage-modal details summary {
  min-height: 44px !important;
  padding: 0 14px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 13px !important;
  font-weight: 720 !important;
}

.tt-fullpage-modal .form-grid,
.tt-fullpage-modal .cv2-row,
.tt-fullpage-modal .cform-grid,
.tt-fullpage-modal .archive-form-grid,
.tt-fullpage-modal .template-meta-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 12px !important;
}

.tt-fullpage-modal label,
.tt-fullpage-modal .cv2-field label,
.tt-fullpage-modal .cform-field label {
  color: #667085 !important;
  font-size: 11px !important;
  font-weight: 760 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

.tt-fullpage-modal input,
.tt-fullpage-modal select,
.tt-fullpage-modal textarea {
  min-height: 34px !important;
  border: 1px solid #cfd6e2 !important;
  border-radius: 6px !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
}

.tt-fullpage-modal textarea {
  min-height: 74px !important;
}

.tt-fullpage-modal .modal-footer,
.tt-fullpage-modal .template-editor-footer,
.tt-fullpage-modal form > .modal-footer {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 4 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 12px 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  border-top: 1px solid var(--tt-line) !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 -10px 26px rgba(15, 23, 42, 0.04) !important;
}

.tt-fullpage-modal .modal-footer .btn-danger {
  margin-right: auto !important;
}

.tt-fullpage-modal .modal-footer button,
.tt-fullpage-modal .template-editor-footer button {
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 14px !important;
  border-radius: 6px !important;
  font-size: 13px !important;
}

/* ---------------------------------------------------------------------------
   Admin profile/settings
   --------------------------------------------------------------------------- */

.tt-admin-profile {
  z-index: 160 !important;
}

.tt-admin-profile-menu {
  min-width: 232px !important;
  border-radius: 8px !important;
  border: 1px solid var(--tt-line) !important;
  box-shadow: 0 18px 44px rgba(15, 23, 42, 0.14) !important;
}

#tt-account-modal .modal-dialog,
#tt-prefs-modal .modal-dialog,
#tt-branding-modal .modal-dialog {
  border-radius: var(--tt-card-radius) !important;
}

body.tt-theme-dark #dashboard-view > .container > header,
body.tt-theme-dark #dashboard-view .talent-header,
body.tt-theme-dark #dashboard-view .card,
body.tt-theme-dark #dashboard-view .talent-panel,
body.tt-theme-dark #templates-container .tt-view {
  background: #101827 !important;
  color: #e5e7eb !important;
  border-color: rgba(148, 163, 184, 0.25) !important;
}

body.tt-theme-dark,
body.tt-theme-dark #dashboard-view > .container > main,
body.tt-theme-dark #dashboard-view .talent-main {
  background: #0b1120 !important;
}

body.tt-theme-dark #dashboard-view h1,
body.tt-theme-dark #dashboard-view h2,
body.tt-theme-dark #dashboard-view h3,
body.tt-theme-dark #templates-container .tt-view-header h1 {
  color: #f8fafc !important;
}

body.tt-theme-dark #dashboard-view p,
body.tt-theme-dark #dashboard-view .talent-muted,
body.tt-theme-dark #templates-container .tt-view-header p {
  color: #94a3b8 !important;
}

/* ---------------------------------------------------------------------------
   Contract preview and standalone invitation preview
   --------------------------------------------------------------------------- */

.tt-contract-preview-fullpage {
  left: var(--tt-sidebar-w) !important;
  z-index: 95 !important;
  background: var(--tt-page-bg) !important;
}

.tt-contract-preview-header {
  height: 56px !important;
  padding: 0 18px !important;
}

.tt-contract-preview-body {
  padding: 24px !important;
  background: #eef2f7 !important;
}

.tt-contract-preview-body .tt-preview-content {
  width: 794px !important;
  min-height: 1123px !important;
  padding: 74px 82px !important;
  border-radius: 4px !important;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
  font-size: 12px !important;
  line-height: 18px !important;
}

body.tt-contract-standalone {
  padding: 0 !important;
  display: block !important;
  background: #eef2f7 !important;
}

body.tt-contract-standalone .contract-container {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  border-radius: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.tt-contract-standalone .contract-header {
  min-height: 64px !important;
  padding: 14px clamp(18px, 4vw, 56px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  text-align: left !important;
  border-bottom: 1px solid var(--tt-line) !important;
  background: #ffffff !important;
  border-radius: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
}

body.tt-contract-standalone .contract-header-logo {
  max-width: 170px !important;
  margin: 0 !important;
}

body.tt-contract-standalone .contract-header h1 {
  font-size: 18px !important;
  line-height: 1.2 !important;
}

body.tt-contract-standalone .contract-header p {
  margin: 4px 0 0 !important;
  font-size: 12.5px !important;
}

body.tt-contract-standalone .contract-content {
  max-height: none !important;
  overflow: visible !important;
  width: 794px !important;
  max-width: calc(100vw - 48px) !important;
  min-height: 1123px !important;
  margin: 28px auto 44px !important;
  padding: 74px 82px !important;
  background: #ffffff !important;
  border-radius: 2px !important;
  box-shadow: 0 12px 34px rgba(15, 23, 42, 0.1), 0 0 0 1px rgba(15, 23, 42, 0.06) !important;
  color: #111827 !important;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
  font-size: 12px !important;
  line-height: 18px !important;
}

body.tt-contract-standalone .contract-content p,
body.tt-contract-standalone .contract-content li,
body.tt-contract-standalone .contract-content span,
body.tt-contract-standalone .contract-content strong,
body.tt-contract-standalone .contract-content b,
body.tt-contract-standalone .contract-content em,
body.tt-contract-standalone .contract-content i {
  font-size: inherit !important;
  line-height: inherit !important;
}

body.tt-contract-standalone .contract-content *,
.tt-contract-preview-body .tt-preview-content * {
  font-family: inherit !important;
}

/* Generic portal header styles must not turn the contract title into another
   framed card inside the A4 page. */
body.tt-contract-standalone .contract-content header.contract-title,
.tt-contract-preview-body .tt-preview-content header.contract-title {
  margin: 0 0 0.5rem !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

/* ---------------------------------------------------------------------------
   Signature dialogs across Admin, Talent and invitation link
   --------------------------------------------------------------------------- */

.signature-modal,
#signature-modal,
.talent-signature-modal,
.talent-modal-overlay:has(.signature-pad-container) {
  background: rgba(15, 23, 42, 0.48) !important;
  backdrop-filter: blur(6px) !important;
}

.signature-modal-content,
#signature-modal .signature-modal-content,
.talent-signature-modal .talent-modal,
.talent-modal:has(.signature-pad-container) {
  width: min(760px, calc(100vw - 28px)) !important;
  max-width: 760px !important;
  max-height: calc(100vh - 32px) !important;
  border-radius: var(--tt-card-radius) !important;
  border: 1px solid var(--tt-line) !important;
  background: #ffffff !important;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.22) !important;
  overflow: hidden !important;
}

.signature-modal-header,
#signature-modal .signature-modal-header,
.talent-modal-header:has(+ .signature-pad-container) {
  min-height: 58px !important;
  padding: 14px 20px !important;
  border-bottom: 1px solid var(--tt-line) !important;
}

.signature-modal-header h2,
#signature-modal .signature-modal-header h2,
.talent-modal-header h2 {
  margin: 0 !important;
  font-size: 18px !important;
  line-height: 1.2 !important;
  font-weight: 760 !important;
}

.signature-modal-body,
#signature-modal .signature-modal-body {
  padding: 18px 20px !important;
}

.signature-instruction,
#signature-modal .signature-instruction {
  margin: 0 0 14px !important;
  padding: 10px 12px !important;
  border-radius: 6px !important;
  background: #f8fafc !important;
  border: 1px solid var(--tt-line) !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
}

.signature-pad-container,
.signature-canvas-container,
#signature-pad-container {
  border: 1px solid #cfd6e2 !important;
  border-radius: 6px !important;
  background: #ffffff !important;
  padding: 8px !important;
}

.signature-pad-container canvas,
.signature-canvas-container canvas,
#signature-pad {
  width: 100% !important;
  height: 220px !important;
  min-height: 220px !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: linear-gradient(#ffffff 0 0), repeating-linear-gradient(0deg, transparent 0 33px, #f1f4f8 34px) !important;
}

.signature-actions,
.signature-modal-footer,
#signature-modal .signature-actions,
#signature-modal .signature-modal-footer {
  padding: 14px 20px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  border-top: 1px solid var(--tt-line) !important;
  background: #ffffff !important;
}

.signature-actions button,
.signature-modal-footer button,
#signature-modal button {
  min-height: 36px !important;
  border-radius: 6px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

/* ---------------------------------------------------------------------------
   Smaller, calmer status pills
   --------------------------------------------------------------------------- */

.status-badge,
.contract-status-badge,
.payment-status-badge,
.talent-status-badge,
.admin-table-status,
.invoice-table-status,
.invoice-status,
.contract-status,
.cooperation-status,
.signature-status-badge,
.rv-address-status-badge,
.talent-status-pill {
  min-height: 20px !important;
  padding: 2px 7px !important;
  border-radius: 999px !important;
  font-size: 8.4px !important;
  line-height: 1.25 !important;
  font-weight: 720 !important;
  letter-spacing: 0.01em !important;
  white-space: nowrap !important;
}

/* ---------------------------------------------------------------------------
   Responsive stability
   --------------------------------------------------------------------------- */

@media (max-width: 1180px) {
  :root {
    --tt-sidebar-w: 216px !important;
  }

  #templates-container .tt-view-header,
  #tt-view-editor .tt-view-header--editor {
    grid-template-columns: 1fr !important;
    align-items: flex-start !important;
  }

  #templates-container .tt-view-header-actions {
    width: 100% !important;
    justify-content: flex-start !important;
  }

  #tt-editor-paper-stage.tt-paper-stage {
    justify-content: flex-start !important;
  }

  .tt-editor-side-toolbar {
    width: 194px !important;
    flex-basis: 194px !important;
  }
}

@media (max-width: 900px) {
  :root {
    --tt-sidebar-w: 64px !important;
  }

  #dashboard-view .admin-main-nav,
  #dashboard-view .talent-main > .dashboard-tabs {
    padding: 10px 8px !important;
  }

  #dashboard-view .admin-main-nav .nav-label,
  #dashboard-view .talent-main > .dashboard-tabs .nav-label {
    display: none !important;
  }

  #dashboard-view .admin-main-nav .view-btn,
  #dashboard-view .admin-main-nav .admin-nav-subitem,
  #dashboard-view .talent-main > .dashboard-tabs .dashboard-tab,
  #dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab {
    justify-content: center !important;
    padding: 0 !important;
  }

  #dashboard-view .admin-main-nav .admin-nav-subgroup,
  #dashboard-view .talent-main > .dashboard-tabs .dashboard-subgroup {
    margin-left: 0 !important;
    padding-left: 0 !important;
    border-left: 0 !important;
  }

  #dashboard-view main > .admin-main-section,
  #dashboard-view .talent-main > .talent-panel {
    padding: 12px !important;
  }

  #tt-editor-page-rail.tt-editor-page-rail {
    display: none !important;
  }

  #tt-editor-paper-stage .tt-paper-sheet,
  #tt-editor-paper-stage .tt-paper-workspace {
    width: min(794px, calc(100vw - 108px)) !important;
    flex-basis: auto !important;
  }

  .tt-editor-side-toolbar {
    display: none !important;
  }

  /* V95e6: Template editor sidebar ALWAYS visible (full-screen view, not modal).
     Override the global hide so toolbar remains accessible on all viewports. */
  #tt-editor-paper-stage .tt-editor-side-toolbar {
    display: flex !important;
    flex-direction: column !important;
  }

  body.tt-contract-standalone .contract-content,
  .tt-contract-preview-body .tt-preview-content {
    width: calc(100vw - 36px) !important;
    padding: 42px 32px !important;
  }
}

@media (max-width: 620px) {
  :root {
    --tt-header-h: 58px !important;
  }

  #dashboard-view > .container > header,
  #dashboard-view .talent-header {
    padding: 0 10px !important;
  }

  #dashboard-view .header-content .logo,
  #dashboard-view .talent-header-logo {
    height: 36px !important;
    max-width: 160px !important;
  }

  #templates-container .tt-view {
    min-height: calc(100vh - 88px) !important;
  }

  #template-type-list.tt-template-grid {
    grid-template-columns: 1fr !important;
    padding: 12px !important;
  }

  #templates-container .tt-view-header-actions .tt-search-input,
  #templates-container .tt-view-header input[type="search"],
  #templates-container .tt-view-header button {
    width: 100% !important;
  }

  .tt-fullpage-modal .modal,
  .tt-fullpage-modal .modal-content,
  .tt-fullpage-modal .campaign-modal,
  .tt-fullpage-modal .brand-modal,
  .tt-fullpage-modal .talent-modal {
    width: calc(100vw - var(--tt-sidebar-w) - 18px) !important;
    margin: 8px !important;
  }
}

/* ---------------------------------------------------------------------------
   V93 final hardening
   Older layers contain centered template headers and mobile dropdown sidebars.
   Keep the final product shell deterministic on every viewport.
   --------------------------------------------------------------------------- */

html body #templates-container.tt-template-app .tt-view > .tt-view-header {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  justify-items: stretch !important;
  text-align: left !important;
}

html body #templates-container.tt-template-app .tt-view > .tt-view-header > .tt-view-header-title,
html body #templates-container.tt-template-app .tt-view > .tt-view-header > .tt-view-header-left,
html body #templates-container.tt-template-app .tt-view-header-left .tt-view-header-title,
html body #templates-container.tt-template-app .tt-editor-title-block {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  justify-self: start !important;
  min-width: 0 !important;
  max-width: 100% !important;
  text-align: left !important;
}

html body #templates-container.tt-template-app .tt-view-header-left {
  flex-direction: row !important;
  align-items: center !important;
  gap: 12px !important;
}

html body #templates-container.tt-template-app .tt-view-header h1,
html body #templates-container.tt-template-app .tt-view-header p,
html body #templates-container.tt-template-app .tt-editor-meta {
  width: auto !important;
  max-width: min(760px, 100%) !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  text-align: left !important;
  transform: none !important;
}

html body #templates-container.tt-template-app #tt-view-placeholders .tt-view-header {
  grid-template-columns: minmax(0, 1fr) auto !important;
}

html body #templates-container.tt-template-app .placeholder-table-wrap {
  margin: 16px !important;
  max-width: calc(100% - 32px) !important;
}

@media (max-width: 900px) {
  html body {
    overflow-x: hidden !important;
  }

  html body #dashboard-view > .container > main,
  html body #dashboard-view .talent-main {
    display: flex !important;
    flex-direction: row !important;
    grid-template-columns: none !important;
    width: 100vw !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }

  html body #dashboard-view .admin-main-nav,
  html body #dashboard-view main > .admin-main-nav,
  html body #dashboard-view .talent-main > .dashboard-tabs,
  html body .talent-shell .talent-main > .dashboard-tabs,
  html body .talent-shell .dashboard-tabs {
    position: sticky !important;
    top: var(--tt-header-h) !important;
    display: flex !important;
    flex: 0 0 64px !important;
    width: 64px !important;
    min-width: 64px !important;
    max-width: 64px !important;
    height: calc(100vh - var(--tt-header-h)) !important;
    margin: 0 !important;
    padding: 10px 8px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    flex-direction: column !important;
    gap: 4px !important;
    background: var(--tt-sidebar-bg) !important;
    border: 0 !important;
    border-right: 1px solid var(--tt-sidebar-border) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    z-index: 80 !important;
  }

  html body #dashboard-view .admin-main-nav:hover,
  html body #dashboard-view .admin-main-nav:focus-within,
  html body #dashboard-view .talent-main > .dashboard-tabs:hover,
  html body #dashboard-view .talent-main > .dashboard-tabs:focus-within {
    flex-basis: 64px !important;
    width: 64px !important;
    min-width: 64px !important;
    max-width: 64px !important;
  }

  html body #dashboard-view .admin-main-nav::before,
  html body #dashboard-view .admin-main-nav::after,
  html body #dashboard-view .talent-main > .dashboard-tabs::before,
  html body #dashboard-view .talent-main > .dashboard-tabs::after {
    display: none !important;
    content: none !important;
  }

  html body #dashboard-view .admin-main-nav > *,
  html body #dashboard-view .talent-main > .dashboard-tabs > * {
    display: inline-flex !important;
  }

  html body #dashboard-view .admin-main-nav .nav-label,
  html body #dashboard-view .talent-main > .dashboard-tabs .nav-label {
    display: none !important;
  }

  html body #dashboard-view .admin-main-nav .view-btn,
  html body #dashboard-view .admin-main-nav .admin-nav-subitem,
  html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-tab,
  html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab {
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    min-height: 38px !important;
    padding: 0 !important;
    justify-content: center !important;
  }

  html body #dashboard-view .admin-main-nav .admin-nav-subgroup,
  html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subgroup {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }

  html body #dashboard-view .admin-main-nav .admin-nav-subgroup.tt-hover-open,
  html body #dashboard-view .admin-main-nav .admin-nav-subgroup.is-active-parent,
  html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subgroup.tt-hover-open,
  html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subgroup.is-active-parent {
    display: flex !important;
  }

  html body #dashboard-view main > .admin-main-section,
  html body #dashboard-view .talent-main > .talent-panel {
    flex: 1 1 auto !important;
    width: calc(100vw - 64px) !important;
    max-width: calc(100vw - 64px) !important;
    min-width: 0 !important;
  }
}

@media (max-width: 620px) {
  html body #templates-container.tt-template-app .tt-view > .tt-view-header {
    grid-template-columns: 1fr !important;
    align-items: flex-start !important;
  }

  html body #templates-container.tt-template-app .tt-view-header-actions {
    width: 100% !important;
    justify-content: stretch !important;
  }

  html body #templates-container.tt-template-app .tt-view-header-actions > * {
    width: 100% !important;
  }
}

/* Shell-specificity lock. Earlier V87 CSS defined a hard 54px header with
   stronger selectors; V93 uses one shared 64px shell for Admin and Talent. */
html body #dashboard-view > .container > header,
html body #dashboard-view header.admin-header,
html body #dashboard-view > .container > header:first-of-type,
html body #dashboard-view.dashboard-view > .container > header,
html body #dashboard-view.talent-shell .talent-header,
html body .talent-shell > .talent-header,
html body .talent-shell .talent-header,
html body #dashboard-view .talent-header {
  height: var(--tt-header-h) !important;
  min-height: var(--tt-header-h) !important;
  max-height: var(--tt-header-h) !important;
  padding: 0 18px !important;
  display: flex !important;
  align-items: center !important;
  border-bottom: 1px solid var(--tt-line) !important;
}

html body #dashboard-view header .header-content,
html body #dashboard-view > .container > header > .header-content,
html body #dashboard-view .talent-header {
  height: var(--tt-header-h) !important;
  min-height: var(--tt-header-h) !important;
  max-height: var(--tt-header-h) !important;
}

html body #dashboard-view .admin-main-nav,
html body #dashboard-view main > .admin-main-nav,
html body #dashboard-view .talent-main > .dashboard-tabs,
html body .talent-shell .dashboard-tabs {
  top: var(--tt-header-h) !important;
  height: calc(100vh - var(--tt-header-h)) !important;
}

html body #dashboard-view > .container > main,
html body #dashboard-view .talent-main {
  min-height: calc(100vh - var(--tt-header-h)) !important;
}

@media (max-width: 620px) {
  html body #dashboard-view > .container > header,
  html body #dashboard-view header.admin-header,
  html body #dashboard-view > .container > header:first-of-type,
  html body #dashboard-view.dashboard-view > .container > header,
  html body #dashboard-view.talent-shell .talent-header,
  html body .talent-shell > .talent-header,
  html body .talent-shell .talent-header,
  html body #dashboard-view .talent-header,
  html body #dashboard-view header .header-content,
  html body #dashboard-view > .container > header > .header-content {
    height: var(--tt-header-h) !important;
    min-height: var(--tt-header-h) !important;
    max-height: var(--tt-header-h) !important;
  }
}

/* Template editor final alignment: keep back button, title and metadata in one
   clean horizontal header row instead of letting the title spill into tabs. */
html body #templates-container.tt-template-app .tt-view > .tt-view-header > .tt-view-header-left {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 12px !important;
}

/* V95c: slim template-editor toolbars so more of the A4 sheet is visible */
html body #templates-container.tt-template-app #tt-view-editor > .tt-view-header--editor {
  min-height: 48px !important;
  align-items: center !important;
  padding-top: 6px !important;
  padding-bottom: 6px !important;
}

html body #templates-container.tt-template-app #tt-view-editor .tt-editor-title-block {
  gap: 1px !important;
  justify-content: center !important;
}

html body #templates-container.tt-template-app #tt-view-editor .tt-editor-meta {
  font-size: 10px !important;
  line-height: 1.2 !important;
}

html body #templates-container.tt-template-app #tt-view-editor .tt-editor-lang-bar {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

@media (max-width: 620px) {
  html body #templates-container.tt-template-app #tt-view-placeholders > .tt-view-header {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 12px !important;
    overflow: visible !important;
  }

  html body #templates-container.tt-template-app #tt-view-placeholders > .tt-view-header > .tt-view-header-left {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    width: 100% !important;
    gap: 8px !important;
  }

  html body #templates-container.tt-template-app #tt-view-placeholders .tt-view-header-title {
    width: 100% !important;
    max-width: 100% !important;
  }

  html body #templates-container.tt-template-app #tt-view-placeholders .tt-view-header h1,
  html body #templates-container.tt-template-app #tt-view-placeholders .tt-view-header p {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
  }

  html body #templates-container.tt-template-app #tt-view-placeholders .tt-view-header p {
    display: none !important;
  }

  html body #templates-container.tt-template-app #tt-view-placeholders .tt-view-header-actions {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 8px !important;
  }

  html body #templates-container.tt-template-app #tt-view-placeholders .tt-view-header-actions > * {
    width: 100% !important;
  }

  html body #templates-container.tt-template-app .tt-view > .tt-view-header > .tt-view-header-left {
    width: 100% !important;
    align-items: flex-start !important;
  }

  html body #tt-view-placeholders .placeholder-table-wrap {
    margin-top: 12px !important;
    max-height: calc(100vh - 300px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }

  html body #tt-view-placeholders .placeholder-table,
  html body #tt-view-placeholders .placeholder-table thead,
  html body #tt-view-placeholders .placeholder-table tbody,
  html body #tt-view-placeholders .placeholder-table tr,
  html body #tt-view-placeholders .placeholder-table td {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  html body #tt-view-placeholders .placeholder-table thead {
    display: none !important;
  }

  html body #tt-view-placeholders .placeholder-table tr {
    padding: 12px !important;
    border-bottom: 1px solid var(--tt-line) !important;
    background: #ffffff !important;
  }

  html body #tt-view-placeholders .placeholder-table td {
    padding: 4px 0 !important;
    border-bottom: 0 !important;
    font-size: 12.5px !important;
    white-space: normal !important;
  }

  html body #tt-view-placeholders .placeholder-table td:nth-child(1)::before {
    content: "Tag";
  }

  html body #tt-view-placeholders .placeholder-table td:nth-child(2)::before {
    content: "Feldname";
  }

  html body #tt-view-placeholders .placeholder-table td:nth-child(3)::before {
    content: "Beschreibung";
  }

  html body #tt-view-placeholders .placeholder-table td:nth-child(4)::before {
    content: "Datentyp";
  }

  html body #tt-view-placeholders .placeholder-table td:nth-child(5)::before {
    content: "Kategorie";
  }

  html body #tt-view-placeholders .placeholder-table td::before {
    display: block !important;
    margin-bottom: 2px !important;
    color: #667085 !important;
    font-size: 10px !important;
    font-weight: 760 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
  }
}

/* ---------------------------------------------------------------------------
   V93B signature modal lock: old Admin/Sign markup uses generic modal classes
   --------------------------------------------------------------------------- */

html body #signature-modal.modal-overlay:not(.hidden),
html body #signature-modal.signature-modal.active {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 16px !important;
  overflow: hidden !important;
  background: rgba(15, 23, 42, 0.48) !important;
  backdrop-filter: blur(6px) !important;
  z-index: 10000 !important;
}

html body #signature-modal.signature-modal:not(.active) {
  display: none !important;
}

html body #signature-modal > .modal,
html body #signature-modal > .modal-large,
html body #signature-modal > .modal-dialog {
  width: min(780px, calc(100vw - 32px)) !important;
  max-width: 780px !important;
  max-height: calc(100vh - 32px) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  border: 1px solid var(--tt-line) !important;
  border-radius: var(--tt-card-radius) !important;
  background: #ffffff !important;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.24) !important;
}

html body #signature-modal .modal-header {
  flex: 0 0 auto !important;
  margin: 0 !important;
  min-height: 58px !important;
  padding: 14px 20px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  border-bottom: 1px solid var(--tt-line) !important;
  background: #ffffff !important;
}

html body #signature-modal .modal-header h2 {
  margin: 0 !important;
  font-size: 18px !important;
  line-height: 1.2 !important;
  font-weight: 760 !important;
  color: var(--tt-text) !important;
}

html body #signature-modal .modal-close {
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid transparent !important;
  border-radius: 6px !important;
  background: transparent !important;
  color: var(--tt-muted) !important;
  font-size: 24px !important;
  line-height: 1 !important;
}

html body #signature-modal .modal-close:hover {
  border-color: var(--tt-line) !important;
  background: #f8fafc !important;
  color: var(--tt-text) !important;
}

html body #signature-modal .modal-body,
html body #signature-modal .signature-content {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 18px 20px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  background: #ffffff !important;
}

html body #signature-modal .modal-body > .tt-paragraph,
html body #signature-modal .signature-instruction {
  margin: 0 0 14px !important;
  padding: 10px 12px !important;
  border: 1px solid var(--tt-line) !important;
  border-radius: 6px !important;
  background: #f8fafc !important;
  color: var(--tt-text) !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
}

html body #signature-modal .signature-section {
  margin: 0 0 18px !important;
  padding: 14px !important;
  border: 1px solid var(--tt-line) !important;
  border-radius: 8px !important;
  background: #ffffff !important;
}

html body #signature-modal .signature-section > label,
html body #signature-modal .signature-section h3 {
  margin: 0 0 10px !important;
  display: block !important;
  color: var(--tt-text) !important;
  font-size: 13px !important;
  line-height: 1.3 !important;
  font-weight: 760 !important;
}

html body #signature-modal .signature-section p {
  margin: 0 0 12px !important;
  color: var(--tt-muted) !important;
  font-size: 12.5px !important;
  line-height: 1.45 !important;
}

html body #signature-modal .signature-section canvas,
html body #signature-modal #signature-pad,
html body #signature-modal canvas[id^="signature-canvas-"] {
  width: 100% !important;
  height: 160px !important;
  min-height: 160px !important;
  max-height: 160px !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: linear-gradient(#ffffff 0 0), repeating-linear-gradient(0deg, transparent 0 31px, #f1f4f8 32px) !important;
}

html body #signature-modal .signature-section div[style*="border"],
html body #signature-modal .signature-section div[style*="background: #e0e0e0"] {
  margin: 0 0 10px !important;
  padding: 8px !important;
  border: 1px solid #cfd6e2 !important;
  border-radius: 6px !important;
  background: #ffffff !important;
}

html body #signature-modal .signature-section div[style*="display: flex"],
html body #signature-modal .signature-actions-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 8px !important;
}

html body #signature-modal .modal-footer {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 14px 20px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  border-top: 1px solid var(--tt-line) !important;
  background: #ffffff !important;
}

html body #signature-modal .modal-footer button,
html body #signature-modal .signature-actions-row button,
html body #signature-modal .signature-actions-row label,
html body #signature-modal .signature-section .btn-small {
  min-height: 34px !important;
  padding: 0 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 6px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

@media (max-width: 620px) {
  html body #signature-modal.modal-overlay:not(.hidden),
  html body #signature-modal.signature-modal.active {
    padding: 10px !important;
    align-items: center !important;
  }

  html body #signature-modal > .modal,
  html body #signature-modal > .modal-large,
  html body #signature-modal > .modal-dialog {
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    max-height: calc(100vh - 20px) !important;
  }

  html body #signature-modal .modal-body,
  html body #signature-modal .signature-content {
    padding: 14px !important;
  }

  html body #signature-modal .signature-section canvas,
  html body #signature-modal #signature-pad,
  html body #signature-modal canvas[id^="signature-canvas-"] {
    height: 140px !important;
    min-height: 140px !important;
    max-height: 140px !important;
  }

  html body #signature-modal .modal-footer {
    padding: 12px 14px !important;
  }

  html body #signature-modal .modal-footer button {
    flex: 1 1 0 !important;
  }
}

html body #signature-modal #signature-pad {
  box-sizing: border-box !important;
  border: 1px solid #cfd6e2 !important;
}

/* ---------------------------------------------------------------------------
   V93B mobile template headers: no overlapping action bars
   --------------------------------------------------------------------------- */

@media (max-width: 768px) {
  html body #templates-container.tt-template-app .tt-view > .tt-view-header {
    height: auto !important;
    min-height: 0 !important;
    padding: 12px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    overflow: hidden !important;
  }

  html body #templates-container.tt-template-app .tt-view > .tt-view-header > .tt-view-header-left,
  html body #templates-container.tt-template-app .tt-view > .tt-view-header > .tt-view-header-actions {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 8px !important;
  }

  html body #templates-container.tt-template-app .tt-view > .tt-view-header > .tt-view-header-left {
    flex-direction: column !important;
  }

  html body #templates-container.tt-template-app .tt-view > .tt-view-header > .tt-view-header-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-auto-flow: row !important;
    flex-direction: column !important;
  }

  html body #templates-container.tt-template-app .tt-view-header-title,
  html body #templates-container.tt-template-app .tt-view-header-title h1 {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  html body #templates-container.tt-template-app .tt-view-header-title p {
    display: none !important;
  }

  html body #templates-container.tt-template-app .tt-view-header-actions > *,
  html body #templates-container.tt-template-app .tt-view-header-actions input,
  html body #templates-container.tt-template-app .tt-view-header-actions button {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    grid-column: 1 / -1 !important;
  }

  html body #templates-container.tt-template-app .tt-view-body {
    min-width: 0 !important;
    overflow-x: hidden !important;
  }

  html body #templates-container.tt-template-app #tt-view-templates > .tt-view-header,
  html body #templates-container.tt-template-app #tt-view-placeholders > .tt-view-header {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  html body #templates-container.tt-template-app #tt-view-templates > .tt-view-header {
    min-height: 224px !important;
  }

  html body #templates-container.tt-template-app #tt-view-placeholders > .tt-view-header {
    min-height: 190px !important;
  }

  html body #templates-container.tt-template-app #tt-view-templates > .tt-view-header > .tt-view-header-actions,
  html body #templates-container.tt-template-app #tt-view-placeholders > .tt-view-header > .tt-view-header-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-auto-flow: row !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
  }

  html body #templates-container.tt-template-app #tt-view-templates > .tt-view-header > .tt-view-header-actions {
    min-height: 118px !important;
  }

  html body #templates-container.tt-template-app #tt-view-placeholders > .tt-view-header > .tt-view-header-actions {
    min-height: 80px !important;
  }

  html body #templates-container.tt-template-app #tt-view-templates > .tt-view-header > .tt-view-header-actions > *,
  html body #templates-container.tt-template-app #tt-view-placeholders > .tt-view-header > .tt-view-header-actions > * {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    grid-column: 1 / -1 !important;
  }
}

/* ---------------------------------------------------------------------------
   V94 Talent signature-template modal: fixed action row and scroll body
   --------------------------------------------------------------------------- */

html body #signature-template-modal.talent-modal-overlay:not(.hidden) {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 16px !important;
  overflow: hidden !important;
}

html body #signature-template-modal .talent-modal {
  width: min(860px, calc(100vw - 32px)) !important;
  max-width: min(860px, calc(100vw - 32px)) !important;
  max-height: calc(100dvh - 32px) !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto auto !important;
  padding: 0 !important;
  overflow: hidden !important;
}

html body #signature-template-modal .talent-modal-header {
  margin: 0 !important;
}

html body #signature-template-modal .signature-grid {
  min-height: 0 !important;
  overflow-y: auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.35fr) minmax(240px, 0.75fr) !important;
  gap: 18px !important;
  align-items: start !important;
  align-content: start !important;
  padding: 18px !important;
}

html body #signature-template-modal .signature-box {
  min-width: 0 !important;
}

html body #signature-template-modal #talent-signature-pad {
  height: clamp(170px, 26vh, 230px) !important;
}

html body #signature-template-modal .signature-actions {
  display: flex !important;
  justify-content: flex-start !important;
  gap: 8px !important;
}

html body #signature-template-modal .signature-actions button {
  flex: 0 1 auto !important;
  min-width: min(180px, 100%) !important;
}

html body #signature-template-modal #signature-error {
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 18px !important;
}

html body #signature-template-modal .signature-template-actions {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 12px 18px !important;
  border-top: 1px solid #e5e7eb !important;
  background: #ffffff !important;
}

html body #signature-template-modal .signature-template-actions button {
  min-width: 132px !important;
}

@media (max-width: 760px) {
  html body #templates-container.tt-template-app #tt-view-editor > .tt-view-header--editor {
    min-height: 0 !important;
  }

  html body #tt-view-editor .tt-editor-toolbar.template-editor-toolbar {
    padding: 10px 12px !important;
    overflow-x: auto !important;
    justify-content: flex-start !important;
  }

  html body #tt-editor-paper-stage.tt-paper-stage {
    height: auto !important;
    min-height: calc(100vh - 300px) !important;
    padding: 12px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    justify-content: stretch !important;
    background: #eef2f7 !important;
  }

  html body #tt-editor-paper-stage .tt-paper-workspace {
    width: calc(100vw - 100px) !important;
    max-width: calc(100vw - 100px) !important;
    display: block !important;
  }

  html body #tt-editor-page-rail.tt-editor-page-rail,
  html body #tt-editor-paper-stage .tt-editor-side-toolbar {
    display: none !important;
  }

  /* V95e7: Template editor sidebar ALWAYS visible — override 760px media hide.
     Template editor is full-screen, sidebar is essential. Contract editor (modal)
     can hide it on narrow viewports, but template editor can't. */
  html body #tt-editor-paper-stage .tt-editor-side-toolbar {
    display: flex !important;
    flex-direction: column !important;
  }

  html body #tt-editor-paper-stage .tt-paper-sheet {
    width: calc(100vw - 100px) !important;
    max-width: calc(100vw - 100px) !important;
    min-height: 680px !important;
    flex: 1 1 auto !important;
    border-radius: 6px !important;
    box-sizing: border-box !important;
  }

  /* V95e10: removed font-size / line-height / padding overrides — those
     caused the template editor to render DIFFERENTLY from the contract editor
     at < 760px viewports, breaking page-for-page parity. Now both editors
     share the same A4 metrics (Arial 12px / 1.45, 181/60/91/60 padding) at
     all viewports. Only box-model/width/flex hints remain for narrow stages. */
  html body #template-rich-editor.tt-paper-content {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
    margin: 0 !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    hyphens: auto !important;
  }

  html body #template-rich-editor.tt-paper-content h1,
  html body #template-rich-editor.tt-paper-content h2,
  html body #template-rich-editor.tt-paper-content h3 {
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
  }

  html body #signature-template-modal.talent-modal-overlay:not(.hidden) {
    align-items: stretch !important;
    padding: 10px !important;
  }

  html body #signature-template-modal .talent-modal {
    width: 100% !important;
    max-width: 100% !important;
    height: calc(100vh - 64px) !important;
    max-height: calc(100vh - 64px) !important;
  }

  html body #signature-template-modal .signature-grid {
    grid-template-columns: 1fr !important;
    grid-auto-rows: auto !important;
    gap: 14px !important;
    padding: 14px !important;
  }

  html body #signature-template-modal #talent-signature-pad {
    height: 158px !important;
  }

  html body #signature-template-modal .signature-actions,
  html body #signature-template-modal .signature-template-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  html body #signature-template-modal .signature-actions button,
  html body #signature-template-modal .signature-template-actions button {
    width: 100% !important;
    min-width: 0 !important;
  }
}

/* ============================================================================
   V95 annotated screenshot corrections
   ============================================================================ */

:root {
  --tt-sidebar-w: 248px !important;
}

/* Fixed shell: the navigation background must never end while content scrolls. */
html body #dashboard-view > .container > header,
html body #dashboard-view header.admin-header,
html body #dashboard-view > .container > header:first-of-type,
html body #dashboard-view.talent-shell .talent-header,
html body .talent-shell > .talent-header,
html body .talent-shell .talent-header,
html body #dashboard-view .talent-header {
  position: sticky !important;
  z-index: 300 !important;
  overflow: visible !important;
}

html body #dashboard-view .header-content,
html body #dashboard-view > .container > header > .header-content,
html body #dashboard-view .header-actions,
html body #dashboard-view.talent-shell .talent-header > .talent-header-actions,
html body .talent-shell .talent-header > .talent-header-actions,
html body #dashboard-view .talent-header,
html body #dashboard-view .talent-header-actions {
  overflow: visible !important;
}

html body #dashboard-view .admin-main-nav,
html body #dashboard-view main > .admin-main-nav,
html body #dashboard-view .talent-main > .dashboard-tabs,
html body .talent-shell .dashboard-tabs {
  position: fixed !important;
  top: var(--tt-header-h) !important;
  left: 0 !important;
  bottom: 0 !important;
  z-index: 210 !important;
  height: auto !important;
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  max-height: calc(100dvh - var(--tt-header-h)) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

/* The older Talent stylesheet uses a two-column grid. Once the navigation is
   fixed, that grid column would reserve the sidebar width a second time. */
html body #dashboard-view.talent-shell,
html body #dashboard-view.talent-shell .talent-main,
html body .talent-shell .talent-main {
  width: 100vw !important;
  max-width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body #dashboard-view.talent-shell .talent-main,
html body .talent-shell .talent-main {
  display: block !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  grid-template-areas: none !important;
  overflow-x: hidden !important;
}

html body #dashboard-view.talent-shell .talent-main > .talent-global-alerts,
html body .talent-shell .talent-main > .talent-global-alerts {
  box-sizing: border-box !important;
  width: calc(100vw - var(--tt-sidebar-w)) !important;
  max-width: calc(100vw - var(--tt-sidebar-w)) !important;
  margin-left: var(--tt-sidebar-w) !important;
}

/* ==========================================================================
   V100 final portal frame: one geometry for Admin and Talent.
   ========================================================================== */
html body {
  --tt-header-h: 72px !important;
  --tt-sidebar-w: 248px !important;
  --tt-content-pad: 22px !important;
}

html body #dashboard-view > .container > header,
html body #dashboard-view > .talent-header,
html body #dashboard-view.talent-shell > .talent-header {
  position: fixed !important;
  inset: 0 0 auto 0 !important;
  z-index: 1400 !important;
  width: 100vw !important;
  height: var(--tt-header-h) !important;
  min-height: var(--tt-header-h) !important;
  max-height: var(--tt-header-h) !important;
  padding: 0 24px !important;
  background: #ffffff !important;
  border: 0 !important;
  border-bottom: 1px solid var(--tt-line, #e5e7eb) !important;
  border-radius: 0 !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04) !important;
}

html body #dashboard-view > .container > header > .header-content,
html body #dashboard-view > .talent-header,
html body #dashboard-view.talent-shell > .talent-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
}

html body #dashboard-view .header-content > img.logo,
html body #dashboard-view .logo,
html body #dashboard-view .talent-header-logo {
  display: block !important;
  width: auto !important;
  height: 32px !important;
  max-width: 172px !important;
  max-height: 62px !important;
  margin: 0 !important;
  object-fit: contain !important;
  transform: none !important;
}

html body #dashboard-view .header-actions,
html body #dashboard-view .talent-header-actions {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 10px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

html body #dashboard-view .lang-toggle-btn,
html body #dashboard-view .tt-notif-toggle-btn {
  height: 40px !important;
  min-height: 40px !important;
  border-radius: 8px !important;
}

html body #dashboard-view .talent-profile-menu {
  position: relative !important;
  z-index: 1500 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body #dashboard-view .talent-profile-menu > summary {
  height: 40px !important;
  min-height: 40px !important;
  max-width: min(288px, calc(100vw - 188px)) !important;
  padding: 3px 12px 3px 4px !important;
  border-radius: 999px !important;
}

html body #dashboard-view > .container > main,
html body #dashboard-view > .talent-main,
html body #dashboard-view.talent-shell > .talent-main {
  width: 100vw !important;
  max-width: 100vw !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: var(--tt-header-h) 0 0 !important;
  overflow-x: hidden !important;
  background: var(--tt-page-bg, #f5f6fa) !important;
}

html body #dashboard-view .admin-main-nav,
html body #dashboard-view > .container > main > .admin-main-nav,
html body #dashboard-view .talent-main > .dashboard-tabs,
html body #dashboard-view.talent-shell > .talent-main > .dashboard-tabs {
  position: fixed !important;
  top: var(--tt-header-h) !important;
  left: 0 !important;
  bottom: 0 !important;
  z-index: 500 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  width: var(--tt-sidebar-w) !important;
  min-width: var(--tt-sidebar-w) !important;
  max-width: var(--tt-sidebar-w) !important;
  height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 !important;
  padding: 14px 12px !important;
  overflow-y: auto !important;
  background: var(--tt-sidebar-bg, #111827) !important;
  border-right: 1px solid var(--tt-sidebar-border, rgba(255,255,255,0.08)) !important;
  border-radius: 0 !important;
}

html body #dashboard-view .admin-main-nav .view-btn,
html body #dashboard-view .admin-main-nav .admin-nav-subitem,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-tab,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  gap: 12px !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
}

html body #dashboard-view .admin-main-nav .nav-icon,
html body #dashboard-view .talent-main > .dashboard-tabs .nav-icon,
html body #dashboard-view .admin-main-nav svg,
html body #dashboard-view .talent-main > .dashboard-tabs svg {
  width: 18px !important;
  height: 18px !important;
  flex: 0 0 18px !important;
}

html body #dashboard-view main > .admin-main-section,
html body #dashboard-view.dashboard-view > .container > main > .admin-main-section,
html body #dashboard-view .talent-main > .talent-panel,
html body #dashboard-view.talent-shell > .talent-main > .talent-panel,
html body #dashboard-view.talent-shell .talent-main > .talent-panel {
  box-sizing: border-box !important;
  width: calc(100vw - var(--tt-sidebar-w)) !important;
  max-width: calc(100vw - var(--tt-sidebar-w)) !important;
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 0 0 var(--tt-sidebar-w) !important;
  padding: var(--tt-content-pad) !important;
  background: var(--tt-page-bg, #f5f6fa) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html body #dashboard-view main > .admin-main-section > .card,
html body #dashboard-view #overview-admin-section > .card {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html body #dashboard-view .admin-main-section > .card > .card-header,
html body #dashboard-view .admin-main-section > .card > .card-body,
html body #dashboard-view .admin-main-section > .card > .table-responsive,
html body #dashboard-view .admin-main-section > .card > .admin-table-wrap {
  background: transparent !important;
}

html body #dashboard-view .dash-overview-header,
html body #dashboard-view .talent-panel-header-row {
  margin: 0 0 18px !important;
  padding: 0 0 18px !important;
  border-bottom: 1px solid var(--tt-line, #e5e7eb) !important;
}

html body #dashboard-view .card-header--with-search,
html body #dashboard-view .modal-fullpage .card-header--with-search {
  display: grid !important;
  grid-template-columns: minmax(220px, 1fr) auto !important;
  align-items: end !important;
  gap: 12px !important;
  margin: 0 0 16px !important;
  padding: 0 0 14px !important;
  border-bottom: 1px solid var(--tt-line, #e5e7eb) !important;
}

html body #dashboard-view .card-header-actions,
html body #dashboard-view .admin-overview-controls {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
}

html body #dashboard-view .card-header-actions input,
html body #dashboard-view .card-header-actions select,
html body #dashboard-view .admin-overview-controls input,
html body #dashboard-view .admin-overview-controls select,
html body #dashboard-view .contract-search-input,
html body #dashboard-view .contract-filter-select {
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  padding: 0 12px !important;
}

html body #dashboard-view .btn-primary,
html body #dashboard-view .btn-secondary,
html body #dashboard-view .btn-icon {
  min-height: 36px !important;
  height: 36px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

html body #dashboard-view .btn-primary,
html body #dashboard-view .btn-secondary {
  padding: 0 12px !important;
}

html body #contracts-admin-section .card-header-actions,
html body #campaigns-admin-section .card-header-actions,
html body #invoices-admin-section .card-header-actions {
  max-width: min(100%, 920px) !important;
}

html body #dashboard-view .ac-inline-status,
html body #dashboard-view select.ac-inline-status {
  height: 28px !important;
  min-height: 28px !important;
  max-width: 180px !important;
  font-size: 11.5px !important;
  line-height: 1.1 !important;
}

html body #talent-form .talent-email-active-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: end !important;
  gap: 16px !important;
}

html body #talent-form .talent-active-toggle {
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 0 0 !important;
  padding: 0 12px !important;
  border: 1px solid var(--tt-line, #e5e7eb) !important;
  border-radius: 8px !important;
  background: #fff !important;
}

html body #admin-reminder-generator-section #close-admin-reminder-generator-btn {
  display: none !important;
}

html body #invitation-status-panel #status-brand,
html body #invitation-status-panel #status-talent,
html body #invitation-status-panel #status-management {
  min-height: 46px !important;
  padding: 2px 5px !important;
  gap: 10px !important;
}

html body #invitation-status-panel #status-brand-signature,
html body #invitation-status-panel #status-talent-signature,
html body #invitation-status-panel #status-management-signature {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 34px !important;
  max-width: 150px !important;
  min-height: 24px !important;
  height: 24px !important;
  padding: 0 8px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  background: #eef2f7 !important;
  color: #374151 !important;
}

@media (max-width: 900px) {
  html body {
    --tt-sidebar-w: 0px !important;
  }

  html body #dashboard-view .admin-main-nav,
  html body #dashboard-view .talent-main > .dashboard-tabs {
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }

  html body #dashboard-view main > .admin-main-section,
  html body #dashboard-view .talent-main > .talent-panel {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: 0 !important;
  }

  html body #dashboard-view .card-header--with-search {
    grid-template-columns: 1fr !important;
  }

  html body #dashboard-view .card-header-actions {
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
  }
}

/* V98 absolute final override: this must stay last. */
:root {
  --tt-header-h: 72px !important;
  --tt-sidebar-w: 248px !important;
  --tt-content-pad: 22px !important;
}

html body #dashboard-view,
html body #dashboard-view > .container,
html body #dashboard-view.talent-shell {
  width: 100vw !important;
  max-width: 100vw !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  background: var(--tt-page-bg) !important;
}

html body #dashboard-view > .container > header,
html body #dashboard-view > .talent-header,
html body #dashboard-view.talent-shell > .talent-header {
  position: fixed !important;
  inset: 0 0 auto 0 !important;
  z-index: 1400 !important;
  box-sizing: border-box !important;
  width: 100vw !important;
  height: var(--tt-header-h) !important;
  min-height: var(--tt-header-h) !important;
  max-height: var(--tt-header-h) !important;
  margin: 0 !important;
  padding: 0 24px !important;
  overflow: visible !important;
  background: #ffffff !important;
  border: 0 !important;
  border-bottom: 1px solid var(--tt-line) !important;
  border-radius: 0 !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04) !important;
  transform: none !important;
}

html body #dashboard-view > .container > header > .header-content,
html body #dashboard-view > .talent-header,
html body #dashboard-view.talent-shell > .talent-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body #dashboard-view .header-content > img.logo,
html body #dashboard-view .logo,
html body #dashboard-view .talent-header-logo {
  display: block !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: 32px !important;
  max-width: 172px !important;
  max-height: 62px !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  transform: none !important;
}

html body #dashboard-view .talent-header-brand {
  display: flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 220px !important;
  height: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body #dashboard-view .talent-header-brand > div {
  display: none !important;
}

html body #dashboard-view .header-actions,
html body #dashboard-view .talent-header-actions {
  position: static !important;
  display: inline-flex !important;
  flex: 0 1 auto !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 10px !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

html body #dashboard-view .lang-toggle-btn,
html body #dashboard-view .tt-notif-toggle-btn {
  flex: 0 0 auto !important;
  height: 40px !important;
  min-height: 40px !important;
  border-radius: 8px !important;
}

html body #dashboard-view .talent-profile-menu {
  position: relative !important;
  inset: auto !important;
  z-index: 1500 !important;
  flex: 0 0 auto !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

html body #dashboard-view .talent-profile-menu > summary {
  width: auto !important;
  max-width: min(288px, calc(100vw - 188px)) !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 3px 12px 3px 4px !important;
  overflow: hidden !important;
}

html body #dashboard-view > .container > main,
html body #dashboard-view > .talent-main,
html body #dashboard-view.talent-shell > .talent-main {
  position: relative !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100vw !important;
  max-width: 100vw !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: var(--tt-header-h) 0 0 !important;
  overflow-x: hidden !important;
  background: var(--tt-page-bg) !important;
  transform: none !important;
}

html body #dashboard-view .admin-main-nav,
html body #dashboard-view > .container > main > .admin-main-nav,
html body #dashboard-view .talent-main > .dashboard-tabs,
html body #dashboard-view.talent-shell > .talent-main > .dashboard-tabs {
  position: fixed !important;
  top: var(--tt-header-h) !important;
  left: 0 !important;
  bottom: 0 !important;
  z-index: 500 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 8px !important;
  box-sizing: border-box !important;
  width: var(--tt-sidebar-w) !important;
  min-width: var(--tt-sidebar-w) !important;
  max-width: var(--tt-sidebar-w) !important;
  height: calc(100dvh - var(--tt-header-h)) !important;
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  max-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 !important;
  padding: 14px 12px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  background: var(--tt-sidebar-bg) !important;
  border: 0 !important;
  border-right: 1px solid var(--tt-sidebar-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

html body #dashboard-view .admin-main-nav .view-btn,
html body #dashboard-view .admin-main-nav .admin-nav-subitem,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-tab,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  gap: 12px !important;
  border: 0 !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
  text-align: left !important;
}

html body #dashboard-view .admin-main-nav .nav-icon,
html body #dashboard-view .talent-main > .dashboard-tabs .nav-icon,
html body #dashboard-view .admin-main-nav .nav-icon svg,
html body #dashboard-view .talent-main > .dashboard-tabs .nav-icon svg {
  width: 18px !important;
  height: 18px !important;
}

html body #dashboard-view main > .admin-main-section,
html body #dashboard-view.dashboard-view > .container > main > .admin-main-section,
html body #dashboard-view .talent-main > .talent-panel,
html body #dashboard-view.talent-shell > .talent-main > .talent-panel,
html body #dashboard-view.talent-shell .talent-main > .talent-panel {
  box-sizing: border-box !important;
  width: calc(100vw - var(--tt-sidebar-w)) !important;
  max-width: calc(100vw - var(--tt-sidebar-w)) !important;
  min-width: 0 !important;
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 0 0 var(--tt-sidebar-w) !important;
  padding: var(--tt-content-pad) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--tt-page-bg) !important;
  box-shadow: none !important;
  transform: none !important;
}

html body #dashboard-view #overview-admin-section > .card {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html body #dashboard-view #overview-admin-section > .card > .dash-overview-header,
html body #dashboard-view .talent-panel-header-row {
  margin: 0 0 18px !important;
  padding: 0 0 18px !important;
  border-bottom: 1px solid var(--tt-line) !important;
}

@media (max-width: 760px) {
  :root {
    --tt-header-h: 64px !important;
    --tt-sidebar-w: 76px !important;
    --tt-content-pad: 12px !important;
  }

  html body #dashboard-view > .container > header,
  html body #dashboard-view > .talent-header,
  html body #dashboard-view.talent-shell > .talent-header {
    padding: 0 12px !important;
  }

  html body #dashboard-view .header-content > img.logo,
  html body #dashboard-view .logo,
  html body #dashboard-view .talent-header-logo {
    height: 30px !important;
    max-width: 120px !important;
  }
}

/* V95M end lock: final source of truth for the fixed Admin/Talent shell. */
html body #dashboard-view > .container > header,
html body #dashboard-view > .talent-header,
html body #dashboard-view.talent-shell > .talent-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 1400 !important;
  box-sizing: border-box !important;
  width: 100vw !important;
  height: var(--tt-header-h) !important;
  min-height: var(--tt-header-h) !important;
  max-height: var(--tt-header-h) !important;
  padding: 0 24px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid var(--tt-line) !important;
  border-radius: 0 !important;
}

html body #dashboard-view > .container > header > .header-content,
html body #dashboard-view > .talent-header,
html body #dashboard-view.talent-shell > .talent-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
}

html body #dashboard-view > .container > header > .header-content {
  height: 100% !important;
  min-height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
}

html body #dashboard-view .logo,
html body #dashboard-view .header-content .logo,
html body #dashboard-view .talent-header-logo {
  width: auto !important;
  height: 38px !important;
  max-width: 190px !important;
  object-fit: contain !important;
  flex: 0 0 auto !important;
}

html body #dashboard-view .header-actions,
html body #dashboard-view .talent-header-actions {
  position: static !important;
  display: inline-flex !important;
  flex: 0 1 auto !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  overflow: visible !important;
}

html body #dashboard-view .talent-profile-menu {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  bottom: auto !important;
  z-index: 1500 !important;
  flex: 0 0 auto !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body #dashboard-view .talent-profile-menu > summary {
  width: auto !important;
  max-width: min(280px, calc(100vw - var(--tt-sidebar-w) - 140px)) !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 3px 12px 3px 4px !important;
  border-radius: 999px !important;
}

html body #dashboard-view .talent-profile-dropdown {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  right: 0 !important;
  left: auto !important;
  bottom: auto !important;
  z-index: 1600 !important;
  width: 240px !important;
  min-width: 240px !important;
  max-width: min(240px, calc(100vw - 32px)) !important;
  margin: 0 !important;
  transform: none !important;
}

html body #dashboard-view > .container > main,
html body #dashboard-view > .talent-main,
html body #dashboard-view.talent-shell > .talent-main,
html body #dashboard-view .talent-main {
  position: relative !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100vw !important;
  max-width: 100vw !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: var(--tt-header-h) 0 0 !important;
  overflow-x: hidden !important;
  background: var(--tt-page-bg) !important;
}

html body #dashboard-view .admin-main-nav,
html body #dashboard-view > .container > main > .admin-main-nav,
html body #dashboard-view .talent-main > .dashboard-tabs,
html body #dashboard-view.talent-shell > .talent-main > .dashboard-tabs {
  position: fixed !important;
  top: var(--tt-header-h) !important;
  left: 0 !important;
  bottom: 0 !important;
  z-index: 500 !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 8px !important;
  width: var(--tt-sidebar-w) !important;
  min-width: var(--tt-sidebar-w) !important;
  max-width: var(--tt-sidebar-w) !important;
  height: calc(100dvh - var(--tt-header-h)) !important;
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  max-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 !important;
  padding: 14px 12px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  background: var(--tt-sidebar-bg) !important;
  border: 0 !important;
  border-right: 1px solid var(--tt-sidebar-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html body #dashboard-view .admin-main-nav .view-btn,
html body #dashboard-view .admin-main-nav .admin-nav-subitem,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-tab,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab {
  min-height: 42px !important;
  height: 42px !important;
  padding: 0 12px !important;
  gap: 12px !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
}

html body #dashboard-view main > .admin-main-section,
html body #dashboard-view.dashboard-view > .container > main > .admin-main-section,
html body #dashboard-view .talent-main > .talent-panel,
html body #dashboard-view.talent-shell > .talent-main > .talent-panel,
html body #dashboard-view.talent-shell .talent-main > .talent-panel {
  box-sizing: border-box !important;
  width: calc(100vw - var(--tt-sidebar-w)) !important;
  max-width: calc(100vw - var(--tt-sidebar-w)) !important;
  min-width: 0 !important;
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 0 0 var(--tt-sidebar-w) !important;
  padding: var(--tt-content-pad) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--tt-page-bg) !important;
  box-shadow: none !important;
  transform: none !important;
}

@media (max-width: 760px) {
  html body #dashboard-view .talent-profile-menu > summary {
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 2px !important;
  }

  html body #dashboard-view .talent-profile-copy {
    display: none !important;
  }
}

/* V98 final dashboard standard: Admin and Talent share identical frame metrics. */
:root {
  --tt-header-h: 72px !important;
  --tt-sidebar-w: 248px !important;
  --tt-content-pad: 22px !important;
  --tt-page-bg: #f5f7fb !important;
  --tt-sidebar-bg: #151b2a !important;
}

html body,
html body #dashboard-view,
html body #dashboard-view > .container,
html body #dashboard-view.talent-shell {
  box-sizing: border-box !important;
  width: 100vw !important;
  max-width: 100vw !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  background: var(--tt-page-bg) !important;
}

html body #dashboard-view > .container > header,
html body #dashboard-view > .talent-header,
html body #dashboard-view.talent-shell > .talent-header {
  position: fixed !important;
  inset: 0 0 auto 0 !important;
  z-index: 1400 !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100vw !important;
  height: var(--tt-header-h) !important;
  min-height: var(--tt-header-h) !important;
  max-height: var(--tt-header-h) !important;
  margin: 0 !important;
  padding: 0 24px !important;
  overflow: visible !important;
  background: #ffffff !important;
  border: 0 !important;
  border-bottom: 1px solid var(--tt-line) !important;
  border-radius: 0 !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04) !important;
  transform: none !important;
}

html body #dashboard-view > .container > header > .header-content,
html body #dashboard-view > .talent-header,
html body #dashboard-view.talent-shell > .talent-header {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body #dashboard-view .logo,
html body #dashboard-view .header-content > img.logo,
html body #dashboard-view .talent-header-logo {
  display: block !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: 32px !important;
  max-width: 172px !important;
  max-height: 62px !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  transform: none !important;
}

html body #dashboard-view .talent-header-brand {
  display: flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 220px !important;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body #dashboard-view .talent-header-brand > div {
  display: none !important;
}

html body #dashboard-view .header-actions,
html body #dashboard-view .talent-header-actions {
  position: static !important;
  display: inline-flex !important;
  flex: 0 1 auto !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 10px !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

html body #dashboard-view .lang-toggle-btn,
html body #dashboard-view .tt-notif-toggle-btn {
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
  height: 40px !important;
  min-height: 40px !important;
  border-radius: 8px !important;
}

html body #dashboard-view .talent-profile-menu {
  position: relative !important;
  inset: auto !important;
  z-index: 1500 !important;
  flex: 0 0 auto !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

html body #dashboard-view .talent-profile-menu > summary {
  box-sizing: border-box !important;
  width: auto !important;
  max-width: min(288px, calc(100vw - 188px)) !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 3px 12px 3px 4px !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}

html body #dashboard-view .talent-profile-copy {
  min-width: 0 !important;
  max-width: 198px !important;
}

html body #dashboard-view .talent-profile-copy strong {
  max-width: 198px !important;
}

html body #dashboard-view > .container > main,
html body #dashboard-view > .talent-main,
html body #dashboard-view.talent-shell > .talent-main {
  position: relative !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100vw !important;
  max-width: 100vw !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: var(--tt-header-h) 0 0 !important;
  overflow-x: hidden !important;
  background: var(--tt-page-bg) !important;
  transform: none !important;
}

html body #dashboard-view .admin-main-nav,
html body #dashboard-view > .container > main > .admin-main-nav,
html body #dashboard-view .talent-main > .dashboard-tabs,
html body #dashboard-view.talent-shell > .talent-main > .dashboard-tabs {
  position: fixed !important;
  top: var(--tt-header-h) !important;
  left: 0 !important;
  bottom: 0 !important;
  z-index: 500 !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 8px !important;
  width: var(--tt-sidebar-w) !important;
  min-width: var(--tt-sidebar-w) !important;
  max-width: var(--tt-sidebar-w) !important;
  height: calc(100dvh - var(--tt-header-h)) !important;
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  max-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 !important;
  padding: 14px 12px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  background: var(--tt-sidebar-bg) !important;
  border: 0 !important;
  border-right: 1px solid var(--tt-sidebar-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

html body #dashboard-view .admin-main-nav .view-btn,
html body #dashboard-view .admin-main-nav .admin-nav-subitem,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-tab,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  gap: 12px !important;
  border: 0 !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
  text-align: left !important;
  white-space: nowrap !important;
}

html body #dashboard-view .admin-main-nav .nav-icon,
html body #dashboard-view .talent-main > .dashboard-tabs .nav-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 18px !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
}

html body #dashboard-view .admin-main-nav .nav-icon svg,
html body #dashboard-view .talent-main > .dashboard-tabs .nav-icon svg {
  width: 18px !important;
  height: 18px !important;
  display: block !important;
}

html body #dashboard-view main > .admin-main-section,
html body #dashboard-view.dashboard-view > .container > main > .admin-main-section,
html body #dashboard-view .talent-main > .talent-panel,
html body #dashboard-view.talent-shell > .talent-main > .talent-panel,
html body #dashboard-view.talent-shell .talent-main > .talent-panel {
  box-sizing: border-box !important;
  width: calc(100vw - var(--tt-sidebar-w)) !important;
  max-width: calc(100vw - var(--tt-sidebar-w)) !important;
  min-width: 0 !important;
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 0 0 var(--tt-sidebar-w) !important;
  padding: var(--tt-content-pad) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--tt-page-bg) !important;
  box-shadow: none !important;
  transform: none !important;
}

html body #dashboard-view #overview-admin-section > .card {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html body #dashboard-view #overview-admin-section > .card > .dash-overview-header,
html body #dashboard-view .talent-panel-header-row {
  margin: 0 0 18px !important;
  padding: 0 0 18px !important;
  border-bottom: 1px solid var(--tt-line) !important;
}

html body #dashboard-view.talent-shell .talent-main > .talent-global-alerts,
html body .talent-shell .talent-main > .talent-global-alerts {
  box-sizing: border-box !important;
  width: calc(100vw - var(--tt-sidebar-w)) !important;
  max-width: calc(100vw - var(--tt-sidebar-w)) !important;
  margin: 0 0 0 var(--tt-sidebar-w) !important;
  padding: var(--tt-content-pad) var(--tt-content-pad) 0 !important;
}

@media (max-width: 760px) {
  :root {
    --tt-header-h: 64px !important;
    --tt-sidebar-w: 76px !important;
    --tt-content-pad: 12px !important;
  }

  html body #dashboard-view > .container > header,
  html body #dashboard-view > .talent-header,
  html body #dashboard-view.talent-shell > .talent-header {
    padding: 0 12px !important;
  }

  html body #dashboard-view .logo,
  html body #dashboard-view .header-content > img.logo,
  html body #dashboard-view .talent-header-logo {
    height: 30px !important;
    max-width: 120px !important;
  }

  html body #dashboard-view .talent-profile-menu > summary {
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 2px !important;
  }

  html body #dashboard-view .talent-profile-copy {
    display: none !important;
  }
}

/* V95M unified dashboard frame: Admin and Talent share one fixed shell. */
:root {
  --tt-header-h: 72px !important;
  --tt-sidebar-w: 248px !important;
  --tt-content-pad: 22px !important;
}

html body #dashboard-view,
html body #dashboard-view > .container,
html body #dashboard-view.talent-shell {
  width: 100vw !important;
  max-width: 100vw !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  background: var(--tt-page-bg) !important;
}

html body #dashboard-view > .container > header,
html body #dashboard-view > .talent-header,
html body #dashboard-view.talent-shell > .talent-header {
  position: fixed !important;
  inset: 0 0 auto 0 !important;
  z-index: 1400 !important;
  box-sizing: border-box !important;
  width: 100vw !important;
  height: var(--tt-header-h) !important;
  min-height: var(--tt-header-h) !important;
  max-height: var(--tt-header-h) !important;
  margin: 0 !important;
  padding: 0 24px !important;
  overflow: visible !important;
  background: #ffffff !important;
  border: 0 !important;
  border-bottom: 1px solid var(--tt-line) !important;
  border-radius: 0 !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04) !important;
}

html body #dashboard-view > .container > header > .header-content,
html body #dashboard-view > .talent-header,
html body #dashboard-view.talent-shell > .talent-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
}

html body #dashboard-view > .container > header > .header-content {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
}

html body #dashboard-view .logo,
html body #dashboard-view .header-content .logo,
html body #dashboard-view .talent-header-logo {
  display: block !important;
  width: auto !important;
  height: 38px !important;
  max-width: 190px !important;
  object-fit: contain !important;
  flex: 0 0 auto !important;
}

html body #dashboard-view.talent-shell > .talent-header > .talent-header-brand {
  flex: 0 0 calc(var(--tt-sidebar-w) - 24px) !important;
  width: calc(var(--tt-sidebar-w) - 24px) !important;
  min-width: 0 !important;
  max-width: calc(var(--tt-sidebar-w) - 24px) !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

html body #dashboard-view .header-actions,
html body #dashboard-view .talent-header-actions {
  position: static !important;
  transform: none !important;
  display: inline-flex !important;
  flex: 0 1 auto !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 10px !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 40px !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

html body #dashboard-view .lang-toggle-btn,
html body #dashboard-view .tt-notif-toggle-btn {
  flex: 0 0 auto !important;
}

html body #dashboard-view .talent-profile-menu {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  bottom: auto !important;
  z-index: 1500 !important;
  flex: 0 0 auto !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body #dashboard-view .talent-profile-menu > summary {
  box-sizing: border-box !important;
  width: auto !important;
  max-width: min(280px, calc(100vw - var(--tt-sidebar-w) - 140px)) !important;
  min-height: 40px !important;
  height: 40px !important;
  padding: 3px 12px 3px 4px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}

html body #dashboard-view .talent-profile-copy {
  min-width: 0 !important;
  max-width: 190px !important;
}

html body #dashboard-view .talent-profile-copy strong {
  max-width: 190px !important;
}

html body #dashboard-view .talent-profile-dropdown {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  right: 0 !important;
  left: auto !important;
  bottom: auto !important;
  z-index: 1600 !important;
  width: 240px !important;
  min-width: 240px !important;
  max-width: min(240px, calc(100vw - 32px)) !important;
  margin: 0 !important;
  transform: none !important;
}

html body #dashboard-view > .container > main,
html body #dashboard-view > .talent-main,
html body #dashboard-view.talent-shell > .talent-main {
  position: relative !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100vw !important;
  max-width: 100vw !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: var(--tt-header-h) 0 0 !important;
  overflow-x: hidden !important;
  background: var(--tt-page-bg) !important;
}

html body #dashboard-view .admin-main-nav,
html body #dashboard-view > .container > main > .admin-main-nav,
html body #dashboard-view .talent-main > .dashboard-tabs,
html body #dashboard-view.talent-shell > .talent-main > .dashboard-tabs {
  position: fixed !important;
  top: var(--tt-header-h) !important;
  left: 0 !important;
  bottom: 0 !important;
  z-index: 500 !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 8px !important;
  width: var(--tt-sidebar-w) !important;
  min-width: var(--tt-sidebar-w) !important;
  max-width: var(--tt-sidebar-w) !important;
  height: calc(100dvh - var(--tt-header-h)) !important;
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  max-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 !important;
  padding: 14px 12px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  background: var(--tt-sidebar-bg) !important;
  border: 0 !important;
  border-right: 1px solid var(--tt-sidebar-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html body #dashboard-view .admin-main-nav .view-btn,
html body #dashboard-view .admin-main-nav .admin-nav-subitem,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-tab,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab {
  min-height: 42px !important;
  height: 42px !important;
  padding: 0 12px !important;
  gap: 12px !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
}

html body #dashboard-view main > .admin-main-section,
html body #dashboard-view.dashboard-view > .container > main > .admin-main-section,
html body #dashboard-view .talent-main > .talent-panel,
html body #dashboard-view.talent-shell > .talent-main > .talent-panel,
html body #dashboard-view.talent-shell .talent-main > .talent-panel {
  box-sizing: border-box !important;
  width: calc(100vw - var(--tt-sidebar-w)) !important;
  max-width: calc(100vw - var(--tt-sidebar-w)) !important;
  min-width: 0 !important;
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 0 0 var(--tt-sidebar-w) !important;
  padding: var(--tt-content-pad) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--tt-page-bg) !important;
  box-shadow: none !important;
  transform: none !important;
}

html body #dashboard-view main > .admin-main-section > .card,
html body #dashboard-view .talent-main > .talent-panel > .card,
html body #dashboard-view .talent-panel > .tt-panel-card {
  margin: 0 !important;
  border-radius: 8px !important;
}

html body #dashboard-view.talent-shell .talent-main > .talent-global-alerts,
html body .talent-shell .talent-main > .talent-global-alerts {
  box-sizing: border-box !important;
  width: calc(100vw - var(--tt-sidebar-w)) !important;
  max-width: calc(100vw - var(--tt-sidebar-w)) !important;
  margin: 0 0 0 var(--tt-sidebar-w) !important;
  padding: var(--tt-content-pad) var(--tt-content-pad) 0 !important;
}

html body #talent-profile-modal.talent-modal-overlay:not(.hidden) {
  display: flex !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 10000 !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px !important;
  overflow: auto !important;
  background: rgba(15, 23, 42, 0.54) !important;
  backdrop-filter: blur(8px) !important;
}

html body #talent-profile-modal > .talent-modal.talent-profile-modal {
  width: min(820px, calc(100vw - 48px)) !important;
  max-width: 820px !important;
  max-height: calc(100dvh - 48px) !important;
  margin: auto !important;
  border-radius: 10px !important;
}

@media (max-width: 760px) {
  :root {
    --tt-header-h: 64px !important;
    --tt-sidebar-w: 76px !important;
    --tt-content-pad: 12px !important;
  }

  html body #dashboard-view > .container > header,
  html body #dashboard-view > .talent-header,
  html body #dashboard-view.talent-shell > .talent-header {
    padding: 0 12px !important;
  }

  html body #dashboard-view .logo,
  html body #dashboard-view .header-content .logo,
  html body #dashboard-view .talent-header-logo {
    height: 30px !important;
    max-width: 118px !important;
  }

  html body #dashboard-view.talent-shell > .talent-header > .talent-header-brand {
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
  }

  html body #dashboard-view .talent-profile-menu > summary {
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 2px !important;
  }

  html body #dashboard-view .talent-profile-copy {
    display: none !important;
  }

  html body #dashboard-view .admin-main-nav .view-btn,
  html body #dashboard-view .admin-main-nav .admin-nav-subitem,
  html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-tab,
  html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab {
    justify-content: center !important;
    padding: 0 !important;
  }

  html body #dashboard-view .admin-main-nav .nav-label,
  html body #dashboard-view .talent-main > .dashboard-tabs .nav-label {
    display: none !important;
  }
}

/* V95L talent shell repair: header/sidebar/content form one clean dashboard frame. */
html body #dashboard-view.talent-shell:not(.talent-auth-view) {
  width: 100vw !important;
  max-width: 100vw !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--tt-page-bg) !important;
  overflow-x: hidden !important;
}

html body #dashboard-view.talent-shell:not(.talent-auth-view) > .talent-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 1200 !important;
  width: 100vw !important;
  max-width: 100vw !important;
  height: var(--tt-header-h) !important;
  min-height: var(--tt-header-h) !important;
  max-height: var(--tt-header-h) !important;
  margin: 0 !important;
  padding: 0 24px 0 18px !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  overflow: visible !important;
  background: rgba(255, 255, 255, 0.98) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--tt-line) !important;
  border-radius: 0 !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04) !important;
}

html body #dashboard-view.talent-shell:not(.talent-auth-view) > .talent-header > .talent-header-brand {
  flex: 0 0 calc(var(--tt-sidebar-w) - 18px) !important;
  width: calc(var(--tt-sidebar-w) - 18px) !important;
  min-width: 0 !important;
  max-width: calc(var(--tt-sidebar-w) - 18px) !important;
  height: var(--tt-header-h) !important;
  min-height: var(--tt-header-h) !important;
  max-height: var(--tt-header-h) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  overflow: hidden !important;
}

html body #dashboard-view.talent-shell:not(.talent-auth-view) .talent-header-logo {
  width: auto !important;
  height: 34px !important;
  max-width: min(172px, calc(var(--tt-sidebar-w) - 42px)) !important;
  object-fit: contain !important;
  flex: 0 0 auto !important;
}

html body #dashboard-view.talent-shell:not(.talent-auth-view) > .talent-header > .talent-header-actions {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  height: var(--tt-header-h) !important;
  min-height: var(--tt-header-h) !important;
  max-height: var(--tt-header-h) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

html body #dashboard-view.talent-shell:not(.talent-auth-view) > .talent-main {
  position: relative !important;
  display: block !important;
  width: 100vw !important;
  max-width: 100vw !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: var(--tt-header-h) 0 0 !important;
  box-sizing: border-box !important;
  background: var(--tt-page-bg) !important;
  overflow-x: hidden !important;
}

html body #dashboard-view.talent-shell:not(.talent-auth-view) > .talent-main > .dashboard-tabs {
  position: fixed !important;
  top: var(--tt-header-h) !important;
  left: 0 !important;
  bottom: 0 !important;
  z-index: 300 !important;
  box-sizing: border-box !important;
  width: var(--tt-sidebar-w) !important;
  min-width: var(--tt-sidebar-w) !important;
  max-width: var(--tt-sidebar-w) !important;
  height: calc(100dvh - var(--tt-header-h)) !important;
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  max-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 !important;
  padding: 12px 10px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  background: var(--tt-sidebar-bg) !important;
  border: 0 !important;
  border-right: 1px solid var(--tt-sidebar-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html body #dashboard-view.talent-shell:not(.talent-auth-view) > .talent-main > .talent-panel {
  box-sizing: border-box !important;
  width: calc(100vw - var(--tt-sidebar-w)) !important;
  max-width: calc(100vw - var(--tt-sidebar-w)) !important;
  min-width: 0 !important;
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 0 0 var(--tt-sidebar-w) !important;
  padding: var(--tt-content-pad) !important;
  border-radius: 0 !important;
  background: var(--tt-page-bg) !important;
  transform: none !important;
}

html body #dashboard-view.talent-shell:not(.talent-auth-view) > .talent-main > .talent-global-alerts {
  box-sizing: border-box !important;
  width: calc(100vw - var(--tt-sidebar-w)) !important;
  max-width: calc(100vw - var(--tt-sidebar-w)) !important;
  margin: 0 0 0 var(--tt-sidebar-w) !important;
  padding: var(--tt-content-pad) var(--tt-content-pad) 0 !important;
}

@media (max-width: 760px) {
  html body #dashboard-view.talent-shell:not(.talent-auth-view) > .talent-header {
    padding: 0 14px !important;
  }

  html body #dashboard-view.talent-shell:not(.talent-auth-view) > .talent-header > .talent-header-brand {
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
  }
}

/* v95j: cleaner public signature dialog */
html body #signature-modal.signature-modal {
  background: rgba(15, 23, 42, 0.48) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  padding: 18px !important;
}

html body #signature-modal .signature-modal-content {
  display: flex !important;
  flex-direction: column !important;
  width: min(720px, calc(100vw - 36px)) !important;
  max-width: 720px !important;
  max-height: calc(100dvh - 36px) !important;
  overflow: hidden !important;
  border: 1px solid #d7dde7 !important;
  border-radius: 10px !important;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.26) !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, Helvetica,
    sans-serif !important;
}

html body #signature-modal .signature-modal-header {
  min-height: 58px !important;
  padding: 14px 18px !important;
  border-bottom: 1px solid #e5e7eb !important;
}

html body #signature-modal .signature-modal-header h2 {
  font-size: 20px !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  color: #111827 !important;
}

html body #signature-modal .modal-close {
  width: 36px !important;
  height: 36px !important;
  border-radius: 8px !important;
  background: #f3f4f6 !important;
  color: #4b5563 !important;
  font-size: 25px !important;
  line-height: 1 !important;
}

html body #signature-modal .modal-close:hover {
  background: #e5e7eb !important;
  color: #111827 !important;
}

html body #signature-modal .signature-modal-body {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  padding: 16px 18px !important;
  background: #fff !important;
}

html body #signature-modal .modal-signature-progress {
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  background: #f8fafc !important;
}

html body #signature-modal .modal-signature-progress .progress-bar-container {
  height: 6px !important;
  margin-bottom: 8px !important;
  border-radius: 999px !important;
  background: #e5e7eb !important;
}

html body #signature-modal .modal-signature-progress .progress-bar-fill {
  border-radius: 999px !important;
  background: #111827 !important;
}

html body #signature-modal .modal-signature-progress .progress-text {
  font-size: 14px !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
  color: #111827 !important;
}

html body #signature-modal .signer-info-section {
  margin: 0 !important;
  padding: 12px 14px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  background: #fafafa !important;
}

html body #signature-modal .signer-info-row {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

html body #signature-modal .form-group {
  min-width: 0 !important;
}

html body #signature-modal .form-group label {
  margin: 0 0 6px !important;
  font-size: 13px !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  color: #374151 !important;
}

html body #signature-modal .form-input {
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 12px !important;
  border: 1px solid #d1d5db !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  line-height: 40px !important;
  box-shadow: none !important;
}

html body #signature-modal .alert.alert-info {
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: #f8fafc !important;
  color: #374151 !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
}

html body #signature-modal .signature-canvas-wrapper {
  min-height: 0 !important;
  margin: 0 !important;
  padding: 6px !important;
  border: 1px solid #ccd4df !important;
  border-radius: 8px !important;
  background: #f8fafc !important;
}

html body #signature-modal #modal-signature-canvas {
  height: 150px !important;
  border-radius: 6px !important;
  background: #fff !important;
}

html body #signature-modal .signature-actions-compact {
  margin: 0 !important;
  gap: 8px !important;
  align-items: center !important;
}

html body #signature-modal .upload-inline-group {
  gap: 8px !important;
  min-width: 0 !important;
}

html body #signature-modal .or-text,
html body #signature-modal .upload-hint-small {
  font-size: 14px !important;
  line-height: 1.3 !important;
  color: #6b7280 !important;
}

html body #signature-modal .btn,
html body #signature-modal .file-upload-label {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  flex: 0 0 auto !important;
  min-height: 36px !important;
  height: 36px !important;
  padding: 0 13px !important;
  border: 1px solid #d1d5db !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 13.5px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  transition:
    background-color 0.16s ease,
    border-color 0.16s ease,
    color 0.16s ease !important;
}

html body #signature-modal .btn-secondary,
html body #signature-modal .file-upload-label {
  background: #fff !important;
  color: #374151 !important;
}

html body #signature-modal .btn-secondary:hover,
html body #signature-modal .file-upload-label:hover {
  background: #f3f4f6 !important;
  border-color: #cbd5e1 !important;
}

html body #signature-modal .apply-to-all-wrapper {
  margin: 0 !important;
  padding: 10px 12px !important;
  border-radius: 8px !important;
  background: #f8fafc !important;
}

html body #signature-modal .apply-to-all-wrapper label {
  align-items: center !important;
  gap: 9px !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
  color: #111827 !important;
}

html body #signature-modal .apply-to-all-wrapper input[type="checkbox"] {
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
}

/* V101g: padding/gap/margin/background/border-top entfernt — die kanonische
   V101f Inline-Definition in contract-view.html (Zeile 2068) und
   common/signature-modal.css (Zeile 357) übernimmt: padding 40/48/56,
   gap 56, display grid. NUR flex: 0 0 auto bleibt damit der Footer im
   flex-column-Layout des Modal-Content nicht schrumpft. */
html body #signature-modal .signature-modal-actions {
  flex: 0 0 auto !important;
}

html body #signature-modal .signature-modal-actions .btn {
  min-width: 112px !important;
}

html body #signature-modal .signature-modal-actions .btn-primary {
  min-width: 188px !important;
  background: #111827 !important;
  border-color: #111827 !important;
  color: #fff !important;
  flex: 0 0 auto !important;
}

html body #signature-modal .signature-modal-actions .btn-primary:hover {
  background: #020617 !important;
  border-color: #020617 !important;
}

html body .signature-line,
html body .signature-column,
html body .signature-placeholder,
html body .signature-placeholder.signed,
html body .signer-meta,
html body .signer-name,
html body .signer-role {
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  white-space: normal !important;
}

/* v112: on-screen preview now uses FLEX (mirrors the PDF inline CSS) so
   the signature boxes share a common bottom baseline regardless of how
   the date label wraps. Table-cell `vertical-align: top` left differently
   wrapped labels at different heights, which made Brand sit higher than
   Management in the annex 2-col row. */
html body .signature-container {
  display: flex !important;
  flex-direction: row !important;
  align-items: stretch !important;
  gap: 12px !important;
  width: 100% !important;
  margin: 22px 0 16px !important;
  padding: 0 !important;
}

html body .signature-column {
  flex: 1 1 0 !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  display: flex !important;
  flex-direction: column !important;
}

html body .signature-column p {
  margin: 0 0 6px !important;
  font-size: 12px !important;
  line-height: 16px !important;
}

html body .signature-line {
  /* V96l: Sig box as a flex column. The inner placeholder (signed/clickable/
     other-role/preview) fills the whole box and decides its own internal
     layout (state on top, meta at bottom). 120px is the sweet spot — enough
     for 2 meta lines + a centered state, not so tall that empty boxes look
     hollow. */
  margin-top: auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: stretch !important;
  width: 100% !important;
  height: 120px !important;
  min-height: 120px !important;
  padding: 0 !important;
  border: 1px solid #d1d5db !important;
  border-radius: 8px !important;
  background: #fafbfc !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  position: relative !important;
  transition:
    border-color 0.2s ease,
    background-color 0.2s ease,
    box-shadow 0.2s ease !important;
}

html body .signature-line::after {
  content: none !important;
  display: none !important;
}

html body .signature-line > .signature-placeholder,
html body .signature-line .signature-placeholder.signed,
html body .signature-line > .signature-placeholder.signed,
html body .signature-line > .signature-placeholder.other-role,
html body .signature-placeholder.signed {
  /* V96l: inner placeholder fills the box, decides its own state/meta split */
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: stretch !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  text-align: center !important;
  color: #111827 !important;
  flex: 1 1 auto !important;
}

html body .signature-line > img.signature-image,
html body .signature-line > .signature-image,
html body .signature-line .signature-placeholder.signed .signature-image,
html body .signature-placeholder.signed .signature-image,
html body .signature-placeholder.signed img {
  display: block !important;
  /* V96j: signature image floats freely in the body area, vertical center
     enforced by the flex placeholder above. */
  margin: 14px auto 0 !important;
  width: auto !important;
  height: auto !important;
  max-height: 60px !important;
  max-width: calc(100% - 24px) !important;
  object-fit: contain !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  flex: 0 0 auto !important;
}

html body .signature-missing {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  font-size: 12px !important;
  line-height: 16px !important;
  font-style: italic !important;
  color: #6b7280 !important;
  text-align: center !important;
}

/* V96j: "Hier unterschreiben" CTA — vertically centered, prominent */
html body .signature-placeholder:not(.signed):not(.other-role) {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 1 1 auto !important;
  text-align: center !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  padding: 14px 12px !important;
  color: #92400e !important;
  letter-spacing: 0.01em !important;
}

/* V96j: "Brand offen" / "Management offen" / "Talent offen" — vertically
   centered placeholder for OTHER roles (not the current viewer). Italic,
   subtle, but readable. */
html body .signature-placeholder.other-role {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 1 1 auto !important;
  text-align: center !important;
  font-size: 13px !important;
  line-height: 1.3 !important;
  font-style: italic !important;
  font-weight: 500 !important;
  color: #6b7280 !important;
  padding: 14px 12px !important;
}

/* V96j: signer-meta = Name + Position block at the bottom of the sig box.
   Separated from the sig area with a thin top border. Auto-shrinks for
   long role/position strings via line-clamp. */
html body .signature-line > .signer-meta,
html body .signature-placeholder .signer-meta,
html body .signer-meta {
  display: block !important;
  position: static !important;
  inset: auto !important;
  transform: none !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 8px 12px 10px !important;
  border-top: 1px solid #e5e7eb !important;
  background: #ffffff !important;
  overflow: hidden !important;
  font-size: 10px !important;
  line-height: 1.3 !important;
  text-align: left !important;
  color: #111827 !important;
  white-space: normal !important;
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
}

html body .signature-line > .signer-meta {
  margin-top: auto !important;
  align-self: stretch !important;
}

html body .signer-name {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  max-width: 100% !important;
  overflow: hidden !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  font-weight: 700 !important;
  font-size: 10px !important;
  line-height: 1.3 !important;
  color: #111827 !important;
  margin: 0 !important;
}

html body .signer-role {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  max-width: 100% !important;
  overflow: hidden !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  font-weight: 400 !important;
  font-size: 9px !important;
  line-height: 1.3 !important;
  color: #6b7280 !important;
  margin: 2px 0 0 !important;
}

/* V96j: Override the older 8.4px signed-meta block. Names get 10px bold,
   role labels get 9px regular, both clamped to 2 lines so long titles
   stay inside the box. */
html body .signature-line .signature-placeholder.signed .signer-meta {
  position: static !important;
  display: block !important;
  margin: 0 !important;
  line-height: 1.3 !important;
  text-align: left !important;
  white-space: normal !important;
}
html body .signature-line .signature-placeholder.signed .signer-name {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  margin: 0 !important;
  font-size: 10px !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  text-align: left !important;
  overflow: hidden !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
html body .signature-line .signature-placeholder.signed .signer-role {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  margin: 2px 0 0 !important;
  font-size: 9px !important;
  line-height: 1.3 !important;
  font-weight: 400 !important;
  color: #6b7280 !important;
  text-align: left !important;
  overflow: hidden !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

html body .signature-line .signature-placeholder.signed .signer-meta {
  width: 100% !important;
  margin-top: auto !important;
  padding: 8px 12px 10px !important;
  border-top: 1px solid #e5e7eb !important;
  background: #ffffff !important;
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
}

@media (max-width: 640px) {
  html body #signature-modal.signature-modal {
    padding: 10px !important;
  }

  html body #signature-modal .signature-modal-content {
    width: calc(100vw - 20px) !important;
    max-height: calc(100dvh - 20px) !important;
  }

  html body #signature-modal .signer-info-row {
    grid-template-columns: 1fr !important;
  }

  html body #signature-modal #modal-signature-canvas {
    height: 132px !important;
  }

  html body #signature-modal .signature-actions-compact,
  html body #signature-modal .upload-inline-group,
  html body #signature-modal .signature-modal-actions {
    flex-wrap: wrap !important;
  }

  html body #signature-modal .signature-modal-actions .btn {
    flex: 1 1 150px !important;
  }
}

html body #dashboard-view main > .admin-main-section,
html body #dashboard-view .talent-main > .talent-panel,
html body #dashboard-view.talent-shell .talent-main > .talent-panel,
html body .talent-shell .talent-main > .talent-panel {
  box-sizing: border-box !important;
  width: calc(100vw - var(--tt-sidebar-w)) !important;
  max-width: calc(100vw - var(--tt-sidebar-w)) !important;
  min-width: 0 !important;
  margin-left: var(--tt-sidebar-w) !important;
}

html body #dashboard-view .admin-main-nav .view-btn,
html body #dashboard-view .admin-main-nav .admin-nav-subitem,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-tab,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab {
  font-size: 12.5px !important;
}

html body #dashboard-view .admin-main-nav .nav-label,
html body #dashboard-view .talent-main > .dashboard-tabs .nav-label {
  overflow: visible !important;
  text-overflow: clip !important;
}

html body #dashboard-view .admin-main-nav .admin-nav-subgroup,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subgroup {
  margin-left: 22px !important;
  padding-left: 8px !important;
}

html body #dashboard-view .admin-main-nav .admin-nav-subgroup.is-active-parent,
html body #dashboard-view .admin-main-nav .admin-nav-subgroup.tt-hover-open,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subgroup.is-active-parent,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subgroup.tt-hover-open {
  margin-left: 22px !important;
  overflow: visible !important;
}

/* Profile menus stay above cards, tables and full-page forms. */
html body .tt-admin-profile,
html body .talent-profile-menu {
  position: relative !important;
  z-index: 1000 !important;
}

html body .tt-admin-profile-menu,
html body .talent-profile-dropdown {
  z-index: 1100 !important;
  overflow: visible !important;
  box-shadow: 0 18px 44px rgba(15, 23, 42, 0.16) !important;
}

/* Compact, consistent actions and filters. */
html body #dashboard-view .btn-primary,
html body #dashboard-view .btn-secondary,
html body #dashboard-view .btn-danger,
html body #dashboard-view .btn-icon-action,
html body #dashboard-view .btn-small {
  min-height: 34px !important;
  height: 34px !important;
  padding: 0 12px !important;
  border-radius: 6px !important;
  font-size: 12.5px !important;
  line-height: 1 !important;
}

html body #dashboard-view .btn-icon-action {
  width: 34px !important;
  min-width: 34px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

html body #dashboard-view .card-header--with-search {
  gap: 12px !important;
  padding: 16px 18px !important;
}

html body #dashboard-view .card-header--with-search .card-header-actions {
  gap: 7px !important;
  align-items: center !important;
}

html body #dashboard-view .card-header--with-search input,
html body #dashboard-view .card-header--with-search select,
html body #dashboard-view .contract-filter-select {
  height: 34px !important;
  min-height: 34px !important;
  border-radius: 6px !important;
  font-size: 12.5px !important;
}

html body #contracts-table-container,
html body .admin-overview-list,
html body .talent-panel {
  min-width: 0 !important;
}

html body #contracts-table-container {
  overflow-x: auto !important;
}

html body #contracts-table-container .badge,
html body #contracts-table-container .contract-type-badge,
html body #contracts-table-container .compact-sig-badge {
  min-height: 20px !important;
  height: 20px !important;
  padding: 0 7px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  font-size: 8.4px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
}

html body .monthly-collab-label {
  min-height: 20px !important;
  height: 20px !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin-top: 4px !important;
  padding: 0 7px !important;
  border-radius: 999px !important;
  display: flex !important;
  align-items: center !important;
  font-size: 8.4px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}

html body #empty-state.hidden,
html body #empty-state[hidden] {
  display: none !important;
}

/* Strong, small campaign status colors. */
html body .ac-inline-status,
html body .admin-campaign-status {
  min-height: 24px !important;
  height: 24px !important;
  padding: 0 8px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 750 !important;
}

html body .ac-inline-status.status-gray,
html body .admin-campaign-status.status-gray { background: #eef1f5 !important; color: #4b5563 !important; }
html body .ac-inline-status.status-red,
html body .admin-campaign-status.status-red { background: #fee2e2 !important; color: #991b1b !important; }
html body .ac-inline-status.status-blue,
html body .admin-campaign-status.status-blue { background: #dbeafe !important; color: #1d4ed8 !important; }
html body .ac-inline-status.status-yellow,
html body .admin-campaign-status.status-yellow { background: #fef3c7 !important; color: #854d0e !important; }
html body .ac-inline-status.status-green,
html body .admin-campaign-status.status-green { background: #dcfce7 !important; color: #166534 !important; }
html body .ac-inline-status.status-orange,
html body .admin-campaign-status.status-orange { background: #ffedd5 !important; color: #9a3412 !important; }
html body .ac-inline-status.status-purple,
html body .admin-campaign-status.status-purple { background: #ede9fe !important; color: #6d28d9 !important; }
html body .ac-inline-status.status-pink,
html body .admin-campaign-status.status-pink { background: #fce7f3 !important; color: #9d174d !important; }
html body .ac-inline-status.status-brown,
html body .admin-campaign-status.status-brown { background: #f3e8df !important; color: #7c4a2d !important; }

/* Template headers and placeholder creation as a portal subpage section. */
html body #templates-container.tt-template-app .tt-view > .tt-view-header {
  padding: 18px 22px !important;
}

html body #templates-container.tt-template-app .tt-view-header-title p {
  margin: 5px 0 0 !important;
  padding: 0 !important;
  line-height: 1.45 !important;
}

html body #templates-container.tt-template-app #tt-view-templates .tt-view-body,
html body #templates-container.tt-template-app #tt-view-placeholders .placeholder-table-wrap {
  margin-top: 18px !important;
}

html body #templates-container.tt-template-app .tt-view-header-actions {
  padding-right: 2px !important;
}

html body #templates-container.tt-template-app .tt-add-placeholder-btn {
  margin-right: 0 !important;
  flex: 0 0 auto !important;
}

html body .tt-add-placeholder-panel {
  margin: 18px 22px 0 !important;
  padding: 0 !important;
  border: 1px solid var(--tt-line) !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  overflow: hidden !important;
}

html body .tt-add-ph-header {
  padding: 14px 16px !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  border-bottom: 1px solid var(--tt-line) !important;
  background: #fafbfc !important;
}

html body .tt-add-ph-header h2 {
  margin: 0 !important;
  font-size: 16px !important;
  color: #111827 !important;
}

html body .tt-add-ph-header p {
  margin: 4px 0 0 !important;
  color: #6b7280 !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}

html body .tt-add-ph-close {
  width: 30px !important;
  height: 30px !important;
  flex: 0 0 30px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  color: #6b7280 !important;
  font-size: 22px !important;
  cursor: pointer !important;
}

html body .tt-add-ph-grid {
  padding: 16px !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

html body .tt-add-ph-field {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}

html body .tt-add-ph-field--wide {
  grid-column: 1 / -1 !important;
}

html body .tt-add-ph-field > span {
  color: #667085 !important;
  font-size: 11px !important;
  font-weight: 750 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

html body .tt-add-ph-field input,
html body .tt-add-ph-field select,
html body .tt-add-ph-field textarea {
  width: 100% !important;
  min-height: 34px !important;
  border: 1px solid #cfd6e2 !important;
  border-radius: 6px !important;
  padding: 6px 9px !important;
  background: #ffffff !important;
  font-size: 13px !important;
}

html body .tt-add-ph-field small {
  color: #6b7280 !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}

html body .tt-add-ph-actions {
  padding: 12px 16px !important;
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  border-top: 1px solid var(--tt-line) !important;
  background: #fafbfc !important;
}

/* Full-page forms: reliable scroll containers and non-clipped action rows. */
html body #contract-modal.modal-overlay.tt-fullpage-modal:not(.hidden),
html body #campaign-edit-modal.modal-overlay.tt-fullpage-modal:not(.hidden),
html body #brand-edit-modal.modal-overlay.tt-fullpage-modal:not(.hidden),
html body #talent-edit-modal.modal-overlay.tt-fullpage-modal:not(.hidden),
html body #manual-tx-modal.modal-overlay.tt-fullpage-modal:not(.hidden) {
  inset: var(--tt-header-h) 0 0 var(--tt-sidebar-w) !important;
  overflow: hidden !important;
  z-index: 150 !important;
}

html body #contract-modal.tt-fullpage-modal .modal-dialog,
html body #campaign-edit-modal.tt-fullpage-modal .modal-dialog,
html body #brand-edit-modal.tt-fullpage-modal .modal-dialog,
html body #talent-edit-modal.tt-fullpage-modal .modal-dialog,
html body #manual-tx-modal.tt-fullpage-modal .modal-dialog {
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

html body #contract-modal.tt-fullpage-modal .modal-dialog {
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
}

html body #contract-modal.tt-fullpage-modal .contract-tabs {
  position: static !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 22px !important;
  display: flex !important;
  align-items: flex-end !important;
  gap: 18px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--tt-line) !important;
  background: #ffffff !important;
  overflow: visible !important;
}

html body #contract-modal.tt-fullpage-modal .contract-tab-btn {
  height: 44px !important;
  margin: 0 !important;
  padding: 0 2px !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  font-size: 13px !important;
}

html body #contract-modal.tt-fullpage-modal .contract-tab-btn.active {
  border-bottom-color: #2563eb !important;
  color: #111827 !important;
}

html body #contract-modal.tt-fullpage-modal #contract-form {
  min-height: 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  overflow: hidden !important;
}

html body #contract-modal.tt-fullpage-modal #contract-form > .contract-tab-panel.active {
  min-height: 0 !important;
  margin: 0 !important;
  padding: 16px 22px 24px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  border: 0 !important;
}

html body #contract-modal.tt-fullpage-modal #contract-form > .modal-footer {
  position: static !important;
  width: 100% !important;
  min-height: 58px !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 11px 22px !important;
}

html body #contract-modal.tt-fullpage-modal #contract-editor {
  min-height: 640px !important;
  border: 1px solid var(--tt-line-strong) !important;
  border-radius: 6px !important;
  overflow: visible !important;
}

html body #campaign-edit-modal.tt-fullpage-modal .modal-dialog {
  display: flex !important;
  flex-direction: column !important;
}

html body #campaign-edit-modal.tt-fullpage-modal #campaign-form {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 14px 18px 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

html body #campaign-edit-modal.tt-fullpage-modal > .modal-dialog > .modal-footer {
  position: static !important;
  width: 100% !important;
  min-height: 58px !important;
  flex: 0 0 58px !important;
  margin: 0 !important;
  padding: 11px 18px !important;
  z-index: 10 !important;
}

html body #campaign-edit-modal .cform-disclosure,
html body #campaign-edit-modal .cform-disclosure[open],
html body #campaign-edit-modal .cform-disclosure-body,
html body #campaign-edit-modal .cform-essentials,
html body #campaign-edit-modal .cform-monthly-picker {
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: visible !important;
}

html body #campaign-edit-modal .cform-disclosure {
  border-radius: 7px !important;
  padding: 0 !important;
}

html body #campaign-edit-modal .cform-disclosure > summary {
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  cursor: pointer !important;
}

html body #campaign-edit-modal .cform-disclosure-body {
  padding: 12px !important;
  border-top: 1px solid var(--tt-line) !important;
}

/* Compact Talent and Brand forms. */
html body #talent-edit-modal.tt-fullpage-modal .modal-body,
html body #brand-edit-modal.tt-fullpage-modal .modal-body {
  width: min(900px, 100%) !important;
  max-width: 900px !important;
  margin: 0 auto !important;
  padding: 14px 18px 90px !important;
}

html body #talent-form {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px 10px !important;
}

html body #talent-form > .form-row {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px 10px !important;
}

html body #talent-form > .talent-email-active-row {
  grid-column: 1 / -1 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 10px !important;
  align-items: end !important;
}

html body #talent-form > .talent-email-active-row > .form-group,
html body #talent-form > .talent-email-active-row > .talent-active-toggle {
  grid-column: auto !important;
  width: auto !important;
}

html body #talent-form .talent-active-toggle {
  min-height: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  border-radius: 6px !important;
  white-space: nowrap !important;
}

html body #talent-form .talent-form-disclosure {
  grid-column: 1 / -1 !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 7px !important;
}

html body #talent-form .talent-form-disclosure > summary {
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 12px !important;
}

html body #talent-form .talent-form-disclosure-body {
  padding: 10px 12px !important;
  gap: 8px !important;
}

html body #brand-edit-modal .brand-form {
  padding-top: 12px !important;
}

html body #brand-edit-modal .bf-grid {
  gap: 8px 10px !important;
}

html body #brand-edit-modal .bf-grid input,
html body #brand-edit-modal .bf-grid select {
  height: 30px !important;
  min-height: 30px !important;
}

html body #brand-edit-modal .bf-grid textarea {
  min-height: 58px !important;
}

html body #brand-edit-modal .bf-disclosure {
  margin-top: 10px !important;
  padding: 0 !important;
  border-radius: 7px !important;
}

html body #brand-edit-modal .bf-disclosure > summary {
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 12px !important;
}

html body #brand-edit-modal .bf-disclosure > .bf-grid {
  padding: 10px 12px !important;
  border-top: 1px solid var(--tt-line) !important;
}

/* Contract preview is a normal portal page with a centered A4 sheet. */
html body .tt-contract-preview-fullpage {
  position: fixed !important;
  inset: var(--tt-header-h) 0 0 var(--tt-sidebar-w) !important;
  z-index: 155 !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  overflow: hidden !important;
}

html body .tt-contract-preview-body {
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: auto !important;
}

html body .tt-contract-preview-body .tt-preview-content {
  width: 794px !important;
  min-width: 794px !important;
  min-height: 1123px !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}

/* Clean, compact admin signature dialog. */
html body .admin-sig-modal {
  padding: 16px !important;
  background: rgba(15, 23, 42, 0.38) !important;
}

/* V101n: v93 admin-sig overrides ENTFERNT.
   v93 quetschte Modal auf 520px + 12px Padding → Trust-Bar wickelte ein Wort
   pro Zeile, Buttons zu klein. Admin-inline-CSS (max-width 760px, 28px/32px
   Padding) ist die korrekte Quelle der Wahrheit — analog zu V101g für
   signature-modal. */

@media (max-width: 1180px) and (min-width: 901px) {
  :root {
    --tt-sidebar-w: 220px !important;
  }
}

@media (max-width: 900px) {
  :root {
    --tt-sidebar-w: 64px !important;
  }

  html body #dashboard-view .admin-main-nav,
  html body #dashboard-view main > .admin-main-nav,
  html body #dashboard-view .talent-main > .dashboard-tabs,
  html body .talent-shell .dashboard-tabs {
    width: 64px !important;
    min-width: 64px !important;
    max-width: 64px !important;
    padding: 10px 8px !important;
  }

  html body #dashboard-view main > .admin-main-section,
  html body #dashboard-view .talent-main > .talent-panel,
  html body #dashboard-view.talent-shell .talent-main > .talent-panel,
  html body .talent-shell .talent-main > .talent-panel {
    width: calc(100vw - 64px) !important;
    max-width: calc(100vw - 64px) !important;
    margin-left: 64px !important;
    padding: 10px !important;
  }

  html body #dashboard-view .card,
  html body #dashboard-view .talent-panel {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  html body #contract-modal.modal-overlay.tt-fullpage-modal:not(.hidden),
  html body #campaign-edit-modal.modal-overlay.tt-fullpage-modal:not(.hidden),
  html body #brand-edit-modal.modal-overlay.tt-fullpage-modal:not(.hidden),
  html body #talent-edit-modal.modal-overlay.tt-fullpage-modal:not(.hidden),
  html body #manual-tx-modal.modal-overlay.tt-fullpage-modal:not(.hidden),
  html body .tt-contract-preview-fullpage {
    inset: var(--tt-header-h) 0 0 64px !important;
    left: 64px !important;
  }

  html body #dashboard-view .card-header--with-search {
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-items: stretch !important;
  }

  html body #dashboard-view .card-header--with-search .card-header-actions {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(120px, auto) minmax(120px, auto) auto !important;
  }

  html body #dashboard-view .card-header--with-search .search-box,
  html body #dashboard-view .card-header--with-search input {
    width: 100% !important;
    min-width: 0 !important;
  }

  html body #dashboard-view .admin-data-table,
  html body #dashboard-view table {
    min-width: 760px !important;
  }

  html body #campaign-edit-modal .cform-row,
  html body #campaign-edit-modal .cform-toggles,
  html body #talent-form,
  html body #talent-form > .form-row,
  html body #brand-edit-modal .bf-grid {
    grid-template-columns: 1fr !important;
  }

  html body #talent-form > .talent-email-active-row {
    grid-template-columns: minmax(0, 1fr) auto !important;
  }
}

@media (max-width: 620px) {
  html body #dashboard-view > .container > header,
  html body #dashboard-view .talent-header {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 8px !important;
  }

  html body #dashboard-view > .container > header > .header-content,
  html body #dashboard-view .header-content {
    width: 100% !important;
    height: var(--tt-header-h) !important;
    min-height: var(--tt-header-h) !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    padding: 0 !important;
  }

  html body #dashboard-view .header-content .logo,
  html body #dashboard-view .talent-header-logo {
    max-width: 118px !important;
    height: 32px !important;
    flex: 0 0 auto !important;
  }

  html body #dashboard-view .header-actions,
  html body #dashboard-view .talent-header-actions {
    position: static !important;
    transform: none !important;
    width: auto !important;
    height: auto !important;
    min-height: 32px !important;
    max-height: none !important;
    display: inline-flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 5px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: 0 0 auto !important;
  }

  html body #dashboard-view .lang-toggle-btn,
  html body #dashboard-view .tt-notif-toggle-btn {
    width: 32px !important;
    min-width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
    font-size: 10px !important;
  }

  html body .tt-admin-profile-btn,
  html body .talent-profile-menu summary {
    min-height: 32px !important;
    padding: 2px !important;
  }

  html body .tt-admin-profile-btn > span:not(.tt-admin-profile-avatar),
  html body .tt-admin-profile-btn > svg,
  html body .talent-profile-copy {
    display: none !important;
  }

  html body .tt-admin-profile-menu,
  html body .talent-profile-dropdown {
    position: fixed !important;
    top: calc(var(--tt-header-h) - 2px) !important;
    right: 8px !important;
    left: auto !important;
    width: min(260px, calc(100vw - 16px)) !important;
    max-width: calc(100vw - 16px) !important;
  }

  html body #dashboard-view main > .admin-main-section,
  html body #dashboard-view .talent-main > .talent-panel {
    padding: 8px !important;
  }

  html body #dashboard-view .card-header--with-search {
    padding: 12px !important;
  }

  html body #dashboard-view .card-header--with-search .card-header-actions {
    grid-template-columns: 1fr auto !important;
  }

  html body #dashboard-view .card-header--with-search .search-box,
  html body #dashboard-view .card-header--with-search .contract-filter-select {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }

  html body #dashboard-view .card-header--with-search .btn-primary {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }

  html body #contract-modal.tt-fullpage-modal .modal-header,
  html body #campaign-edit-modal.tt-fullpage-modal .modal-header,
  html body #brand-edit-modal.tt-fullpage-modal .modal-header,
  html body #talent-edit-modal.tt-fullpage-modal .modal-header {
    padding: 10px 12px !important;
  }

  html body #contract-modal.tt-fullpage-modal .contract-tabs {
    padding: 0 12px !important;
  }

  html body #contract-modal.tt-fullpage-modal #contract-form > .contract-tab-panel.active {
    padding: 12px !important;
  }

  html body #contract-modal.tt-fullpage-modal #contract-form > .modal-footer,
  html body #campaign-edit-modal.tt-fullpage-modal > .modal-dialog > .modal-footer {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 7px !important;
  }

  html body #contract-modal.tt-fullpage-modal #contract-form > .modal-footer button,
  html body #campaign-edit-modal.tt-fullpage-modal > .modal-dialog > .modal-footer button {
    width: 100% !important;
  }

  html body #campaign-edit-modal.tt-fullpage-modal #campaign-form {
    padding: 10px 10px 0 !important;
  }

  html body #campaign-edit-modal.tt-fullpage-modal > .modal-dialog > .modal-footer {
    width: 100% !important;
    margin: 0 !important;
    padding: 10px !important;
    flex-basis: auto !important;
  }

  html body #talent-edit-modal.tt-fullpage-modal .modal-body,
  html body #brand-edit-modal.tt-fullpage-modal .modal-body {
    padding: 10px 10px 78px !important;
  }

  html body #talent-form > .talent-email-active-row {
    grid-template-columns: minmax(0, 1fr) auto !important;
  }

  html body .tt-add-ph-grid {
    grid-template-columns: 1fr !important;
  }

  html body #talent-form .talent-active-toggle {
    width: 100% !important;
  }

  html body .tt-add-placeholder-panel {
    margin: 12px !important;
  }

  html body .tt-add-ph-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  html body .tt-add-ph-actions button {
    width: 100% !important;
  }

  html body .tt-contract-preview-header {
    padding: 0 10px !important;
  }

  html body .tt-contract-preview-header .tt-preview-title {
    min-width: 0 !important;
    max-width: none !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body .tt-contract-preview-body {
    padding: 12px !important;
    display: block !important;
    justify-content: flex-start !important;
    overflow: auto !important;
  }

  html body .tt-contract-preview-body .tt-preview-content {
    margin: 0 !important;
  }

  html body .tt-contract-preview-header .tt-preview-actions {
    display: none !important;
  }

  html body #talent-profile-modal.talent-modal-overlay:not(.hidden) {
    align-items: flex-start !important;
    padding: 10px !important;
    overflow-y: auto !important;
  }

  html body #talent-profile-modal > .talent-profile-modal {
    width: 100% !important;
    max-width: 100% !important;
    max-height: calc(100dvh - 20px) !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-y: auto !important;
  }

  html body #talent-profile-modal .talent-modal-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 2 !important;
    margin: 0 !important;
  }

html body #talent-profile-modal .talent-modal-actions {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 2 !important;
    margin: 0 !important;
  }
}

/* ---------------------------------------------------------------------------
   V95B final annotated-screen hardening
   --------------------------------------------------------------------------- */

/* The contract list header must not reappear above the template sub-pages. */
html body #dashboard-view #contracts-admin-section .card-header.tt-templates-active {
  display: none !important;
}

/* Leave a deliberate quiet gap between template copy and the divider. */
html body #templates-container.tt-template-app .tt-view > .tt-view-header {
  min-height: 82px !important;
  padding: 16px 22px 22px !important;
}

html body #templates-container.tt-template-app .tt-view-header-title p {
  margin-top: 6px !important;
}

/* Keep the active flag directly beside the e-mail input, without a tall tile. */
html body #talent-form .talent-active-toggle {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  align-self: end !important;
  width: auto !important;
  min-width: max-content !important;
  gap: 6px !important;
}

html body #talent-form .talent-active-toggle span {
  white-space: nowrap !important;
  line-height: 1 !important;
}

@media (max-width: 620px) {
  html body #talent-form > .talent-email-active-row {
    grid-template-columns: minmax(0, 1fr) max-content !important;
    gap: 8px !important;
  }

  html body #talent-form .talent-active-toggle {
    width: auto !important;
    min-width: max-content !important;
    padding: 0 8px !important;
  }

  html body #talent-form .talent-active-toggle span {
    font-size: 11px !important;
  }

  /* Preserve the A4 page ratio while fitting the portal's available width. */
  html body .tt-contract-preview-body .tt-preview-content {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    aspect-ratio: 794 / 1123 !important;
    overflow: hidden !important;
  }
}

/* ---------------------------------------------------------------------------
   V95D profile, fixed shell and contract workflow corrections
   --------------------------------------------------------------------------- */

/* Header and sidebar form one permanent dashboard frame. */
html body #dashboard-view > .container > header,
html body #dashboard-view header.admin-header,
html body #dashboard-view > .container > header:first-of-type,
html body #dashboard-view.dashboard-view > .container > header,
html body #dashboard-view.talent-shell .talent-header,
html body .talent-shell > .talent-header,
html body .talent-shell .talent-header,
html body #dashboard-view .talent-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100vw !important;
  margin: 0 !important;
  border-radius: 0 !important;
  z-index: 1200 !important;
}

html body #dashboard-view > .container > main,
html body #dashboard-view .talent-main {
  padding-top: var(--tt-header-h) !important;
  min-height: 100vh !important;
}

/* Talent profile settings use the same solid, scrollable dialog structure as
   the admin account settings. */
html body #talent-profile-modal.talent-modal-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10000 !important;
  padding: 16px !important;
  background: rgba(15, 23, 42, 0.5) !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}

html body #talent-profile-modal > .talent-modal.talent-profile-modal {
  width: min(760px, calc(100vw - 32px)) !important;
  max-width: 760px !important;
  max-height: calc(100dvh - 32px) !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  align-items: stretch !important;
  justify-content: stretch !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid var(--tt-line-strong) !important;
  border-radius: 8px !important;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.18) !important;
}

html body #talent-profile-modal .talent-modal-header,
html body #talent-profile-modal .talent-modal-actions {
  position: static !important;
  margin: 0 !important;
  background: #fff !important;
}

html body #talent-profile-modal .talent-modal-header {
  padding: 18px 22px !important;
  border-bottom: 1px solid var(--tt-line) !important;
}

html body #talent-profile-modal .talent-profile-modal-body {
  min-height: 0 !important;
  padding: 20px 22px !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  background: #fff !important;
}

html body #talent-profile-modal .talent-profile-settings {
  margin: 0 !important;
  padding: 0 0 20px !important;
  background: #fff !important;
}

html body #talent-profile-modal .tt-profile-section {
  margin: 0 !important;
  padding: 20px 0 0 !important;
  border-top: 1px solid var(--tt-line) !important;
  background: #fff !important;
}

html body #talent-profile-modal .talent-modal-actions {
  padding: 14px 22px !important;
  border-top: 1px solid var(--tt-line) !important;
  background: #fafbfc !important;
}

/* Admin profile settings: the middle section must be the scroll container. */
html body #tt-account-modal .modal-dialog {
  max-height: calc(100dvh - 32px) !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

html body #tt-account-modal .modal-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
}

html body #tt-account-modal .modal-footer {
  position: static !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  backdrop-filter: none !important;
}

html body #tt-account-modal .tt-account-branding-section {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 10px 12px !important;
  border: 1px solid var(--tt-line) !important;
  border-radius: 6px !important;
  background: #fafbfc !important;
}

html body #tt-account-modal .tt-account-branding-copy {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

html body #tt-account-modal .tt-account-branding-copy img {
  width: 92px !important;
  height: 34px !important;
  flex: 0 0 92px !important;
  object-fit: contain !important;
  padding: 3px !important;
  border: 1px solid var(--tt-line) !important;
  border-radius: 4px !important;
  background: #fff !important;
}

html body #tt-account-modal .tt-account-branding-copy strong,
html body #tt-account-modal .tt-account-branding-copy span {
  display: block !important;
  margin: 0 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

html body #tt-account-modal .tt-account-branding-copy strong {
  color: var(--tt-text) !important;
  font-size: 12px !important;
  line-height: 1.3 !important;
}

html body #tt-account-modal .tt-account-branding-copy span {
  margin-top: 2px !important;
  color: var(--tt-muted) !important;
  font-size: 8.4px !important;
  line-height: 1.35 !important;
}

html body #tt-account-modal label.tt-account-branding-upload {
  min-height: 30px !important;
  margin: 0 !important;
  padding: 0 9px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  border: 1px solid var(--tt-line-strong) !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: var(--tt-text) !important;
  cursor: pointer !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
}

html body #tt-account-modal .tt-account-branding-upload input {
  display: none !important;
}

/* A long contract remains on a continuous white page instead of overflowing
   beyond a fixed A4-height tile. */
html body .tt-contract-preview-body .tt-preview-content {
  height: auto !important;
  min-height: 1123px !important;
  display: flow-root !important;
  overflow: visible !important;
  background: #fff !important;
}

/* Contract options shown in the annotated screenshots are compact checkbox
   rows, not full-width tiles. */
html body #contract-modal .contract-inline-checkbox {
  width: max-content !important;
  max-width: 100% !important;
  min-height: 30px !important;
  margin: 0 !important;
  padding: 4px 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  border: 1px solid var(--tt-line-strong) !important;
  border-radius: 6px !important;
  background: #fff !important;
  cursor: pointer !important;
}

html body #contract-modal .contract-inline-checkbox input[type="checkbox"] {
  width: 15px !important;
  min-width: 15px !important;
  height: 15px !important;
  margin: 0 !important;
  flex: 0 0 15px !important;
}

html body #contract-modal .contract-inline-checkbox .field-label-main,
html body #contract-modal .contract-inline-checkbox span {
  margin: 0 !important;
  color: var(--tt-text) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
}

html body #contract-modal #contract-online-months {
  width: 96px !important;
  min-width: 96px !important;
  flex: 0 0 96px !important;
}

html body #contract-modal #contract-online-duration-unit {
  width: auto !important;
  min-width: 110px !important;
  flex: 1 1 auto !important;
  text-overflow: ellipsis !important;
}

html body #contract-modal #contract-payment-mode {
  text-overflow: ellipsis !important;
}

/* Contract list status pills stay on one line, including long German labels. */
html body #contracts-table .badge,
html body #contracts-grid .badge {
  min-height: 18px !important;
  height: 18px !important;
  padding: 0 6px !important;
  display: inline-flex !important;
  align-items: center !important;
  font-size: 9.5px !important;
  line-height: 1 !important;
  letter-spacing: 0.02em !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
}

html body #contracts-table td:nth-child(6) {
  min-width: 118px !important;
}

/* Public contract signature dialog follows the compact portal modal scale. */
html body #signature-modal.signature-modal {
  padding: 16px !important;
  background: rgba(15, 23, 42, 0.5) !important;
}

html body #signature-modal .signature-modal-content {
  width: min(560px, calc(100vw - 32px)) !important;
  max-width: 560px !important;
  max-height: calc(100dvh - 32px) !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  border: 1px solid var(--tt-line-strong) !important;
  border-radius: 8px !important;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.18) !important;
}

html body #signature-modal .signature-modal-header {
  flex: 0 0 auto !important;
  padding: 14px 18px !important;
  border-bottom: 1px solid var(--tt-line) !important;
}

html body #signature-modal .signature-modal-header h2 {
  font-size: 16px !important;
  color: var(--tt-text) !important;
}

html body #signature-modal .signature-modal-body {
  min-height: 0 !important;
  padding: 16px 18px !important;
  overflow-y: auto !important;
}

html body #signature-modal .alert.alert-info {
  margin: 0 0 10px !important;
  padding: 2px 5px !important;
  border-radius: 5px !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}

html body #signature-modal .signature-canvas-wrapper {
  margin: 10px 0 !important;
  padding: 4px !important;
  border: 1px solid var(--tt-line-strong) !important;
  border-radius: 5px !important;
  background: #f3f4f6 !important;
}

html body #signature-modal #modal-signature-canvas {
  height: 150px !important;
  border-radius: 3px !important;
}

html body #signature-modal .signature-actions-compact {
  margin: 0 !important;
  gap: 8px !important;
}

html body #signature-modal .file-upload-label {
  padding: 6px 9px !important;
  border-width: 1px !important;
  border-radius: 5px !important;
  font-size: 12px !important;
}

html body #signature-modal .apply-to-all-wrapper {
  margin: 12px 0 0 !important;
  padding: 2px 5px !important;
  border-radius: 5px !important;
}

html body #signature-modal .apply-to-all-wrapper label {
  font-size: 12px !important;
  line-height: 1.35 !important;
}

/* V101g: ENTFERNT — `margin: 14px -18px -16px !important` zog den Footer
   16px UNTER die Modal-Edge (das war DER „Cut-off" den User seit V100q meldet).
   Plus padding 12px 18px überschrieb die kanonische 40/48/56 Inline-Definition.
   Komplett rausgenommen damit V101f Inline-Style greift. */

@media (max-width: 620px) {
  html body #talent-profile-modal.talent-modal-overlay {
    padding: 10px !important;
    align-items: flex-start !important;
    overflow-y: auto !important;
  }

  html body #talent-profile-modal > .talent-modal.talent-profile-modal {
    width: 100% !important;
    max-width: 100% !important;
    height: calc(100dvh - 32px) !important;
    max-height: calc(100dvh - 32px) !important;
    box-sizing: border-box !important;
  }

  html body #talent-profile-modal .talent-profile-modal-body {
    padding: 14px !important;
  }

  html body #tt-account-modal .tt-account-branding-section {
    align-items: stretch !important;
    flex-direction: column !important;
  }

  html body #tt-account-modal label.tt-account-branding-upload {
    width: 100% !important;
  }

  html body .tt-contract-preview-body .tt-preview-content {
    width: 100% !important;
    min-width: 0 !important;
    min-height: calc((100vw - 24px) * 1.414) !important;
    aspect-ratio: auto !important;
    overflow: visible !important;
  }

  html body #contract-modal .contract-inline-checkbox .field-label-main,
  html body #contract-modal .contract-inline-checkbox span {
    white-space: normal !important;
  }

  html body #signature-modal .signature-modal-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  html body #signature-modal .signature-modal-actions button {
    width: 100% !important;
  }
}

/* ---------------------------------------------------------------------------
   V95E stage-1 live recovery: contract signing and annotated design cleanup
   --------------------------------------------------------------------------- */

/* The dashboard shell is the frame. Page content itself meets the fixed header
   and sidebar without an additional rounded window around every view. */
html body #dashboard-view main > .admin-main-section,
html body #dashboard-view .talent-main > .talent-panel,
html body #dashboard-view.talent-shell .talent-main > .talent-panel {
  padding: 0 !important;
  background: #fff !important;
}

html body #dashboard-view main > .admin-main-section > .card,
html body #dashboard-view .talent-main > .talent-panel {
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
}

/* Shared list headers use one calm, compact action-bar rhythm. */
html body #dashboard-view .admin-main-section > .card > .card-header--with-search,
html body #templates-container.tt-template-app .tt-view > .tt-view-header {
  min-height: 78px !important;
  padding: 16px 22px !important;
  gap: 18px !important;
  border-bottom: 1px solid var(--tt-line) !important;
  background: #fff !important;
}

html body #dashboard-view .card-header--with-search .card-header-actions,
html body #templates-container.tt-template-app .tt-view-header-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
}

html body #dashboard-view .card-header--with-search .search-box,
html body #templates-container.tt-template-app .tt-view-header-actions .tt-search-input {
  min-width: 260px !important;
}

html body #dashboard-view .card-header--with-search input,
html body #dashboard-view .card-header--with-search select,
html body #templates-container.tt-template-app .tt-view-header-actions input,
html body #templates-container.tt-template-app .tt-view-header-actions button {
  min-height: 36px !important;
  height: 36px !important;
  border-radius: 6px !important;
}

/* Account settings: use the available width instead of creating a long stack. */
html body #tt-account-modal .modal-dialog {
  width: min(650px, calc(100vw - 32px)) !important;
  max-width: 650px !important;
}

html body #tt-account-modal .modal-body {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px 14px !important;
  padding: 16px 20px !important;
}

html body #tt-account-modal .modal-body > .tt-account-avatar-section,
html body #tt-account-modal .modal-body > .tt-account-branding-section {
  grid-column: 1 / -1 !important;
}

html body #tt-account-modal .tt-account-avatar-section {
  margin: 0 !important;
  padding: 4px 0 12px !important;
}

html body #tt-account-modal .modal-header,
html body #tt-account-modal .modal-footer {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

/* Checkbox labels in contract and talent forms stay level with their copy. */
html body #contract-modal .contract-inline-checkbox {
  vertical-align: middle !important;
}

html body #contract-modal .contract-inline-checkbox + small {
  margin-top: 5px !important;
  line-height: 1.35 !important;
}

html body #talent-form > .talent-email-active-row {
  align-items: end !important;
}

html body #talent-form .talent-active-toggle {
  min-height: 36px !important;
  height: 36px !important;
  align-items: center !important;
}

html body #talent-form .talent-active-toggle input[type="checkbox"] {
  margin: 0 !important;
  flex: 0 0 auto !important;
}

/* Invitation and final-send dialogs must always fit the viewport. Their body is
   the only scrolling region, so headers and actions are never cut off. */
html body #email-modal.modal-overlay:not(.hidden),
html body #send-invitation-modal.modal-overlay:not(.hidden),
html body #pdf-download-modal.modal-overlay:not(.hidden) {
  padding: 16px !important;
  align-items: center !important;
  overflow: hidden !important;
  z-index: 5000 !important;
}

html body #email-modal > .modal-dialog,
html body #send-invitation-modal > .modal-dialog,
html body #pdf-download-modal > .modal-dialog {
  width: min(700px, calc(100vw - 32px)) !important;
  max-width: 700px !important;
  max-height: calc(100dvh - 32px) !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  border: 1px solid var(--tt-line-strong) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.2) !important;
}

html body #send-invitation-modal > .modal-dialog {
  width: min(600px, calc(100vw - 32px)) !important;
  max-width: 600px !important;
}

html body #email-modal .modal-header,
html body #send-invitation-modal .modal-header,
html body #pdf-download-modal .modal-header {
  flex: 0 0 auto !important;
  min-height: 54px !important;
  margin: 0 !important;
  padding: 13px 18px !important;
  border-bottom: 1px solid var(--tt-line) !important;
}

html body #email-modal .modal-body,
html body #send-invitation-modal .modal-body,
html body #pdf-download-modal .modal-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  padding: 16px 18px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
}

html body #email-modal .modal-footer,
html body #send-invitation-modal .modal-footer,
html body #pdf-download-modal .modal-footer {
  position: static !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 12px 18px !important;
  border-top: 1px solid var(--tt-line) !important;
  background: #fafbfc !important;
}

html body #email-modal label,
html body #send-invitation-modal label,
html body #pdf-download-modal label,
html body #pdf-download-modal h3 {
  display: block !important;
  overflow: visible !important;
  line-height: 1.35 !important;
}

html body #send-invitation-modal .close-btn {
  width: 32px !important;
  height: 32px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  color: var(--tt-muted) !important;
  font-size: 24px !important;
  cursor: pointer !important;
}

/* Public signature dialog: compact controls, portal typography and explicit
   visual separation between drawing area and final actions. */
html body #signature-modal .signature-modal-content {
  font-family:
    ui-sans-serif,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif !important;
}

html body #signature-modal .modal-close {
  border-radius: 6px !important;
  color: var(--tt-muted) !important;
}

html body #signature-modal .signature-actions-compact,
html body #signature-modal .upload-inline-group {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
}

/* V101g: ENTFERNT — display:flex/gap:8px überschrieb die kanonische
   V101f Inline grid + gap:56. */

html body #signature-modal .signature-modal-actions .btn,
html body #signature-modal .signature-actions-compact .btn {
  flex: 0 0 auto !important;
  min-height: 34px !important;
  height: 34px !important;
  padding: 0 12px !important;
  border-radius: 6px !important;
  font-size: 12.5px !important;
}

/* Portal-native confirmation dialog replaces browser confirm popups. */
html body #tt-confirm-modal.tt-confirm-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 12000 !important;
  padding: 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(15, 23, 42, 0.5) !important;
  backdrop-filter: blur(6px) !important;
}

html body #tt-confirm-modal .tt-confirm-dialog {
  width: min(460px, calc(100vw - 32px)) !important;
  max-width: 460px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid var(--tt-line-strong) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.2) !important;
}

html body #tt-confirm-modal .modal-header,
html body #tt-confirm-modal .modal-footer {
  padding: 13px 18px !important;
}

html body #tt-confirm-modal .tt-confirm-body {
  padding: 16px 18px !important;
}

html body #tt-confirm-modal .tt-confirm-body p {
  margin: 0 0 10px !important;
  color: var(--tt-text) !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

html body #tt-confirm-modal .tt-confirm-body p:last-child {
  margin-bottom: 0 !important;
}

@media (max-width: 700px) {
  html body #dashboard-view .admin-main-section > .card > .card-header--with-search,
  html body #templates-container.tt-template-app .tt-view > .tt-view-header {
    min-height: 0 !important;
  }

  html body #dashboard-view .card-header--with-search .card-header-actions,
  html body #templates-container.tt-template-app .tt-view-header-actions {
    flex-wrap: wrap !important;
  }

  html body #dashboard-view .card-header--with-search .search-box,
  html body #templates-container.tt-template-app .tt-view-header-actions .tt-search-input {
    min-width: 0 !important;
  }

  html body #tt-account-modal .modal-body {
    grid-template-columns: 1fr !important;
  }

  html body #tt-account-modal .modal-body > .tt-account-avatar-section,
  html body #tt-account-modal .modal-body > .tt-account-branding-section {
    grid-column: auto !important;
  }
}

/* ---------------------------------------------------------------------------
   V95H/V95M final archive corrections: restore frame geometry, compact dialogs
   and keep Admin/Talent on one fixed shell.
   --------------------------------------------------------------------------- */

html body #dashboard-view > .container,
html body #dashboard-view.talent-shell {
  width: 100vw !important;
  max-width: 100vw !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  overflow-x: hidden !important;
}

html body #dashboard-view > .container > header,
html body #dashboard-view header.admin-header,
html body #dashboard-view.talent-shell:not(.talent-auth-view) > .talent-header,
html body #dashboard-view.talent-shell .talent-header,
html body .talent-shell > .talent-header,
html body .talent-shell .talent-header,
html body #dashboard-view .talent-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100vw !important;
  min-height: var(--tt-header-h) !important;
  height: var(--tt-header-h) !important;
  margin: 0 !important;
  padding: 0 24px !important;
  border-radius: 0 !important;
  z-index: 1400 !important;
  overflow: visible !important;
}

html body #dashboard-view .header-content,
html body #dashboard-view .talent-header-content {
  min-height: var(--tt-header-h) !important;
  height: var(--tt-header-h) !important;
  margin: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  align-items: center !important;
  overflow: visible !important;
}

html body #dashboard-view .logo img,
html body #dashboard-view .talent-logo img {
  max-height: calc(var(--tt-header-h) - 22px) !important;
  width: auto !important;
  object-fit: contain !important;
}

html body #dashboard-view .profile-dropdown,
html body #dashboard-view .talent-profile-menu {
  top: auto !important;
  right: auto !important;
  left: auto !important;
  bottom: auto !important;
  z-index: 1500 !important;
}

html body #dashboard-view .talent-profile-dropdown {
  top: calc(100% + 8px) !important;
  right: 0 !important;
  left: auto !important;
  z-index: 1600 !important;
}

html body #dashboard-view > .container > main,
html body #dashboard-view .talent-main {
  display: block !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: var(--tt-header-h) 0 0 !important;
  background: var(--tt-page-bg) !important;
}

html body #dashboard-view .admin-main-nav,
html body #dashboard-view .talent-main > .dashboard-tabs {
  position: fixed !important;
  top: var(--tt-header-h) !important;
  left: 0 !important;
  bottom: 0 !important;
  z-index: 500 !important;
  width: var(--tt-sidebar-w) !important;
  min-width: var(--tt-sidebar-w) !important;
  max-width: var(--tt-sidebar-w) !important;
  height: calc(100dvh - var(--tt-header-h)) !important;
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  max-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 !important;
  padding: 14px 12px !important;
  border-radius: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

html body #dashboard-view main > .admin-main-section,
html body #dashboard-view .talent-main > .talent-panel,
html body #dashboard-view.talent-shell .talent-main > .talent-panel {
  min-width: 0 !important;
  flex: 1 1 auto !important;
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 0 0 var(--tt-sidebar-w) !important;
  padding: var(--tt-content-pad) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--tt-page-bg) !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html body #dashboard-view main > .admin-main-section > .card,
html body #dashboard-view .talent-panel > .card,
html body #dashboard-view .talent-panel > .tt-panel-card {
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html body #dashboard-view .admin-main-section > .card > .card-header--with-search,
html body #templates-container.tt-template-app .tt-view > .tt-view-header {
  display: grid !important;
  grid-template-columns: minmax(220px, 1fr) auto !important;
  align-items: center !important;
  min-height: 70px !important;
  padding: 14px 22px !important;
  gap: 14px !important;
}

html body #dashboard-view .card-header--with-search .card-header-actions,
html body #templates-container.tt-template-app .tt-view-header-actions,
html body #dashboard-view .talent-panel-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

/* V94g: split the rule — only the INPUT gets the border, NOT the wrapper.
   Prevents the double-frame appearance (rounded box inside rounded box). */
html body #dashboard-view .card-header--with-search input[type="search"],
html body #dashboard-view .card-header--with-search input[type="text"],
html body #dashboard-view .card-header--with-search .search-box input,
html body #templates-container.tt-template-app .tt-view-header-actions .tt-search-input {
  /* V103av — Vorher: min-width:240px ließ den Input über seinen 220px
     Container hinausragen und überlappte mit dem Status-Filter daneben.
     Mit min-width:0 schrumpft er korrekt auf 100% des Containers. */
  min-width: 0 !important;
  height: 38px !important;
  border-radius: 8px !important;
  border: 1px solid #d8dee8 !important;
  background: #fff !important;
  box-shadow: none !important;
}
/* Wrapper: no chrome, just layout */
html body #dashboard-view .card-header--with-search .search-box {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  overflow: visible !important;
  height: auto !important;
  display: inline-flex !important;
  align-items: center !important;
}

html body #dashboard-view .card-header--with-search button,
html body #templates-container.tt-template-app .tt-view-header-actions button,
html body #dashboard-view .btn-icon,
html body #dashboard-view .refresh-btn {
  min-height: 38px !important;
  height: 38px !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
}

html body #dashboard-view .card-header--with-search .btn-primary,
html body #dashboard-view .card-header--with-search button.primary,
html body #templates-container.tt-template-app .tt-view-header-actions .btn-primary {
  border-color: #111827 !important;
  background: #111827 !important;
  color: #fff !important;
}

html body .modal-overlay:not(.hidden),
html body .talent-modal-overlay:not(.hidden) {
  padding: 18px !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: auto !important;
}

html body .modal-overlay:not(.hidden) > .modal,
html body .modal-overlay:not(.hidden) > .modal-dialog,
html body .modal-overlay:not(.hidden) > .modal-large,
html body .talent-modal-overlay:not(.hidden) > .talent-modal,
html body #email-modal:not(.hidden) > .modal-dialog,
html body #send-invitation-modal:not(.hidden) > .modal-dialog,
html body #pdf-download-modal:not(.hidden) > .modal-dialog,
html body #signature-modal.active > .signature-modal-content {
  max-height: calc(100dvh - 36px) !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

html body .modal-header,
html body .talent-modal-header,
html body #signature-modal .signature-modal-header {
  flex: 0 0 auto !important;
}

html body .modal-body,
html body .talent-modal-body,
html body .talent-profile-modal-body,
html body #signature-modal .signature-modal-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
}

html body .modal-footer,
html body .talent-modal-actions,
html body #signature-modal .signature-modal-actions {
  flex: 0 0 auto !important;
}

html body #talent-profile-modal > .talent-modal.talent-profile-modal {
  width: min(880px, calc(100vw - 32px)) !important;
  max-width: 880px !important;
}

html body #talent-profile-modal .talent-modal-header {
  padding: 16px 22px !important;
}

html body #talent-profile-modal .talent-profile-modal-body {
  padding: 18px 22px !important;
}

html body #talent-profile-modal .talent-profile-settings {
  display: grid !important;
  grid-template-columns: 200px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 18px !important;
  margin-bottom: 16px !important;
}

html body #talent-profile-modal .talent-profile-preview-card {
  padding: 14px !important;
}

html body #talent-profile-modal .talent-profile-preview {
  width: 104px !important;
  height: 118px !important;
  font-size: 30px !important;
}

html body #talent-profile-modal .tt-profile-section {
  margin-top: 14px !important;
  padding-top: 14px !important;
}

html body #talent-profile-modal .tt-profile-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px 14px !important;
}

html body #talent-profile-modal .talent-modal-actions {
  padding: 12px 22px !important;
}

html body #contract-modal .contract-inline-checkbox,
html body #contract-modal .usage-rights-option,
html body #contract-modal label:has(> input[type="checkbox"]),
html body #talent-form .talent-active-toggle,
html body .cform-toggle {
  display: inline-flex !important;
  align-items: center !important;
  gap: 9px !important;
  line-height: 1.3 !important;
}

html body #contract-modal .contract-inline-checkbox input[type="checkbox"],
html body #contract-modal label:has(> input[type="checkbox"]) input[type="checkbox"],
html body #talent-form .talent-active-toggle input[type="checkbox"],
html body .cform-toggle input[type="checkbox"] {
  flex: 0 0 auto !important;
  margin: 0 !important;
  transform: none !important;
}

html body #signature-modal.signature-modal {
  align-items: center !important;
  justify-content: center !important;
  padding: 18px !important;
}

html body #signature-modal .signature-modal-content {
  width: min(760px, calc(100vw - 36px)) !important;
  max-width: 760px !important;
  border-radius: 10px !important;
}

html body #signature-modal .signature-modal-header {
  padding: 15px 18px !important;
}

html body #signature-modal .signature-modal-body {
  padding: 16px 18px !important;
}

html body #signature-modal .signature-canvas-wrapper {
  min-height: 180px !important;
}

@media (max-width: 760px) {
  html body #dashboard-view .admin-main-section > .card > .card-header--with-search,
  html body #templates-container.tt-template-app .tt-view > .tt-view-header {
    grid-template-columns: 1fr !important;
    align-items: stretch !important;
  }

  html body #dashboard-view .card-header--with-search .card-header-actions,
  html body #templates-container.tt-template-app .tt-view-header-actions {
    justify-content: flex-start !important;
  }

  html body #talent-profile-modal .talent-profile-settings,
  html body #talent-profile-modal .tt-profile-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 520px) {
  html body .talent-modal-overlay:not(.hidden) {
    padding: 12px !important;
  }

  html body .talent-modal-overlay:not(.hidden) > .talent-modal,
  html body #talent-profile-modal > .talent-modal.talent-profile-modal,
  html body #signature-template-modal .talent-modal {
    height: calc(100vh - 48px) !important;
    min-height: 0 !important;
    max-height: calc(100vh - 48px) !important;
  }

  html body #signature-template-modal .signature-grid {
    padding: 14px !important;
    gap: 12px !important;
  }

  html body #signature-template-modal #talent-signature-pad {
    height: clamp(130px, 21vh, 170px) !important;
  }

  html body #talent-profile-modal .talent-modal-actions,
  html body #signature-template-modal .signature-template-actions {
    padding: 10px 14px !important;
  }
}

/* V95H hard shell geometry: fixed frame, content never underneath sidebar. */
html body #dashboard-view > .container > main,
html body #dashboard-view.dashboard-view > .container > main,
html body #dashboard-view.talent-shell > .talent-main,
html body #dashboard-view .talent-main,
html body .talent-shell .talent-main {
  position: relative !important;
  display: block !important;
  width: 100vw !important;
  max-width: 100vw !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: var(--tt-header-h) 0 0 !important;
  overflow-x: hidden !important;
}

html body #dashboard-view > .container > main > .admin-main-nav,
html body #dashboard-view .admin-main-nav,
html body #dashboard-view.talent-shell:not(.talent-auth-view) > .talent-main > .dashboard-tabs,
html body #dashboard-view.talent-shell > .talent-main > .dashboard-tabs,
html body #dashboard-view.talent-shell .talent-main > .dashboard-tabs,
html body #dashboard-view .talent-main > .dashboard-tabs,
html body .talent-shell .talent-main > .dashboard-tabs,
html body .talent-shell .dashboard-tabs {
  position: fixed !important;
  top: var(--tt-header-h) !important;
  left: 0 !important;
  bottom: 0 !important;
  z-index: 500 !important;
  width: var(--tt-sidebar-w) !important;
  min-width: var(--tt-sidebar-w) !important;
  max-width: var(--tt-sidebar-w) !important;
  height: calc(100dvh - var(--tt-header-h)) !important;
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  max-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 !important;
  padding: 14px 12px !important;
  gap: 8px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

html body #dashboard-view main > .admin-main-section,
html body #dashboard-view.dashboard-view > .container > main > .admin-main-section,
html body #dashboard-view.talent-shell:not(.talent-auth-view) > .talent-main > .talent-panel,
html body #dashboard-view .talent-main > .talent-panel,
html body #dashboard-view.talent-shell > .talent-main > .talent-panel,
html body #dashboard-view.talent-shell .talent-main > .talent-panel,
html body .talent-shell .talent-main > .talent-panel {
  box-sizing: border-box !important;
  width: calc(100vw - var(--tt-sidebar-w)) !important;
  max-width: calc(100vw - var(--tt-sidebar-w)) !important;
  min-width: 0 !important;
  min-height: calc(100dvh - var(--tt-header-h)) !important;
  margin: 0 0 0 var(--tt-sidebar-w) !important;
  padding: var(--tt-content-pad) !important;
  border-radius: 0 !important;
  background: var(--tt-page-bg) !important;
  transform: none !important;
}

html body #dashboard-view.talent-shell .talent-main > .talent-global-alerts,
html body .talent-shell .talent-main > .talent-global-alerts {
  box-sizing: border-box !important;
  width: calc(100vw - var(--tt-sidebar-w)) !important;
  max-width: calc(100vw - var(--tt-sidebar-w)) !important;
  margin-left: var(--tt-sidebar-w) !important;
}

/* ============================================================================
   Template-Verwaltung — redesign to match Übersicht layout
   ============================================================================ */

#templates-container .tt-view.tt-view--templates {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  min-height: auto !important;
  overflow: visible !important;
}

html body #templates-container.tt-template-app .tt-view--templates > .tt-view-header {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 0 0 12px !important;
  margin: 0 0 14px !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--tt-line) !important;
  border-radius: 0 !important;
  min-height: auto !important;
  grid-template-columns: none !important;
}

html body #templates-container.tt-template-app .tt-view--templates .tt-view-header-title {
  display: flex !important;
  align-items: baseline !important;
  gap: 0 !important;
  min-width: 0 !important;
}

html body #templates-container.tt-template-app .tt-view--templates .tt-view-header h1 {
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  color: #111827 !important;
  margin: 0 !important;
  letter-spacing: 0 !important;
}

/* Subtitle removed for cleaner look */
html body #templates-container.tt-template-app .tt-view--templates .tt-view-header p {
  display: none !important;
}

html body #templates-container.tt-template-app .tt-view--templates .tt-view-header-actions {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex: 0 0 auto !important;
}

html body #templates-container.tt-template-app .tt-view--templates .tt-view-header-actions .tt-search-input,
html body #templates-container.tt-template-app .tt-view--templates .tt-view-header input[type="search"] {
  width: 180px !important;
  min-width: 140px !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  padding: 0 10px !important;
  font-size: 12px !important;
  border-radius: 6px !important;
  border: 1px solid var(--tt-line-strong) !important;
}

html body #templates-container.tt-template-app .tt-view--templates .tt-view-header-actions button,
html body #templates-container.tt-template-app .tt-view--templates .tt-view-header-actions .btn-primary,
html body #templates-container.tt-template-app .tt-view--templates .tt-view-header-actions .btn-secondary {
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  padding: 0 11px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  line-height: 1 !important;
}

#template-type-list.tt-template-grid {
  padding: 0 !important;
  gap: 14px !important;
}

#template-type-list .tt-template-card {
  background: #ffffff !important;
  border: 1px solid var(--tt-line) !important;
  border-radius: var(--tt-card-radius, 8px) !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04), 0 6px 16px rgba(15, 23, 42, 0.03) !important;
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease !important;
}

#template-type-list .tt-template-card:hover {
  border-color: #b8c0ce !important;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08), 0 12px 28px rgba(15, 23, 42, 0.06) !important;
  transform: translateY(-2px) !important;
}

#template-type-list .tt-template-card-body strong {
  color: var(--tt-text, #111827) !important;
  font-weight: 700 !important;
}

#template-type-list .tt-template-card-footer,
#template-type-list .tt-template-card-foot {
  background: #f8fafd !important;
  border-top: 1px solid var(--tt-line) !important;
}

#template-type-list .tt-template-card-foot button.btn-secondary,
#template-type-list .tt-template-card-footer button.btn-secondary {
  background: #ffffff !important;
  border: 1px solid var(--tt-line-strong) !important;
  color: var(--tt-text) !important;
  font-weight: 600 !important;
}

#template-type-list .tt-template-card-foot button.btn-secondary:hover,
#template-type-list .tt-template-card-footer button.btn-secondary:hover {
  background: #f3f4f6 !important;
  border-color: #9ca3af !important;
}

/* ============================================================================
   V94e — UNIFIED PAGE DESIGN
   Apply the Übersicht (overview) header pattern to ALL admin sections AND
   all talent panels:
   - bold 22px h1/h2 title
   - muted subtitle in #666
   - 1px bottom border with breathing-space below
   - filter controls right-aligned with uppercase grey micro-labels
   - smaller, cleaner buttons everywhere
   ============================================================================ */

/* === Section titles (admin h1 + talent h2) ============================== */
html body #dashboard-view .admin-main-section .card-header h1,
html body #dashboard-view .admin-main-section .card-header h2,
html body #dashboard-view .talent-panel-header h2,
html body #dashboard-view .talent-panel-header-row h2,
html body #dashboard-view .preview-header-title h1 {
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  color: #111827 !important;
  margin: 0 !important;
  letter-spacing: 0 !important;
}

/* === Subtitles ========================================================== */
html body #dashboard-view .admin-main-section .card-header p,
html body #dashboard-view .admin-main-section .card-header-subtitle,
html body #dashboard-view .talent-panel-header p,
html body #dashboard-view .talent-panel-header-row p,
html body #dashboard-view .talent-panel-header .talent-muted,
html body #dashboard-view .talent-panel-header-row .talent-muted {
  margin: 4px 0 0 !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
  color: #666 !important;
  font-weight: 400 !important;
}

/* === Header layout + divider line =======================================
   ALL section headers share the same min-height so the divider lines sit
   at exactly the same Y across pages — even when a page has tall filter
   controls (Übersicht) vs simple search (Templates). */
html body #dashboard-view main > .admin-main-section > .card > .card-header,
html body #dashboard-view main > .admin-main-section > .card > .card-header--with-search,
html body #dashboard-view main > .admin-main-section > .card > .dash-overview-header,
html body #dashboard-view .admin-main-section .card-header,
html body #dashboard-view .admin-main-section .card-header--with-search,
html body #dashboard-view .admin-main-section .dash-overview-header,
html body #dashboard-view .talent-main .talent-panel-header-row,
html body #dashboard-view .talent-panel-header-row,
html body #dashboard-view #preview-inline-section .preview-header-row,
html body #dashboard-view .preview-header-row {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
  padding: 0 0 18px !important;
  margin: 0 0 18px !important;
  border-bottom: 1px solid var(--tt-line, #e5e7eb) !important;
  background: transparent !important;
  border-radius: 0 !important;
  min-height: 73px !important;
  grid-template-columns: none !important;
}

/* The non-Übersicht admin sections wrap their header in a card. Strip the
   card chrome so the layout matches Übersicht (no nested box around title). */
html body #dashboard-view .admin-main-section > .card {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* === Header actions (right column) ====================================== */
html body #dashboard-view .admin-main-section .card-header-actions,
html body #dashboard-view .talent-panel-header-row > .dash-toolbar,
html body #dashboard-view .talent-panel-header-row .talent-panel-actions {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}

/* Filter rows that live BELOW the header (Kooperationen, Buchungen etc.) —
   render them as a clean left-aligned filter strip. */
html body #dashboard-view .admin-main-section .admin-overview-controls {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  text-align: left !important;
  width: 100% !important;
}

html body #dashboard-view .admin-main-section .admin-overview-controls > input,
html body #dashboard-view .admin-main-section .admin-overview-controls > select {
  width: auto !important;
  max-width: 220px !important;
  flex: 0 0 auto !important;
}

html body #dashboard-view .admin-main-section .admin-overview-controls > input[type="text"],
html body #dashboard-view .admin-main-section .admin-overview-controls > input[type="search"] {
  min-width: 220px !important;
  max-width: 280px !important;
  flex: 1 1 220px !important;
}

/* === Smaller, cleaner inputs + buttons across all section headers ======= */
html body #dashboard-view .admin-main-section .card-header-actions input,
html body #dashboard-view .admin-main-section .card-header-actions select,
html body #dashboard-view .admin-main-section .card-header-actions .search-box input,
html body #dashboard-view .admin-main-section .admin-overview-controls input,
html body #dashboard-view .admin-main-section .admin-overview-controls select,
html body #dashboard-view .talent-panel-header-row select,
html body #dashboard-view .talent-panel-header-row input {
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  padding: 0 10px !important;
  font-size: 12.5px !important;
  border-radius: 6px !important;
  border: 1px solid var(--tt-line-strong, #d1d5db) !important;
  background: #ffffff !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  color: #111827 !important;
}

html body #dashboard-view .admin-main-section .card-header-actions button,
html body #dashboard-view .admin-main-section .card-header-actions .btn-primary,
html body #dashboard-view .admin-main-section .card-header-actions .btn-secondary,
html body #dashboard-view .admin-main-section .card-header-actions .btn-icon,
html body #dashboard-view .admin-main-section .card-header-actions .btn-icon-action,
html body #dashboard-view .talent-panel-header-row button,
html body #dashboard-view .talent-panel-header-row .btn-primary,
html body #dashboard-view .talent-panel-header-row .btn-secondary,
html body #dashboard-view .talent-panel-header-row .btn-icon,
html body #dashboard-view .preview-header-actions button,
html body #dashboard-view .preview-header-actions .btn-secondary {
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  padding: 0 12px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  line-height: 1 !important;
}

/* Icon-only buttons stay square */
html body #dashboard-view .admin-main-section .card-header-actions .btn-icon,
html body #dashboard-view .admin-main-section .card-header-actions .btn-icon-action,
html body #dashboard-view .talent-panel-header-row .btn-icon {
  width: 32px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* === Page padding to sidebar (consistent across admin + talent) ========= */
html body #dashboard-view main > .admin-main-section,
html body #dashboard-view.dashboard-view > .container > main > .admin-main-section,
html body #dashboard-view .talent-main > .talent-panel,
html body #dashboard-view.talent-shell > .talent-main > .talent-panel,
html body #dashboard-view.talent-shell .talent-main > .talent-panel {
  padding: 24px 28px !important;
}

/* === Smaller table-row action buttons (Vorschau, ... etc.) ============== */
html body #dashboard-view .admin-data-table .btn-primary,
html body #dashboard-view .admin-data-table .btn-secondary,
html body #dashboard-view .admin-data-table button.btn-primary,
html body #dashboard-view .admin-data-table button.btn-secondary,
html body #dashboard-view td .btn-primary,
html body #dashboard-view td .btn-secondary,
html body #dashboard-view td button.btn-primary,
html body #dashboard-view td button.btn-secondary {
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  line-height: 1 !important;
}

/* Row "..." action buttons square */
html body #dashboard-view td .row-actions-btn,
html body #dashboard-view td .btn-icon-action,
html body #dashboard-view td button[aria-label*="ktion" i] {
  width: 28px !important;
  height: 28px !important;
  padding: 0 !important;
}

/* === Status badges inside table rows: a touch smaller + tighter ========== */
html body #dashboard-view .admin-data-table .badge,
html body #dashboard-view .admin-data-table .status-pill,
html body #dashboard-view td .badge,
html body #dashboard-view td .status-pill {
  font-size: 10px !important;
  padding: 4px 8px !important;
  border-radius: 4px !important;
  letter-spacing: 0.04em !important;
}

/* === Übersicht filter controls (kept as canonical reference style) ======
   Make sure the uppercase micro-label above each control wins everywhere. */
html body #dashboard-view .dash-toolbar label.dash-control > span:first-child,
html body #dashboard-view .dash-toolbar .dash-control-static > span:first-child {
  font-size: 9.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  color: #8f96a3 !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  margin-bottom: 4px !important;
}


/* ============================================================================
   V94g — FINAL UNIFICATION: portal proportions, sidebar, header chips,
   Template-Verwaltung as a regular subsection, kill the active-tab ring.

   Source of truth for cross-portal sizing:
   --tt-header-chip-h: 36px   (lang, bell, profile pill — all admin+talent)
   --tt-logo-h:        38px   (admin + talent logo height)
   --tt-nav-item-h:    36px   (sidebar items)
   ============================================================================ */

html body {
  --tt-header-chip-h: 36px !important;
  --tt-logo-h: 38px !important;
  --tt-nav-item-h: 36px !important;
}

/* ── A. LOGO — same height in admin and talent ──────────────────────────── */
html body #dashboard-view > .container > header .logo,
html body #dashboard-view .header-content .logo,
html body #dashboard-view .header-content img.logo,
html body #dashboard-view .talent-header-logo,
html body #dashboard-view .talent-header img.talent-header-logo,
html body .talent-shell .talent-header .talent-header-logo,
html body .talent-shell .talent-header img.talent-header-logo,
html body .talent-shell .talent-header img.talent-logo {
  width: auto !important;
  height: var(--tt-logo-h, 38px) !important;
  min-height: var(--tt-logo-h, 38px) !important;
  max-height: var(--tt-logo-h, 38px) !important;
  max-width: 210px !important;
  object-fit: contain !important;
}

/* ── B. SIDEBAR NAV ITEMS — same height in admin and talent ─────────────── */
html body #dashboard-view .admin-main-nav .view-btn,
html body #dashboard-view .admin-main-nav .admin-nav-subitem,
html body #dashboard-view .admin-main-nav:not(:hover):not(:focus-within) .view-btn,
html body #dashboard-view .admin-main-nav:not(:hover):not(:focus-within) .admin-nav-subitem,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-tab,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab,
html body .talent-shell .dashboard-tabs .dashboard-tab,
html body .talent-shell .dashboard-tabs .dashboard-subtab {
  min-height: var(--tt-nav-item-h, 36px) !important;
  height: auto !important;
  padding: 0 12px !important;
  gap: 10px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
}

/* ── C. ACTIVE NAV ITEM — no blue ring, only background fill ────────────── */
html body #dashboard-view .admin-main-nav .view-btn.active,
html body #dashboard-view .admin-main-nav .admin-nav-subitem.active,
html body #dashboard-view .admin-main-nav .view-btn:focus,
html body #dashboard-view .admin-main-nav .view-btn:focus-visible,
html body #dashboard-view .admin-main-nav .view-btn.active:focus,
html body #dashboard-view .admin-main-nav .view-btn.active:focus-visible,
html body #dashboard-view .admin-main-nav .admin-nav-subitem:focus,
html body #dashboard-view .admin-main-nav .admin-nav-subitem:focus-visible,
html body #dashboard-view .admin-main-nav .admin-nav-subitem.active:focus,
html body #dashboard-view .admin-main-nav .admin-nav-subitem.active:focus-visible,
html body .talent-shell .dashboard-tabs .dashboard-tab.active,
html body .talent-shell .dashboard-tabs .dashboard-subtab.active,
html body .talent-shell .dashboard-tabs .dashboard-tab:focus,
html body .talent-shell .dashboard-tabs .dashboard-tab:focus-visible,
html body .talent-shell .dashboard-tabs .dashboard-tab.active:focus,
html body .talent-shell .dashboard-tabs .dashboard-tab.active:focus-visible {
  outline: none !important;
  outline-offset: 0 !important;
}
/* Keep the dark fill background; drop the inset light-blue accent + halo.
   Covers ADMIN and TALENT, including :focus / :focus-visible triggered by
   click (Chrome/Safari set :focus on click) — otherwise the v87-fixes
   blue-glow box-shadow leaks through and renders as a rounded blue ring. */
html body #dashboard-view .admin-main-nav .view-btn,
html body #dashboard-view .admin-main-nav .admin-nav-subitem,
html body #dashboard-view .admin-main-nav .view-btn.active,
html body #dashboard-view .admin-main-nav .admin-nav-subitem.active,
html body #dashboard-view .admin-main-nav .view-btn:focus,
html body #dashboard-view .admin-main-nav .view-btn:focus-visible,
html body #dashboard-view .admin-main-nav .view-btn.active:focus,
html body #dashboard-view .admin-main-nav .view-btn.active:focus-visible,
html body #dashboard-view .admin-main-nav .admin-nav-subitem:focus,
html body #dashboard-view .admin-main-nav .admin-nav-subitem:focus-visible,
html body #dashboard-view .admin-main-nav .admin-nav-subitem.active:focus,
html body #dashboard-view .admin-main-nav .admin-nav-subitem.active:focus-visible,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-tab,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-tab.active,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab.active,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-tab:focus,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-tab:focus-visible,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-tab.active:focus,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-tab.active:focus-visible,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab:focus,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab:focus-visible,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab.active:focus,
html body #dashboard-view .talent-main > .dashboard-tabs .dashboard-subtab.active:focus-visible,
html body .talent-shell .dashboard-tabs .dashboard-tab,
html body .talent-shell .dashboard-tabs .dashboard-subtab,
html body .talent-shell .dashboard-tabs .dashboard-tab.active,
html body .talent-shell .dashboard-tabs .dashboard-subtab.active,
html body .talent-shell .dashboard-tabs .dashboard-tab:focus,
html body .talent-shell .dashboard-tabs .dashboard-tab:focus-visible,
html body .talent-shell .dashboard-tabs .dashboard-tab.active:focus,
html body .talent-shell .dashboard-tabs .dashboard-tab.active:focus-visible,
html body .talent-shell .dashboard-tabs .dashboard-subtab:focus,
html body .talent-shell .dashboard-tabs .dashboard-subtab:focus-visible,
html body .talent-shell .dashboard-tabs .dashboard-subtab.active:focus,
html body .talent-shell .dashboard-tabs .dashboard-subtab.active:focus-visible {
  box-shadow: none !important;
}

/* ── D. HEADER CHIP CLUSTER — DEU / bell / profile pill all same height ── */
html body #dashboard-view .header-actions,
html body #dashboard-view .talent-header-actions {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}
html body #dashboard-view .header-actions > *,
html body #dashboard-view .talent-header-actions > *,
html body #dashboard-view .lang-toggle-btn,
html body #dashboard-view .tt-notif-toggle-btn,
html body #dashboard-view .tt-admin-profile-btn,
html body #dashboard-view .talent-header-actions .talent-profile-menu > summary,
html body .talent-shell .talent-header-actions .talent-profile-menu > summary,
html body .talent-shell .talent-header .talent-profile-menu > summary {
  box-sizing: border-box !important;
  height: var(--tt-header-chip-h, 36px) !important;
  min-height: var(--tt-header-chip-h, 36px) !important;
  max-height: var(--tt-header-chip-h, 36px) !important;
  line-height: 1 !important;
  align-self: center !important;
}
/* Bell stays square */
html body #dashboard-view .tt-notif-toggle-btn {
  width: var(--tt-header-chip-h, 36px) !important;
  padding: 0 !important;
}
/* Profile pill: pill-shape, hug content */
html body #dashboard-view .tt-admin-profile-btn,
html body #dashboard-view .talent-header-actions .talent-profile-menu > summary,
html body .talent-shell .talent-header .talent-profile-menu > summary {
  border-radius: calc(var(--tt-header-chip-h, 36px) / 2) !important;
  padding: 0 12px 0 4px !important;
}
/* Profile avatar shrinks to fit */
html body #dashboard-view .talent-profile-avatar,
html body .talent-shell .talent-profile-avatar,
html body #dashboard-view .tt-admin-profile-avatar {
  width: 28px !important;
  height: 28px !important;
  font-size: 11px !important;
  line-height: 1 !important;
}

/* Hidden logout button stays hidden */
html body #dashboard-view header #logout-btn {
  display: none !important;
}

/* ── E. TEMPLATE-VERWALTUNG TREATED AS NORMAL SUBSECTION ────────────────── */
/* The whole tt-template-app is just a transparent block inside the section.
   The tt-view-header inherits the same typography as .card-header. */
html body #dashboard-view #templates-container.tt-template-app {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  min-height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
}
html body #dashboard-view #templates-container.tt-template-app .tt-view,
html body #dashboard-view #templates-container.tt-template-app .tt-view--templates,
html body #dashboard-view #templates-container.tt-template-app .tt-view--placeholders {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  min-height: auto !important;
  overflow: visible !important;
  padding: 0 !important;
}
/* Editor view: keep the paper-stage card — it's its own working surface */
html body #dashboard-view #templates-container.tt-template-app .tt-view--editor {
  background: #f3f4f6 !important;
  border: 0 !important;
}
/* Make the tt-view-header look like a card-header with bottom divider.
   min-height: 73px matches the global section-header rule so the divider
   line is at exactly the same Y as Übersicht/Verträge dividers. */
html body #dashboard-view #templates-container.tt-template-app .tt-view--templates > .tt-view-header,
html body #dashboard-view #templates-container.tt-template-app .tt-view--placeholders > .tt-view-header {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
  margin: 0 0 18px !important;
  padding: 0 0 18px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--tt-line, #e5e7eb) !important;
  border-radius: 0 !important;
  background: transparent !important;
  min-height: 73px !important;
  grid-template-columns: none !important;
}
html body #dashboard-view #templates-container.tt-template-app .tt-view--templates > .tt-view-header h1,
html body #dashboard-view #templates-container.tt-template-app .tt-view--placeholders > .tt-view-header h1 {
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  color: #111827 !important;
  margin: 0 !important;
  letter-spacing: 0 !important;
}
html body #dashboard-view #templates-container.tt-template-app .tt-view--templates > .tt-view-header p,
html body #dashboard-view #templates-container.tt-template-app .tt-view--placeholders > .tt-view-header p {
  margin: 4px 0 0 !important;
  font-size: 12px !important;
  color: #666 !important;
  line-height: 1.4 !important;
  display: block !important;
}
/* Show the subtitle again now that we're matching the rest */
html body #dashboard-view #templates-container.tt-template-app .tt-view--templates .tt-view-header p,
html body #dashboard-view #templates-container.tt-template-app .tt-view--placeholders .tt-view-header p {
  display: block !important;
}
/* Search input + buttons inside template header use the same sizing as other admin headers */
html body #dashboard-view #templates-container.tt-template-app .tt-view-header-actions .tt-search-input,
html body #dashboard-view #templates-container.tt-template-app .tt-view-header input[type="search"] {
  width: auto !important;
  min-width: 200px !important;
  max-width: 240px !important;
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  padding: 0 10px !important;
  font-size: 12.5px !important;
  border-radius: 6px !important;
  border: 1px solid var(--tt-line-strong, #d1d5db) !important;
  background: #fff !important;
}
html body #dashboard-view #templates-container.tt-template-app .tt-view-header-actions button,
html body #dashboard-view #templates-container.tt-template-app .tt-view-header-actions .btn-primary,
html body #dashboard-view #templates-container.tt-template-app .tt-view-header-actions .btn-secondary {
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  padding: 0 12px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  line-height: 1 !important;
}
/* Page padding: ZERO so the title sits at the same Y as Übersicht/Verträge.
   The parent .admin-main-section already supplies padding via --tt-content-pad,
   so this card must add ZERO extra padding — else the Templateauswahl title
   lands 24px lower than other admin section titles. */
html body #dashboard-view #contracts-admin-section .card:has(#templates-container:not(.hidden)) {
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* ── F. RESPONSIVE: chips shrink together on mobile ─────────────────────── */
@media (max-width: 620px) {
  html body {
    --tt-header-chip-h: 32px !important;
    --tt-logo-h: 30px !important;
  }
}


/* ============================================================================
   V94k MASTER HEADER UNIFICATION
   ONE source of truth for both admin and talent portal headers.
   Forces pixel-identical: logo X position, logo size, header height,
   action-cluster Y position. Cannot be overridden by any other layer.
   ============================================================================ */

html body {
  --tt-header-h-final: 64px !important;
  --tt-header-pad-x: 20px !important;
  --tt-logo-h-final: 32px !important;
  --tt-logo-maxw-final: 180px !important;
}

/* === HEADER CONTAINER — same height + horizontal padding everywhere === */
html body #dashboard-view > .container > header,
html body #dashboard-view.dashboard-view > .container > header,
html body #dashboard-view .talent-header,
html body #dashboard-view.talent-shell > .talent-header,
html body #dashboard-view.talent-shell > header.talent-header,
html body .talent-shell > .talent-header,
html body .talent-shell > header.talent-header {
  height: var(--tt-header-h-final, 64px) !important;
  min-height: var(--tt-header-h-final, 64px) !important;
  max-height: var(--tt-header-h-final, 64px) !important;
  padding: 0 var(--tt-header-pad-x, 20px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  background: #ffffff !important;
  border-bottom: 1px solid var(--tt-line, #e4e8f0) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 100 !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}

/* === ADMIN INNER WRAPPER (.header-content) — must be transparent flex === */
html body #dashboard-view > .container > header > .header-content,
html body #dashboard-view.dashboard-view > .container > header > .header-content {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  flex: 1 1 auto !important;
  background: transparent !important;
}

/* === BRAND/LOGO CLUSTER (left side) — identical in both portals === */
html body #dashboard-view > .container > header > .header-content > .logo,
html body #dashboard-view > .container > header > .header-content > img.logo,
html body #dashboard-view.talent-shell > .talent-header > .talent-header-brand,
html body .talent-shell > .talent-header > .talent-header-brand {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* === LOGO IMAGE — same size + alignment in both portals === */
html body #dashboard-view > .container > header img.logo,
html body #dashboard-view > .container > header .logo,
html body #dashboard-view.dashboard-view > .container > header img.logo,
html body #dashboard-view.dashboard-view > .container > header .logo,
html body #dashboard-view .talent-header img.talent-header-logo,
html body #dashboard-view .talent-header .talent-header-logo,
html body #dashboard-view.talent-shell > .talent-header img.talent-header-logo,
html body #dashboard-view.talent-shell > .talent-header .talent-header-logo,
html body .talent-shell > .talent-header img.talent-header-logo,
html body .talent-shell > .talent-header .talent-header-logo {
  height: var(--tt-logo-h-final, 32px) !important;
  min-height: var(--tt-logo-h-final, 32px) !important;
  max-height: var(--tt-logo-h-final, 32px) !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: var(--tt-logo-maxw-final, 180px) !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  display: block !important;
  vertical-align: middle !important;
  flex: 0 0 auto !important;
}

/* === HIDE redundant "Talent Portal" / account label text next to logo === */
html body #dashboard-view.talent-shell > .talent-header > .talent-header-brand > div,
html body #dashboard-view .talent-header > .talent-header-brand > div,
html body .talent-shell > .talent-header > .talent-header-brand > div {
  display: none !important;
}

/* === ACTIONS CLUSTER (right side) — identical alignment === */
html body #dashboard-view > .container > header > .header-content > .header-actions,
html body #dashboard-view.dashboard-view > .container > header > .header-content > .header-actions,
html body #dashboard-view .talent-header > .talent-header-actions,
html body #dashboard-view.talent-shell > .talent-header > .talent-header-actions,
html body .talent-shell > .talent-header > .talent-header-actions {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 100% !important;
}

/* === RESPONSIVE (mobile): scale down together === */
@media (max-width: 620px) {
  html body {
    --tt-header-h-final: 56px !important;
    --tt-header-pad-x: 14px !important;
    --tt-logo-h-final: 28px !important;
    --tt-logo-maxw-final: 150px !important;
  }
}


/* ============================================================================
   V94n — TEMPLATE EDITOR PAGE BOUNDARIES
   Make the page divisions visible inside the long paper sheet so the
   "Seite X von Y" counter in the rail actually corresponds to a visible
   marker on the document. Two layers:
   1) Repeating horizontal line every 1123px (= A4 page height in editor px)
   2) Styled .tt-page-break divs when the user manually inserts page breaks
   ============================================================================ */

/* V94w — Editor preview = PDF preview. Sheet styling mirrors the worker:
   - 181px top padding = 48mm Puppeteer top margin (logo header zone)
   - 91px bottom padding = 24mm Puppeteer bottom margin (page-number footer)
   - White background; markers between pages drop in a footer+gap+header band
   - First page header / last page footer drawn via pseudo-elements */
html body #template-rich-editor.tt-paper-content {
  background-color: #ffffff !important;
  background-image: none !important;
  position: relative !important;
}
/* V94y: <main class="contract"> inherits a light-grey background somewhere —
   make it transparent so the sheet stays pure white like the PDF. */
html body #template-rich-editor.tt-paper-content main.contract,
html body #template-rich-editor.tt-paper-content > main,
html body #template-rich-editor.tt-paper-content > section,
html body #template-rich-editor.tt-paper-content > article {
  background: transparent !important;
  background-color: transparent !important;
}
/* Logo on the FIRST page — drawn in the 181px top padding zone */
html body #template-rich-editor.tt-paper-content::before {
  content: "" !important;
  position: absolute !important;
  top: 60px !important;
  left: 0 !important;
  right: 0 !important;
  height: 30px !important;
  background-image: url("/assets/truetalent-logo.png") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: contain !important;
  pointer-events: none !important;
  user-select: none !important;
  z-index: 1 !important;
}
/* "Seite N von TOTAL" on the LAST page — drawn in the 91px bottom padding */
html body #template-rich-editor.tt-paper-content::after {
  content: attr(data-last-page) !important;
  position: absolute !important;
  bottom: 30px !important;
  left: 0 !important;
  right: 0 !important;
  text-align: center !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 9px !important;
  color: #1f2937 !important;
  pointer-events: none !important;
  user-select: none !important;
}

/* V94w page-boundary marker — represents the BOTTOM of the previous sheet
   (with "Seite X von Y" footer) + a dark gap + the TOP of the next sheet
   (with TrueTalent logo header). Mirrors the actual PDF page structure
   from the Cloudflare worker so the editor previews = the PDF result.
   IMPORTANT: must be display:block so footer/gap/header stack vertically
   (the older flex declaration would lay them out horizontally). */
html body #template-rich-editor.tt-paper-content .tt-page-gap-marker,
html body #template-rich-editor.tt-paper-content ol .tt-page-gap-marker,
html body #template-rich-editor.tt-paper-content ul .tt-page-gap-marker,
html body #template-rich-editor.tt-paper-content ol > .tt-page-gap-marker,
html body #template-rich-editor.tt-paper-content ul > .tt-page-gap-marker {
  margin: 0 -60px !important;
  padding: 0 !important;
  background: transparent !important;
  display: block !important;            /* CRITICAL: stack children vertically */
  flex-direction: column !important;
  user-select: none !important;
  pointer-events: none !important;
  position: relative !important;
  border: 0 !important;
  box-shadow: none !important;
  height: auto !important;
  width: auto !important;
  list-style: none !important;
}
/* Bottom-of-previous-page area (white, with footer "Seite X von Y") */
html body #template-rich-editor.tt-paper-content .tt-page-gap-marker .tt-pb-footer {
  height: 91px !important;              /* = 24mm = Puppeteer bottom margin */
  background: #ffffff !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  padding: 0 0 24px 0 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 9px !important;
  color: #1f2937 !important;
  box-shadow: 0 4px 16px -2px rgba(15, 23, 42, 0.15) !important;
}
/* Gap between sheets (dark, matches stage) */
html body #template-rich-editor.tt-paper-content .tt-page-gap-marker .tt-pb-gap {
  height: 28px !important;
  background: #eef2f7 !important;       /* stage color */
}
/* Top-of-next-page area (white, with logo) */
html body #template-rich-editor.tt-paper-content .tt-page-gap-marker .tt-pb-header {
  height: 181px !important;             /* = 48mm = Puppeteer top margin */
  background: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 16px 0 0 0 !important;
  box-shadow: 0 -4px 16px -2px rgba(15, 23, 42, 0.15) !important;
}
html body #template-rich-editor.tt-paper-content .tt-page-gap-marker .tt-pb-header .tt-pb-logo {
  height: 30px !important;
  width: auto !important;
  max-width: 200px !important;
  object-fit: contain !important;
  display: block !important;
}
html body #template-rich-editor.tt-paper-content .tt-page-gap-marker .tt-pb-footer-text {
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 9px !important;
  color: #1f2937 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}
html body #template-rich-editor.tt-paper-content .tt-page-gap-marker .tt-page-gap-label {
  position: relative !important;
  z-index: 2 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: #334155 !important;
  background: #ffffff !important;
  padding: 5px 18px !important;
  border-radius: 999px !important;
  border: 1px solid #cbd5e1 !important;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.08) !important;
  line-height: 1 !important;
}
/* V94w: marker inside <ol>/<ul> uses BLOCK display so footer/gap/header
   stack vertically. Old "display:flex" rule for ol > marker would lay them
   out side-by-side (a visible bug). */
html body #template-rich-editor.tt-paper-content ol .tt-page-gap-marker,
html body #template-rich-editor.tt-paper-content ul .tt-page-gap-marker,
html body #template-rich-editor.tt-paper-content ol > .tt-page-gap-marker,
html body #template-rich-editor.tt-paper-content ul > .tt-page-gap-marker {
  display: block !important;
  list-style: none !important;
}

/* 3) Styled manual page-break marker (from "+ Seite" button) */
html body #template-rich-editor.tt-paper-content .tt-page-break {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  margin: 22px -82px !important;
  padding: 4px 0 !important;
  height: 22px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  color: #94a3b8 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  background: linear-gradient(to right,
    transparent 0,
    transparent 4px,
    #cbd5e1 4px,
    #cbd5e1 calc(50% - 60px),
    transparent calc(50% - 60px),
    transparent calc(50% + 60px),
    #cbd5e1 calc(50% + 60px),
    #cbd5e1 calc(100% - 4px),
    transparent calc(100% - 4px)) !important;
  background-position: center !important;
  background-size: 100% 1px !important;
  background-repeat: no-repeat !important;
  border: 0 !important;
  page-break-after: always !important;
  break-after: page !important;
}

/* Hover indication on the divider */
html body #template-rich-editor.tt-paper-content .tt-page-break:hover {
  color: #475569 !important;
}


/* ============================================================================
   V94z — PDF-Vorschau Overlay (live aus Cloudflare-Worker)
   ============================================================================ */
html body .tt-pdf-preview-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000 !important;
  background: rgba(15, 23, 42, 0.78) !important;
  display: flex !important;
  align-items: stretch !important;
  justify-content: center !important;
  padding: 24px !important;
}
html body .tt-pdf-preview-overlay.hidden {
  display: none !important;
}
html body .tt-pdf-preview-overlay .tt-pdf-preview-dialog {
  width: 100% !important;
  max-width: 1200px !important;
  height: 100% !important;
  background: #ffffff !important;
  border-radius: 12px !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.4) !important;
}
html body .tt-pdf-preview-overlay .tt-pdf-preview-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 14px 18px !important;
  border-bottom: 1px solid var(--tt-line, #e5e7eb) !important;
  background: #f8fafc !important;
  flex: 0 0 auto !important;
}
html body .tt-pdf-preview-overlay .tt-pdf-preview-title {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #1f2937 !important;
}
html body .tt-pdf-preview-overlay .tt-pdf-preview-actions {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}
html body .tt-pdf-preview-overlay .tt-pdf-preview-actions button {
  height: 32px !important;
  padding: 0 12px !important;
  font-size: 12.5px !important;
  border-radius: 6px !important;
}
html body .tt-pdf-preview-overlay .tt-pdf-preview-body {
  flex: 1 1 auto !important;
  position: relative !important;
  background: #eef2f7 !important;
  overflow: hidden !important;
}
html body .tt-pdf-preview-overlay .tt-pdf-preview-loading {
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  color: #475569 !important;
  font-size: 13px !important;
}
html body .tt-pdf-preview-overlay .tt-pdf-preview-loading.hidden {
  display: none !important;
}
html body .tt-pdf-preview-overlay .tt-pdf-preview-loading .spinner {
  width: 36px !important;
  height: 36px !important;
  border: 3px solid #cbd5e1 !important;
  border-top-color: #111827 !important;
  border-radius: 50% !important;
  animation: tt-pdf-spin 0.8s linear infinite !important;
}
@keyframes tt-pdf-spin {
  to { transform: rotate(360deg); }
}
html body .tt-pdf-preview-overlay .tt-pdf-preview-iframe {
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  background: #ffffff !important;
}
html body .tt-pdf-preview-overlay .tt-pdf-preview-iframe.hidden {
  display: none !important;
}
html body .tt-pdf-preview-overlay .tt-pdf-preview-error {
  position: absolute !important;
  inset: 24px !important;
  padding: 16px !important;
  background: #fee2e2 !important;
  color: #991b1b !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
}
html body .tt-pdf-preview-overlay .tt-pdf-preview-error.hidden {
  display: none !important;
}

/* =====================================================================
   V95c: Contract editor (Vertrag bearbeiten > Vertragstext) paper view
   Mirrors the template editor so both editors get the same multi-sheet
   WYSIWYG with logo header + page footer per page.
   ===================================================================== */

/* V95e: 3-column layout: page-rail (left) | paper (center) | side-toolbar (right)
   V95e5: combined modal header dropped ~70px → expand stage budget. */
#contract-editor-paper-stage.tt-paper-stage {
  display: block !important;
  height: calc(100vh - 130px) !important;
  min-height: 620px !important;
  padding: 12px 20px !important;
  overflow: auto !important;
  background: #eef2f7 !important;
  border-radius: 0 0 6px 6px !important;
  position: relative !important;
}

#contract-editor-paper-stage .tt-paper-workspace {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 20px !important;
  min-width: 1170px !important; /* 96 + 794 + 220 + 2*20 gap + 20px slack */
  margin: 0 auto !important;
  width: max-content !important;
}

#contract-editor-paper-stage .tt-paper-sheet {
  flex: 0 0 794px !important;
  width: 794px !important;
}

/* V95e: page-rail in column 1 — sticky to top of stage, scrolls independently */
#contract-editor-paper-stage #contract-editor-page-rail.tt-editor-page-rail {
  position: sticky !important;
  top: 0 !important;
  width: 96px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding: 12px 8px !important;
  background: #ffffff !important;
  border: 1px solid var(--tt-line, #e5e7eb) !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05) !important;
  max-height: calc(100vh - 240px) !important;
  overflow-y: auto !important;
  justify-self: start !important;
}

/* V95e5: Side-toolbar — Pages-dense layout, fits without scrolling.
   Compact sections (no h4 padding), grouped controls, smaller font.
   Total target: <580px tall, fits any standard viewport. */
#contract-editor-paper-stage #contract-editor-side-toolbar.tt-editor-side-toolbar {
  display: flex !important;
  flex-direction: column !important;
  position: sticky !important;
  top: 0 !important;
  width: 200px !important;
  flex: 0 0 200px !important;
  margin: 0 !important;
  padding: 10px !important;
  border: 1px solid var(--tt-line, #e5e7eb) !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05) !important;
  /* Allow growth if viewport tall — clamp only as safety net */
  max-height: calc(100vh - 130px) !important;
  overflow-y: auto !important;
  justify-self: end !important;
  font-size: 11px !important;
}
#contract-editor-paper-stage #contract-editor-side-toolbar .tt-side-section {
  padding: 0 0 6px !important;
  margin: 0 0 6px !important;
  border-bottom: 1px solid #eef1f5 !important;
}
#contract-editor-paper-stage #contract-editor-side-toolbar .tt-side-section:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
}
#contract-editor-paper-stage #contract-editor-side-toolbar h4 {
  margin: 0 0 4px !important;
  color: #6b7280 !important;
  font-size: 9px !important;
  font-weight: 760 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}
#contract-editor-paper-stage #contract-editor-side-toolbar .tt-side-row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
}
#contract-editor-paper-stage #contract-editor-side-toolbar .tt-side-row--stack {
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 4px !important;
}
#contract-editor-paper-stage #contract-editor-side-toolbar select {
  height: 26px !important;
  width: 100% !important;
  padding: 0 6px !important;
  font-size: 11px !important;
  border-radius: 4px !important;
  border: 1px solid #d1d5db !important;
  background: #fff !important;
  color: #111827 !important;
}
#contract-editor-paper-stage #contract-editor-side-toolbar input[type="color"] {
  width: 26px !important;
  height: 24px !important;
  border-radius: 4px !important;
  border: 1px solid #d1d5db !important;
  padding: 0 !important;
  cursor: pointer !important;
  background: transparent !important;
}
#contract-editor-paper-stage #contract-editor-side-toolbar button {
  height: 24px !important;
  min-width: 24px !important;
  padding: 0 4px !important;
  border-radius: 4px !important;
  border: 1px solid transparent !important;
  background: #ffffff !important;
  color: #374151 !important;
  font-size: 12px !important;
  line-height: 1 !important;
}
#contract-editor-paper-stage #contract-editor-side-toolbar button:hover {
  background: #f3f6fa !important;
  border-color: #d7dee9 !important;
}
#contract-editor-paper-stage #contract-editor-side-toolbar .tt-side-action-btn {
  width: 100% !important;
  height: 28px !important;
  padding: 0 8px !important;
  border: 1px solid #d1d5db !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  text-align: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
#contract-editor-paper-stage #contract-editor-side-toolbar .tt-side-action-btn--warn {
  color: #991b1b !important;
  border-color: #fecaca !important;
  background: #fef2f2 !important;
}
#contract-editor-paper-stage #contract-editor-side-toolbar .tt-side-page-status {
  min-height: 24px !important;
  padding: 2px 8px !important;
  border: 1px solid #cfd6e2 !important;
  border-radius: 4px !important;
  background: #f8fafc !important;
  color: #111827 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
/* V95e9: Template editor side-toolbar — compact (mirrors contract editor).
   Same dense Pages-style rules so the template sidebar fits without scrolling
   and matches the contract editor visually. Overrides the verbose defaults
   at lines 619-708. */
#tt-editor-paper-stage .tt-editor-side-toolbar {
  display: flex !important;
  flex-direction: column !important;
  position: sticky !important;
  top: 0 !important;
  width: 200px !important;
  flex: 0 0 200px !important;
  margin: 0 !important;
  padding: 10px !important;
  border: 1px solid var(--tt-line, #e5e7eb) !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05) !important;
  max-height: calc(100vh - 130px) !important;
  overflow-y: auto !important;
  justify-self: end !important;
  font-size: 11px !important;
}
#tt-editor-paper-stage .tt-editor-side-toolbar .tt-side-section {
  padding: 0 0 6px !important;
  margin: 0 0 6px !important;
  border-bottom: 1px solid #eef1f5 !important;
}
#tt-editor-paper-stage .tt-editor-side-toolbar .tt-side-section:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
}
#tt-editor-paper-stage .tt-editor-side-toolbar h4 {
  margin: 0 0 4px !important;
  color: #6b7280 !important;
  font-size: 9px !important;
  font-weight: 760 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}
#tt-editor-paper-stage .tt-editor-side-toolbar .tt-side-row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
}
#tt-editor-paper-stage .tt-editor-side-toolbar .tt-side-row--stack {
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 4px !important;
}
#tt-editor-paper-stage .tt-editor-side-toolbar select {
  height: 26px !important;
  width: 100% !important;
  padding: 0 6px !important;
  font-size: 11px !important;
  border-radius: 4px !important;
  border: 1px solid #d1d5db !important;
  background: #fff !important;
  color: #111827 !important;
}
#tt-editor-paper-stage .tt-editor-side-toolbar input[type="color"] {
  width: 26px !important;
  height: 24px !important;
  border-radius: 4px !important;
  border: 1px solid #d1d5db !important;
  padding: 0 !important;
  cursor: pointer !important;
  background: transparent !important;
}
#tt-editor-paper-stage .tt-editor-side-toolbar button {
  height: 24px !important;
  min-width: 24px !important;
  padding: 0 4px !important;
  border-radius: 4px !important;
  border: 1px solid transparent !important;
  background: #ffffff !important;
  color: #374151 !important;
  font-size: 12px !important;
  line-height: 1 !important;
}
#tt-editor-paper-stage .tt-editor-side-toolbar button:hover {
  background: #f3f6fa !important;
  border-color: #d7dee9 !important;
}
#tt-editor-paper-stage .tt-editor-side-toolbar .tt-side-action-btn,
#tt-editor-paper-stage .tt-editor-side-toolbar #tt-editor-pagebreak-btn,
#tt-editor-paper-stage .tt-editor-side-toolbar #tt-side-placeholder-btn {
  width: 100% !important;
  height: 28px !important;
  padding: 0 8px !important;
  border: 1px solid #d1d5db !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  text-align: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
#tt-editor-paper-stage .tt-editor-side-toolbar .tt-side-action-btn--warn {
  color: #991b1b !important;
  border-color: #fecaca !important;
  background: #fef2f2 !important;
}
#tt-editor-paper-stage .tt-editor-side-toolbar .tt-side-page-status {
  min-height: 24px !important;
  padding: 2px 8px !important;
  border: 1px solid #cfd6e2 !important;
  border-radius: 4px !important;
  background: #f8fafc !important;
  color: #111827 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* V95e9: inline DE/EN pills inside template editor header actions */
.tt-view-header--editor .template-lang-tabs--inline {
  display: inline-flex !important;
  gap: 2px !important;
  padding: 2px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 6px !important;
  background: #f8fafc !important;
  margin-right: 6px !important;
  flex: 0 0 auto !important;
}
.tt-view-header--editor .template-lang-tabs--inline .template-lang-tab {
  height: 24px !important;
  min-width: 32px !important;
  padding: 0 8px !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  color: #6b7280 !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  letter-spacing: 0.04em !important;
  cursor: pointer !important;
}
.tt-view-header--editor .template-lang-tabs--inline .template-lang-tab.active {
  background: #ffffff !important;
  color: #111827 !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08) !important;
}

#contract-editor-paper-stage #contract-editor-page-rail .tt-page-marker {
  border: 1px solid #e5e7eb !important;
  border-radius: 6px !important;
  padding: 7px 6px !important;
  background: rgba(255, 255, 255, 0.6) !important;
  color: #475569 !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  text-align: center !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}
#contract-editor-paper-stage #contract-editor-page-rail .tt-page-marker.active {
  border-color: #cbd5e1 !important;
  background: #ffffff !important;
  color: #111827 !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06) !important;
}

#contract-editor-paper-stage .tt-paper-sheet {
  width: 794px !important;
  min-height: 1123px !important;
  flex: 0 0 794px !important;
  border-radius: 4px !important;
  background: #ffffff !important;
  box-shadow: 0 14px 44px rgba(15, 23, 42, 0.12), 0 0 0 1px rgba(15, 23, 42, 0.08) !important;
  position: relative !important;
}

/* Editor body — same metrics as template editor (Arial 12px/1.45, 48/24mm margins) */
#contract-editor.tt-paper-content,
#contract-editor.contract-editor-content.tt-paper-content {
  column-count: 1 !important;
  columns: auto !important;
  width: 100% !important;
  /* V95e2: override portal-v87-fixes calc(100vw - 360px) which becomes negative
     on narrow viewports and collapses the editor to ~120px wide. Contract
     editor lives in a fixed-width modal layout, viewport-based calc is wrong. */
  max-width: none !important;
  min-height: 1123px !important;
  padding: 181px 60px 91px 60px !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  color: #111 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  position: relative !important;
  outline: none !important;
}
#contract-editor.tt-paper-content p,
#contract-editor.tt-paper-content li,
#contract-editor.tt-paper-content span,
#contract-editor.tt-paper-content strong,
#contract-editor.tt-paper-content em {
  font-family: inherit !important;
  font-size: 12px !important;
  line-height: 18px !important;
}

/* Logo on FIRST page of the contract editor */
html body #contract-editor.tt-paper-content::before {
  content: "" !important;
  position: absolute !important;
  top: 60px !important;
  left: 0 !important;
  right: 0 !important;
  height: 30px !important;
  background-image: url("/assets/truetalent-logo.png") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: contain !important;
  pointer-events: none !important;
  user-select: none !important;
  z-index: 1 !important;
}
/* "Seite N von TOTAL" on LAST page of the contract editor */
html body #contract-editor.tt-paper-content::after {
  content: attr(data-last-page) !important;
  position: absolute !important;
  bottom: 30px !important;
  left: 0 !important;
  right: 0 !important;
  text-align: center !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 9px !important;
  color: #1f2937 !important;
  pointer-events: none !important;
  user-select: none !important;
}

/* Page-gap marker rendered inside the contract editor (mirrors template editor) */
html body #contract-editor.tt-paper-content .tt-page-gap-marker,
html body #contract-editor.tt-paper-content ol .tt-page-gap-marker,
html body #contract-editor.tt-paper-content ul .tt-page-gap-marker,
html body #contract-editor.tt-paper-content ol > .tt-page-gap-marker,
html body #contract-editor.tt-paper-content ul > .tt-page-gap-marker {
  margin: 0 -60px !important;
  padding: 0 !important;
  background: transparent !important;
  display: block !important;
  flex-direction: column !important;
  user-select: none !important;
  pointer-events: none !important;
  position: relative !important;
  border: 0 !important;
  box-shadow: none !important;
  height: auto !important;
  width: auto !important;
  list-style: none !important;
}
html body #contract-editor.tt-paper-content .tt-page-gap-marker .tt-pb-footer {
  height: 91px !important;
  background: #ffffff !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  padding: 0 0 24px 0 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 9px !important;
  color: #1f2937 !important;
  box-shadow: 0 4px 16px -2px rgba(15, 23, 42, 0.15) !important;
}
html body #contract-editor.tt-paper-content .tt-page-gap-marker .tt-pb-gap {
  height: 28px !important;
  background: #eef2f7 !important;
}
html body #contract-editor.tt-paper-content .tt-page-gap-marker .tt-pb-header {
  height: 181px !important;
  background: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 16px 0 0 0 !important;
  box-shadow: 0 -4px 16px -2px rgba(15, 23, 42, 0.15) !important;
}
html body #contract-editor.tt-paper-content .tt-page-gap-marker .tt-pb-header .tt-pb-logo {
  height: 30px !important;
  width: auto !important;
  max-width: 200px !important;
  object-fit: contain !important;
  display: block !important;
}
html body #contract-editor.tt-paper-content .tt-page-gap-marker .tt-pb-footer-text {
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 9px !important;
  color: #1f2937 !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}

/* Hide the legacy box-style editor look when wrapped in paper-sheet */
.tt-paper-sheet #contract-editor.contract-editor-content {
  border: 0 !important;
  border-radius: 0 !important;
  padding: 181px 60px 91px 60px !important;
}

/* =====================================================================
   V95c: Contract preview (Vorschau button) multi-sheet shell.
   Same paper look as the editors, but read-only.
   ===================================================================== */

#preview-paper-stage.tt-paper-stage--preview {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 18px !important;
  padding: 12px 18px !important;
  background: #eef2f7 !important;
  overflow: auto !important;
  min-height: 70vh !important;
  border-radius: 6px !important;
}

#preview-paper-stage .tt-paper-workspace {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 18px !important;
}

#preview-paper-stage .tt-paper-sheet {
  width: 794px !important;
  min-height: 1123px !important;
  flex: 0 0 794px !important;
  border-radius: 4px !important;
  background: #ffffff !important;
  box-shadow: 0 14px 44px rgba(15, 23, 42, 0.12), 0 0 0 1px rgba(15, 23, 42, 0.08) !important;
  position: relative !important;
}

#preview-paper-content.tt-paper-content {
  column-count: 1 !important;
  columns: auto !important;
  width: 100% !important;
  min-height: 1123px !important;
  padding: 181px 60px 91px 60px !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  color: #111 !important;
  background: transparent !important;
  position: relative !important;
}
#preview-paper-content.tt-paper-content p,
#preview-paper-content.tt-paper-content li,
#preview-paper-content.tt-paper-content span,
#preview-paper-content.tt-paper-content strong,
#preview-paper-content.tt-paper-content em {
  font-family: inherit !important;
  font-size: 12px !important;
  line-height: 18px !important;
}

/* Logo on FIRST page of the preview */
html body #preview-paper-content.tt-paper-content::before {
  content: "" !important;
  position: absolute !important;
  top: 60px !important;
  left: 0 !important;
  right: 0 !important;
  height: 30px !important;
  background-image: url("/assets/truetalent-logo.png") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: contain !important;
  pointer-events: none !important;
  user-select: none !important;
  z-index: 1 !important;
}
html body #preview-paper-content.tt-paper-content::after {
  content: attr(data-last-page) !important;
  position: absolute !important;
  bottom: 30px !important;
  left: 0 !important;
  right: 0 !important;
  text-align: center !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 9px !important;
  color: #1f2937 !important;
  pointer-events: none !important;
  user-select: none !important;
}

/* Mirror gap-marker styling for the preview pane */
html body #preview-paper-content.tt-paper-content .tt-page-gap-marker,
html body #preview-paper-content.tt-paper-content ol .tt-page-gap-marker,
html body #preview-paper-content.tt-paper-content ul .tt-page-gap-marker,
html body #preview-paper-content.tt-paper-content ol > .tt-page-gap-marker,
html body #preview-paper-content.tt-paper-content ul > .tt-page-gap-marker {
  margin: 0 -60px !important;
  padding: 0 !important;
  background: transparent !important;
  display: block !important;
  flex-direction: column !important;
  user-select: none !important;
  pointer-events: none !important;
  position: relative !important;
  border: 0 !important;
  box-shadow: none !important;
  height: auto !important;
  width: auto !important;
  list-style: none !important;
}
html body #preview-paper-content.tt-paper-content .tt-page-gap-marker .tt-pb-footer {
  height: 91px !important;
  background: #ffffff !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  padding: 0 0 24px 0 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 9px !important;
  color: #1f2937 !important;
  box-shadow: 0 4px 16px -2px rgba(15, 23, 42, 0.15) !important;
}
html body #preview-paper-content.tt-paper-content .tt-page-gap-marker .tt-pb-gap {
  height: 28px !important;
  background: #eef2f7 !important;
}
html body #preview-paper-content.tt-paper-content .tt-page-gap-marker .tt-pb-header {
  height: 181px !important;
  background: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 16px 0 0 0 !important;
  box-shadow: 0 -4px 16px -2px rgba(15, 23, 42, 0.15) !important;
}
html body #preview-paper-content.tt-paper-content .tt-page-gap-marker .tt-pb-header .tt-pb-logo {
  height: 30px !important;
  width: auto !important;
  max-width: 200px !important;
  object-fit: contain !important;
  display: block !important;
}
html body #preview-paper-content.tt-paper-content .tt-page-gap-marker .tt-pb-footer-text {
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 9px !important;
  color: #1f2937 !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}

/* The legacy preview-a4-page wrapper around our new shell loses its
   own padding/border so the multi-sheet shell takes over. */
#preview-content.preview-a4-page:has(#preview-paper-stage),
#preview-content:has(#preview-paper-stage) {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  padding: 0 !important;
  width: auto !important;
  max-width: none !important;
}