/* === MOBILE AUDIT FIXES (max-width: 768px) === */

@media (max-width: 768px) {

  /* FIX 3 — глобальные отступы */
  body {
    overflow-x: hidden;
    padding-bottom: 72px;
  }

  .container {
    width: 100%;
    max-width: 100%;
    padding-left: 16px;
    padding-right: 16px;
    margin-left: 0;
    margin-right: 0;
  }

  .section {
    padding-top: 24px;
    padding-bottom: 24px;
  }

  /* FIX 1 — шапка конструктора */
  .header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #ffffff;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
  }

  .header .header-inner,
  .header .container.header-inner {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    height: 52px;
    min-height: 52px;
    max-height: 52px;
    padding: 8px 16px;
    grid-template-columns: unset;
  }

  .header:has(.btn-templates-panel) .header-inner {
    padding-right: 16px;
  }

  .logo-wrap {
    flex: 0 0 auto;
    min-width: 0;
    gap: 0;
  }

  .logo-img {
    height: 28px;
    width: auto;
  }

  .logo-subtitle {
    display: none !important;
  }

  .header-admin-center,
  .header-view-bar,
  .header-guest-contacts,
  .header-view-logout {
    display: none !important;
  }

  .header-right {
    flex: 0 1 auto;
    width: auto;
    max-width: none;
    flex-wrap: nowrap;
    gap: 8px;
    justify-content: flex-end;
  }

  .header-actions {
    flex-wrap: nowrap;
    gap: 8px;
    width: auto;
  }

  .header-price {
    display: none;
  }

  .header-actions .btn,
  .header-actions .btn-pill {
    width: auto !important;
    min-height: 36px;
    padding: 8px 14px !important;
    font-size: 13px !important;
    white-space: nowrap;
  }

  /* FIX 1 — шапка админки */
  .admin-header {
    height: 52px;
    min-height: 52px;
    max-height: 52px;
    padding: 8px 16px;
    gap: 8px;
    max-width: 100%;
    flex-wrap: nowrap;
    overflow: hidden;
  }

  .admin-logo {
    font-size: 14px;
  }

  .admin-badge {
    display: none;
  }

  .admin-nav {
    display: none !important;
  }

  .admin-header-right {
    gap: 6px;
    margin-left: auto;
  }

  .admin-header-right #btn-new-template,
  .admin-header-right .btn-logout {
    display: none !important;
  }

  .admin-header-right .btn-sm {
    width: auto !important;
    min-height: 36px;
    padding: 8px 12px !important;
    font-size: 12px !important;
    white-space: nowrap;
  }

  .admin-body {
    padding: 16px;
  }

  #client-banner {
    padding: 8px 16px;
    font-size: 12px;
    line-height: 1.4;
  }

  /* FIX 2 — футер (если появится на странице) */
  footer,
  .footer,
  .site-footer {
    padding: 16px !important;
    max-height: none;
  }

  .footer__nav,
  .footer__links,
  .footer__social,
  .footer__about,
  .footer__description,
  [class*="footer-col"]:not(:last-child) {
    display: none !important;
  }

  .footer__grid,
  .footer__columns,
  .footer__inner {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
  }

  footer p,
  footer span,
  footer a,
  .footer p,
  .footer span,
  .footer a {
    font-size: 13px !important;
  }

  /* FIX 4 — типографика */
  h1 { font-size: clamp(22px, 6vw, 32px) !important; line-height: 1.2 !important; }
  h2 { font-size: clamp(18px, 5vw, 26px) !important; line-height: 1.25 !important; }
  h3 { font-size: clamp(15px, 4vw, 20px) !important; line-height: 1.3 !important; }

  #app main p,
  #app main li,
  #app main label,
  #app main .section-subtitle,
  #app main .section-intro {
    font-size: max(15px, 1rem);
    line-height: 1.5;
  }

  .section-title {
    font-size: clamp(20px, 5.5vw, 28px) !important;
  }

  .checkbox-card p,
  .checkbox-card h3,
  .checkbox-card li,
  .tariff-card p,
  .tariff-card h3,
  .tariff-card li,
  .case-card p,
  .case-card h3 {
    text-align: left !important;
  }

  /* FIX 5 — сетки и карточки */
  .tariff-grid,
  .research-grid,
  .cases-grid,
  .checkbox-grid,
  .checkbox-grid.rich,
  .checkbox-grid.cols-2,
  .fields-grid-2,
  .declension-grid,
  .economics-hero-grid,
  .econ-scenarios-grid,
  .econ-scenario-metrics,
  .monthly-costs-cards,
  .economics-summary-grid,
  .kp-panel-extra .field-row.cols-2,
  .company-input-row {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
  }

  .tariff-card,
  .checkbox-card,
  .research-item,
  .case-card,
  .admin-form-block,
  .info-box {
    width: 100% !important;
    max-width: 100% !important;
  }

  .goal-banner {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .goal-banner-metrics {
    flex-wrap: wrap;
    gap: 8px;
  }

  .card-actions {
    flex-direction: column;
    width: 100%;
    gap: 8px;
  }

  .btn-example {
    width: 100% !important;
    min-height: 44px !important;
    justify-content: center;
    font-size: 14px !important;
    padding: 10px 14px !important;
  }

  /* FIX 6 — кнопки (контент, не шапка) */
  #app main .btn:not(.btn-icon),
  .login-card .btn,
  .admin-body .btn:not(.btn-sm):not(.business-type-btn),
  .kp-panel-actions .btn,
  .confirm-modal-actions .btn,
  .modal-footer .btn,
  .example-download {
    min-height: 44px !important;
    padding: 10px 20px !important;
    font-size: 15px !important;
    width: 100% !important;
    text-align: center !important;
  }

  .btn-back,
  .btn-logout,
  .header-admin-btn,
  .header-admin-logout,
  .modal-close,
  .example-modal .modal-close,
  .goal-banner-edit,
  .business-type-btn,
  .admin-nav-item,
  .templates-panel-close,
  .header-social-link,
  .btn-example,
  button[class*="icon"],
  .btn-icon {
    width: auto !important;
    min-height: 44px;
    min-width: 44px;
  }

  .business-type-btn {
    min-height: 40px;
    padding: 8px 14px !important;
    font-size: 14px !important;
  }

  /* FIX 7 — формы */
  #app input:not([type="checkbox"]):not([type="radio"]),
  #app textarea,
  #app select,
  .login-card input,
  .admin-form input,
  .admin-form textarea,
  .admin-form select,
  .kp-panel-field {
    width: 100% !important;
    font-size: 16px !important;
    min-height: 44px !important;
    padding: 10px 14px !important;
    box-sizing: border-box !important;
  }

  #app textarea,
  .admin-form textarea,
  .kp-panel-field[type="textarea"],
  textarea.kp-panel-field {
    min-height: 88px !important;
  }

  #app label,
  .admin-form .field-label,
  .kp-panel-extra label {
    display: block !important;
    margin-bottom: 6px !important;
    font-size: 14px !important;
  }

  .form-row,
  .input-group,
  .field-row,
  .admin-save-row,
  .kp-panel-actions {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
  }

  .kp-panel-client-name {
    max-width: none !important;
    min-width: 0 !important;
  }

  /* FIX 8 — summary panel */
  .summary-panel {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-height: 56px;
    overflow: hidden;
    border-radius: 16px 16px 0 0 !important;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.12) !important;
    z-index: 200 !important;
    transition: max-height 0.3s ease;
    padding: 0;
    background: #0f1435;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-top: 1px solid var(--border);
  }

  .summary-panel.expanded {
    max-height: 80vh;
    overflow-y: auto;
  }

  .summary-panel-peek {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    padding: 12px 16px;
    min-height: 56px;
    cursor: pointer;
    user-select: none;
    flex-shrink: 0;
  }

  .summary-peek-label {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-muted);
    flex: 1;
    min-width: 0;
  }

  .summary-peek-value {
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: 700;
    color: var(--accent-light);
    white-space: nowrap;
  }

  .summary-peek-chevron {
    font-size: 14px;
    color: var(--text-muted);
    transition: transform 0.25s ease;
  }

  .summary-panel.expanded .summary-peek-chevron {
    transform: rotate(180deg);
  }

  .summary-panel:not(.expanded) .summary-inner {
    display: none;
  }

  .summary-panel.expanded .summary-inner {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    padding: 0 16px 16px;
    max-width: 100%;
  }

  .summary-breakdown {
    flex-direction: column;
    gap: 10px;
    width: 100%;
  }

  .summary-breakdown-item {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    text-align: left;
    gap: 12px;
  }

  .summary-breakdown-label {
    font-size: 12px;
    text-transform: none;
    letter-spacing: 0;
  }

  .summary-breakdown-value {
    font-size: 16px;
    white-space: nowrap;
  }

  .summary-inner .btn {
    width: 100% !important;
  }

  /* Модалки */
  .modal-overlay {
    padding: 16px;
  }

  .modal-header,
  .modal-body,
  .modal-footer {
    padding-left: 16px;
    padding-right: 16px;
  }

  .modal-header h2 {
    font-size: clamp(16px, 4.5vw, 20px);
  }

  /* Логин */
  #login-screen {
    padding: 16px;
  }

  .login-card {
    padding: 24px 20px;
    width: 100%;
    max-width: 100%;
  }

  .login-subtitle br {
    display: none;
  }
}

@media (min-width: 769px) {
  .summary-panel-peek {
    display: none;
  }
}
