/* ENVIA LMS V9.4.6 | Responsive Auto-Fit Patch
   Amaç: Tüm sayfaların görüntülenen cihaz ekranına göre otomatik şekil alması,
   mobilde sağa/sola kaydırma ihtiyacının ortadan kaldırılması. */

html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}
@supports not (overflow-x: clip) {
  html,
  body { overflow-x: hidden; }
}
*,
*::before,
*::after { box-sizing: border-box; }

img,
svg,
canvas,
video,
iframe,
embed,
object {
  max-width: 100%;
}
img,
video { height: auto; }

main,
section,
article,
header,
footer,
.container,
.section,
.card,
.app-shell,
.app-layout,
.main,
.app-main,
.app-content {
  min-width: 0;
  max-width: 100%;
}

[style*="min-width"],
[style*="width"] { max-width: 100%; }

/* Tablet: geniş düzenler iki kolona düşer, içerik taşması engellenir. */
@media (max-width: 1180px) {
  .app-shell,
  .app-layout,
  body:not([data-page="landing"]) .app-shell {
    grid-template-columns: 260px minmax(0, 1fr) !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .v4-kpi-grid,
  .v4-kpi-grid.five,
  .sales-kpi-grid,
  .sales-kpi-grid.compact,
  .sales-kpi-grid.four,
  .crm-summary-grid,
  .employee-kpi-grid,
  .cert-kpi-grid,
  .learning-stat-grid,
  .contract-template-dashboard,
  .landing-management-grid,
  .course-grid,
  .certificate-grid,
  .exam-list-grid,
  .employee-course-grid,
  .employee-exam-grid,
  .employee-certificate-grid,
  .designer-quick-grid,
  .game-admin-grid,
  .game-list-grid,
  .game-badge-grid,
  .sgk-parts-grid,
  .interactive-report-grid,
  .sales-dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .learning-shell-v4,
  .contract-editor-shell-pro,
  .landing-section-layout,
  .mail-template-studio,
  .designer-split-view,
  .crm-detail-grid,
  .sales-detail-grid,
  .management-grid,
  .v4-split,
  .v4-split-40,
  .v4-split-60,
  .dashboard-grid,
  .settings-grid,
  .profile-grid,
  .kvkk-grid,
  .legal-grid,
  .signature-grid,
  .auth-stage,
  .hero-grid,
  .landing-hero-grid,
  .blog-grid,
  .feature-grid,
  .role-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Mobil otomatik şekillenme: yatay kaydırma yerine kart, tek kolon ve sarma. */
@media (max-width: 900px) {
  html,
  body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    min-width: 0 !important;
  }

  body {
    position: relative;
    background: var(--lumina-background, #f8f9ff) !important;
  }

  .app-shell,
  .app-layout,
  body:not([data-page="landing"]) .app-shell {
    display: block !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
  }

  .sidebar,
  body:not([data-page="landing"]) .app-shell::before {
    display: none !important;
  }

  .main,
  .app-main,
  .app-content {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    overflow-x: hidden !important;
    padding-bottom: calc(96px + env(safe-area-inset-bottom)) !important;
    background: var(--lumina-background, #f8f9ff) !important;
  }

  .main > .topbar,
  .app-topbar,
  .topbar {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 110 !important;
  }

  .main > :not(.topbar),
  .app-content,
  .container,
  .section > .container,
  main > .container {
    width: 100% !important;
    max-width: min(100%, 448px) !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: clamp(12px, 4vw, 16px) !important;
    padding-right: clamp(12px, 4vw, 16px) !important;
  }

  body[data-page="landing"] main,
  body[data-page="blog"] main,
  body[data-page="blog-detail"] main,
  body[data-page="about"] main,
  body[data-page="verify"] main,
  body[data-page="login"] main,
  body[data-page="reset-password"] main {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  .container {
    width: 100% !important;
    max-width: 100% !important;
  }

  .section { padding: 18px 0 !important; }

  /* Tüm geniş gridleri tek kolona indir. */
  .grid,
  .grid-2,
  .grid-3,
  .grid-4,
  .grid-5,
  .grid-6,
  .v4-kpi-grid,
  .v4-kpi-grid.five,
  .v4-dashboard-grid,
  .sales-kpi-grid,
  .sales-kpi-grid.compact,
  .sales-kpi-grid.four,
  .crm-summary-grid,
  .employee-kpi-grid,
  .cert-kpi-grid,
  .learning-stat-grid,
  .contract-template-dashboard,
  .course-grid,
  .certificate-grid,
  .exam-list-grid,
  .employee-course-grid,
  .employee-exam-grid,
  .employee-certificate-grid,
  .learning-course-grid,
  .designer-quick-grid,
  .designer-exam-grid,
  .designer-form-grid,
  .designer-preview-grid,
  .designer-bulk-grid,
  .company-select-grid,
  .landing-management-grid,
  .landing-editor-form-grid,
  .landing-editor-form-grid.two,
  .interactive-report-grid,
  .sales-dashboard-grid,
  .nace-stat-grid,
  .kpi-grid,
  .stats-grid,
  .metric-grid,
  .game-admin-grid,
  .game-list-grid,
  .game-form-grid,
  .game-badge-grid,
  .sgk-parts-grid,
  .mail-editor-grid,
  .backup-action-grid,
  .quick-action-grid,
  .kvkk-security-grid,
  .kvkk-mini-stats,
  .filter-row,
  .v4-filter-grid,
  .employee-filter-row,
  .exam-card-actions,
  .module-form-grid,
  .contract-general-grid,
  .contract-tool-grid,
  .cms-card-grid,
  .cms-stat-grid,
  .cms-dashboard-grid,
  .cms-form-grid,
  .cms-media-grid,
  .signature-method-grid,
  .signature-card-grid,
  .legal-detail-grid,
  .profile-summary-grid,
  .settings-section-grid,
  .hero-grid,
  .landing-hero-grid,
  .blog-grid,
  .feature-grid,
  .role-grid,
  .reference-grid,
  .module-grid,
  .why-grid,
  .trust-grid,
  .testimonial-grid,
  .footer-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .learning-shell-v4,
  .learning-overview-hero,
  .contract-editor-shell-pro,
  .cert-editor-shell,
  .landing-section-layout,
  .mail-template-studio,
  .designer-split-view,
  .crm-detail-grid,
  .crm-record-hero,
  .sales-detail-grid,
  .sales-hero,
  .nace-hero,
  .assignment-hero,
  .management-grid,
  .v4-split,
  .v4-split-40,
  .v4-split-60,
  .dashboard-grid,
  .settings-grid,
  .profile-grid,
  .kvkk-grid,
  .legal-grid,
  .signature-grid,
  .auth-stage,
  .cert-template-grid,
  .certificate-template-grid,
  .contract-template-grid,
  .quote-detail-grid,
  .customer-detail-grid,
  .opportunity-detail-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    min-width: 0 !important;
    gap: 12px !important;
  }

  .learning-left,
  .learning-right,
  .landing-section-live,
  .contract-editor-left,
  .contract-editor-right,
  .cert-editor-left,
  .cert-editor-right,
  .designer-split-left,
  .designer-split-right,
  .sticky,
  [class*="sticky"] {
    position: static !important;
    top: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .card,
  .sales-card,
  .crm-card,
  .admin-card,
  .v4-card,
  .envia-card,
  .envia-list-card,
  .envia-kpi-card,
  .dashboard-card,
  .course-card,
  .profile-card,
  .settings-card,
  .metric-card,
  .stat-card,
  .hero-card,
  .page-hero,
  .sales-hero,
  .nace-hero,
  .assignment-hero,
  .crm-record-hero,
  .management-hero,
  .landing-management-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    border-radius: 20px !important;
  }

  .topbar-title,
  .sales-card-head,
  .sales-head-actions,
  .sales-hero-actions,
  .assignment-hero-actions,
  .hero-actions,
  .v4-actions,
  .button-row,
  .toolbar,
  .filters-bar,
  .sales-toolbar,
  .envia-toolbar,
  .cms-compact-topbar,
  .interactive-chart-head,
  .contract-editor-card > header,
  .contract-section-row header,
  .signature-toolbar,
  .signature-card-head,
  .landing-section-title-row,
  .employee-list-topbar,
  .legal-approval-bar {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex-wrap: wrap !important;
  }

  .sales-hero-actions,
  .sales-card-head,
  .sales-head-actions,
  .assignment-hero-actions,
  .hero-actions,
  .v4-actions,
  .button-row,
  .form-actions,
  .modal-actions,
  .contract-row-actions,
  .exam-nav,
  .scorm-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    align-items: stretch !important;
  }

  .btn,
  button,
  a.btn,
  .envia-btn-primary,
  .envia-btn-secondary,
  .envia-btn-action {
    max-width: 100% !important;
    min-height: 48px !important;
    touch-action: manipulation !important;
    white-space: normal !important;
  }

  .button-row .btn,
  .hero-actions .btn,
  .form-actions .btn,
  .sales-hero-actions .btn,
  .assignment-hero-actions .btn,
  .v4-actions .btn,
  .modal-actions .btn {
    width: 100% !important;
    justify-content: center !important;
  }

  input,
  select,
  textarea,
  .input,
  .auth-input {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    font-size: 16px !important;
  }

  .sales-filter-strip,
  .crm-tabbar,
  .admin-tabs,
  .v4-tabs,
  .game-admin-tabs,
  .designer-step-tabs,
  .legal-tabs,
  .signature-tabs,
  .cms-tabs,
  .tabbar,
  .tabs,
  .pill-row,
  .filter-pills {
    display: flex !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    gap: 8px !important;
    padding-bottom: 6px !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .sales-filter-strip::-webkit-scrollbar,
  .crm-tabbar::-webkit-scrollbar,
  .admin-tabs::-webkit-scrollbar,
  .v4-tabs::-webkit-scrollbar,
  .game-admin-tabs::-webkit-scrollbar,
  .designer-step-tabs::-webkit-scrollbar,
  .legal-tabs::-webkit-scrollbar,
  .signature-tabs::-webkit-scrollbar,
  .cms-tabs::-webkit-scrollbar,
  .tabbar::-webkit-scrollbar,
  .tabs::-webkit-scrollbar,
  .pill-row::-webkit-scrollbar,
  .filter-pills::-webkit-scrollbar { display: none; }
  .sales-filter-strip > *,
  .crm-tabbar > *,
  .admin-tabs > *,
  .v4-tabs > *,
  .game-admin-tabs > *,
  .designer-step-tabs > *,
  .legal-tabs > *,
  .signature-tabs > *,
  .cms-tabs > *,
  .tabbar > *,
  .tabs > *,
  .pill-row > *,
  .filter-pills > * { flex: 0 0 auto !important; }

  .v4-table-wrap,
  .table-responsive,
  .crm-table-wrap,
  .sales-table-wrap,
  .employee-table-wrap,
  .report-table-wrap,
  .kvkk-table-wrap,
  .audit-table-wrap,
  .cert-table-wrap,
  .contract-table-wrap,
  .cms-compact-table-wrap,
  .table-wrap,
  .responsive-table,
  .action-scroll {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: visible !important;
  }

  table,
  .v4-table,
  .sales-table,
  .crm-inner-table,
  .report-table,
  .kvkk-table,
  .cert-table,
  .contract-table,
  .cms-compact-table,
  table.envia-mobile-table {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    display: block !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: transparent !important;
  }

  table colgroup { display: none !important; }
  table thead { display: none !important; }
  table tbody {
    display: grid !important;
    width: 100% !important;
    min-width: 0 !important;
    gap: 12px !important;
  }
  table tr {
    display: grid !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    gap: 8px !important;
    padding: 14px !important;
    border: 1px solid rgba(195, 198, 215, .72) !important;
    border-radius: 18px !important;
    background: #fff !important;
    box-shadow: var(--lumina-shadow, 0px 1px 3px rgba(0,0,0,.05), 0px 10px 15px -3px rgba(0,0,0,.03)) !important;
  }
  table td,
  table th {
    display: grid !important;
    grid-template-columns: minmax(92px, 36%) minmax(0, 1fr) !important;
    gap: 10px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    text-align: left !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
  }
  table td::before,
  table th::before {
    content: attr(data-label);
    color: var(--lumina-on-surface-variant, #434655) !important;
    font-size: .72rem !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
  }
  table td:empty,
  table th:empty { display: none !important; }
  table td:last-child,
  table th:last-child,
  .actions-cell,
  .v4-table .actions-cell,
  .sales-table .actions-cell,
  .crm-inner-table .actions-cell,
  .employee-actions,
  .table-actions,
  .nowrap-actions,
  .action-buttons.nowrap-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    gap: 8px !important;
    overflow: visible !important;
    white-space: normal !important;
  }
  table td:last-child::before,
  table th:last-child::before { flex: 0 0 100%; }
  .actions-cell .btn,
  .table-actions .btn,
  .employee-actions .btn,
  .v4-table .actions-cell .btn,
  .sales-table .actions-cell .btn,
  .crm-inner-table .actions-cell .btn,
  .icon-action {
    flex: 1 1 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    border-radius: 14px !important;
  }

  .watch-meter,
  .dept-bar,
  .interactive-hbar,
  .module-row,
  .module-row-expanded,
  .course-line,
  .cert-mini,
  .v4-feed-row,
  .sales-task-row,
  .game-score-row,
  .contract-section-row header,
  .contract-appendix-row,
  .legal-approval-bar {
    grid-template-columns: 1fr !important;
  }

  .interactive-donut-layout {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
  }
  .interactive-donut,
  .interactive-chart-svg,
  .chart svg { max-width: 100% !important; }

  .contract-editor-topbar,
  .cert-editor-topbar {
    position: relative !important;
    top: auto !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
  }
  .contract-preview-mini,
  .contract-doc,
  .legal-doc,
  .cert-canvas-wrap,
  .certificate-canvas,
  .certificate-preview,
  .document-player,
  .scorm-frame,
  .learning-video-wrap,
  .video-placeholder {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    transform: none !important;
  }
  .cert-canvas-wrap,
  .document-player,
  .scorm-frame { overflow: hidden !important; }

  .auth-stage,
  .auth-card,
  .auth-panel,
  .auth-form-card,
  .login-card,
  .reset-card {
    width: 100% !important;
    max-width: 448px !important;
    min-width: 0 !important;
  }
  .auth-side-scene,
  .auth-innovation-network {
    display: none !important;
  }
  .auth-page {
    padding: 16px !important;
    overflow-x: hidden !important;
  }

  .site-header,
  .header-wrap,
  .public-header,
  .landing-header {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  .header-wrap {
    min-height: 64px !important;
    height: auto !important;
    flex-wrap: wrap !important;
  }
  .site-header .nav,
  .public-header .nav,
  .landing-header .nav {
    display: none !important;
  }
  .brand,
  .brand img,
  .site-logo,
  .site-logo img {
    max-width: 170px !important;
  }
  .hero,
  .landing-hero,
  .public-hero {
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow: hidden !important;
  }
  .hero h1,
  .landing-hero h1,
  .public-hero h1,
  .learning-overview-copy h1,
  .employee-page-hero h1 {
    font-size: clamp(2rem, 10vw, 2.6rem) !important;
    line-height: 1.06 !important;
    overflow-wrap: anywhere !important;
  }

  .modal,
  .sales-modal,
  .kvkk-password-overlay {
    padding: 12px !important;
    overflow-x: hidden !important;
  }
  .modal-panel,
  .sales-modal-panel,
  .sales-modal-panel.wide,
  .kvkk-password-modal,
  .contract-preview-modal {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    max-height: min(88dvh, 760px) !important;
    overflow: auto !important;
    border-radius: 22px !important;
  }
}

@media (max-width: 560px) {
  .main > :not(.topbar),
  .app-content,
  .container,
  .section > .container,
  main > .container {
    max-width: 100% !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .v4-kpi-grid,
  .sales-kpi-grid,
  .crm-summary-grid,
  .employee-kpi-grid,
  .cert-kpi-grid,
  .learning-stat-grid,
  .contract-template-dashboard,
  .course-grid,
  .certificate-grid,
  .exam-list-grid,
  .landing-management-grid,
  .interactive-report-grid,
  .sales-dashboard-grid,
  .nace-stat-grid,
  .kpi-grid,
  .stats-grid,
  .metric-grid,
  .sgk-parts-grid,
  .kvkk-mini-stats {
    grid-template-columns: 1fr !important;
  }

  table td,
  table th {
    grid-template-columns: 1fr !important;
    gap: 4px !important;
  }

  table td::before,
  table th::before { font-size: .68rem !important; }

  .envia-bottom-nav a span:last-child { font-size: .66rem !important; }
  .mobile-topbar-brand { font-size: 1.12rem !important; }
}