/* ==========================================================================
   QUALITERA DYS - STANDARDIZED ENTERPRISE TYPOGRAPHY & SYMMETRICAL LAYOUT
   ========================================================================== */

:root {
  --kt-primary: #167d68 !important;
  --kt-primary-active: #116b59 !important;
  --kt-primary-light: #eff8f5 !important;
  --kt-primary-inverse: #ffffff !important;
  --kt-info: #009ef7 !important;
  --kt-success: #50cd89 !important;
  --kt-warning: #ffc700 !important;
  --kt-danger: #f1416c !important;
  
  --font-base: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
  --serif: var(--font-base) !important;
}

/* Base Sizing & Modern Text Rendering */
html, body {
  font-family: var(--font-base) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  color: #1e293b !important;
  background-color: #f8fafc !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  min-height: 100vh !important;
  overflow-x: hidden !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
}

body {
  display: block !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-base) !important;
  color: #0f172a !important;
}

/* ==========================================================================
   ROCK-SOLID LAYOUT ARCHITECTURE: FIXED SIDEBAR (280px) + OFFSET CONTENT
   ========================================================================== */

.app-shell {
  display: flex !important;
  min-height: 100vh !important;
  width: 100% !important;
  background-color: #f8fafc !important;
  position: relative !important;
  overflow-x: hidden !important;
}

/* Desktop: Permanently Anchored Fixed Sidebar & Matched Offset Content */
@media (min-width: 992px) {
  .sidebar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    width: 280px !important;
    min-width: 280px !important;
    max-width: 280px !important;
    height: 100vh !important;
    max-height: 100vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    z-index: 1000 !important;
    background-color: #0f172a !important;
    border-right: 1px solid #1e293b !important;
    box-shadow: 2px 0 10px rgba(0, 0, 0, 0.15) !important;
    transition: none !important;
  }

  .sidebar .brand-header {
    padding: 16px 20px !important;
  }

  .sidebar .brand-logo-container {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    flex-shrink: 0 !important;
    border-radius: 8px !important;
    background-color: #ffffff !important;
    padding: 3px !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.15) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .sidebar .brand-logo-container img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    display: block !important;
  }

  .content {
    margin-left: 280px !important;
    width: calc(100% - 280px) !important;
    max-width: calc(100% - 280px) !important;
    min-width: 0 !important;
    min-height: 100vh !important;
    display: flex !important;
    flex-direction: column !important;
    background-color: #f8fafc !important;
    position: relative !important;
  }
}

/* Mobile & Tablet Drawer (< 992px) */
@media (max-width: 991.98px) {
  .sidebar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    width: 280px !important;
    max-width: 85vw !important;
    height: 100vh !important;
    overflow-y: auto !important;
    transform: translateX(-100%) !important;
    z-index: 1050 !important;
    background-color: #0f172a !important;
    border-right: 1px solid #1e293b !important;
    transition: transform 0.25s ease-in-out !important;
  }
  .sidebar.show-mobile {
    transform: translateX(0) !important;
    box-shadow: 6px 0 25px rgba(0, 0, 0, 0.4) !important;
  }
  .sidebar-backdrop {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: rgba(15, 23, 42, 0.6) !important;
    z-index: 1040 !important;
    backdrop-filter: blur(2px) !important;
  }
  .content {
    margin-left: 0 !important;
    width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
  }
}

