/* Advoke CV — Editor Responsive Overrides */

@media (max-width: 1023px) {
  .editor-toolbar__mode-tabs {
    display: inline-flex;
  }
  .editor-toolbar__group--spacer {
    display: none;
  }
  .editor-toolbar__label {
    display: none;
  }
  .editor-toolbar__btn {
    min-width: 36px;
    padding: 0;
  }
}

@media (max-width: 767px) {
  .editor-toolbar {
    height: 52px;
    padding-inline: var(--space-2);
    gap: var(--space-1);
  }
  .editor-toolbar__title {
    max-width: 96px;
    margin-inline: var(--space-1);
  }
  .editor-toolbar__title-input {
    font-size: var(--text-xs);
    padding: 2px var(--space-1);
  }
  .editor-toolbar__status {
    display: none;
  }
  .editor-toolbar__divider {
    margin-inline: 0;
  }
  .editor-toolbar__btn {
    min-width: 32px;
    height: 32px;
  }
  .editor-toolbar__btn svg {
    width: 14px;
    height: 14px;
  }
}

@media (max-width: 480px) {
  .editor-toolbar {
    height: 48px;
    padding-inline: var(--space-1-5);
  }
  .editor-toolbar__title {
    max-width: 68px;
  }
  .editor-toolbar__title-input {
    font-size: 11px;
  }
  .editor-toolbar__btn--hide-mobile {
    display: none;
  }
  .editor-toolbar__divider {
    display: none;
  }
}

@media (max-width: 640px) {
  .editor-panel__header {
    padding: var(--space-3);
    flex-direction: column;
    align-items: stretch;
    gap: var(--space-2);
  }
  .editor-panel__title {
    font-size: var(--text-base);
  }
  .editor-panel__subtitle {
    font-size: var(--text-xs);
  }
  .editor-panel__body {
    padding: var(--space-3) var(--space-3) var(--space-6);
  }
  .editor-form {
    gap: var(--space-3);
  }
  .editor-section__body {
    padding: var(--space-3);
  }
  .editor-section__header {
    padding: var(--space-2) var(--space-3);
  }
  .editor-entry {
    padding: var(--space-3);
    gap: var(--space-3);
  }
  .editor-entry__header-right .editor-remove__label {
    display: none;
  }
  .editor-style__options {
    gap: var(--space-1-5);
  }
  .editor-style__option {
    min-width: 44px;
    padding: var(--space-1);
  }
  .editor-style__option-preview {
    width: 24px;
    height: 16px;
    font-size: 12px;
  }
  .editor-style__option-label {
    font-size: 9px;
  }
  .editor-style__swatch {
    min-width: 28px;
    max-width: 36px;
  }
}

@media (max-width: 1023px) {
  .editor-preview__canvas {
    padding: var(--space-3);
    gap: var(--space-3);
    background-color: var(--ink-50);
    background-image:
      radial-gradient(circle at 1px 1px, rgba(15, 23, 42, 0.04) 1px, transparent 0);
    background-size: 14px 14px;
  }
  .editor-preview__toolbar {
    padding: var(--space-2);
    min-height: 40px;
    gap: var(--space-1);
  }
  .editor-preview__label {
    display: none;
  }
  .editor-preview__page-info {
    font-size: 10px;
    padding: 2px var(--space-1);
  }
}

@media (max-width: 767px) {
  .editor-preview__canvas {
    padding: var(--space-2);
    gap: var(--space-2);
  }
  .editor-preview__paper {
    box-shadow:
      0 1px 2px rgba(15, 23, 42, 0.08),
      0 4px 12px rgba(15, 23, 42, 0.08);
  }
}

@media (max-width: 480px) {
  .editor-preview__canvas {
    padding: var(--space-1-5);
  }
  .editor-preview__toolbar {
    padding: var(--space-1) var(--space-2);
  }
}

@media (min-width: 1024px) {
  .editor__pane--sidebar,
  .editor__pane--form,
  .editor__pane--preview {
    display: flex !important;
  }
  .editor-mobile-tabs {
    display: none;
  }
  .editor-toolbar__mode-tabs {
    display: none;
  }
}

@media (min-width: 1280px) {
  .editor__pane--sidebar {
    position: relative;
  }
  .editor__pane--sidebar::after {
    content: "";
    position: absolute;
    top: var(--space-4);
    bottom: var(--space-4);
    right: -4px;
    width: 3px;
    background-color: transparent;
    border-radius: var(--radius-full);
    cursor: col-resize;
    transition: background-color var(--duration-fast) var(--ease-out);
    z-index: 5;
  }
  .editor__pane--sidebar:hover::after {
    background-color: var(--color-border-strong);
  }
  .editor__pane--sidebar.is-resizing::after {
    background-color: var(--color-accent);
  }
}

@media (orientation: landscape) and (max-height: 500px) {
  .editor-toolbar {
    height: 44px;
  }
  .editor-mobile-tabs {
    min-height: 36px;
  }
  .editor-mobile-tabs__tab {
    min-height: 36px;
    flex-direction: row;
    gap: var(--space-1);
  }
  .editor-mobile-tabs__label {
    font-size: 11px;
    text-transform: none;
    letter-spacing: 0;
  }
  .editor-mobile-tabs__tab svg {
    width: 14px;
    height: 14px;
  }
  .editor-mobile-nav {
    padding-block: var(--space-1);
  }
  .editor-mobile-nav__btn {
    min-height: 34px;
  }
}

@media (min-width: 1536px) {
  .editor-preview__canvas {
    padding: var(--space-8);
  }
}

.editor-toolbar,
.editor-mobile-tabs,
.editor-mobile-nav {
  -webkit-tap-highlight-color: transparent;
}

.editor input,
.editor textarea,
.editor select {
  font-size: 16px;
}

@media (min-width: 768px) {
  .editor input,
  .editor textarea,
  .editor select {
    font-size: inherit;
  }
}

@media (prefers-reduced-motion: reduce) {
  .editor__pane--sidebar::after {
    transition: none;
  }
}