История страницы

<!-- Минималистичная главнаястартовая страница Wiki-документации для врачей  -->
<!-- Основа: прозрачный фонПрозрачный фон, системные шрифты, однавыстроенные системаотступы шрифтов,и двакомпактное основныхнавигационное цветаменю -->

<div style="
     font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
     max-width: 1180px;
     margin: 0 auto;
     padding: 32px 24px;
     line-height: 1.45;
  color: #1a1a1a;
">

  <!-- Заголовок -->
  <header style="text-align: center; margin-bottom: 48px;">
    <h1 style="
        font-size:font-size: 2.2rem;
        font-weight: 600;
        color:#1a1a1a;margin: 0;">
      Документация  margin:0;для врачей
    ">Документация для врачей<</h1>
    <p style="
        font-size: 1rem;
        color: #4d4d4d;
 margin-top: 8px;">
      margin-top:8px;
    ">Краткое руководство по работе с личным кабинетом<Быстрый старт и ответы на типовые вопросы
    </p>
  </header>

  <!-- Универсальный CSS-класс для карточек Стили -->
  <style>
    .doc-card/* Шапка секции */
    .menu-section {
      backgroundmargin-bottom: rgba(255,255,255,0.85);36px;
    }
  /* полупрозрачный на случай тёмных тем */.menu-section > h2 {
      borderfont-size: 1px solid #e0e0e01.28rem;
      borderfont-radiusweight: 8px600;
      paddingmargin: 0 20px0 24px12px;
      transitioncursor: box-shadow .2s ease, transform .2s ease;
    } pointer;
      user-select: none;
      display: flex;
    .doc-card:hover {
      box-shadow: 0 4px 14px rgba(0,0,0,.08)align-items: center;
      transformgap: translateY(-4px)6px;
    }
    .doc-gridmenu-section > h2 span {
      displayfont-size: grid1.1rem;
      grid-template-columns: repeat(auto-fill,minmax(260px,1fr));
      gap: 20pxtransition: transform .25s ease;
    }
    .docmenu-section-title.collapsed > h2 span {
      font-size:1.25rem;
      font-weight:600;transform: rotate(-90deg);
    }

    /* Контейнер ссылок */
    .menu-items {
      marginpadding-left:0 0 16px20px;
      colordisplay:#1a1a1a block;
    }
    .docmenu-carditems.collapsed h3{
      font-size:1.05rem;
  display: none;
    }

    /* Ссылки */
    font-weight:500;.menu-link {
      margindisplay:0 0 6pxblock;
      color:#1a1a1amargin: 6px 0;
    }
    .doc-card p{text-decoration: none;
      font-size:.9remcolor: #1a1a1a;
      margin:0font-size: .97rem;
      color:#5c5c5cfont-weight: 500;
    }
  transition: color /* ссылку можно задать всей карточке */.2s ease;
    }
    .docmenu-link:hover {
 text-decoration:none; }
  </style>

  <!-- 1. Начало работы -->
  <section style="margin-bottom:56px;">
    <h2 class="doc-section-title">🚀 Начало работы</h2>color: #0b66d3;
      text-decoration: underline;
    }

    /* Карточка (можно использовать для доп. контента) */
    <div class=".doc-grid">card {
      <a class="doc-link" href="Обзор-ЛК.html">background: rgba(255, 255, 255, .9);
      border: 1px <div class="doc-card">solid #e0e0e0;
      border-radius: 8px;
   <h3>Обзор ЛК</h3>
  padding: 20px 24px;
      <p>Ключевые возможности личного кабинета</p>
        </div>
      </a>
margin-bottom: 12px;
      transition: box-shadow .2s ease, transform .2s ease;
    }
    .doc-card:hover {
      <a class="doc-link" href="Регистрация-и-активация.html">
        <div class="doc-card">
box-shadow: 0 4px 14px rgba(0, 0, 0, .08);
      transform: translateY(-4px);
    <h3>Регистрация}
 и активация<</h3>style>

  <!-- Скрипт сворачивания/разворачивания -->
  <script>
    <p>Пошаговое подключение к системе</p>function toggleSection(id) {
      const section  </div>
= document.getElementById(id);
      if  </a>

(!section) return;
      <a class="doc-link" href="Вход-в-ЛК.html">
        <div class="doc-card">
          <h3>Вход в ЛК</h3>
     section.classList.toggle('collapsed');
    }
  </script>

  <!-- Навигационное меню -->
  <nav>

    <!-- 1. Начало работы -->
    <section id="s1" class="menu-section">
     <p>Авторизация и восстановление пароля</p>
  <h2 onclick="toggleSection('s1')"><span>▶</span> 🚀 Начало работы</h2>
      </div>
      </a>

