/* V41.6.6 — free launch, accessible typography, stable mobile views, and export review. */

:root {
  --v4163-ink: #183b4b;
  --v4163-muted: #5d727c;
  --v4163-line: #ccdbe1;
  --v4163-surface: #ffffff;
  --v4163-soft: #eef5f7;
  --v4163-blue: #1d5f7b;
  --v4163-blue-strong: #123e53;
  --v4163-gold: #d7b574;
  --v4163-success: #19704d;
  --v4163-warning: #8a5a17;
}

/* The Arabic label previously mixed direction and used a 7px pseudo-element. */
.template-language-toggle[data-v4162-label]::before {
  content: none !important;
  display: none !important;
}

.template-language-toggle[data-v4162-label] {
  direction: ltr !important;
  grid-template-columns: repeat(2, minmax(76px, 1fr)) !important;
  min-width: 206px !important;
  padding: 5px !important;
}

.v4163-cv-language-label {
  grid-column: 1 / -1;
  min-width: 0;
  padding: 3px 6px 5px;
  color: #dceaf0;
  direction: rtl;
  font-size: 11px;
  font-weight: 850;
  line-height: 1.35;
  letter-spacing: 0;
  text-align: start;
  unicode-bidi: isolate;
}

.ui-en .v4163-cv-language-label {
  direction: ltr;
}

.template-language-toggle[data-v4162-label] button {
  min-height: 44px !important;
  padding: 8px 10px !important;
  font-size: 11px !important;
}

/* Readability pass: interface only. The white A4 CV and its typography are untouched. */
body.v40-builder .v26-field-hint,
body.v40-builder .v26-context-guide li,
body.v40-builder .panel-heading p,
body.v40-builder .panel-route-tip p,
body.v40-builder .quick-start small,
body.v40-builder .format-heading small,
body.v40-builder .template-switcher small,
body.v40-builder .workspace-dashboard small,
body.v40-builder .preview-studio-head small,
body.v40-builder .selected-design-bar small,
body.v40-builder .preview-save-copy span,
body.v40-builder .preview-save-copy small,
body.v40-builder .preview-note,
body.v40-builder .v4131-writing-helper small,
body.v40-builder .v4134-signature-tools-copy small {
  color: var(--v4163-muted) !important;
  font-size: 11px !important;
  line-height: 1.55 !important;
}

body.v40-builder .field > span,
body.v40-builder .panel-route-tip b,
body.v40-builder .format-heading > span,
body.v40-builder .template-switcher > div:first-child > b,
body.v40-builder .preview-studio-head b,
body.v40-builder .selected-design-bar b {
  font-size: 12px !important;
  line-height: 1.4 !important;
}

body.v40-builder :is(.field input, .field textarea, .field select, .custom-field-row input) {
  min-height: 46px !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
}

body.v40-builder :is(
  .ui-language-toggle button,
  .preview-actions button,
  .preview-actions summary,
  .design-cycle,
  .panel-tabs button,
  .form-step-actions button,
  .mobile-switch button,
  .mobile-app-dock button,
  .v4162-about-links a
) {
  min-height: 44px !important;
}

body.v40-builder :is(
  .preview-actions b,
  .panel-tabs button,
  .form-step-actions button,
  .mobile-switch button,
  .mobile-app-dock b
) {
  font-size: 11.5px !important;
  line-height: 1.3 !important;
}

/* About card remains compact but no longer relies on unreadably tiny type. */
.v4162-about-copy b {
  font-size: 13px !important;
}

.v4162-about-copy small,
.v4162-about-developer small,
.v4162-about-footnote {
  color: var(--v4163-muted) !important;
  font-size: 11px !important;
  line-height: 1.55 !important;
}

.v4162-about-developer b {
  font-size: 12px !important;
  line-height: 1.45 !important;
}

.v4162-version {
  padding: 6px 9px !important;
  font-size: 10px !important;
}

.v4162-about-links a {
  font-size: 11px !important;
}

/* Live page-length status beside the A4 preview label. */
.v4163-page-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 27px;
  margin-inline-start: 5px;
  padding: 4px 8px;
  color: var(--v4163-success);
  background: #eaf7f0;
  border: 1px solid #bcdcca;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.2;
  white-space: nowrap;
}

.v4163-page-status::before {
  content: "✓";
  font-size: 10px;
}

.v4163-page-status.long {
  color: var(--v4163-warning);
  background: #fff5e5;
  border-color: #e2c28c;
}

.v4163-page-status.long::before {
  content: "!";
}

/* Inline gesture education: never floats over the form or bottom dock. */
.v4163-swipe-hint {
  display: none;
}

.v4163-swipe-hint.is-hiding {
  opacity: 0;
  transform: translateY(-5px);
  transition: opacity 160ms ease, transform 160ms ease;
}