/* Topbar: Height 70px, Horizontal Padding 36px, Sticky to Top */
.topbar {
  height: 70px !important;
  min-height: 70px !important;
  max-height: 70px !important;
  background-color: #ffffff !important;
  border-bottom: 1px solid #e2e8f0 !important;
  padding: 0 36px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 900 !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Main Page Container: Exactly 36px Horizontal Padding Aligned With Topbar */
.page {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 32px 36px 64px 36px !important;
  box-sizing: border-box !important;
  flex: 1 0 auto !important;
}

@media (max-width: 1200px) {
  .topbar {
    padding: 0 24px !important;
  }
  .page {
    padding: 24px 24px 48px 24px !important;
  }
}

@media (max-width: 768px) {
  .topbar {
    padding: 0 16px !important;
  }
  .page {
    padding: 20px 16px 40px 16px !important;
  }
}

/* Document Form: Override restrictive 980px cap to fill the layout harmoniously */
.document-form {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

/* ==========================================================================
   SIDEBAR ACCORDION & SUBMENU (FIXED & HIGH-CONTRAST)
   ========================================================================== */

details.sidebar-accordion,
details.menu-accordion {
  margin-bottom: 2px !important;
}

.sidebar-menu-toggle,
.menu-link {
  list-style: none !important;
  transition: all 0.2s ease !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  color: #94a3b8 !important;
  cursor: pointer !important;
  user-select: none !important;
}

.sidebar-menu-toggle::-webkit-details-marker,
.menu-link::-webkit-details-marker,
.sidebar-menu-toggle::marker,
.menu-link::marker {
  display: none !important;
}

.sidebar-menu-toggle:hover,
.menu-link:hover,
details[open] > .sidebar-menu-toggle,
details[open] > .menu-link {
  color: #ffffff !important;
  background-color: rgba(255, 255, 255, 0.08) !important;
}

.menu-icon-box {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 26px !important;
  height: 26px !important;
  border-radius: 6px !important;
  background-color: rgba(22, 125, 104, 0.18) !important;
  color: #38b2ac !important;
}

.sidebar-menu-arrow,
.menu-arrow {
  font-size: 16px !important;
  font-weight: bold !important;
  transition: transform 0.2s ease !important;
  display: inline-block !important;
}

details[open] > summary .sidebar-menu-arrow,
details[open] > summary .menu-arrow {
  transform: rotate(90deg) !important;
  color: #38b2ac !important;
}

/* SUBMENU OVERRIDES */
details[open] > .sidebar-submenu,
details[open] > .menu-sub,
details.sidebar-accordion[open] > .sidebar-submenu,
details.menu-accordion[open] > .menu-sub,
details.sidebar-accordion[open] > div,
details.menu-accordion[open] > div {
  display: flex !important;
  flex-direction: column !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  max-height: none !important;
}

details:not([open]) > .sidebar-submenu,
details:not([open]) > .menu-sub,
details.sidebar-accordion:not([open]) > .sidebar-submenu,
details.menu-accordion:not([open]) > .menu-sub,
details.sidebar-accordion:not([open]) > div:not(summary),
details.menu-accordion:not([open]) > div:not(summary) {
  display: none !important;
}

.sidebar-submenu-link,
.menu-sub-link {
  color: #94a3b8 !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  transition: all 0.18s ease !important;
  text-decoration: none !important;
}

.sidebar-submenu-link:hover,
.menu-sub-link:hover {
  color: #ffffff !important;
  background-color: rgba(255, 255, 255, 0.06) !important;
  padding-left: 16px !important;
}

.sidebar-submenu-link.active,
.menu-sub-link.active {
  color: #ffffff !important;
  background-color: rgba(22, 125, 104, 0.3) !important;
  border-left: 3px solid #38b2ac !important;
  font-weight: 600 !important;
}

/* ==========================================================================
   TOPBAR & SEARCH & USER DROPDOWN
   ========================================================================== */

.global-search {
  height: 42px !important;
  max-width: 520px !important;
  flex: 1 !important;
  border: 1.5px solid #e2e8f0 !important;
  background: #f8fafc !important;
  border-radius: 8px !important;
  padding: 0 14px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.global-search input {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  flex: 1 !important;
  font-size: 13.5px !important;
  color: #1e293b !important;
}

.global-search kbd {
  font-size: 11px !important;
  background: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 4px !important;
  padding: 3px 6px !important;
  color: #64748b !important;
}

.user-menu summary::-webkit-details-marker,
.user-menu summary::marker {
  display: none !important;
}

.user-menu summary {
  list-style: none !important;
}

.user-menu > div {
  animation: userMenuFadeIn 0.15s ease-out;
}

@keyframes userMenuFadeIn {
  from { opacity: 0; transform: translateY(-5px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Floating row action dropdowns */
.row-action details[open] > form,
.card-action details[open] > form,
.measure-action details[open] > form,
.progress-action details[open] > form,
.audit-detail details[open] > div {
  animation: userMenuFadeIn 0.15s ease-out;
}

/* ==========================================================================
   BREADCRUMBS, EYEBROW & PAGE TITLES (STANDARDIZED TYPOGRAPHY)
   ========================================================================== */

.breadcrumbs,
.breadcrumb {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #64748b !important;
  margin-bottom: 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 !important;
  list-style: none !important;
}

.breadcrumbs span,
.breadcrumb-item .bullet {
  color: #94a3b8 !important;
  font-size: 13px !important;
  margin: 0 2px !important;
}

.breadcrumbs b,
.breadcrumb-item.text-dark,
.breadcrumb-item:last-child {
  color: #0f172a !important;
  font-weight: 600 !important;
}

.breadcrumb-item a {
  color: #64748b !important;
  text-decoration: none !important;
}

.breadcrumb-item a:hover {
  color: var(--kt-primary) !important;
}

.eyebrow {
  margin: 0 0 6px 0 !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.8px !important;
  color: #167d68 !important;
  text-transform: uppercase !important;
}

.page-title {
  margin-bottom: 24px !important;
}

.page-title.split {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 24px !important;
}

.page-title h1,
.page h1 {
  font-family: var(--font-base) !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: #0f172a !important;
  margin: 4px 0 8px 0 !important;
}

.page-title > p:last-child,
.page-title > div > p:last-child {
  font-size: 13.5px !important;
  color: #64748b !important;
  margin: 0 !important;
}

.page-title-actions {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-shrink: 0 !important;
}

/* ==========================================================================
   BUTTONS: UNIFORM 42px HEIGHT & LEGIBLE SIZING
   ========================================================================== */

.primary-button,
.btn-primary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  border-radius: 8px !important;
  background-color: var(--kt-primary) !important;
  border: 1px solid var(--kt-primary) !important;
  color: #ffffff !important;
  padding: 0 20px !important;
  height: 42px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 3px rgba(22, 125, 104, 0.25) !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  transition: all 0.18s ease !important;
}

.primary-button:hover,
.btn-primary:hover {
  background-color: var(--kt-primary-active) !important;
  border-color: var(--kt-primary-active) !important;
  box-shadow: 0 4px 10px rgba(22, 125, 104, 0.35) !important;
  color: #ffffff !important;
}

.secondary-button,
.btn-light {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  border-radius: 8px !important;
  background-color: #ffffff !important;
  border: 1.5px solid #cbd5e1 !important;
  color: #334155 !important;
  padding: 0 18px !important;
  height: 42px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  transition: all 0.18s ease !important;
}

.secondary-button:hover,
.btn-light:hover {
  background-color: #f8fafc !important;
  border-color: #94a3b8 !important;
  color: #0f172a !important;
}

/* ==========================================================================
   CARDS & PANELS: CLEAN ENTERPRISE STYLING
   ========================================================================== */

.card,
.panel {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  overflow: hidden !important;
  margin-bottom: 24px !important;
}

.card-header,
.panel-head {
  padding: 18px 28px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: auto !important;
  background: #ffffff !important;
}

.card-body {
  padding: 24px 28px !important;
}

.card-title h3,
.panel-head h2 {
  font-family: var(--font-base) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin: 0 !important;
}

.card-title .text-muted,
.panel-head p {
  font-size: 13px !important;
  color: #64748b !important;
  margin: 4px 0 0 0 !important;
}

.panel-head > a {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--kt-primary) !important;
  text-decoration: none !important;
}

/* ==========================================================================
   SUMMARY STRIP (METADATA CARDS: DURUM, REVİZYON, GİZLİLİK, DOKÜMAN SAHİBİ)
   ========================================================================== */

.summary-strip {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  margin-bottom: 24px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  overflow: hidden !important;
}

.summary-strip > div {
  padding: 20px 24px !important;
  border-right: 1px solid #e2e8f0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

.summary-strip > div:last-child {
  border-right: none !important;
}

.summary-strip small {
  display: block !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.7px !important;
  color: #64748b !important;
  margin-bottom: 6px !important;
}

.summary-strip strong {
  display: block !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
}

/* ==========================================================================
   DETAIL GRID (50% / 50% SYMMETRICAL COLUMNS & PANELS)
   ========================================================================== */

.detail-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 24px !important;
  margin-bottom: 24px !important;
  align-items: start !important;
}

@media (max-width: 991.98px) {
  .detail-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Detail list (Kontrol bilgileri - dl/dt/dd) */
.detail-list {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  margin: 0 !important;
  padding: 12px 24px 20px 24px !important;
  gap: 0 !important;
}

.detail-list > div {
  padding: 14px 0 !important;
  border-bottom: 1px solid #f1f5f9 !important;
}

.detail-list > div:nth-child(odd) {
  padding-right: 20px !important;
}

.detail-list > div:nth-child(even) {
  padding-left: 20px !important;
  border-left: 1px solid #f8fafc !important;
}

.detail-list dt {
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
  color: #64748b !important;
  margin-bottom: 4px !important;
}

.detail-list dd {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
  margin: 0 !important;
}

.detail-callout {
  margin: 16px 24px 24px !important;
  padding: 14px 18px !important;
  border-radius: 8px !important;
  background: #eff8f5 !important;
  border: 1px solid #cce8e0 !important;
  color: #167d68 !important;
  font-size: 13.5px !important;
}

.detail-callout strong {
  display: block !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
}

.detail-callout span {
  display: block !important;
  margin-top: 4px !important;
}

/* Detail section (Dağıtım, ilişkiler, ekler) */
.detail-section {
  padding: 20px 24px !important;
  border-bottom: 1px solid #f1f5f9 !important;
}

.detail-section:last-child {
  border-bottom: none !important;
}

.detail-section h3 {
  font-size: 12.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
  color: #475569 !important;
  margin: 0 0 12px 0 !important;
}

.info-pill {
  display: inline-block !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  padding: 5px 12px !important;
  border-radius: 6px !important;
  background: #ecfdf5 !important;
  color: #065f46 !important;
  border: 1px solid #a7f3d0 !important;
  margin: 0 6px 6px 0 !important;
}

.muted-copy {
  font-size: 13.5px !important;
  color: #94a3b8 !important;
  margin: 0 !important;
}

.related-link,
.file-row {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  margin-top: 8px !important;
  background-color: #f8fafc !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
}

.related-link:hover {
  background-color: #ffffff !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.03) !important;
}

.related-link strong {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #167d68 !important;
}

.related-link span {
  font-size: 14px !important;
  color: #1e293b !important;
  flex: 1 !important;
}

.related-link small,
.file-row small {
  font-size: 12.5px !important;
  color: #64748b !important;
}

.file-row strong {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #1e293b !important;
}

.file-actions {
  display: flex !important;
  gap: 8px !important;
  align-items: center !important;
}

.file-actions a {
  font-size: 12.5px !important;
  font-weight: 600 !important;
  padding: 6px 12px !important;
  border-radius: 6px !important;
  background: #ffffff !important;
  border: 1.5px solid #cbd5e1 !important;
  color: #334155 !important;
  text-decoration: none !important;
}

.file-actions a:hover {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}

/* ==========================================================================
   FORMS & INPUTS (STANDARDIZED 44px HEIGHT)
   ========================================================================== */

.form-label,
label {
  display: block !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #334155 !important;
  margin-bottom: 7px !important;
}

.form-label.required:after,
label em {
  content: " *" !important;
  color: #ef4444 !important;
  font-weight: bold !important;
  font-style: normal !important;
}

.form-control,
.form-select,
.form-grid input:not([type=checkbox]):not([type=radio]),
.form-grid select,
.form-grid textarea {
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 8px !important;
  background-color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  font-family: inherit !important;
  color: #0f172a !important;
  outline: none !important;
  transition: all 0.18s ease !important;
}

.form-control:not(textarea):not([type=file]),
.form-select:not([multiple]),
.form-grid input:not(textarea):not([type=checkbox]):not([type=radio]):not([type=file]),
.form-grid select:not([multiple]) {
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 14px !important;
}

.form-control.form-control-solid,
.form-select.form-select-solid {
  background-color: #f8fafc !important;
  border: 1.5px solid #e2e8f0 !important;
}

.form-control:focus,
.form-select:focus,
.form-grid input:focus,
.form-grid select:focus,
.form-grid textarea:focus {
  background-color: #ffffff !important;
  border-color: var(--kt-primary) !important;
  box-shadow: 0 0 0 3px rgba(22, 125, 104, 0.15) !important;
}

.form-text {
  font-size: 12.5px !important;
  color: #64748b !important;
  margin-top: 5px !important;
}

.form-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 20px !important;
  padding: 24px !important;
}

.form-grid .wide {
  grid-column: 1 / -1 !important;
}

.form-actions {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 12px !important;
  margin-top: 12px !important;
}

/* ==========================================================================
   VERSION HISTORY & APPROVALS (SÜRÜM VE ONAY GEÇMİŞİ)
   ========================================================================== */

.version-card {
  padding: 24px !important;
  border-bottom: 1px solid #f1f5f9 !important;
}

.version-card:last-child {
  border-bottom: none !important;
}

.version-head {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}

.version-head > span {
  padding: 6px 12px !important;
  border-radius: 6px !important;
  background: #ecfdf5 !important;
  color: #047857 !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  border: 1px solid #a7f3d0 !important;
}

.version-head div {
  flex: 1 !important;
}

.version-head strong {
  display: block !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
}

.version-head small {
  display: block !important;
  font-size: 13px !important;
  color: #64748b !important;
  margin-top: 3px !important;
}

.version-head > b {
  font-size: 11.5px !important;
  font-weight: 700 !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  background: #dcfce7 !important;
  color: #15803d !important;
  letter-spacing: 0.5px !important;
}

.version-card > p {
  font-size: 14px !important;
  color: #334155 !important;
  line-height: 1.6 !important;
  margin: 14px 0 !important;
}

.version-card > code {
  display: inline-block !important;
  padding: 6px 12px !important;
  border-radius: 6px !important;
  background: #f1f5f9 !important;
  color: #475569 !important;
  font-size: 12.5px !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
}

.version-file-actions {
  display: flex !important;
  gap: 10px !important;
  margin-top: 14px !important;
}

.approval-flow {
  display: flex !important;
  gap: 14px !important;
  margin-top: 18px !important;
  flex-wrap: wrap !important;
}

.approval-flow > div {
  flex: 1 !important;
  min-width: 180px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  background: #f8fafc !important;
}

.approval-flow span {
  display: inline-grid !important;
  place-items: center !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  background: #167d68 !important;
  color: #ffffff !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  margin-right: 8px !important;
}

.approval-flow strong {
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
}

.approval-flow small {
  display: block !important;
  font-size: 12px !important;
  color: #64748b !important;
  margin-top: 4px !important;
}

.receipt-summary {
  margin-top: 16px !important;
  padding-top: 14px !important;
  border-top: 1px dashed #cbd5e1 !important;
  font-size: 13px !important;
  color: #64748b !important;
}

.receipt-summary strong {
  color: #0f172a !important;
  font-weight: 700 !important;
}

/* ==========================================================================
   DOCUMENT TABLES (TÜM DOKÜMANLAR & LISTINGS)
   ========================================================================== */

.table-tools {
  padding: 16px 20px !important;
  border-bottom: 1px solid #e2e8f0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.table-search {
  height: 42px !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 8px !important;
  padding: 0 14px !important;
  min-width: 280px !important;
  font-size: 13.5px !important;
  color: #64748b !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.table-search input {
  font-size: 13.5px !important;
  color: #0f172a !important;
  border: 0 !important;
  outline: 0 !important;
  width: 100% !important;
  background: transparent !important;
}

.table-tools select,
.table-tools button {
  height: 42px !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 8px !important;
  padding: 0 14px !important;
  font-size: 13.5px !important;
}

.table-tools button {
  background: #167d68 !important;
  color: #ffffff !important;
  border-color: #167d68 !important;
  font-weight: 600 !important;
  cursor: pointer !important;
}

.table-tools > a {
  font-size: 13px !important;
  color: #64748b !important;
}

.table-head {
  display: grid !important;
  grid-template-columns: minmax(280px, 2fr) minmax(160px, 1fr) 120px 110px 110px !important;
  gap: 16px !important;
  align-items: center !important;
  padding: 14px 20px !important;
  background: #f8fafc !important;
  border-bottom: 1px solid #e2e8f0 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
  color: #64748b !important;
}

.table-row {
  display: grid !important;
  grid-template-columns: minmax(280px, 2fr) minmax(160px, 1fr) 120px 110px 110px !important;
  gap: 16px !important;
  align-items: center !important;
  padding: 16px 20px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  font-size: 13.5px !important;
  color: #334155 !important;
  text-decoration: none !important;
  transition: background-color 0.15s ease !important;
}

.table-row:hover {
  background-color: #f8fafc !important;
}

.table-row strong {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
}

.table-row small {
  font-size: 12.5px !important;
  color: #64748b !important;
  margin-top: 3px !important;
}

.table-document {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.table-document i {
  width: 38px !important;
  height: 42px !important;
  border-radius: 6px !important;
  background: #e0f2fe !important;
  color: #0284c7 !important;
  display: grid !important;
  place-items: center !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  font-style: normal !important;
}

.type-pill {
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  background: #f1f5f9 !important;
  color: #475569 !important;
  display: inline-block !important;
}

/* ==========================================================================
   STATUS, BADGES & PILLS
   ========================================================================= */

.status,
.severity,
.priority,
.compliance-state {
  padding: 4px 10px !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.status.published {
  background-color: #dcfce7 !important;
  color: #15803d !important;
}

.status.review,
.status.approval {
  background-color: #fef3c7 !important;
  color: #b45309 !important;
}

.status.draft {
  background-color: #f1f5f9 !important;
  color: #475569 !important;
}

.status.cancelled,
.status.archived {
  background-color: #fee2e2 !important;
  color: #b91c1c !important;
}

.state-dot {
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: #167d68 !important;
}

.state-dot:before {
  content: '' !important;
  display: inline-block !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: currentColor !important;
  margin-right: 6px !important;
}

.state-dot.draft {
  color: #64748b !important;
}

.state-dot.review,
.state-dot.approval {
  color: #d97706 !important;
}

/* ==========================================================================
   DASHBOARD METRICS & WIDGETS
   ========================================================================== */

.dashboard-hero h1 {
  font-family: var(--font-base) !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin: 4px 0 8px 0 !important;
}

.dashboard-hero p {
  font-size: 14px !important;
  color: #64748b !important;
}

.dashboard-metrics,
.metrics {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 16px !important;
  margin-bottom: 24px !important;
}

.dashboard-metrics > a,
.metrics > a {
  min-height: 120px !important;
  padding: 20px !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  display: flex !important;
  gap: 16px !important;
  align-items: center !important;
  text-decoration: none !important;
  transition: all 0.18s ease !important;
}

.dashboard-metrics > a:hover,
.metrics > a:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
  border-color: #cbd5e1 !important;
}

.metric-icon {
  width: 44px !important;
  height: 44px !important;
  border-radius: 10px !important;
  font-size: 18px !important;
  display: grid !important;
  place-items: center !important;
  font-weight: 700 !important;
}

.metrics small,
.dashboard-metrics small {
  display: block !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.6px !important;
  color: #64748b !important;
  text-transform: uppercase !important;
  margin-bottom: 4px !important;
}

.metrics strong,
.dashboard-metrics strong {
  display: block !important;
  font-family: var(--font-base) !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
}

.metrics p,
.dashboard-metrics p {
  display: block !important;
  font-size: 12.5px !important;
  color: #64748b !important;
  margin-top: 4px !important;
}

.dashboard-command-grid {
  display: grid !important;
  grid-template-columns: 1.6fr 1fr !important;
  gap: 24px !important;
  margin-bottom: 24px !important;
}

.document-row {
  display: grid !important;
  grid-template-columns: 40px minmax(180px, 1.8fr) 110px minmax(110px, 1fr) 95px !important;
  gap: 14px !important;
  align-items: center !important;
  padding: 14px 20px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  text-decoration: none !important;
  color: #334155 !important;
}

.document-row:hover {
  background-color: #f8fafc !important;
}

.doc-icon {
  width: 36px !important;
  height: 38px !important;
  border-radius: 6px !important;
  background: #e0f2fe !important;
  color: #0284c7 !important;
  display: grid !important;
  place-items: center !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

.document-row strong {
  display: block !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
}

.document-row small {
  display: block !important;
  font-size: 12.5px !important;
  color: #64748b !important;
}

.attention-list > a {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 16px 20px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  text-decoration: none !important;
}

.attention-list > a:hover {
  background-color: #f8fafc !important;
}

.attention-icon {
  width: 38px !important;
  height: 38px !important;
  border-radius: 8px !important;
  font-size: 16px !important;
  display: grid !important;
  place-items: center !important;
  font-weight: 700 !important;
}

.attention-list strong {
  display: block !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
}

.attention-list small {
  display: block !important;
  font-size: 12.5px !important;
  color: #64748b !important;
  margin-top: 3px !important;
}

.attention-list > a > b {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  min-width: 32px !important;
  height: 32px !important;
  border-radius: 16px !important;
  display: grid !important;
  place-items: center !important;
  background: #f1f5f9 !important;
  color: #334155 !important;
  margin-left: auto !important;
}

/* Management cards */
.management-hub header h2 {
  font-size: 18px !important;
  font-weight: 700 !important;
}

.management-card {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 20px !important;
  border-radius: 12px !important;
  text-decoration: none !important;
}

.management-card strong {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
}

.management-card p {
  font-size: 13px !important;
  color: #64748b !important;
  margin: 4px 0 0 0 !important;
}

/* ==========================================================================
   STANDARDIZED INLINE CREATOR FORMS (UYGUNSUZLUKLAR, RİSKLER, VB.)
   ========================================================================== */

details.inline-creator {
  background: #ffffff !important;
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 12px !important;
  margin-bottom: 24px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  overflow: hidden !important;
  transition: all 0.2s ease !important;
}

details.inline-creator > summary {
  padding: 16px 24px !important;
  background-color: #f8fafc !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  cursor: pointer !important;
  user-select: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-bottom: 1px solid transparent !important;
  transition: background-color 0.18s ease, color 0.18s ease !important;
  list-style: none !important;
}

details.inline-creator > summary::-webkit-details-marker,
details.inline-creator > summary::marker {
  display: none !important;
}

details.inline-creator > summary::after {
  content: '▾' !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #167d68 !important;
  display: inline-block !important;
  transition: transform 0.2s ease !important;
}

details.inline-creator[open] > summary {
  background-color: #f1f5f9 !important;
  border-bottom: 1.5px solid #e2e8f0 !important;
  color: #167d68 !important;
}

details.inline-creator[open] > summary::after {
  transform: rotate(180deg) !important;
}

details.inline-creator > summary:hover {
  background-color: #f1f5f9 !important;
}

details.inline-creator form.form-grid {
  padding: 24px 28px !important;
  background-color: #ffffff !important;
  animation: fadeInCreator 0.2s ease-out !important;
}

@keyframes fadeInCreator {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ==========================================================================
   UNIVERSAL FORM GRID & FORM CONTROLS STANDARDIZATION
   ========================================================================== */

.form-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 20px 24px !important;
}

@media (max-width: 768px) {
  .form-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
}

.form-grid .wide,
.form-grid label.wide {
  grid-column: 1 / -1 !important;
}

.form-grid label {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: #334155 !important;
  letter-spacing: 0.3px !important;
  text-transform: uppercase !important;
  margin: 0 !important;
}

.form-grid label em {
  color: #ef4444 !important;
  font-style: normal !important;
  margin-left: 2px !important;
  font-weight: 700 !important;
}

.form-grid label small {
  font-size: 12px !important;
  font-weight: 400 !important;
  color: #64748b !important;
  text-transform: none !important;
  margin-top: 3px !important;
}

.form-grid input:not([type=checkbox]):not([type=radio]),
.form-grid select,
.form-grid textarea {
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 8px !important;
  background-color: #ffffff !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  font-family: inherit !important;
  color: #0f172a !important;
  outline: none !important;
  padding: 0 14px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease !important;
}

.form-grid input:not(textarea):not([type=checkbox]):not([type=radio]):not([type=file]),
.form-grid select:not([multiple]) {
  height: 44px !important;
  min-height: 44px !important;
}

.form-grid textarea {
  min-height: 84px !important;
  padding: 12px 14px !important;
  line-height: 1.55 !important;
  resize: vertical !important;
}

.form-grid select[multiple] {
  min-height: 120px !important;
  padding: 8px !important;
}

.form-grid select[multiple] option {
  padding: 8px 12px !important;
  border-radius: 6px !important;
  font-size: 13px !important;
}

.form-grid input:focus,
.form-grid select:focus,
.form-grid textarea:focus {
  border-color: #167d68 !important;
  box-shadow: 0 0 0 3px rgba(22, 125, 104, 0.15) !important;
  background-color: #ffffff !important;
}

.form-grid .check-card {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 14px 18px !important;
  background-color: #f8fafc !important;
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  text-transform: none !important;
}

.form-grid .check-card input[type=checkbox] {
  width: 18px !important;
  height: 18px !important;
  accent-color: #167d68 !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
}

.form-grid .check-card span strong {
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
  display: block !important;
}

.form-grid .check-card span small {
  font-size: 12px !important;
  color: #64748b !important;
  display: block !important;
  margin-top: 2px !important;
}

.form-actions {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 14px !important;
  margin-top: 20px !important;
  padding-top: 18px !important;
  border-top: 1px solid #f1f5f9 !important;
}

.two-fields {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  margin-bottom: 14px !important;
}

@media (max-width: 768px) {
  .two-fields {
    grid-template-columns: 1fr !important;
  }
}

/* ==========================================================================
   COMPLIANCE & AUDIT TABLES STANDARDIZATION (HIGH-LEGIBILITY)
   ========================================================================== */

.list-panel {
  border-radius: 12px !important;
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  overflow: visible !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  margin-bottom: 24px !important;
}

.compliance-head {
  padding: 14px 24px !important;
  background-color: #f8fafc !important;
  border-bottom: 1.5px solid #e2e8f0 !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  color: #475569 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
  display: grid !important;
  gap: 16px !important;
  align-items: center !important;
}

.compliance-row {
  padding: 16px 24px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  font-size: 13.5px !important;
  color: #1e293b !important;
  display: grid !important;
  gap: 16px !important;
  align-items: center !important;
  transition: background-color 0.15s ease !important;
  text-decoration: none !important;
}

.compliance-row:hover {
  background-color: #f8fafc !important;
}

.compliance-row:last-child {
  border-bottom: none !important;
}

.compliance-row > span strong {
  display: block !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
  line-height: 1.4 !important;
}

.compliance-row > span small {
  display: block !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  color: #64748b !important;
  margin-top: 3px !important;
  line-height: 1.4 !important;
}

/* Default Compliance columns */
.compliance-head,
.compliance-row {
  grid-template-columns: minmax(240px, 1.8fr) minmax(180px, 1.2fr) 140px 100px 120px 100px !important;
}

/* Specific Column Configurations */
.audit-report-columns {
  grid-template-columns: 140px 170px minmax(200px, 1.3fr) minmax(200px, 1.2fr) 100px !important;
}

.action-columns {
  grid-template-columns: minmax(240px, 1.8fr) 140px 150px 110px 120px 100px !important;
}

.legal-columns {
  grid-template-columns: minmax(240px, 1.8fr) minmax(170px, 1.2fr) 140px 120px 120px 100px !important;
}

.audit-columns,
.finding-columns,
.complaint-columns {
  grid-template-columns: minmax(240px, 1.8fr) minmax(170px, 1.2fr) 130px 120px 110px 100px !important;
}

.supplier-master-columns {
  grid-template-columns: minmax(220px, 1.5fr) minmax(180px, 1.2fr) minmax(170px, 1.1fr) 120px 130px 110px !important;
}

.supplier-columns {
  grid-template-columns: minmax(220px, 1.5fr) 130px 90px 90px 110px 140px !important;
}

.training-columns {
  grid-template-columns: minmax(220px, 1.5fr) minmax(170px, 1.2fr) 150px 130px 140px 130px !important;
}

.exam-columns {
  grid-template-columns: minmax(240px, 1.8fr) 120px 90px 110px 130px 110px !important;
}

.maintenance-history-columns {
  grid-template-columns: minmax(220px, 1.4fr) 140px 130px 110px 90px 100px 130px !important;
}

.retention-columns {
  grid-template-columns: minmax(220px, 1.5fr) minmax(170px, 1.2fr) 100px 140px 130px 160px !important;
}

.type-columns {
  grid-template-columns: minmax(220px, 1.8fr) 95px 115px 130px 160px 115px 110px !important;
}

.notification-columns {
  grid-template-columns: minmax(220px, 1.5fr) 150px 120px minmax(170px, 1.2fr) 100px 150px !important;
}

.department-columns {
  grid-template-columns: minmax(260px, 2fr) minmax(200px, 1.3fr) 150px !important;
}

.action-item-columns {
  grid-template-columns: minmax(240px, 1.8fr) minmax(170px, 1.2fr) 100px 120px 120px 100px !important;
}

.reading-report-columns {
  grid-template-columns: minmax(240px, 1.7fr) minmax(170px, 1.1fr) 140px 140px 140px 120px !important;
}

.report-document-columns {
  grid-template-columns: minmax(260px, 2fr) 160px 160px 110px 130px !important;
}

.competency-columns {
  grid-template-columns: minmax(200px, 1.4fr) minmax(160px, 1.2fr) 100px 90px 120px 110px !important;
}

.indicator-head,
.indicator-row {
  grid-template-columns: minmax(240px, 1.8fr) minmax(170px, 1.2fr) 120px 130px 100px 100px !important;
  display: grid !important;
  gap: 16px !important;
  align-items: center !important;
  padding: 16px 24px !important;
}

.indicator-head {
  padding: 14px 24px !important;
  background-color: #f8fafc !important;
  border-bottom: 1.5px solid #e2e8f0 !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  color: #475569 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
}

.indicator-row {
  border-bottom: 1px solid #f1f5f9 !important;
  font-size: 13.5px !important;
}

/* ==========================================================================
   AUDIT TRAIL REPORT (DENETİM İZİ FİLTRE & JSON İNCELEME)
   ========================================================================== */

.audit-filters {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
}

.audit-filters label:not(.table-search) {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #475569 !important;
  margin: 0 !important;
  text-transform: none !important;
}

.audit-filters input[type=date] {
  height: 42px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  padding: 0 12px !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 8px !important;
  color: #0f172a !important;
  background-color: #ffffff !important;
}

.audit-event {
  display: inline-block !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  background-color: #ecfdf5 !important;
  color: #065f46 !important;
  border: 1px solid #a7f3d0 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
}

.audit-detail {
  position: relative !important;
}

.audit-detail > summary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 14px !important;
  border-radius: 6px !important;
  background-color: #f1f5f9 !important;
  border: 1.5px solid #cbd5e1 !important;
  color: #1e293b !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  user-select: none !important;
  list-style: none !important;
  transition: all 0.15s ease !important;
}

.audit-detail > summary::-webkit-details-marker,
.audit-detail > summary::marker {
  display: none !important;
}

.audit-detail > summary:hover {
  background-color: #e2e8f0 !important;
  border-color: #94a3b8 !important;
}

.audit-detail[open] > div {
  position: absolute !important;
  right: 0 !important;
  top: calc(100% + 8px) !important;
  z-index: 1000 !important;
  width: 460px !important;
  max-height: 480px !important;
  overflow: auto !important;
  padding: 18px !important;
  background: #ffffff !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 10px !important;
  box-shadow: 0 15px 35px rgba(15, 23, 42, 0.18) !important;
}

.audit-detail small {
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  color: #64748b !important;
  display: block !important;
  margin-bottom: 6px !important;
}

.audit-detail pre {
  white-space: pre-wrap !important;
  word-break: break-word !important;
  background-color: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  padding: 12px !important;
  font-size: 12px !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  color: #1e293b !important;
  line-height: 1.5 !important;
  margin: 0 0 12px 0 !important;
  max-height: 200px !important;
  overflow: auto !important;
}

/* ==========================================================================
   ROW ACTION DROPDOWNS (ANALİZ, GÜNCELLE, DEĞERLENDİR, VB.)
   ========================================================================== */

.row-action {
  position: relative !important;
}

.row-action > summary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 6px 14px !important;
  border-radius: 6px !important;
  background-color: #f1f5f9 !important;
  border: 1.5px solid #cbd5e1 !important;
  color: #1e293b !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  user-select: none !important;
  text-decoration: none !important;
  list-style: none !important;
  transition: all 0.15s ease !important;
}

.row-action > summary::-webkit-details-marker,
.row-action > summary::marker {
  display: none !important;
}

.row-action > summary:hover {
  background-color: #e2e8f0 !important;
  border-color: #94a3b8 !important;
}

.row-action[open] > form {
  position: absolute !important;
  right: 0 !important;
  top: calc(100% + 8px) !important;
  z-index: 1000 !important;
  width: 340px !important;
  padding: 18px !important;
  background: #ffffff !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 10px !important;
  box-shadow: 0 15px 35px rgba(15, 23, 42, 0.18) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.row-action input,
.row-action select,
.row-action textarea {
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
  font-family: inherit !important;
  color: #0f172a !important;
  background-color: #ffffff !important;
  outline: none !important;
}

.row-action input:not(textarea),
.row-action select {
  height: 38px !important;
}

.row-action textarea {
  min-height: 64px !important;
  resize: vertical !important;
  line-height: 1.45 !important;
}

.row-action input:focus,
.row-action select:focus,
.row-action textarea:focus {
  border-color: #167d68 !important;
  box-shadow: 0 0 0 3px rgba(22, 125, 104, 0.15) !important;
}

.row-action button {
  height: 38px !important;
  border-radius: 6px !important;
  background-color: #167d68 !important;
  border: none !important;
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background-color 0.18s ease !important;
}

.row-action button:hover {
  background-color: #116b59 !important;
}

/* ==========================================================================
   CARD GRIDS (SÜREÇLER, HEDEFLER, RİSKLER, YGG, VARLIKLAR)
   ========================================================================== */

.process-card-grid,
.objective-grid,
.risk-grid,
.review-grid,
.asset-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 20px !important;
  padding: 24px !important;
}

@media (max-width: 1200px) {
  .process-card-grid,
  .objective-grid,
  .risk-grid,
  .review-grid,
  .asset-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 768px) {
  .process-card-grid,
  .objective-grid,
  .risk-grid,
  .review-grid,
  .asset-grid {
    grid-template-columns: 1fr !important;
  }
}

.process-card,
.objective-card,
.risk-card,
.review-card,
.asset-card {
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  padding: 20px 24px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease !important;
}

.process-card:hover,
.objective-card:hover,
.risk-card:hover,
.review-card:hover,
.asset-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06) !important;
  border-color: #cbd5e1 !important;
}

.process-card header,
.objective-card header,
.risk-card header,
.review-card header,
.asset-card header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 8px !important;
}

.process-card header > span,
.objective-card header > span,
.risk-card header > span,
.review-card header > span,
.asset-card header > span {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #167d68 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
}

.process-card h2,
.objective-card h2,
.risk-card h2,
.review-card h2,
.asset-card h2 {
  font-family: var(--font-base) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin: 4px 0 8px 0 !important;
  line-height: 1.35 !important;
}

.process-card > p,
.objective-card > p,
.risk-card > p,
.review-card > p,
.asset-card > p {
  font-size: 13px !important;
  line-height: 1.55 !important;
  color: #475569 !important;
  margin: 0 0 14px 0 !important;
  min-height: 40px !important;
}

.process-card dl,
.risk-card dl,
.review-card dl,
.asset-card dl {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px 12px !important;
  margin: 12px 0 !important;
  background-color: #f8fafc !important;
  border-radius: 8px !important;
  padding: 12px 14px !important;
}

.process-card dt,
.risk-card dt,
.review-card dt,
.asset-card dt {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #64748b !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  margin: 0 !important;
}

.process-card dd,
.risk-card dd,
.review-card dd,
.asset-card dd {
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
  margin: 2px 0 0 0 !important;
}

.risk-score {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

.score-low {
  background-color: #dcfce7 !important;
  color: #15803d !important;
}

.score-medium {
  background-color: #fef3c7 !important;
  color: #b45309 !important;
}

.score-high {
  background-color: #fee2e2 !important;
  color: #b91c1c !important;
}

/* Card Actions (Değerlendirmeyi güncelle vb.) */
.card-action {
  border-top: 1px solid #f1f5f9 !important;
  padding-top: 12px !important;
  margin-top: 12px !important;
}

.card-action > summary {
  cursor: pointer !important;
  color: #167d68 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  list-style: none !important;
}

.card-action > summary::-webkit-details-marker {
  display: none !important;
}

.card-action form {
  display: grid !important;
  gap: 10px !important;
  margin-top: 12px !important;
  background-color: #f8fafc !important;
  border-radius: 8px !important;
  padding: 12px !important;
  border: 1px solid #e2e8f0 !important;
}

.card-action textarea,
.card-action select,
.card-action input {
  width: 100% !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
  background-color: #ffffff !important;
  box-sizing: border-box !important;
}

.card-action button {
  height: 38px !important;
  border: none !important;
  border-radius: 6px !important;
  background-color: #167d68 !important;
  color: #ffffff !important;
  padding: 0 16px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
}

/* ==========================================================================
   RECORD MANAGEMENT PANEL & EDIT PAGES
   ========================================================================== */

.record-management-panel {
  margin-top: 24px !important;
  border-radius: 12px !important;
  border: 1.5px solid #e2e8f0 !important;
  background: #ffffff !important;
  overflow: hidden !important;
}

.record-management-panel > .panel-head {
  padding: 18px 24px !important;
  background-color: #f8fafc !important;
  border-bottom: 1.5px solid #e2e8f0 !important;
}

.record-management-panel > .panel-head h2 {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
}

.record-management-panel > .panel-head p {
  font-size: 13px !important;
  color: #64748b !important;
}

.record-management-panel > div:last-child {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

@media (max-width: 768px) {
  .record-management-panel > div:last-child {
    grid-template-columns: 1fr !important;
  }
}

.record-management-panel > div:last-child > div {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 16px 24px !important;
  border-top: 1px solid #f1f5f9 !important;
}

.record-management-panel > div:last-child > div:nth-child(odd) {
  border-right: 1px solid #f1f5f9 !important;
}

.record-management-panel span strong {
  display: block !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
}

.record-management-panel span small {
  display: block !important;
  font-size: 12px !important;
  color: #64748b !important;
  margin-top: 3px !important;
}

.record-actions {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.record-actions > a {
  display: inline-flex !important;
  align-items: center !important;
  padding: 6px 12px !important;
  border-radius: 6px !important;
  background-color: #ecfdf5 !important;
  color: #065f46 !important;
  border: 1px solid #a7f3d0 !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.record-actions > a:hover {
  background-color: #d1fae5 !important;
}

.inline-delete button,
.danger-zone button {
  display: inline-flex !important;
  align-items: center !important;
  padding: 6px 12px !important;
  border-radius: 6px !important;
  background-color: #fef2f2 !important;
  color: #b91c1c !important;
  border: 1px solid #fecaca !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
}

.inline-delete button:hover,
.danger-zone button:hover {
  background-color: #fee2e2 !important;
}

.record-editor {
  padding: 28px !important;
}

.danger-zone {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
  margin-top: 24px !important;
  padding: 20px 24px !important;
  background-color: #fff5f5 !important;
  border: 1.5px solid #fecaca !important;
  border-radius: 10px !important;
}

.danger-zone strong {
  display: block !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #991b1b !important;
}

.danger-zone p {
  margin: 4px 0 0 0 !important;
  font-size: 13px !important;
  color: #b91c1c !important;
}

.danger-zone button {
  padding: 8px 18px !important;
  background-color: #dc2626 !important;
  color: #ffffff !important;
  border: none !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
}

/* ==========================================================================
   REPORTS & VISUAL ANALYTICS (DOKÜMAN, KALİTE, OKUMA RAPORLARI)
   ========================================================================== */

.report-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 20px !important;
  margin-bottom: 24px !important;
}

@media (max-width: 992px) {
  .report-grid {
    grid-template-columns: 1fr !important;
  }
}

.report-panel {
  min-height: 260px !important;
}

.report-bars {
  display: grid !important;
  gap: 16px !important;
  padding: 24px !important;
}

.report-bars > div > span {
  display: flex !important;
  justify-content: space-between !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: #334155 !important;
  margin-bottom: 8px !important;
}

.report-bars > div > span b {
  font-weight: 700 !important;
  color: #0f172a !important;
}

.report-bars i,
.progress-report i {
  display: block !important;
  height: 8px !important;
  border-radius: 9999px !important;
  background-color: #e2e8f0 !important;
  overflow: hidden !important;
}

.report-bars i b,
.progress-report i b {
  display: block !important;
  height: 100% !important;
  border-radius: 9999px !important;
  background-color: #167d68 !important;
}

.quality-report-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 20px !important;
  margin-bottom: 24px !important;
}

@media (max-width: 992px) {
  .quality-report-grid {
    grid-template-columns: 1fr !important;
  }
}

.report-list > a {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 14px 20px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  text-decoration: none !important;
  transition: background-color 0.15s ease !important;
}

.report-list > a:hover {
  background-color: #f8fafc !important;
}

.report-list > a:last-child {
  border-bottom: none !important;
}

.report-list strong {
  display: block !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
}

.report-list small {
  display: block !important;
  font-size: 12px !important;
  color: #64748b !important;
  margin-top: 3px !important;
}

.summary-strip.report-summary-five {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

@media (max-width: 992px) {
  .summary-strip.report-summary-five {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ==========================================================================
   CHECKLIST & AUDIT STANDARDS
   ========================================================================== */

.audit-assignment {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  margin-bottom: 24px !important;
}

@media (max-width: 768px) {
  .audit-assignment {
    grid-template-columns: 1fr 1fr !important;
  }
}

.audit-assignment > div {
  padding: 16px 20px !important;
  border-right: 1px solid #e2e8f0 !important;
}

.audit-assignment > div:last-child {
  border-right: none !important;
}

.audit-assignment small {
  display: block !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  color: #64748b !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
  margin-bottom: 4px !important;
}

.audit-assignment strong {
  display: block !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
}

.checklist-question {
  margin-bottom: 20px !important;
}

.checklist-question > header {
  display: flex !important;
  align-items: flex-start !important;
  gap: 14px !important;
  padding: 18px 24px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  background-color: #f8fafc !important;
}

.checklist-question > header > span {
  width: 36px !important;
  height: 36px !important;
  border-radius: 8px !important;
  background-color: #e0f2fe !important;
  color: #0284c7 !important;
  display: grid !important;
  place-items: center !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  flex-shrink: 0 !important;
}

.checklist-question header h2 {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin: 4px 0 0 0 !important;
  line-height: 1.4 !important;
}

.checklist-question header small {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #64748b !important;
}

.checklist-question > header > b {
  font-size: 11.5px !important;
  font-weight: 700 !important;
  color: #475569 !important;
  background-color: #e2e8f0 !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  margin-left: auto !important;
  white-space: nowrap !important;
}

.question-guidance {
  margin: 0 !important;
  padding: 14px 24px !important;
  background-color: #f8fafc !important;
  border-bottom: 1px solid #f1f5f9 !important;
  color: #475569 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

.answer-criteria {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 14px 24px !important;
  background-color: #eff8f5 !important;
  border-bottom: 1px solid #cce8e0 !important;
  color: #167d68 !important;
  font-size: 13px !important;
  flex-wrap: wrap !important;
}

.answer-criteria strong {
  font-weight: 700 !important;
  color: #116b59 !important;
}

.checklist-answer-grid {
  display: grid !important;
  grid-template-columns: 1fr 1.4fr 1.4fr !important;
  gap: 16px !important;
  padding: 20px 24px !important;
}

@media (max-width: 992px) {
  .checklist-answer-grid {
    grid-template-columns: 1fr !important;
  }
}

.checklist-answer-grid label {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #475569 !important;
  text-transform: uppercase !important;
}

.checklist-answer-grid input,
.checklist-answer-grid select,
.checklist-answer-grid textarea {
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 8px !important;
  padding: 8px 12px !important;
  font-size: 13.5px !important;
  font-family: inherit !important;
  color: #0f172a !important;
  box-sizing: border-box !important;
}

.checklist-answer-grid select {
  height: 42px !important;
}

.checklist-answer-grid textarea {
  min-height: 64px !important;
}

.checklist-question footer {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 12px 24px !important;
  border-top: 1px solid #f1f5f9 !important;
  background-color: #f8fafc !important;
}

.criteria-result {
  padding: 4px 10px !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

.criteria-result.pass {
  background-color: #dcfce7 !important;
  color: #15803d !important;
}

.criteria-result.fail {
  background-color: #fee2e2 !important;
  color: #b91c1c !important;
}

.criteria-result.manual {
  background-color: #f1f5f9 !important;
  color: #475569 !important;
}

.checklist-save {
  position: sticky !important;
  bottom: 16px !important;
  z-index: 50 !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 18px 24px !important;
  border: 1.5px solid #a7f3d0 !important;
  border-radius: 12px !important;
  background-color: #ecfdf5 !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
}

.checklist-save p {
  margin: 0 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #065f46 !important;
}

/* Audit Standards Grid */
.audit-standard-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 20px !important;
  padding: 24px !important;
}

@media (max-width: 992px) {
  .audit-standard-grid {
    grid-template-columns: 1fr !important;
  }
}

.audit-standard-card header {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  padding: 20px 24px !important;
  border-bottom: 1px solid #f1f5f9 !important;
}

.audit-standard-card header h2 {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin: 4px 0 2px 0 !important;
}

.audit-standard-card header p {
  font-size: 13px !important;
  color: #64748b !important;
  margin: 0 !important;
}

.standard-stats {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  border-bottom: 1px solid #f1f5f9 !important;
}

.standard-stats span {
  padding: 14px 20px !important;
  border-right: 1px solid #f1f5f9 !important;
}

.standard-stats span:last-child {
  border-right: none !important;
}

.standard-stats small {
  display: block !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #64748b !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

.standard-stats strong {
  display: block !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin-top: 4px !important;
}

.standard-description {
  padding: 14px 24px !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  color: #475569 !important;
  margin: 0 !important;
}

.standard-file {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 14px 24px !important;
  padding: 12px 16px !important;
  border: 1.5px solid #a7f3d0 !important;
  border-radius: 8px !important;
  background-color: #ecfdf5 !important;
}

.standard-file strong {
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
}

.standard-file small {
  font-size: 12px !important;
  color: #64748b !important;
}

.standard-file a {
  display: inline-flex !important;
  padding: 6px 14px !important;
  border-radius: 6px !important;
  background-color: #167d68 !important;
  color: #ffffff !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.standard-question-list {
  padding: 14px 24px !important;
}

.standard-question-list > div {
  display: flex !important;
  gap: 12px !important;
  padding: 10px 0 !important;
  border-bottom: 1px solid #f1f5f9 !important;
  font-size: 13px !important;
}

.standard-question-list > div > b {
  color: #167d68 !important;
  font-weight: 700 !important;
  min-width: 44px !important;
}

.standard-question-list strong {
  font-size: 13.5px !important;
  color: #0f172a !important;
}

.standard-question-list small {
  font-size: 12px !important;
  color: #64748b !important;
}

/* ==========================================================================
   CALENDAR STANDARDIZATION
   ========================================================================== */

.month-nav strong {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
}

.month-nav a {
  width: 38px !important;
  height: 38px !important;
  border-radius: 8px !important;
  border: 1.5px solid #cbd5e1 !important;
  background-color: #ffffff !important;
  color: #167d68 !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  display: grid !important;
  place-items: center !important;
  text-decoration: none !important;
}

.calendar-weekdays span {
  padding: 12px 14px !important;
  background-color: #f8fafc !important;
  border-bottom: 1.5px solid #e2e8f0 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
  color: #475569 !important;
  text-align: center !important;
}

.calendar-day {
  min-height: 120px !important;
  padding: 12px !important;
  border-right: 1px solid #e2e8f0 !important;
  border-bottom: 1px solid #e2e8f0 !important;
}

.calendar-day > b {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
}

.calendar-day.today > b {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  background-color: #167d68 !important;
  color: #ffffff !important;
}

.calendar-action {
  font-size: 11.5px !important;
  font-weight: 600 !important;
  padding: 4px 8px !important;
  border-radius: 6px !important;
  margin-top: 6px !important;
}

/* ==========================================================================
   PROFILE & NOTIFICATIONS
   ========================================================================== */

.profile-panel {
  padding: 28px !important;
}

.profile-summary {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  padding-bottom: 24px !important;
  margin-bottom: 24px !important;
  border-bottom: 1px solid #f1f5f9 !important;
}

.profile-avatar {
  width: 64px !important;
  height: 64px !important;
  border-radius: 16px !important;
  background-color: #ecfdf5 !important;
  color: #047857 !important;
  border: 1.5px solid #a7f3d0 !important;
  display: grid !important;
  place-items: center !important;
  font-size: 22px !important;
  font-weight: 700 !important;
}

.profile-summary h2 {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin: 0 0 4px 0 !important;
}

.profile-summary p {
  font-size: 14px !important;
  color: #64748b !important;
  margin: 0 0 6px 0 !important;
}

.profile-summary b {
  display: inline-block !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  background-color: #f1f5f9 !important;
  color: #475569 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

.notification-item {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 16px 24px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  border: none !important;
  background: transparent !important;
  cursor: pointer !important;
  transition: background-color 0.15s ease !important;
}

.notification-item:hover {
  background-color: #f8fafc !important;
}

.notification-item > b {
  padding: 4px 8px !important;
  border-radius: 6px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
}

.notification-item strong {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
}

.notification-item small {
  font-size: 12.5px !important;
  color: #64748b !important;
  margin-top: 3px !important;
}

/* ==========================================================================
   BADGES & PILLS COLOR ENHANCEMENTS
   ========================================================================== */

.severity.minor {
  background-color: #e0f2fe !important;
  color: #0369a1 !important;
  border: 1px solid #bae6fd !important;
}

.severity.major {
  background-color: #fef3c7 !important;
  color: #b45309 !important;
  border: 1px solid #fde68a !important;
}

.severity.critical {
  background-color: #fee2e2 !important;
  color: #b91c1c !important;
  border: 1px solid #fecaca !important;
}

.compliance-state.compliant {
  background-color: #dcfce7 !important;
  color: #15803d !important;
  border: 1px solid #bbf7d0 !important;
}

.compliance-state.partial {
  background-color: #fef3c7 !important;
  color: #b45309 !important;
  border: 1px solid #fde68a !important;
}

.compliance-state.noncompliant {
  background-color: #fee2e2 !important;
  color: #b91c1c !important;
  border: 1px solid #fecaca !important;
}

.compliance-state.not_assessed {
  background-color: #f1f5f9 !important;
  color: #475569 !important;
  border: 1px solid #e2e8f0 !important;
}

.code-pill,
.count-pill {
  display: inline-block !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  background-color: #f1f5f9 !important;
  color: #334155 !important;
  border: 1px solid #cbd5e1 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

/* Empty State */
.empty-state {
  text-align: center !important;
  padding: 48px 24px !important;
  color: #64748b !important;
}

.empty-state h3 {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  margin: 8px 0 6px 0 !important;
}

.empty-state p {
  font-size: 13.5px !important;
  color: #64748b !important;
  margin: 0 0 14px 0 !important;
}

.empty-state a {
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #167d68 !important;
  text-decoration: none !important;
}

/* ==========================================================================
   ENTERPRISE TYPOGRAPHY & INNER PAGE STANDARDIZATION
   ========================================================================== */

/* Breadcrumbs & Section Headers */
.breadcrumbs {
  font-size: 13px !important;
  color: #64748b !important;
  margin-bottom: 20px !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.breadcrumbs span {
  color: #94a3b8 !important;
  margin: 0 4px !important;
}

.breadcrumbs b {
  color: #0f172a !important;
  font-weight: 600 !important;
}

.breadcrumbs a {
  color: #64748b !important;
  text-decoration: none !important;
  transition: color 0.15s ease !important;
}

.breadcrumbs a:hover {
  color: #167d68 !important;
}

.eyebrow {
  margin: 0 !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.8px !important;
  color: #167d68 !important;
  text-transform: uppercase !important;
}

.page-title h1 {
  font-size: 26px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin: 6px 0 6px 0 !important;
  letter-spacing: -0.02em !important;
}

.page-title > p:last-child,
.page-title > div > p:last-child {
  font-size: 14px !important;
  color: #64748b !important;
  margin: 0 !important;
}

/* Summary Metric Strips */
.summary-strip {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  margin-bottom: 24px !important;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.04) !important;
  overflow: hidden !important;
}

.summary-strip.compact-summary {
  grid-template-columns: repeat(3, 1fr) !important;
}

.summary-strip.report-summary-five {
  grid-template-columns: repeat(5, 1fr) !important;
}

.summary-strip > div {
  padding: 18px 24px !important;
  border-right: 1px solid #f1f5f9 !important;
}

.summary-strip > div:last-child {
  border-right: none !important;
}

.summary-strip small {
  display: block !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.6px !important;
  color: #64748b !important;
  text-transform: uppercase !important;
  margin-bottom: 6px !important;
}

.summary-strip strong {
  display: block !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  letter-spacing: -0.02em !important;
}

/* ==========================================================================
   EXPANDABLE INLINE CREATOR FORMS (details.inline-creator)
   ========================================================================== */

details.inline-creator {
  background: #ffffff !important;
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 12px !important;
  margin-bottom: 24px !important;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04) !important;
  overflow: hidden !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

details.inline-creator:hover {
  border-color: #cbd5e1 !important;
}

details.inline-creator[open] {
  border-color: #167d68 !important;
  box-shadow: 0 6px 20px rgba(22, 125, 104, 0.08) !important;
}

details.inline-creator > summary {
  list-style: none !important;
  cursor: pointer !important;
  padding: 16px 24px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  background-color: #f8fafc !important;
  border-bottom: 1.5px solid transparent !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  user-select: none !important;
  transition: background-color 0.15s ease !important;
}

details.inline-creator > summary::-webkit-details-marker {
  display: none !important;
}

details.inline-creator > summary:hover {
  background-color: #f1f5f9 !important;
  color: #167d68 !important;
}

details.inline-creator[open] > summary {
  background-color: #f8fafc !important;
  border-bottom-color: #e2e8f0 !important;
  color: #167d68 !important;
}

details.inline-creator > summary::after {
  content: '▾' !important;
  font-size: 18px !important;
  color: #64748b !important;
  transition: transform 0.2s ease, color 0.2s ease !important;
}

details.inline-creator[open] > summary::after {
  transform: rotate(180deg) !important;
  color: #167d68 !important;
}

/* ==========================================================================
   FORM GRID & STANDARDIZED INPUT CONTROLS (.form-grid)
   ========================================================================== */

.form-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 20px !important;
  padding: 24px !important;
  background-color: #ffffff !important;
}

.form-grid .wide {
  grid-column: 1 / -1 !important;
}

.form-grid label {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #334155 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

.form-grid label em {
  color: #e11d48 !important;
  font-style: normal !important;
  margin-left: 3px !important;
}

.form-grid label small {
  font-size: 11.5px !important;
  font-weight: 400 !important;
  color: #64748b !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  margin-top: 2px !important;
}

/* Inputs, Selects & Textareas */
.form-grid input:not([type="checkbox"]):not([type="radio"]),
.form-grid select,
.form-grid textarea {
  font-family: var(--font-base) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #0f172a !important;
  background-color: #ffffff !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  outline: none !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.form-grid input:not([type="checkbox"]):not([type="radio"]),
.form-grid select {
  height: 44px !important;
}

.form-grid textarea {
  min-height: 88px !important;
  resize: vertical !important;
  line-height: 1.5 !important;
}

.form-grid select[multiple] {
  height: auto !important;
  min-height: 120px !important;
  padding: 8px !important;
}

.form-grid select[multiple] option {
  padding: 8px 12px !important;
  border-radius: 6px !important;
  margin-bottom: 2px !important;
}

.form-grid select[multiple] option:checked {
  background-color: #167d68 !important;
  color: #ffffff !important;
}

.form-grid input:focus,
.form-grid select:focus,
.form-grid textarea:focus {
  border-color: #167d68 !important;
  box-shadow: 0 0 0 3.5px rgba(22, 125, 104, 0.15) !important;
}

.form-grid input::placeholder,
.form-grid textarea::placeholder {
  color: #94a3b8 !important;
  font-weight: 400 !important;
}

/* Check Card */
.form-grid .check-card {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 14px 18px !important;
  background-color: #f8fafc !important;
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  transition: background-color 0.15s ease, border-color 0.15s ease !important;
}

.form-grid .check-card:hover {
  background-color: #f1f5f9 !important;
  border-color: #cbd5e1 !important;
}

.check-card input[type="checkbox"] {
  width: 18px !important;
  height: 18px !important;
  accent-color: #167d68 !important;
  margin: 0 !important;
}

.check-card span strong {
  display: block !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
}

.check-card span small {
  display: block !important;
  font-size: 12px !important;
  color: #64748b !important;
  margin-top: 2px !important;
}

/* Form Actions */
.form-actions {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 14px !important;
  margin-top: 8px !important;
  padding-top: 20px !important;
  border-top: 1px solid #f1f5f9 !important;
}

.form-actions > a {
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #64748b !important;
  text-decoration: none !important;
}

.form-actions > a:hover {
  color: #0f172a !important;
}

/* ==========================================================================
   TABLE TOOLBARS & SEARCH FILTERS (.table-tools)
   ========================================================================== */

.table-tools {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 16px 22px !important;
  background-color: #f8fafc !important;
  border-bottom: 1.5px solid #e2e8f0 !important;
}

.table-search {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  background-color: #ffffff !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 8px !important;
  height: 42px !important;
  padding: 0 14px !important;
  font-size: 14px !important;
  color: #64748b !important;
  min-width: 260px !important;
  flex: 1 !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}

.table-search:focus-within {
  border-color: #167d68 !important;
  box-shadow: 0 0 0 3px rgba(22, 125, 104, 0.15) !important;
}

.table-search input {
  border: none !important;
  outline: none !important;
  font-size: 13.5px !important;
  font-family: var(--font-base) !important;
  color: #0f172a !important;
  background: transparent !important;
  width: 100% !important;
  min-width: 180px !important;
}

.table-tools select {
  height: 42px !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 8px !important;
  padding: 0 14px !important;
  font-size: 13.5px !important;
  font-family: var(--font-base) !important;
  background-color: #ffffff !important;
  color: #334155 !important;
  outline: none !important;
  cursor: pointer !important;
  transition: border-color 0.15s ease !important;
}

.table-tools select:focus {
  border-color: #167d68 !important;
  box-shadow: 0 0 0 3px rgba(22, 125, 104, 0.15) !important;
}

.table-tools button {
  height: 42px !important;
  padding: 0 20px !important;
  border-radius: 8px !important;
  background-color: #167d68 !important;
  color: #ffffff !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  font-family: var(--font-base) !important;
  border: none !important;
  cursor: pointer !important;
  box-shadow: 0 2px 6px rgba(22, 125, 104, 0.2) !important;
  transition: background-color 0.15s ease, transform 0.1s ease !important;
  white-space: nowrap !important;
}

.table-tools button:hover {
  background-color: #116b59 !important;
}

.table-tools > a {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #64748b !important;
  text-decoration: none !important;
  padding: 8px 12px !important;
}

.table-tools > a:hover {
  color: #e11d48 !important;
}

/* ==========================================================================
   AUDIT TRAIL VIEW STANDARDIZATION (/raporlar/denetim-izi)
   ========================================================================== */

.audit-filters {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 16px !important;
}

.audit-filters > label:not(.table-search) {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #334155 !important;
}

.audit-filters input[type="date"] {
  height: 42px !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 8px !important;
  padding: 0 12px !important;
  font-size: 13px !important;
  font-family: var(--font-base) !important;
  color: #0f172a !important;
  background-color: #ffffff !important;
  outline: none !important;
  transition: border-color 0.15s ease !important;
}

.audit-filters input[type="date"]:focus {
  border-color: #167d68 !important;
  box-shadow: 0 0 0 3px rgba(22, 125, 104, 0.15) !important;
}

.audit-report-columns {
  grid-template-columns: 140px 180px 160px minmax(180px, 1.3fr) 110px !important;
}

.audit-event {
  display: inline-block !important;
  padding: 5px 10px !important;
  border-radius: 6px !important;
  background-color: #ecfdf5 !important;
  color: #047857 !important;
  border: 1px solid #a7f3d0 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  font-family: 'Consolas', 'Courier New', monospace !important;
  letter-spacing: 0.3px !important;
}

.audit-detail {
  position: relative !important;
  display: inline-block !important;
}

.audit-detail > summary {
  list-style: none !important;
  cursor: pointer !important;
  color: #167d68 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  background-color: #eff8f5 !important;
  border: 1px solid #cce5dd !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
}

.audit-detail > summary::-webkit-details-marker {
  display: none !important;
}

.audit-detail > summary:hover {
  background-color: #167d68 !important;
  color: #ffffff !important;
}

.audit-detail > div {
  position: absolute !important;
  right: 0 !important;
  top: 34px !important;
  z-index: 100 !important;
  width: 480px !important;
  max-width: 90vw !important;
  max-height: 420px !important;
  overflow-y: auto !important;
  padding: 18px !important;
  background-color: #ffffff !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 10px !important;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.18) !important;
}

.audit-detail small {
  display: block !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
  color: #475569 !important;
  margin: 10px 0 6px 0 !important;
}

.audit-detail small:first-child {
  margin-top: 0 !important;
}

.audit-detail pre {
  white-space: pre-wrap !important;
  word-break: break-word !important;
  background-color: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
  padding: 12px !important;
  font-size: 12px !important;
  font-family: 'Consolas', 'Courier New', monospace !important;
  color: #0f172a !important;
  line-height: 1.55 !important;
  margin: 0 0 8px 0 !important;
}

/* ==========================================================================
   COMPLIANCE TABLES & EXPLICIT PROPORTIONAL COLUMNS
   ========================================================================== */

.compliance-head {
  display: grid !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 14px 22px !important;
  background-color: #f8fafc !important;
  border-bottom: 1.5px solid #e2e8f0 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #475569 !important;
  letter-spacing: 0.6px !important;
  text-transform: uppercase !important;
}

.compliance-row {
  display: grid !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 16px 22px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  font-size: 13.5px !important;
  color: #1e293b !important;
  transition: background-color 0.15s ease !important;
}

.compliance-row:hover {
  background-color: #f8fafc !important;
}

.compliance-row:last-child {
  border-bottom: none !important;
}

.compliance-row > span > strong {
  display: block !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
  margin-bottom: 3px !important;
}

.compliance-row > span > small {
  display: block !important;
  font-size: 12px !important;
  color: #64748b !important;
}

/* Explicit Proportional Grid Column Templates */
.compliance-head,
.compliance-row {
  grid-template-columns: minmax(220px, 1.8fr) minmax(140px, 1.1fr) 140px 95px 120px 90px !important;
}

.action-columns {
  grid-template-columns: minmax(220px, 1.8fr) 110px 140px 110px 120px 90px !important;
}

.legal-columns {
  grid-template-columns: minmax(220px, 1.8fr) minmax(140px, 1.1fr) 130px 110px 110px 90px !important;
}

.complaint-columns {
  grid-template-columns: minmax(220px, 1.8fr) 140px 130px 95px 110px 90px !important;
}

.finding-columns {
  grid-template-columns: minmax(220px, 1.8fr) 140px 110px 130px 110px 90px !important;
}

.action-item-columns {
  grid-template-columns: minmax(220px, 1.8fr) minmax(140px, 1.1fr) 95px 110px 110px 90px !important;
}

.competency-columns {
  grid-template-columns: minmax(180px, 1.4fr) minmax(140px, 1.2fr) 90px 90px 110px 100px !important;
}

.audit-program-columns {
  grid-template-columns: minmax(200px, 1.6fr) 140px 130px 110px 110px 90px !important;
}

.report-document-columns {
  grid-template-columns: minmax(240px, 2fr) 140px 140px 100px 110px !important;
}

.reading-report-columns {
  grid-template-columns: minmax(220px, 1.8fr) 150px 130px 130px 100px 110px !important;
}

.department-columns {
  grid-template-columns: minmax(220px, 1.8fr) minmax(160px, 1.2fr) 140px !important;
}

.type-columns {
  grid-template-columns: minmax(220px, 1.8fr) 95px 115px 130px 160px 115px 110px !important;
}

.notification-columns {
  grid-template-columns: minmax(180px, 1.4fr) 150px 120px minmax(160px, 1.2fr) 90px 140px !important;
}

.retention-columns {
  grid-template-columns: minmax(180px, 1.4fr) minmax(140px, 1.1fr) 95px 120px 120px 150px !important;
}

.admin-user-columns {
  grid-template-columns: minmax(200px, 1.6fr) 140px 140px 100px 80px !important;
}

/* ==========================================================================
   ROW ACTION DROPDOWN POPUPS (.row-action)
   ========================================================================== */

.row-action {
  position: relative !important;
  display: inline-block !important;
}

.row-action > summary {
  list-style: none !important;
  cursor: pointer !important;
  color: #167d68 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  padding: 6px 12px !important;
  border-radius: 6px !important;
  background-color: #eff8f5 !important;
  border: 1px solid #cce5dd !important;
  text-align: center !important;
  user-select: none !important;
  transition: all 0.15s ease !important;
}

.row-action > summary::-webkit-details-marker {
  display: none !important;
}

.row-action > summary:hover {
  background-color: #167d68 !important;
  color: #ffffff !important;
}

.row-action form {
  position: absolute !important;
  right: 0 !important;
  top: 36px !important;
  z-index: 50 !important;
  width: 340px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  padding: 18px !important;
  background-color: #ffffff !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 10px !important;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.16) !important;
}

.row-action input,
.row-action select,
.row-action textarea {
  width: 100% !important;
  min-width: 0 !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
  font-family: var(--font-base) !important;
  color: #0f172a !important;
  background-color: #ffffff !important;
  outline: none !important;
  box-sizing: border-box !important;
}

.row-action textarea {
  min-height: 64px !important;
  resize: vertical !important;
}

.row-action input:focus,
.row-action select:focus,
.row-action textarea:focus {
  border-color: #167d68 !important;
  box-shadow: 0 0 0 3px rgba(22, 125, 104, 0.15) !important;
}

.row-action button {
  height: 38px !important;
  border: none !important;
  border-radius: 6px !important;
  background-color: #167d68 !important;
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background-color 0.15s ease !important;
}

.row-action button:hover {
  background-color: #116b59 !important;
}

/* ==========================================================================
   RECORD MANAGEMENT PANEL & EDIT PAGES (.record-management-panel, .record-editor)
   ========================================================================== */

.record-management-panel {
  margin-top: 28px !important;
  border-radius: 12px !important;
  border: 1.5px solid #e2e8f0 !important;
}

.record-management-panel .panel-head {
  padding: 18px 24px !important;
  border-bottom: 1.5px solid #f1f5f9 !important;
}

.record-management-panel .panel-head h2 {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin: 0 !important;
}

.record-management-panel .panel-head p {
  font-size: 13px !important;
  color: #64748b !important;
  margin: 4px 0 0 0 !important;
}

.record-management-panel > div > div {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 14px 24px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  font-size: 13.5px !important;
}

.record-management-panel > div > div:last-child {
  border-bottom: none !important;
}

.record-management-panel strong {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
}

.record-management-panel small {
  font-size: 12px !important;
  color: #64748b !important;
  margin-left: 8px !important;
}

.record-actions {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.record-actions a {
  padding: 6px 14px !important;
  border-radius: 6px !important;
  background-color: #f1f5f9 !important;
  color: #334155 !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
}

.record-actions a:hover {
  background-color: #e2e8f0 !important;
  color: #0f172a !important;
}

.record-actions .inline-delete button,
.record-management-panel .inline-delete button {
  padding: 6px 14px !important;
  border-radius: 6px !important;
  background-color: #fee2e2 !important;
  color: #b91c1c !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  border: none !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

.record-actions .inline-delete button:hover,
.record-management-panel .inline-delete button:hover {
  background-color: #fecaca !important;
  color: #991b1b !important;
}

/* Generic Record Editor (/kayit-yonetimi/{type}/{id}/duzenle) */
.record-editor {
  border-radius: 12px !important;
  border: 1.5px solid #e2e8f0 !important;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04) !important;
}

.danger-zone {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  margin-top: 24px !important;
  padding: 20px 24px !important;
  background-color: #fff1f2 !important;
  border: 1.5px solid #fecdd3 !important;
  border-radius: 12px !important;
}

.danger-zone strong {
  display: block !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #9f1239 !important;
}

.danger-zone p {
  font-size: 13px !important;
  color: #be123c !important;
  margin: 4px 0 0 0 !important;
}

.danger-zone button {
  padding: 10px 20px !important;
  border-radius: 8px !important;
  background-color: #e11d48 !important;
  color: #ffffff !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  border: none !important;
  cursor: pointer !important;
  transition: background-color 0.15s ease !important;
}

.danger-zone button:hover {
  background-color: #be123c !important;
}

/* ==========================================================================
   BADGES, PILLS & STATUS INDICATORS
   ========================================================================== */

.severity,
.compliance-state,
.priority,
.status {
  display: inline-block !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.priority.low {
  background-color: #f1f5f9 !important;
  color: #475569 !important;
  border: 1px solid #e2e8f0 !important;
}

.priority.medium {
  background-color: #e0f2fe !important;
  color: #0369a1 !important;
  border: 1px solid #bae6fd !important;
}

.priority.high {
  background-color: #fef3c7 !important;
  color: #b45309 !important;
  border: 1px solid #fde68a !important;
}

.priority.critical {
  background-color: #fee2e2 !important;
  color: #b91c1c !important;
  border: 1px solid #fecaca !important;
}

.state-dot {
  font-size: 13px !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
}

.state-dot:before {
  content: '' !important;
  display: inline-block !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: currentColor !important;
  margin-right: 6px !important;
}

/* Report Grids & Quality Metrics */
.quality-report-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 20px !important;
}

.report-list > a {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 14px 20px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  text-decoration: none !important;
  transition: background-color 0.15s ease !important;
}

.report-list > a:hover {
  background-color: #f8fafc !important;
}

.report-list strong {
  font-size: 14px !important;
  color: #0f172a !important;
  font-weight: 600 !important;
}

.report-list small {
  font-size: 12px !important;
  color: #64748b !important;
  margin-top: 3px !important;
}

.risk-score {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

.score-low {
  background-color: #ecfdf5 !important;
  color: #047857 !important;
  border: 1.5px solid #a7f3d0 !important;
}

.score-medium {
  background-color: #fffbeb !important;
  color: #b45309 !important;
  border: 1.5px solid #fde68a !important;
}

.score-high {
  background-color: #fef2f2 !important;
  color: #b91c1c !important;
  border: 1.5px solid #fecaca !important;
}

.progress-report i,
.report-bars i {
  display: block !important;
  height: 8px !important;
  border-radius: 8px !important;
  background-color: #e2e8f0 !important;
  overflow: hidden !important;
  margin-top: 8px !important;
}

.progress-report i b,
.report-bars i b {
  display: block !important;
  height: 100% !important;
  border-radius: 8px !important;
  background-color: #167d68 !important;
}

/* Pagination */
.pagination {
  padding: 16px 22px !important;
  border-top: 1px solid #e2e8f0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  font-size: 13px !important;
}

/* ==========================================================================
   CARD GRIDS STANDARDIZATION (.process-card, .objective-card, .risk-card, etc.)
   ========================================================================== */

.process-card-grid,
.objective-grid,
.risk-grid,
.review-grid,
.asset-grid,
.admin-card-grid,
.usage-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 20px !important;
  padding: 24px !important;
}

@media (max-width: 1200px) {
  .process-card-grid,
  .objective-grid,
  .risk-grid,
  .review-grid,
  .asset-grid,
  .admin-card-grid,
  .usage-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 768px) {
  .process-card-grid,
  .objective-grid,
  .risk-grid,
  .review-grid,
  .asset-grid,
  .admin-card-grid,
  .usage-grid {
    grid-template-columns: 1fr !important;
  }
}

.process-card,
.objective-card,
.risk-card,
.review-card,
.asset-card,
.admin-card,
.usage-card {
  background-color: #ffffff !important;
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 12px !important;
  padding: 22px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  min-width: 0 !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04) !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease !important;
}

.process-card:hover,
.objective-card:hover,
.risk-card:hover,
.review-card:hover,
.asset-card:hover,
.admin-card:hover,
.usage-card:hover {
  border-color: #cbd5e1 !important;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08) !important;
  transform: translateY(-2px) !important;
}

.process-card header,
.objective-card header,
.risk-card header,
.review-card header,
.asset-card header,
.admin-card header,
.usage-card header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

.process-card header > span,
.objective-card header > span,
.risk-card header > span,
.review-card header,
.asset-card header,
.admin-card header,
.usage-card header {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #167d68 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
}

.review-card header b,
.asset-card header b,
.admin-card header b,
.usage-card header b {
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: #64748b !important;
  text-transform: none !important;
}

.process-card h2,
.objective-card h2,
.risk-card h2,
.review-card h2,
.asset-card h2,
.admin-card h2 {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin: 12px 0 8px 0 !important;
  line-height: 1.4 !important;
}

.process-card > p,
.objective-card > p,
.risk-card > p,
.review-card > p,
.asset-card > p,
.admin-card > p {
  font-size: 13.5px !important;
  line-height: 1.6 !important;
  color: #64748b !important;
  min-height: 42px !important;
  margin: 0 0 16px 0 !important;
}

/* Card Definition Lists */
.process-card dl,
.risk-card dl,
.review-card dl,
.asset-card dl {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px !important;
  margin: 0 0 16px 0 !important;
}

.process-card dl > div,
.risk-card dl > div,
.review-card dl > div,
.asset-card dl > div {
  background-color: #f8fafc !important;
  border: 1px solid #f1f5f9 !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
}

.process-card dt,
.risk-card dt,
.review-card dt,
.asset-card dt {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #64748b !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

.process-card dd,
.risk-card dd,
.review-card dd,
.asset-card dd {
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
  margin: 4px 0 0 0 !important;
}

.process-card footer,
.objective-card footer,
.admin-card footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-top: 1px solid #f1f5f9 !important;
  padding-top: 14px !important;
  margin-top: auto !important;
  font-size: 12.5px !important;
  color: #64748b !important;
}

.process-card footer a,
.objective-card footer a,
.admin-card footer a {
  color: #167d68 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.process-card footer a:hover {
  text-decoration: underline !important;
}

/* Card Inline Quick Actions */
.card-action,
.progress-action {
  border-top: 1px solid #f1f5f9 !important;
  padding-top: 12px !important;
  margin-top: auto !important;
  position: relative !important;
}

.card-action > summary,
.progress-action > summary {
  list-style: none !important;
  cursor: pointer !important;
  color: #167d68 !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  display: inline-block !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  background-color: #eff8f5 !important;
  border: 1px solid #cce5dd !important;
  transition: all 0.15s ease !important;
}

.card-action > summary::-webkit-details-marker,
.progress-action > summary::-webkit-details-marker {
  display: none !important;
}

.card-action > summary:hover,
.progress-action > summary:hover {
  background-color: #167d68 !important;
  color: #ffffff !important;
}

.card-action form {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin-top: 12px !important;
  background-color: #f8fafc !important;
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 8px !important;
  padding: 14px !important;
}

.card-action form > div {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}

.card-action textarea,
.card-action select,
.card-action input,
.progress-action input,
.progress-action select {
  font-size: 13px !important;
  font-family: var(--font-base) !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  background-color: #ffffff !important;
  color: #0f172a !important;
  outline: none !important;
}

.card-action button,
.progress-action button {
  height: 36px !important;
  border: none !important;
  border-radius: 6px !important;
  background-color: #167d68 !important;
  color: #ffffff !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background-color 0.15s ease !important;
}

.card-action button:hover,
.progress-action button:hover {
  background-color: #116b59 !important;
}

.review-decisions {
  font-size: 13px !important;
  line-height: 1.55 !important;
  color: #047857 !important;
  background-color: #ecfdf5 !important;
  border: 1px solid #a7f3d0 !important;
  border-radius: 8px !important;
  padding: 12px 14px !important;
  margin: 12px 0 !important;
}

/* Role & Permission Matrix */
.role-matrix {
  overflow-x: auto !important;
  border-radius: 10px !important;
  border: 1px solid #e2e8f0 !important;
}

.role-matrix-head {
  padding: 14px 22px !important;
  background-color: #f8fafc !important;
  color: #475569 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
  border-bottom: 1.5px solid #e2e8f0 !important;
}

.role-matrix > div:not(.role-matrix-head) {
  padding: 16px 22px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  font-size: 13.5px !important;
}

.role-matrix strong {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
}

.role-matrix small {
  font-size: 12px !important;
  color: #64748b !important;
  margin-top: 3px !important;
}

.permission {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

.permission.yes {
  background-color: #ecfdf5 !important;
  color: #047857 !important;
}

.permission.no {
  background-color: #f1f5f9 !important;
  color: #94a3b8 !important;
}

/* Subscription Hero & Usage Cards */
.subscription-hero {
  padding: 28px 32px !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, #0f172a 0%, #134e4a 100%) !important;
  color: #ffffff !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 32px !important;
  margin-bottom: 24px !important;
}

.subscription-hero h2 {
  font-size: 26px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  margin: 6px 0 !important;
}

.subscription-hero p {
  font-size: 14px !important;
  color: #cbd5e1 !important;
  margin: 0 !important;
}

.subscription-hero dl {
  display: flex !important;
  gap: 36px !important;
  margin: 0 !important;
}

.subscription-hero dt {
  font-size: 11.5px !important;
  font-weight: 700 !important;
  color: #94a3b8 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
}

.subscription-hero dd {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  margin: 4px 0 0 0 !important;
}

/* ==========================================================================
   DOCUMENT TYPES EDIT MODAL & UI ENHANCEMENTS
   ========================================================================== */

.type-modal-backdrop {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  z-index: 1050 !important;
  background-color: rgba(15, 23, 42, 0.65) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 20px !important;
  transition: opacity 0.2s ease, visibility 0.2s ease !important;
}

.type-modal-backdrop.d-none {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.type-modal-card {
  background: #ffffff !important;
  border-radius: 16px !important;
  box-shadow: 0 25px 60px -15px rgba(15, 23, 42, 0.35), 0 0 0 1px rgba(15, 23, 42, 0.08) !important;
  width: 100% !important;
  max-width: 680px !important;
  max-height: 92vh !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  animation: typeModalPop 0.24s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

@keyframes typeModalPop {
  from {
    opacity: 0;
    transform: scale(0.95) translateY(-8px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

.type-modal-header {
  padding: 18px 24px !important;
  border-bottom: 1px solid #e2e8f0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  background: #ffffff !important;
}

.type-modal-icon-badge {
  width: 44px !important;
  height: 44px !important;
  border-radius: 10px !important;
  background-color: #eff8f5 !important;
  border: 1px solid #cce5dd !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

.type-modal-title {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin: 0 0 4px 0 !important;
  line-height: 1.2 !important;
}

.type-modal-subtitle {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 13px !important;
}

.type-modal-close {
  background: #f1f5f9 !important;
  border: none !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 10px !important;
  color: #64748b !important;
  font-size: 22px !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

.type-modal-close:hover {
  background: #e2e8f0 !important;
  color: #0f172a !important;
  transform: scale(1.05) !important;
}

.type-modal-body {
  padding: 24px !important;
  overflow-y: auto !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

.type-form-section-title {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.8px !important;
  color: #167d68 !important;
  text-transform: uppercase !important;
  padding-bottom: 6px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  margin-bottom: 4px !important;
}

.type-form-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

.form-group {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

.form-group label {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #334155 !important;
  letter-spacing: 0.3px !important;
  margin-bottom: 2px !important;
}

.type-form-input {
  height: 44px !important;
  border-radius: 8px !important;
  border: 1px solid #cbd5e1 !important;
  padding: 0 14px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #0f172a !important;
  background-color: #ffffff !important;
  width: 100% !important;
  transition: border-color 0.15s, box-shadow 0.15s !important;
}

.type-form-input:focus {
  border-color: #167d68 !important;
  box-shadow: 0 0 0 3px rgba(22, 125, 104, 0.15) !important;
  outline: none !important;
}

.type-form-hint {
  font-size: 11.5px !important;
  color: #64748b !important;
  margin-top: 2px !important;
  line-height: 1.3 !important;
}

.type-switch-card {
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
  padding: 14px 16px !important;
  background-color: #f8fafc !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  transition: all 0.15s ease !important;
  user-select: none !important;
  margin: 0 !important;
}

.type-switch-card:hover {
  background-color: #ffffff !important;
  border-color: #cbd5e1 !important;
}

.type-switch-card.is-checked {
  border-color: #167d68 !important;
  background-color: #eff8f5 !important;
}

.type-switch-card input[type="checkbox"] {
  width: 18px !important;
  height: 18px !important;
  accent-color: #167d68 !important;
  margin-top: 2px !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
}

.type-switch-card strong {
  display: block !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin-bottom: 3px !important;
}

.type-switch-card p {
  font-size: 11.5px !important;
  color: #64748b !important;
  margin: 0 !important;
  line-height: 1.35 !important;
}

.type-modal-footer {
  padding: 16px 24px !important;
  border-top: 1px solid #e2e8f0 !important;
  background-color: #f8fafc !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
}

.btn-cancel-modal {
  padding: 9px 18px !important;
  border-radius: 8px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #475569 !important;
  background-color: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

.btn-cancel-modal:hover {
  background-color: #f1f5f9 !important;
  color: #1e293b !important;
  border-color: #94a3b8 !important;
}

.btn-save-modal {
  padding: 9px 20px !important;
  border-radius: 8px !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  background-color: #167d68 !important;
  border: 1px solid #167d68 !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  transition: all 0.15s ease !important;
  box-shadow: 0 2px 4px rgba(22, 125, 104, 0.2) !important;
}

.btn-save-modal:hover {
  background-color: #116252 !important;
  border-color: #116252 !important;
  box-shadow: 0 4px 10px rgba(22, 125, 104, 0.3) !important;
  transform: translateY(-1px) !important;
}

/* Edit action button in table */
.btn-edit-type {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 6px 14px !important;
  border-radius: 8px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: #167d68 !important;
  background-color: #eff8f5 !important;
  border: 1px solid #cce5dd !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
  text-decoration: none !important;
  line-height: 1 !important;
}

.btn-edit-type:hover {
  background-color: #167d68 !important;
  color: #ffffff !important;
  border-color: #167d68 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 8px -2px rgba(22, 125, 104, 0.25) !important;
}

.btn-edit-type:hover svg {
  stroke: #ffffff !important;
}

/* Badges for document types */
.badge-record {
  display: inline-flex !important;
  align-items: center !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  background-color: #fef3c7 !important;
  color: #92400e !important;
  border: 1px solid #fde68a !important;
}

.badge-doc {
  display: inline-flex !important;
  align-items: center !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  background-color: #e0f2fe !important;
  color: #0369a1 !important;
  border: 1px solid #bae6fd !important;
}

.badge-status-active {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 8px !important;
  border-radius: 6px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  background-color: #dcfce7 !important;
  color: #15803d !important;
  border: 1px solid #bbf7d0 !important;
  margin-top: 3px !important;
}

.badge-status-passive {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 8px !important;
  border-radius: 6px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  background-color: #fee2e2 !important;
  color: #b91c1c !important;
  border: 1px solid #fecaca !important;
  margin-top: 3px !important;
}

.count-pill {
  display: inline-block !important;
  padding: 4px 9px !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  background-color: #f1f5f9 !important;
  color: #334155 !important;
  border: 1px solid #e2e8f0 !important;
}

/* ==========================================================================
   APPROVALS PAGE & WORKSPACE TASK ROW TYPOGRAPHY (STANDARDIZATION)
   ========================================================================== */

/* Status Tabs */
.status-tabs {
  display: flex !important;
  gap: 8px !important;
  border-bottom: 2px solid #e2e8f0 !important;
  margin-bottom: 24px !important;
  padding-bottom: 0 !important;
  overflow-x: auto !important;
}

.status-tabs a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  padding: 12px 18px !important;
  color: #64748b !important;
  border-bottom: 2px solid transparent !important;
  margin-bottom: -2px !important;
  text-decoration: none !important;
  border-radius: 8px 8px 0 0 !important;
  transition: all 0.15s ease !important;
  white-space: nowrap !important;
}

.status-tabs a:hover {
  color: #0f172a !important;
  background-color: #f8fafc !important;
}

.status-tabs a.active {
  color: #167d68 !important;
  border-bottom-color: #167d68 !important;
  font-weight: 700 !important;
  background-color: transparent !important;
}

.tab-count-pill {
  font-size: 11.5px !important;
  font-weight: 700 !important;
  padding: 2px 8px !important;
  border-radius: 12px !important;
  background-color: #f1f5f9 !important;
  color: #475569 !important;
  border: 1px solid #e2e8f0 !important;
  line-height: 1.2 !important;
}

.status-tabs a.active .tab-count-pill {
  background-color: #e5f4ef !important;
  color: #167d68 !important;
  border-color: #cce5dd !important;
}

/* Approval Panel & Table */
.approval-panel {
  background-color: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  overflow: visible !important;
}

.approval-head {
  display: grid !important;
  grid-template-columns: minmax(280px, 2fr) minmax(180px, 1.2fr) 130px 140px minmax(190px, 1.2fr) !important;
  gap: 16px !important;
  align-items: center !important;
  padding: 14px 24px !important;
  background-color: #f8fafc !important;
  border-bottom: 1px solid #e2e8f0 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #475569 !important;
  letter-spacing: 0.6px !important;
  text-transform: uppercase !important;
}

.approval-row {
  display: grid !important;
  grid-template-columns: minmax(280px, 2fr) minmax(180px, 1.2fr) 130px 140px minmax(190px, 1.2fr) !important;
  gap: 16px !important;
  align-items: center !important;
  padding: 18px 24px !important;
  border-bottom: 1px solid #edf2f7 !important;
  font-size: 14px !important;
  transition: background-color 0.15s ease !important;
}

.approval-row:hover {
  background-color: #f8fafc !important;
}

.approval-doc-title {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  text-decoration: none !important;
  line-height: 1.35 !important;
  display: block !important;
  margin-bottom: 4px !important;
}

.approval-doc-title:hover {
  color: #167d68 !important;
}

.approval-doc-sub {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: #64748b !important;
  flex-wrap: wrap !important;
}

.approval-role-name {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  display: block !important;
  margin-bottom: 3px !important;
}

.approval-role-sub {
  font-size: 12.5px !important;
  color: #64748b !important;
  display: block !important;
}

/* State Dot / Badges */
.state-dot {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 12px !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

.state-dot.pending {
  background-color: #fef3c7 !important;
  color: #92400e !important;
  border: 1px solid #fde68a !important;
}

.state-dot.approved {
  background-color: #dcfce7 !important;
  color: #166534 !important;
  border: 1px solid #bbf7d0 !important;
}

.state-dot.rejected {
  background-color: #fee2e2 !important;
  color: #991b1b !important;
  border: 1px solid #fecaca !important;
}

.state-dot.cancelled {
  background-color: #f1f5f9 !important;
  color: #475569 !important;
  border: 1px solid #cbd5e1 !important;
}

/* Approval Actions & Buttons */
.approval-actions {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  justify-content: flex-end !important;
}

.btn-inspect {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #334155 !important;
  background-color: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  padding: 7px 14px !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
  line-height: 1 !important;
}

.btn-inspect:hover {
  background-color: #f1f5f9 !important;
  color: #0f172a !important;
  border-color: #94a3b8 !important;
  transform: translateY(-1px) !important;
}

.decision-dropdown {
  position: relative !important;
  display: inline-block !important;
}

.decision-dropdown > summary {
  list-style: none !important;
  cursor: pointer !important;
}

.decision-dropdown > summary::-webkit-details-marker {
  display: none !important;
}

.btn-decision {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 7px 14px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  background-color: #167d68 !important;
  color: #ffffff !important;
  border: 1px solid #167d68 !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
  line-height: 1 !important;
  box-shadow: 0 2px 4px rgba(22, 125, 104, 0.2) !important;
}

.btn-decision:hover {
  background-color: #116252 !important;
  border-color: #116252 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 8px rgba(22, 125, 104, 0.3) !important;
}

.decision-popover {
  position: absolute !important;
  right: 0 !important;
  top: calc(100% + 8px) !important;
  width: 360px !important;
  background: #ffffff !important;
  border-radius: 12px !important;
  box-shadow: 0 20px 25px -5px rgba(15, 23, 42, 0.2), 0 0 0 1px rgba(15, 23, 42, 0.08) !important;
  padding: 18px !important;
  z-index: 100 !important;
  animation: popoverFadeIn 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

@keyframes popoverFadeIn {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.decision-popover-header {
  margin-bottom: 12px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  padding-bottom: 10px !important;
}

.decision-popover-header strong {
  display: block !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
}

.decision-popover-header p {
  font-size: 12px !important;
  color: #64748b !important;
  margin: 3px 0 0 0 !important;
  line-height: 1.4 !important;
}

/* Workspace Task Row Modernization */
.task-row {
  display: grid !important;
  grid-template-columns: 38px minmax(160px, 1fr) auto !important;
  gap: 12px !important;
  align-items: center !important;
  padding: 14px 18px !important;
  border-bottom: 1px solid #edf2f7 !important;
  font-size: 14px !important;
  text-decoration: none !important;
  transition: background-color 0.15s ease !important;
}

.task-row:hover {
  background-color: #f8fafc !important;
}

.task-row > span:nth-child(2) strong {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  display: block !important;
}

.task-row > span:nth-child(2) small {
  font-size: 12px !important;
  color: #64748b !important;
  display: block !important;
  margin-top: 3px !important;
}

.task-row > b {
  font-size: 11.5px !important;
  font-weight: 700 !important;
  color: #334155 !important;
  background-color: #f1f5f9 !important;
  border-radius: 6px !important;
  padding: 5px 10px !important;
}

.task-icon {
  width: 32px !important;
  height: 32px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  display: grid !important;
  place-items: center !important;
}

/* ==========================================================================
   QUALITERA DYS - ENTERPRISE MODERN INPUTS & AUTH/LOGIN SCREEN STYLING SYSTEM
   ========================================================================== */

/* 1. Guest & Auth Layout Architecture */
.guest-body {
  min-height: 100vh !important;
  background: radial-gradient(circle at 85% 15%, #193854 0%, #0d2238 55%, #081625 100%) !important;
  color: #ffffff !important;
  padding: 30px 40px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}

.guest-brand {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 20px !important;
}

.guest-brand .brand-mark {
  width: 42px !important;
  height: 42px !important;
  border-radius: 12px !important;
  display: grid !important;
  place-items: center !important;
  background: linear-gradient(135deg, #167d68 0%, #20a388 100%) !important;
  color: #ffffff !important;
  font-size: 26px !important;
  font-weight: 800 !important;
  box-shadow: 0 4px 14px rgba(22, 125, 104, 0.4) !important;
}

.guest-brand strong {
  font-size: 20px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  letter-spacing: -0.3px !important;
  display: block !important;
  line-height: 1.2 !important;
}

.guest-brand small {
  font-size: 11px !important;
  font-weight: 500 !important;
  color: #94a3b8 !important;
  letter-spacing: 0.5px !important;
  display: block !important;
  margin-top: 2px !important;
}

.auth-shell {
  min-height: calc(100vh - 120px) !important;
  display: grid !important;
  grid-template-columns: 1fr 480px !important;
  align-items: center !important;
  gap: 80px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  width: 100% !important;
}

.auth-copy {
  max-width: 580px !important;
}

.auth-badge {
  display: inline-flex !important;
  align-items: center !important;
  border: 1px solid rgba(101, 211, 183, 0.3) !important;
  background: rgba(255, 255, 255, 0.06) !important;
  color: #55cdb0 !important;
  border-radius: 30px !important;
  padding: 8px 14px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  backdrop-filter: blur(4px) !important;
}

.auth-copy h1 {
  font-size: 44px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  margin: 24px 0 16px !important;
  color: #ffffff !important;
  letter-spacing: -0.5px !important;
}

.auth-copy h1 em {
  font-style: normal !important;
  color: #4dd1b1 !important;
  font-weight: 400 !important;
}

.auth-copy > p {
  color: #cbd5e1 !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
  max-width: 520px !important;
  margin-bottom: 24px !important;
}

.auth-copy ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 24px 0 0 !important;
}

.auth-copy li {
  font-size: 14px !important;
  color: #e2e8f0 !important;
  margin: 14px 0 !important;
  display: flex !important;
  align-items: center !important;
}

.auth-copy li:before {
  content: '✓' !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 24px !important;
  height: 24px !important;
  border-radius: 50% !important;
  background: #1c745f !important;
  color: #75dfc5 !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  margin-right: 14px !important;
  flex-shrink: 0 !important;
}

/* 2. Login & Auth Card */
.auth-card {
  background: #ffffff !important;
  color: #1e293b !important;
  border-radius: 20px !important;
  padding: 42px 40px !important;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(255, 255, 255, 0.12) !important;
  width: 100% !important;
  max-width: 480px !important;
  margin: 0 auto !important;
  position: relative !important;
}

.auth-card h2,
.auth-title {
  font-size: 26px !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  margin: 0 0 8px 0 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.3px !important;
}

.auth-badge-pill {
  display: inline-flex !important;
  align-items: center !important;
  padding: 5px 12px !important;
  background: #ecfdf5 !important;
  color: #047857 !important;
  border: 1px solid #a7f3d0 !important;
  border-radius: 30px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.8px !important;
  margin-bottom: 14px !important;
}

.form-lead {
  font-size: 14px !important;
  color: #64748b !important;
  margin: 0 0 24px 0 !important;
  line-height: 1.5 !important;
}

/* 3. Auth Form Inputs & Elements */
.auth-form {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
}

.form-field-group {
  margin-bottom: 20px !important;
  text-align: left !important;
}

.field-label {
  display: block !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #334155 !important;
  margin-bottom: 7px !important;
  letter-spacing: 0.1px !important;
}

.field-label-row {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  margin-bottom: 7px !important;
}

.forgot-link {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #167d68 !important;
  text-decoration: none !important;
  transition: color 0.15s ease !important;
}

.forgot-link:hover {
  color: #116b59 !important;
  text-decoration: underline !important;
}

.input-wrapper {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
}

.field-icon-left {
  position: absolute !important;
  left: 15px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: #94a3b8 !important;
  pointer-events: none !important;
  display: flex !important;
  align-items: center !important;
  z-index: 2 !important;
}

.field-btn-right {
  position: absolute !important;
  right: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  background: transparent !important;
  border: none !important;
  color: #94a3b8 !important;
  cursor: pointer !important;
  padding: 6px !important;
  border-radius: 6px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 3 !important;
  transition: color 0.15s ease, background-color 0.15s ease !important;
}

.field-btn-right:hover {
  color: #334155 !important;
  background-color: #f1f5f9 !important;
}

.field-input,
.auth-form input:not([type=checkbox]):not([type=submit]):not([type=button]) {
  width: 100% !important;
  height: 48px !important;
  min-height: 48px !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  color: #0f172a !important;
  background-color: #ffffff !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 10px !important;
  padding: 12px 16px !important;
  outline: none !important;
  box-sizing: border-box !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
}

/* Explicit password padding to avoid overlapping the eye toggle */
.auth-form input[type=password],
.auth-form input#password,
.auth-form .with-password-toggle {
  padding-left: 16px !important;
  padding-right: 48px !important;
}

.field-input.with-left-icon {
  padding-left: 46px !important;
}

.field-input.with-right-btn {
  padding-right: 46px !important;
}

.field-input:focus,
.auth-form input:focus {
  border-color: #167d68 !important;
  background-color: #ffffff !important;
  box-shadow: 0 0 0 4px rgba(22, 125, 104, 0.16) !important;
}

.field-input:hover:not(:focus),
.auth-form input:hover:not(:focus) {
  border-color: #94a3b8 !important;
}

.field-input::placeholder,
.auth-form input::placeholder {
  color: #94a3b8 !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
}

/* Auth Labels */
.auth-form label:not(.custom-check-container) {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  color: #334155 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  margin-bottom: 16px !important;
}

.auth-form .two-fields {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 14px !important;
  margin-bottom: 0 !important;
}

/* Options / Remember Me Row */
.form-options-row {
  display: flex !important;
  align-items: center !important;
  margin-bottom: 24px !important;
  margin-top: 4px !important;
}

.auth-form label.custom-check-container,
.custom-check-container {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 10px !important;
  cursor: pointer !important;
  user-select: none !important;
  margin: 0 !important;
}

.custom-check-container input[type=checkbox] {
  width: 19px !important;
  height: 19px !important;
  accent-color: #167d68 !important;
  cursor: pointer !important;
  border-radius: 5px !important;
  margin: 0 !important;
}

.custom-check-text {
  font-size: 13.5px !important;
  color: #475569 !important;
  font-weight: 500 !important;
}

/* Submit Button */
.auth-submit-button,
.auth-form .primary-button {
  width: 100% !important;
  height: 48px !important;
  background: linear-gradient(135deg, #167d68 0%, #116050 100%) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 10px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  cursor: pointer !important;
  box-shadow: 0 4px 14px rgba(22, 125, 104, 0.35) !important;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
  margin-top: 6px !important;
}

.auth-submit-button:hover,
.auth-form .primary-button:hover {
  background: linear-gradient(135deg, #136f5c 0%, #0c4d40 100%) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 18px rgba(22, 125, 104, 0.45) !important;
}

.auth-submit-button:active,
.auth-form .primary-button:active {
  transform: translateY(0) !important;
  box-shadow: 0 2px 8px rgba(22, 125, 104, 0.3) !important;
}

/* Auth Alerts & Error Banners */
.auth-alert-error,
.inline-error {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  background-color: #fef2f2 !important;
  border: 1.5px solid #fecaca !important;
  color: #b91c1c !important;
  padding: 13px 16px !important;
  border-radius: 10px !important;
  margin-bottom: 22px !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
}

.alert-icon {
  color: #ef4444 !important;
  flex-shrink: 0 !important;
}

/* Auth Footer */
.auth-foot {
  margin-top: 26px !important;
  padding-top: 22px !important;
  border-top: 1px solid #f1f5f9 !important;
  text-align: center !important;
  font-size: 13.5px !important;
  color: #64748b !important;
}

.auth-foot a {
  color: #167d68 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  margin-left: 4px !important;
  transition: color 0.15s ease !important;
}

.auth-foot a:hover {
  color: #116b59 !important;
  text-decoration: underline !important;
}

/* ==========================================================================
   4. INNER PAGES - FORM GRIDS, INPUTS, SELECTS & TEXTAREAS (ENTERPRISE GRADE)
   ========================================================================== */

/* Panels & Form Panels */
.panel,
.form-panel {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 14px !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04), 0 6px 16px rgba(15, 23, 42, 0.02) !important;
  margin-bottom: 24px !important;
  overflow: hidden !important;
}

.panel-head {
  padding: 20px 24px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  background: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.panel-head h2 {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin: 0 !important;
  letter-spacing: -0.2px !important;
}

.panel-head p {
  font-size: 13px !important;
  color: #64748b !important;
  margin: 4px 0 0 0 !important;
  font-weight: 400 !important;
}

.section-number {
  width: 32px !important;
  height: 32px !important;
  border-radius: 8px !important;
  background: #ecfdf5 !important;
  color: #047857 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  border: 1px solid #a7f3d0 !important;
}

.edit-context {
  display: flex !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  padding: 14px 24px !important;
  background: #f8fafc !important;
  border-bottom: 1px solid #e2e8f0 !important;
}

.edit-context span {
  display: inline-flex !important;
  align-items: center !important;
  padding: 6px 12px !important;
  border-radius: 6px !important;
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  color: #334155 !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
}

.version-warning {
  margin: 0 24px 24px !important;
  padding: 14px 18px !important;
  border: 1.5px solid #fde68a !important;
  border-radius: 10px !important;
  background: #fffbeb !important;
  color: #92400e !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
}

/* Form Grid System: 2 Equal Columns, Strictly Aligned Baseline */
.form-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 22px 24px !important;
  align-items: start !important;
  padding: 24px !important;
}

.form-grid .wide {
  grid-column: 1 / -1 !important;
}

/* Form Group Container (for clean block alignment) */
.form-grid .form-group {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  margin: 0 !important;
  width: 100% !important;
}

/* Labels: display block so text and <em>*</em> stay on the exact same header line */
.form-grid label,
.form-grid .form-label {
  display: block !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: #334155 !important;
  letter-spacing: 0.3px !important;
  text-transform: uppercase !important;
  margin-bottom: 7px !important;
  line-height: 1.4 !important;
}

.form-grid label em,
.form-grid .form-label em {
  color: #ef4444 !important;
  font-style: normal !important;
  font-weight: 800 !important;
  margin-left: 3px !important;
  display: inline !important;
}

/* Helper / Hint Texts */
.form-grid label small,
.form-grid .form-hint {
  display: block !important;
  font-size: 12px !important;
  color: #64748b !important;
  font-weight: 400 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  margin-top: 6px !important;
  line-height: 1.45 !important;
}

/* Inner Inputs, Selects & Date pickers: uniform 44px height and consistent baseline */
.form-grid input:not([type=checkbox]):not([type=radio]):not([type=file]),
.form-grid select,
.detail-grid input,
.detail-grid select,
.row-action input,
.row-action select,
.card-action input,
.card-action select,
.measure-action input,
.measure-action select,
.progress-action input,
.progress-action select,
.attachment-row input,
.attachment-row select {
  display: block !important;
  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  font-family: inherit !important;
  color: #0f172a !important;
  background-color: #ffffff !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 8px !important;
  padding: 0 14px !important;
  outline: none !important;
  box-sizing: border-box !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
}

/* Date Pickers */
.form-grid input[type=date],
.detail-grid input[type=date] {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 14px !important;
  line-height: 42px !important;
}

/* File Inputs */
.form-grid input[type=file] {
  display: block !important;
  width: 100% !important;
  font-size: 13.5px !important;
  color: #334155 !important;
  background-color: #f8fafc !important;
  border: 1.5px dashed #cbd5e1 !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
}

/* Modern Select Dropdown Arrow */
.form-grid select:not([multiple]),
.table-tools select,
.row-action select,
.card-action select {
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%2364748b'%3e%3cpath fill-rule='evenodd' d='M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z' clip-rule='evenodd'/%3e%3c/svg%3e") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 16px 16px !important;
  padding-right: 40px !important;
  cursor: pointer !important;
}

/* Input Focus States */
.form-grid input:focus,
.form-grid select:focus,
.form-grid textarea:focus,
.detail-grid input:focus,
.detail-grid select:focus,
.detail-grid textarea:focus,
.row-action input:focus,
.row-action select:focus,
.row-action textarea:focus,
.card-action input:focus,
.card-action select:focus,
.card-action textarea:focus,
.measure-action input:focus,
.measure-action textarea:focus,
.progress-action input:focus,
.progress-action select:focus,
.table-search:focus-within,
.global-search:focus-within {
  border-color: #167d68 !important;
  background-color: #ffffff !important;
  box-shadow: 0 0 0 3.5px rgba(22, 125, 104, 0.15) !important;
  outline: none !important;
}

/* Input Hover States */
.form-grid input:hover:not(:focus),
.form-grid select:hover:not(:focus),
.form-grid textarea:hover:not(:focus) {
  border-color: #94a3b8 !important;
}

/* Multi-selects */
.form-grid select[multiple] {
  height: auto !important;
  min-height: 120px !important;
  max-height: none !important;
  padding: 8px !important;
  line-height: 1.5 !important;
}

.form-grid select[multiple] option {
  padding: 8px 12px !important;
  border-radius: 6px !important;
  font-size: 13.5px !important;
  margin-bottom: 2px !important;
}

.form-grid select[multiple] option:checked {
  background-color: #167d68 !important;
  color: #ffffff !important;
}

/* Textareas */
.form-grid textarea {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100px !important;
  max-height: none !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  font-family: inherit !important;
  color: #0f172a !important;
  background-color: #ffffff !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  line-height: 1.55 !important;
  outline: none !important;
  box-sizing: border-box !important;
  resize: vertical !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
}

/* Date & Time Picker styling */
.form-grid input[type=date],
.form-grid input[type=datetime-local],
.form-grid input[type=time] {
  font-family: inherit !important;
  font-size: 13.5px !important;
  color: #0f172a !important;
  cursor: pointer !important;
}

/* File Upload styling */
.form-grid input[type=file] {
  padding: 10px 14px !important;
  background-color: #f8fafc !important;
  border: 1.5px dashed #cbd5e1 !important;
  cursor: pointer !important;
  border-radius: 8px !important;
  font-size: 13px !important;
}

.form-grid input[type=file]:hover {
  border-color: #167d68 !important;
  background-color: #f0fdf4 !important;
}

/* Modern Check Card */
.form-grid .check-card {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 14px !important;
  border: 1.5px solid #cbd5e1 !important;
  background-color: #f8fafc !important;
  border-radius: 10px !important;
  padding: 14px 18px !important;
  cursor: pointer !important;
  transition: all 0.18s ease !important;
}

.form-grid .check-card:hover {
  border-color: #167d68 !important;
  background-color: #f0fdf4 !important;
}

.check-card input[type=checkbox] {
  width: 20px !important;
  height: 20px !important;
  accent-color: #167d68 !important;
  cursor: pointer !important;
  border-radius: 5px !important;
  flex-shrink: 0 !important;
}

.check-card span strong {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  display: block !important;
}

.check-card span small {
  font-size: 12px !important;
  color: #64748b !important;
  display: block !important;
  margin-top: 3px !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

/* Subsection Form Layout */
.subsection {
  border-top: 1px solid #e2e8f0 !important;
  padding: 22px 24px 0 !important;
  background-color: #fafbfc !important;
}

.subsection > div:first-child strong {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
}

.subsection > div:first-child p {
  font-size: 13px !important;
  color: #64748b !important;
  margin: 4px 0 0 !important;
}

/* Form Actions Button Bar */
.form-actions {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 14px !important;
  margin-top: 24px !important;
}

.form-actions .primary-button {
  height: 44px !important;
  padding: 0 24px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  border-radius: 8px !important;
}

.form-actions > a {
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #64748b !important;
  padding: 8px 14px !important;
  border-radius: 6px !important;
  transition: all 0.15s ease !important;
}

.form-actions > a:hover {
  color: #0f172a !important;
  background-color: #f1f5f9 !important;
}

/* ==========================================================================
   5. TABLE FILTERS & SEARCH INPUTS (ENTERPRISE GRADE)
   ========================================================================== */

.table-tools {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 16px 20px !important;
  background-color: #ffffff !important;
  border-bottom: 1px solid #e2e8f0 !important;
  flex-wrap: wrap !important;
}

.table-search {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  height: 44px !important;
  min-width: 300px !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 8px !important;
  background-color: #ffffff !important;
  padding: 0 14px !important;
  color: #64748b !important;
  font-size: 15px !important;
  transition: all 0.18s ease !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
}

.table-search input {
  border: none !important;
  outline: none !important;
  background: transparent !important;
  font-size: 14px !important;
  color: #0f172a !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
}

.table-search input::placeholder {
  color: #94a3b8 !important;
  font-size: 13.5px !important;
}

.table-tools select {
  height: 44px !important;
  min-width: 150px !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: #334155 !important;
  background-color: #ffffff !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 8px !important;
  padding: 0 38px 0 14px !important;
  cursor: pointer !important;
}

.table-tools button {
  height: 44px !important;
  padding: 0 22px !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  background-color: #167d68 !important;
  border: none !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  box-shadow: 0 2px 6px rgba(22, 125, 104, 0.25) !important;
  transition: all 0.18s ease !important;
}

.table-tools button:hover {
  background-color: #116b59 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(22, 125, 104, 0.35) !important;
}

.table-tools > a {
  font-size: 13.5px !important;
  color: #64748b !important;
  font-weight: 600 !important;
  margin-left: 6px !important;
}

.table-tools > a:hover {
  color: #0f172a !important;
  text-decoration: underline !important;
}

/* ==========================================================================
   6. TOPBAR GLOBAL SEARCH INPUT
   ========================================================================== */

.global-search {
  height: 44px !important;
  max-width: 520px !important;
  flex: 1 !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 10px !important;
  background-color: #f8fafc !important;
  padding: 0 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  color: #64748b !important;
  transition: all 0.18s ease !important;
}

.global-search input {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  flex: 1 !important;
  font-size: 14px !important;
  color: #0f172a !important;
  height: 100% !important;
}

.global-search input::placeholder {
  color: #94a3b8 !important;
}

.global-search kbd {
  font-size: 11px !important;
  font-weight: 600 !important;
  background: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 5px !important;
  padding: 3px 7px !important;
  color: #64748b !important;
}

/* ==========================================================================
   7. ROW / CARD POPOVER INLINE ACTION FORMS
   ========================================================================== */

.row-action form,
.card-action form,
.measure-action form,
.progress-action form {
  padding: 18px !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 10px !important;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.2) !important;
  background: #ffffff !important;
}

.row-action form input,
.row-action form select,
.row-action form textarea,
.card-action form select,
.card-action form textarea,
.measure-action form input,
.measure-action form textarea,
.progress-action form input,
.progress-action form select {
  font-size: 13.5px !important;
  padding: 8px 12px !important;
  min-height: 40px !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 7px !important;
}

.row-action form button,
.card-action form button,
.measure-action form button,
.progress-action form button {
  min-height: 38px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  padding: 8px 16px !important;
  border-radius: 7px !important;
  background-color: #167d68 !important;
  color: #ffffff !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

.row-action form button:hover,
.card-action form button:hover,
.measure-action form button:hover,
.progress-action form button:hover {
  background-color: #116b59 !important;
}

/* Responsive adjustments */
@media (max-width: 991px) {
  .auth-shell {
    grid-template-columns: 1fr !important;
    gap: 40px !important;
    padding: 20px 0 !important;
  }
  
  .auth-copy {
    display: none !important;
  }
  
  .auth-card {
    padding: 32px 24px !important;
  }
  
  .table-search {
    min-width: 100% !important;
  }
}

/* ==========================================================================
   8. BOOTSTRAP & METRONIC SOLID FORM CONTROLS ENHANCEMENT
   ========================================================================== */

.form-control,
.form-control-solid {
  background-color: #f8fafc !important;
  border: 1.5px solid #cbd5e1 !important;
  color: #0f172a !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  min-height: 44px !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02) !important;
}

.form-control:focus,
.form-control-solid:focus {
  background-color: #ffffff !important;
  border-color: #167d68 !important;
  box-shadow: 0 0 0 3.5px rgba(22, 125, 104, 0.15) !important;
  color: #0f172a !important;
  outline: none !important;
}

.form-control:hover:not(:focus),
.form-control-solid:hover:not(:focus) {
  border-color: #94a3b8 !important;
  background-color: #ffffff !important;
}

.form-control::placeholder,
.form-control-solid::placeholder {
  color: #94a3b8 !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
}

.form-select,
.form-select-solid {
  background-color: #f8fafc !important;
  border: 1.5px solid #cbd5e1 !important;
  color: #0f172a !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  border-radius: 8px !important;
  padding: 10px 38px 10px 14px !important;
  min-height: 44px !important;
  transition: all 0.2s ease !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%2364748b'%3e%3cpath fill-rule='evenodd' d='M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z' clip-rule='evenodd'/%3e%3c/svg%3e") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 16px 16px !important;
  cursor: pointer !important;
}

.form-select:focus,
.form-select-solid:focus {
  background-color: #ffffff !important;
  border-color: #167d68 !important;
  box-shadow: 0 0 0 3.5px rgba(22, 125, 104, 0.15) !important;
  color: #0f172a !important;
  outline: none !important;
}

.form-select:hover:not(:focus),
.form-select-solid:hover:not(:focus) {
  border-color: #94a3b8 !important;
  background-color: #ffffff !important;
}

.form-label {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #334155 !important;
  margin-bottom: 7px !important;
  display: inline-block !important;
}

.form-label.required:after {
  content: " *" !important;
  color: #ef4444 !important;
  font-weight: 800 !important;
}

.form-check-input {
  width: 1.25rem !important;
  height: 1.25rem !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 4px !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

.form-check-input:checked {
  background-color: #167d68 !important;
  border-color: #167d68 !important;
}

.form-check-input:focus {
  border-color: #167d68 !important;
  box-shadow: 0 0 0 3px rgba(22, 125, 104, 0.2) !important;
}

/* ==========================================================================
   5. DASHBOARD & QUICK ACCESS (HIZLI ERİŞİM) ENHANCED TYPOGRAPHY & CARDS
   ========================================================================== */

/* Dashboard Shortcuts (Hızlı Erişim) Grid */
.dashboard-shortcuts > div {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
  padding: 22px !important;
}

/* Shortcut Link Card */
.dashboard-shortcuts > div > a {
  display: grid !important;
  grid-template-columns: 46px 1fr !important;
  column-gap: 15px !important;
  row-gap: 3px !important;
  align-items: center !important;
  padding: 15px 18px !important;
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 12px !important;
  background-color: #ffffff !important;
  text-decoration: none !important;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1) !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04) !important;
}

.dashboard-shortcuts > div > a:hover {
  border-color: #167d68 !important;
  background-color: #f0fdf4 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 22px rgba(22, 125, 104, 0.14) !important;
}

/* Shortcut Icon Badge */
.dashboard-shortcuts > div > a > span {
  grid-row: 1 / 3 !important;
  grid-column: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 46px !important;
  height: 46px !important;
  border-radius: 11px !important;
  background: #ecfdf5 !important;
  color: #047857 !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  border: 1.5px solid #a7f3d0 !important;
  transition: all 0.2s ease !important;
  flex-shrink: 0 !important;
}

.dashboard-shortcuts > div > a:hover > span {
  background: #167d68 !important;
  color: #ffffff !important;
  border-color: #167d68 !important;
  transform: scale(1.05) !important;
  box-shadow: 0 4px 12px rgba(22, 125, 104, 0.25) !important;
}

/* Shortcut Title (Prominent, High-Contrast Typography) */
.dashboard-shortcuts strong {
  grid-column: 2 !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  line-height: 1.35 !important;
  display: block !important;
  letter-spacing: -0.1px !important;
  transition: color 0.15s ease !important;
}

.dashboard-shortcuts > div > a:hover strong {
  color: #047857 !important;
}

/* Shortcut Subtitle / Description */
.dashboard-shortcuts small {
  grid-column: 2 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #64748b !important;
  line-height: 1.4 !important;
  display: block !important;
  margin-top: 2px !important;
}

/* Quick Grid fallback for other dashboards/views */
.quick-grid {
  gap: 14px !important;
  padding: 16px !important;
}

.quick-grid a {
  padding: 16px 18px !important;
  border-radius: 12px !important;
  border: 1.5px solid #e2e8f0 !important;
  background: #ffffff !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04) !important;
}

.quick-grid a:hover {
  border-color: #167d68 !important;
  background: #f0fdf4 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px rgba(22, 125, 104, 0.12) !important;
}

.quick-grid a strong {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  margin-top: 6px !important;
}

.quick-grid a small {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #64748b !important;
  margin-top: 3px !important;
}

/* Dashboard Actions & Attention List font legibility enhancements */
.dashboard-action-row {
  padding: 15px 20px !important;
}

.dashboard-action-row strong {
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
}

.dashboard-action-row small {
  font-size: 12.5px !important;
  color: #64748b !important;
  margin-top: 3px !important;
}

.dashboard-action-row time {
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #475569 !important;
}

.dashboard-action-row time small {
  font-size: 12px !important;
  margin-top: 3px !important;
}

.attention-list a {
  padding: 15px 20px !important;
}

.attention-list strong {
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
}

.attention-list small {
  font-size: 12.5px !important;
  color: #64748b !important;
  margin-top: 3px !important;
}

.attention-list a b {
  font-size: 14px !important;
  font-weight: 700 !important;
  min-width: 32px !important;
  height: 32px !important;
}

@media (max-width: 768px) {
  .dashboard-shortcuts > div {
    grid-template-columns: 1fr !important;
  }
}

/* ==========================================================================
   OFFICE DOCUMENT PREVIEW - PIXEL-PERFECT WORD & EXCEL TABLE RENDERING
   ========================================================================== */
.office-preview-canvas {
  padding: 24px !important;
  background: #eef2f5 !important;
  min-height: 620px !important;
  overflow-x: auto !important;
}

.office-word-preview {
  width: min(100%, 860px) !important;
  min-height: 1050px !important;
  margin: 0 auto !important;
  padding: 50px 60px !important;
  background: #ffffff !important;
  box-shadow: 0 8px 30px rgba(15, 23, 42, 0.12) !important;
  border-radius: 4px !important;
  color: #1e293b !important;
  font-size: 11.5px !important;
  line-height: 1.65 !important;
}

.office-word-preview h1 { font-size: 24px !important; font-weight: 700 !important; margin: 0 0 16px !important; }
.office-word-preview h2 { font-size: 19px !important; font-weight: 700 !important; margin: 20px 0 10px !important; }
.office-word-preview h3 { font-size: 15px !important; font-weight: 700 !important; margin: 16px 0 8px !important; }
.office-word-preview p { margin: 0 0 6px !important; }
.office-word-preview .office-empty-line { margin: 0 !important; min-height: 10px !important; }

.office-table-wrap {
  max-width: 100% !important;
  overflow-x: auto !important;
  margin: 14px 0 !important;
}

.office-rendered-table,
.office-table-wrap table {
  width: 100% !important;
  table-layout: fixed !important;
  border-collapse: collapse !important;
  word-break: break-word !important;
  background-color: #ffffff !important;
}

.office-rendered-table th,
.office-rendered-table td,
.office-table-wrap th,
.office-table-wrap td {
  border: 1px solid #cbd5e1 !important;
  padding: 6px 8px !important;
  text-align: left !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
  vertical-align: top !important;
  box-sizing: border-box !important;
}

.office-rendered-table th,
.office-table-wrap th {
  background-color: #f1f5f9 !important;
  font-weight: 700 !important;
  color: #0f172a !important;
}

/* ==========================================================================
   TOPBAR CALENDAR & FULL CALENDAR INTERACTIVE STYLES
   ========================================================================== */
.calendar-menu summary::-webkit-details-marker {
  display: none !important;
}

.calendar-menu summary {
  list-style: none !important;
}

.calendar-wrapper {
  background: #ffffff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.calendar-weekdays {
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  background: #e2e8f0;
  gap: 1px;
}

.calendar-day-cell {
  background: #ffffff;
  min-height: 135px;
  max-height: 200px;
  padding: 8px 10px;
  display: flex;
  flex-direction: column;
  transition: background-color 0.15s ease-in-out;
  position: relative;
}

.calendar-day-cell:hover {
  background-color: #f8fafc !important;
}

.calendar-day-cell.outside-month {
  background-color: #fafbfc !important;
  color: #94a3b8;
}

.calendar-day-cell.is-today {
  background-color: #f0fdf4 !important;
  border: 2px solid #22c55e !important;
}

.calendar-day-events {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex-grow: 1;
  overflow-y: auto;
  max-height: 110px;
  padding-right: 2px;
}

.calendar-day-events::-webkit-scrollbar {
  width: 4px;
}

.calendar-day-events::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}

.calendar-event-pill {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  padding: 3px 6px;
  border-radius: 6px;
  font-size: 11px;
  line-height: 1.3;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border: 1px solid transparent;
  transition: all 0.15s ease-in-out;
}

.calendar-event-pill:hover {
  transform: translateY(-1px);
  filter: brightness(0.95);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.08) !important;
}

dialog::backdrop {
  background: rgba(15, 23, 42, 0.6);
  backdrop-filter: blur(3px);
}

.calendar-modal-dialog {
  border: 0;
  border-radius: 16px;
  padding: 0;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  max-width: 95vw;
  background: #ffffff;
}