<div class="menu-items">
        <a class="docmenu-link" href="НастройкаОбзор-профиляЛК.html">>Обзор ЛК и его возможностей</a>
        <div<a class="docmenu-cardlink">
          <h3>Настройка профиля</h3> href="Регистрация.html">Регистрация и активация аккаунта</a>
        <a  <p>Данные, предпочтения, уведомления</p>class="menu-link" href="Вход-ЛК.html">Вход в ЛК</a>
        </div>
      </a>

<a class="menu-link" href="Настройка-профиля.html">Настройка профиля</a>
        <a class="docmenu-link" href="Навигация-по-интерфейсуинтерфейс.html">
>Навигация по интерфейсу</a>
      <div class="doc-card">
</div>
    </section>

    <!-- 2. Заказы <h3>Навигация по интерфейсу</h3>
и пациенты -->
    <section id="s2" class="menu-section">
     <p>Основы ориентации в системе</p>
        </div><h2 onclick="toggleSection('s2')"><span>▶</span> 👥 Заказы и пациенты</h2>
      </a><div class="menu-items">
    </div>
   </section>

  <!-- 2. Заказы<a class="menu-link" href="Типы-заказов.html">Типы заказов и пациенты -->
их особенности</a>
    <section style="margin-bottom:56px;">
    <h2    <a class="doc-section-title">👥 Заказы и пациенты</h2>
    <div class="doc-grid">
menu-link" href="Добавление-пациента.html">Добавление нового пациента</a>
        <a class="docmenu-link" href="ТипыСоздание-заказовзаказа.html">>Создание первого заказа</a>
        <div<a class="menu-link" href="docЗаказать-card">ретейнер.html">Как заказать ретейнер</a>
        <a class="menu-link"  <h3>Типы заказов</h3>href="Заказать-ревизию.html">Как заказать ревизию</a>
        <a  <p>Отличия и назначение</p>
        </div>
      </a>

class="menu-link" href="Поменять-тип-заказа.html">Как поменять тип заказа?</a>
        <a class="docmenu-link" href="СозданиеАрхив-заказа.html">
>Как переместить заказ в архив / вернуть  <div class="doc-card">
его...</a>
        <a class="menu-link"   <h3>Созданиеhref="Статус-заказа.html">Отслеживание статуса заказа</h3>a>
        <a  <p>Инструкция по первому заказу</p>
        </div>
      </a>

class="menu-link" href="Поиск-пациентов.html">Поиск и фильтрация пациентов</a>
         <a class="docmenu-link" href="Управление-пациентамиРедактирование.html">>Редактирование пациента или заказа</a>
        <div<a class="docmenu-card">link" href="История-заказа.html">История заказа</a>
      </div>
    <h3>Управление пациентами</h3></section>

    <!-- 3. Отгрузки и доставка  <p>База данных и истории</p>капп -->
    <section    </div>
id="s3" class="menu-section">
       </a>
    </div>
  </section>

  <!-- 3. 3D модели -->
  <section style="margin-bottom:56px;">
    <h2 class="doc-section-title">🦷 3D-модели</h2>
    <div class="doc-grid">
      <a class="doc<h2 onclick="toggleSection('s3')"><span>▶</span> 📦 Отгрузки и доставка капп</h2>
      <div class="menu-items">
        <a class="menu-link" href="Новая-партия-капп.html">Как заказать новую партию капп?</a>
        <a class="menu-link" href="Изменить-адрес.html">Как изменить адрес доставки</a>
        <a class="menu-link" href="Когда-доставка.html">Когда доставят каппы?</a>
        <a class="menu-link" href="Отмена-доставки.html">Отмена отгрузки/доставки</a>
        <a class="menu-link" href="Перенести-доставку.html">Хочу перенести дату доставки</a>
      </div>
    </section>

    <!-- 4. Виртуальный сетап -->
    <section id="s4" class="menu-section">
      <h2 onclick="toggleSection('s4')"><span>▶</span> 🦷 Виртуальный сетап (3D-модель)</h2>
      <div class="menu-items">
        <a class="menu-link" href="Просмотрщик-сетапа.html">Просмотрщик сетапа (3D модели)</a>
        <a class="menu-link" href="EuroTMJ-Tracker.html">EuroTMJ Tracker</a>
        <a class="menu-link" href="Детализатор.html">Детализатор</a>
        <a class="menu-link" href="Скачать-таблицу.html">Как скачать таблицу перемещений?</a>
        <a class="menu-link" href="Модель-с-костью.html">Хочу чтобы модель была с костью</a>
        <a class="menu-link" href="Согласовать-сетап.html">Как согласовать/отклонить сетап</a>
        <a class="menu-link" href="Доработка-сетапа.html">Вернуть сетап на доработку</a>
        <a class="menu-link" href="ПросмотрщикСогласование-сетапа.html">>Вернуть сетап на согласование</a>
        <div<a class="menu-link" href="doc-card">3D-не-открывается.html">3D модель не открывается</a>
      </div>
    </section>

    <!-- 5. <h3>Просмотрщик сетапа</h3>
  Чаты и уведомления -->
    <section    <p>Работа с 3D-моделями зубов</p>id="s5" class="menu-section">
        </div>
      </a>