.v4163-view-enter {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

/* Non-blocking export review. This opens only when a real issue is detected. */
body.v4163-review-open {
  overflow: hidden !important;
}

.v4163-review-overlay {
  position: fixed;
  z-index: 420;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(6, 20, 27, .72);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}

.v4163-review-card {
  width: min(480px, 100%);
  max-height: min(720px, calc(100dvh - 36px));
  overflow: auto;
  color: var(--v4163-ink);
  background: linear-gradient(150deg, #fff, #f4f8f9);
  border: 1px solid #d5e1e5;
  border-radius: 20px;
  box-shadow: 0 30px 80px rgba(2, 18, 26, .3);
}

.v4163-review-head {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 44px;
  align-items: center;
  gap: 11px;
  padding: 15px;
  border-bottom: 1px solid #dbe5e8;
}

.v4163-review-mark {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  color: #173f52;
  background: #f0d49d;
  border-radius: 13px;
  font-size: 18px;
  font-weight: 950;
}

.v4163-review-title {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

.v4163-review-title b {
  font-size: 16px;
  line-height: 1.35;
}

.v4163-review-title small {
  color: var(--v4163-muted);
  font-size: 11px;
  line-height: 1.5;
}

.v4163-review-close {
  width: 44px;
  height: 44px;
  color: #355969;
  background: #edf3f5;
  border: 1px solid #d3dfe4;
  border-radius: 12px;
  font-size: 20px;
}

.v4163-review-body {
  padding: 14px;
}

.v4163-review-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.v4163-review-list li {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  padding: 11px;
  color: #62471d;
  background: #fff8eb;
  border: 1px solid #e6d1a8;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.55;
}

.v4163-review-list li > span {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  color: #765118;
  background: #f8ddb0;
  border-radius: 9px;
  font-weight: 950;
}

.v4163-review-note {
  display: block;
  margin-top: 11px;
  color: var(--v4163-muted);
  font-size: 11px;
  line-height: 1.6;
  text-align: center;
}

.v4163-review-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  padding: 0 14px 14px;
}

.v4163-review-actions button {
  min-height: 48px;
  border-radius: 12px;
  padding: 10px;
  font-size: 12px;
  font-weight: 900;
}

.v4163-review-back {
  color: #294d5c;
  background: #fff;
  border: 1px solid #cbd9df;
}

.v4163-review-continue {
  color: #fff;
  background: linear-gradient(135deg, var(--v4163-blue-strong), var(--v4163-blue));
  border: 1px solid #256c88;
}

html.v30-dark body.v40-builder .v4163-cv-language-label,
html.v30-dark body.v40-builder .v4163-review-title b {
  color: #f1f7f9 !important;
}

html.v30-dark body.v40-builder .v4163-page-status {
  color: #bfe8d1;
  background: #173429;
  border-color: #3f7058;
}

html.v30-dark body.v40-builder .v4163-page-status.long {
  color: #f3d7a0;
  background: #382b18;
  border-color: #725b35;
}

html.v30-dark .v4163-review-card {
  color: #eef6f8;
  background: linear-gradient(150deg, #15272f, #0e1b21);
  border-color: #3d5661;
}

html.v30-dark .v4163-review-head {
  border-color: #3d5661;
}

html.v30-dark .v4163-review-title small,
html.v30-dark .v4163-review-note {
  color: #bfd0d7;
}

html.v30-dark .v4163-review-close,
html.v30-dark .v4163-review-back {
  color: #e6f0f3;
  background: #1c313a;
  border-color: #46606b;
}

html.v30-dark .v4163-review-list li {
  color: #f0ddb6;
  background: #302717;
  border-color: #6a5632;
}

@media (max-width: 760px) {
  .app-header .brand-mark > div > small {
    display: none !important;
  }

  .app-header .ui-language-toggle button {
    min-width: 56px !important;
    min-height: 48px !important;
  }

  body.v40-builder :is(.field input, .field textarea, .field select, .custom-field-row input) {
    min-height: 50px !important;
    font-size: 16px !important;
  }

  body.v40-builder :is(
    .preview-actions button,
    .preview-actions summary,
    .design-cycle,
    .panel-tabs button,
    .form-step-actions button,
    .mobile-switch button,
    .mobile-app-dock button
  ) {
    min-height: 48px !important;
  }

  .template-language-toggle[data-v4162-label] {
    width: 100%;
    min-width: 0 !important;
  }

  .v4163-swipe-hint {
    direction: rtl;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) 36px;
    align-items: center;
    gap: 8px;
    margin: 8px 10px 0;
    padding: 7px 8px;
    color: #244b5c;
    background: linear-gradient(135deg, #edf6f8, #fff8eb);
    border: 1px solid #cbdde4;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(14, 53, 69, .08);
  }

  .ui-en + .v4163-swipe-hint,
  .ui-en .v4163-swipe-hint {
    direction: ltr;
  }

  .v4163-swipe-hint > span {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    color: #f6dfb4;
    background: #174f68;
    border-radius: 10px;
    font-size: 17px;
    font-weight: 900;
  }

  .v4163-swipe-hint > b {
    font-size: 11px;
    line-height: 1.45;
  }

  .v4163-swipe-hint > button {
    width: 36px;
    height: 36px;
    min-height: 36px !important;
    color: #416473;
    background: transparent;
    border: 0;
    border-radius: 10px;
    font-size: 18px;
  }

  html.v30-dark body.v40-builder .v4163-swipe-hint {
    color: #e3eef2;
    background: linear-gradient(135deg, #182d36, #2e281d);
    border-color: #465f69;
  }

  html.v30-dark body.v40-builder .v4163-swipe-hint > button {
    color: #d5e3e8;
  }

  .v4163-review-overlay {
    place-items: end center;
    padding: 10px;
  }

  .v4163-review-card {
    width: 100%;
    max-height: calc(88dvh - env(safe-area-inset-bottom));
    border-radius: 20px 20px 15px 15px;
    padding-bottom: env(safe-area-inset-bottom);
  }

  .v4163-review-actions {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .v4163-view-enter,
  .v4163-review-overlay,
  .v4163-review-card {
    animation: none !important;
    transition: none !important;
  }
}

@media print {
  .v4163-page-status,
  .v4163-swipe-hint,
  .v4163-review-overlay {
    display: none !important;
  }
}
