<!DOCTYPE html>
<html lang="ru">
<head>
  <meta charset="UTF-8">
  <title>Форма анкеты</title>
  <style>
    body {
      background-color: #f5f5f5;
    }

    .form-container {
      margin: 2px;
      background: white;
      padding: 3px 10px 2px 5px;
      overflow: hidden;
    }

    .form-row {
      display: flex;
      align-items: center;
      margin-bottom: 5px;
      gap: 10px;
    }

    .form-label {
      white-space: nowrap;
      min-width: 120px;
      width: 120px;
      font-weight: bold;
      text-align: left;
      padding-right: 10px;
      color: #333;
      flex-shrink: 0;
    }

    .form-input {
      flex: 1;
      min-width: 0; /* Ключевое свойство для сжатия flex-элементов */
      padding: 2px;
      border: 1px solid #aaa;
      background-color: #f9f9f9;
      font-size: 14px;
      outline: none;
      box-sizing: border-box;
    }

    .form-input-nonflex {
      min-width: 150px;
      width: 150px;
      padding: 2px;
      border: 1px solid #aaa;
      background-color: #f9f9f9;
      font-size: 14px;
      outline: none;
      box-sizing: border-box;
      flex-shrink: 0;
    }
    
    .form-input:focus {
      border-color: #4a90e2;
      background-color: #fff;
    }

    .form-input-ak {
      width: 60px;
      min-width: 60px;
      padding: 2px;
      border: 1px solid #aaa;
      background-color: #f9f9f9;
      font-size: 14px;
      outline: none;
      box-sizing: border-box;
      flex-shrink: 0;
    }
    
    .form-input-ak-last {
      flex: 1;
      min-width: 0; /* Важно! Позволяет элементу сжиматься */
      padding: 2px;
      border: 1px solid #aaa;
      background-color: #f9f9f9;
      font-size: 14px;
      outline: none;
      box-sizing: border-box;
    }

    /* Дополнительный label в последней строке */
    .form-row .form-label + label {
      white-space: nowrap;
      font-weight: normal;
      color: #333;
      flex-shrink: 0;
    }
  </style>
</head>
<body>
  <div class="form-container">
    <div class="form-row">
      <label class="form-label">ФИО</label>
      <input type="text" class="form-input" placeholder="" value="%%{Patient / cFIO}%%" readonly>
      <input type="text" class="form-input-nonflex" placeholder="" value="%%{Patient / Birthday}%%" readonly>
    </div>

    <div class="form-row">
      <label class="form-label">Адрес</label>
      <input type="text" class="form-input" placeholder="" value="%%{Patient / AddressReal / DisplayName}%%" readonly>
    </div>

    <div class="form-row">
      <label class="form-label">Номер телефона</label>
      <input type="text" class="form-input" placeholder="" value="%%{Patient / PhoneNumbersString}%%" readonly>
    </div>

    <div class="form-row">
      <label class="form-label">Документ</label>
      <input type="text" class="form-input" placeholder="" value="%%{Patient / Document}%%" readonly>
    </div>

    <div class="form-row">
      <label class="form-label">Полис ОМС</label>
      <input type="text" class="form-input" placeholder="" value="%%{Patient / OmsPolicyMapped / Number}%%" readonly>
      <input type="text" class="form-input-nonflex" placeholder="" value="%%{Patient / SNILS / Snils}%%" readonly>
    </div>

    <div class="form-row">
      <label class="form-label">Соц. статус</label>
      <input type="text" class="form-input" placeholder="" value="%%{Patient / SocialStatus / DisplayName}%%" readonly>
    </div>

    <div class="form-row">
      <label class="form-label">Место уч/раб</label>
      <input type="text" class="form-input" placeholder="" value="%%{Patient / Job / DisplayName}%%" readonly>
    </div>

    <div class="form-row">
      <label class="form-label">Номер АК</label>
      <input type="text" class="form-input-ak" placeholder="" value="%%{Number}%%" readonly>
      <label>Прикрепление</label>
      <input type="text" class="form-input-ak" placeholder="" value="%%{Patient / cRegistration / LpuMain / Code}%%" readonly>
      <label>Участок</label>
      <input type="text" class="form-input-ak" placeholder="" value="%%{Patient / cRegistration / State / StateNumber}%%" readonly>
      <input type="text" class="form-input-ak-last" placeholder="" value="%%{Patient / cRegistration / Status}%%" readonly>
    </div>
  </div>
</body>
</html>