<h2 onclick="toggleSection('s5')"><span>▶</span> 💬 Чаты и уведомления</h2>
      <a<div class="doc-link" href="Согласование-сетапа.htmlmenu-items">
        <div<a class="docmenu-cardlink">
          <h3>Согласование сетапа</h3> href="Настройка-уведомлений.html">Настройка уведомлений</a>
        <a  <p>Процесс утверждения</p>class="menu-link" href="Настройка-чата.html">Настройка чата</a>
        </div>
      </a>
<a class="menu-link" href="Не-пропадает-уведомление.html">Не пропадает уведомление</a>
      </div>
    </section>

    <!-- 46. Дополнительные Дополнительноевозможности -->
    <section style id="s6" class="margin-bottom:56px;menu-section">
      <h2 classonclick="doc-section-title">⚙️ Дополнительное<toggleSection('s6')"><span>▶</span> ⚙️ Дополнительные возможности</h2>
      <div class="docmenu-griditems">
        <a class="docmenu-link" href="ЧатыГрафик-и-уведомленияношения.html">>График ношения (Календарь планирования)</a>
        <div<a class="docmenu-cardlink">
          <h3>Чаты и уведомления</h3> href="Евроулыбка.html">Евроулыбка</a>
        <a  <p>Коммуникация внутри платформы</p>class="menu-link" href="Программа-лояльности.html">Программа лояльности</a>
        </div>
      </a>section>

    <!-- 7. Финансовые вопросы -->
    <section <a classid="doc-links7" hrefclass="Программаmenu-лояльности.htmlsection">
      <h2  <div classonclick="doc-card">
   toggleSection('s7')"><span>▶</span> 💰 Финансовые вопросы</h2>
       <h3>Программа лояльности</h3>
<div class="menu-items">
        <a class="menu-link"  <p>Бонусы и скидки</p>href="Оплата-заказа.html">Как оплатить заказ</a>
        </div>
       <a class="menu-link" href="Когда-доставка-после-оплаты.html">Я оплатил заказ, когда доставят каппы?</a>
      </div>
    </section>

    <!-- 58. Возможные Справкапроблемы -->
    <section id="s8" class="menu-section">
       <section>
    <h2 class="doc-section-title">📚 Справка</h2>
<h2 onclick="toggleSection('s8')"><span>▶</span> ❗ Возможные проблемы и их решение</h2>
      <div class="docmenu-griditems">
        <a class="docmenu-link" href="Поддержка.html">
        <div class="doc-card">
    Проблемы-и-решения.html">Возможные проблемы и их решение</a>
      <h3>Служба поддержки<</h3>div>
    </section>

    <!-- 9. Справочная <p>Контакты и подсказки</p>
информация -->
    <section id="s9" class="menu-section">
    </div>
  <h2 onclick="toggleSection('s9')"><span>▶</span> 📚 Справочная <информация</a>
h2>
      <a<div class="doc-link" href="FAQ.htmlmenu-items">
        <div<a class="docmenu-cardlink">
          <h3>FAQ</h3> href="Служба-поддержки.html">Служба поддержки</a>
        <a  <p>Частые вопросы</p>
        </div>class="menu-link" href="FAQ.html">Часто задаваемые вопросы (F.A.Q.)</a>
      </a>div>
    </div>section>

  </section>nav>

</div>