сделал левую часть в регистрации (для пк)

assets/css/gp-style-core.css

@@ -101,6 +101,7 @@
     --text-dark: #2b2b3b;
     --text-grey: #999;
     --text-red: #fa0505;
+    --text-green: #2ED15D;
     --text-0: #000;
     --text-3: #333;
     --text-6: #666;
@@ -109,6 +110,9 @@
     --background-white: #fff;
     --background-black: #121212;
     --background-grey: #f2f2f2;
+    --background-green: #2ED15D;
+    --background-9: #999;
+
 
     /* gradient */
     --gradient-blue: radial-gradient(346.57% 244.17% at 149.73% -58.39%, rgb(15, 88, 129) 0%, rgb(30, 164, 156) 51.21689438819885%, rgb(118, 206, 117) 80.70731163024902%, rgb(236, 243, 159) 91.14583134651184%);

assets/css/gp-style-desktop.css

@@ -1260,6 +1260,240 @@ main{
 
 /* gallery */
 
+
+/* registration */
+.registration{
+  padding: 24px;
+
+  display: flex;
+  justify-content: space-between;
+}
+.registration__orders{
+  width: calc((100% - 48px) / 3);
+}
+.registration__profile{
+  width: calc(((100% - 48px) / 3) * 2);
+}
+
+.registration-card{
+  margin-top: 32px;
+
+  padding: 1px;
+
+  border-radius: 20px;
+}
+.registration-card:first-child{
+  margin-top: 0;
+}
+.registration-card--green{
+  background: var(--background-green);
+}
+.registration-card--red-blue{
+  background: var(--gradient-red);
+}
+.registration-card__content{
+  padding: 23px;
+
+  border-radius: 19px;
+
+  background-color: var(--background-white);
+}
+.registration-card__element{
+  margin-top: 24px;
+
+  position: relative;
+}
+.registration-card__element--margin-top-32{
+  margin-top: 32px;
+}
+.registration-card__element:first-child,
+.registration-card__element--margin-top-32:first-child{
+  margin-top: 0
+}
+.registration-card__element-change{
+  position: absolute;
+  top: 14px;
+  right: 0;
+
+  width: 24px;
+  aspect-ratio: 1;
+
+  background-image: url(../img/svg/main/change-dot.svg);
+  border: none;
+  background-color: var(--background-white);
+
+  transition: opacity .2s ease-out;
+}
+.registration-card__element-change:hover{
+  opacity: .8;
+}
+.registration-card__text{
+  font-family: var(--font-family);
+  font-weight: 500;
+  font-size: 20px;
+  line-height: 120%;
+
+  color: var(--text-black);
+}
+.registration-card__text--grey{
+  color: var(--text-grey);
+}
+.registration-card__label{
+  font-family: var(--font-family);
+  font-weight: 700;
+  font-size: 16px;
+  line-height: 125%;
+
+  color: var(--text-3);
+}
+.registration-card__status{
+  padding-left: 20px;
+
+  font-family: var(--font-family);
+  font-weight: 500;
+  font-size: 12px;
+  line-height: 133%;
+
+  position: relative;
+}
+.registration-card__status--chek{
+  color: var(--text-green);
+}
+.registration-card__status--chek::before{
+  content: '';
+
+  position: absolute;
+  top: 0;
+  left: 0;
+
+  width: 16px;
+  height: 16px;
+
+  background-image: url(../img/svg/main/status-chek.svg);
+  object-fit: contain;
+}
+.registration-card__status--cancelled{
+  color: var(--text-red);
+}
+.registration-card__status--cancelled::before{
+  content: '';
+
+  position: absolute;
+  top: 0;
+  left: 0;
+
+  width: 16px;
+  height: 16px;
+
+  background-image: url(../img/svg/main/status-cancelled.svg);
+  object-fit: contain;
+}
+.registration-card__block-accounts{
+  display: flex;
+}
+.registration-card__account{
+  margin-left: 16px;
+
+  width: 40px;
+  aspect-ratio: 1;
+
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  background: var(--background-9);
+  border-radius: 50%;
+}
+.registration-card__account:first-child{
+  margin-left: 0;
+}
+.registration-card__block-buttons{
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.registration-card__button{
+  padding: 8px 8px 6px 0;
+
+  font-family: var(--font-family);
+  font-weight: 600;
+  font-size: 20px;
+  line-height: 120%;
+  color: var(--text-black);
+
+  background: none;
+  border: none;
+
+  position: relative;
+}
+.registration-card__button::before{
+  content: '';
+
+  position: absolute;
+  bottom: 6px;
+
+  width: calc(100% - 8px);
+  height: 1px;
+
+  background: var(--text-black);
+
+  transition: opacity .2s ease-out;
+}
+.registration-card__button:hover{
+  opacity: .8;
+}
+.registration-card__text, .registration-card__label, .registration-card__status, .registration-card__block-accounts, .registration-card__block-buttons{
+  margin-top: 8px;
+}
+.registration-card__text:first-child, .registration-card__label:first-child, .registration-card__status:first-child, .registration-card__block-accounts:first-child, .registration-card__block-buttons:first-child{
+  margin-top: 0px;
+}
+.registration-card__block-add-pets{
+  width: 100%;
+
+  display: flex;
+  align-items: center;
+
+  background: none;
+  border: none;
+}
+.registration-card-add-pets__circle{
+  width: 48px;
+  aspect-ratio: 1;
+
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  border: 1px solid var(--text-6);
+  border-radius: 50%;
+}
+.registration-card-add-pets__text{
+  margin-left: 16px;
+
+  font-family: var(--font-family);
+  font-weight: 600;
+  font-size: 20px;
+  line-height: 120%;
+
+  color: var(--text-6);
+
+  position: relative;
+}
+.registration-card-add-pets__text::after{
+  content: '';
+
+  position: absolute;
+  left: 0;
+  bottom: -4px;
+
+  width: 100%;
+  height: 1px;
+
+  background: var(--text-6);
+}
+/* registration */
+
 @media only screen and (max-width: 1600px) {
 
 .wrapper{

assets/img/svg/main/change-dot.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11.2929 5.70711C11.1054 5.51957 11 5.26522 11 5C11 4.73478 11.1054 4.48043 11.2929 4.29289C11.4804 4.10536 11.7348 4 12 4C12.2652 4 12.5196 4.10536 12.7071 4.29289C12.8946 4.48043 13 4.73478 13 5C13 5.26522 12.8946 5.51957 12.7071 5.70711C12.5196 5.89464 12.2652 6 12 6C11.7348 6 11.4804 5.89464 11.2929 5.70711ZM11 12C11 12.2652 11.1054 12.5196 11.2929 12.7071C11.4804 12.8946 11.7348 13 12 13C12.2652 13 12.5196 12.8946 12.7071 12.7071C12.8946 12.5196 13 12.2652 13 12C13 11.7348 12.8946 11.4804 12.7071 11.2929C12.5196 11.1054 12.2652 11 12 11C11.7348 11 11.4804 11.1054 11.2929 11.2929C11.1054 11.4804 11 11.7348 11 12ZM11 19C11 19.2652 11.1054 19.5196 11.2929 19.7071C11.4804 19.8946 11.7348 20 12 20C12.2652 20 12.5196 19.8946 12.7071 19.7071C12.8946 19.5196 13 19.2652 13 19C13 18.7348 12.8946 18.4804 12.7071 18.2929C12.5196 18.1054 12.2652 18 12 18C11.7348 18 11.4804 18.1054 11.2929 18.2929C11.1054 18.4804 11 18.7348 11 19Z" fill="#121212"/>
+</svg>

assets/img/svg/main/google-white.svg

@@ -0,0 +1,6 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M19.7875 10.2271C19.7875 9.51801 19.7239 8.83619 19.6057 8.18164H10.1875V12.0498H15.5693C15.3375 13.2998 14.633 14.3589 13.5739 15.068V17.5771H16.8057C18.6966 15.8362 19.7875 13.2726 19.7875 10.2271Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M10.1864 20.0004C12.8864 20.0004 15.15 19.105 16.8046 17.5777L13.5728 15.0686C12.6773 15.6686 11.5318 16.0231 10.1864 16.0231C7.58183 16.0231 5.37728 14.264 4.59092 11.9004H1.25V14.4913C2.89546 17.7595 6.27728 20.0004 10.1864 20.0004Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.59205 11.8997C4.39205 11.2997 4.27842 10.6588 4.27842 9.99971C4.27842 9.34062 4.39205 8.6997 4.59205 8.0997V5.50879H1.25114C0.573864 6.85879 0.1875 8.38607 0.1875 9.99971C0.1875 11.6133 0.573864 13.1406 1.25114 14.4906L4.59205 11.8997Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M10.1864 3.97728C11.6546 3.97728 12.9728 4.48183 14.0091 5.47274L16.8773 2.60455C15.1455 0.990911 12.8818 0 10.1864 0C6.27728 0 2.89546 2.24091 1.25 5.5091L4.59092 8.10002C5.37728 5.73638 7.58183 3.97728 10.1864 3.97728Z" fill="white"/>
+</svg>

assets/img/svg/main/plus-grey.svg

@@ -0,0 +1,11 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_178_5112)">
+<path d="M12 5V19" stroke="#666666" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M5 12H19" stroke="#666666" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<clipPath id="clip0_178_5112">
+<rect width="24" height="24" fill="white"/>
+</clipPath>
+</defs>
+</svg>

assets/img/svg/main/status-cancelled.svg

@@ -0,0 +1,3 @@
+<svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M8.5 1.5C7.64641 1.5 6.80117 1.66813 6.01256 1.99478C5.22394 2.32144 4.50739 2.80023 3.90381 3.40381C3.30023 4.00739 2.82144 4.72394 2.49478 5.51256C2.16813 6.30117 2 7.14641 2 8C2 8.85359 2.16813 9.69883 2.49478 10.4874C2.82144 11.2761 3.30023 11.9926 3.90381 12.5962C4.50739 13.1998 5.22394 13.6786 6.01256 14.0052C6.80117 14.3319 7.64641 14.5 8.5 14.5C9.35359 14.5 10.1988 14.3319 10.9874 14.0052C11.7761 13.6786 12.4926 13.1998 13.0962 12.5962C13.6998 11.9926 14.1786 11.2761 14.5052 10.4874C14.8319 9.69883 15 8.85359 15 8C15 7.14641 14.8319 6.30117 14.5052 5.51256C14.1786 4.72394 13.6998 4.00739 13.0962 3.40381C12.4926 2.80023 11.7761 2.32144 10.9874 1.99478C10.1988 1.66813 9.35359 1.5 8.5 1.5ZM6.39524 2.91866C7.06253 2.64226 7.77773 2.5 8.5 2.5C9.22227 2.5 9.93747 2.64226 10.6048 2.91866C11.272 3.19506 11.8784 3.60019 12.3891 4.11091C12.8998 4.62164 13.3049 5.22795 13.5813 5.89524C13.8577 6.56253 14 7.27773 14 8C14 8.72227 13.8577 9.43747 13.5813 10.1048C13.3049 10.772 12.8998 11.3784 12.3891 11.8891C11.8784 12.3998 11.272 12.8049 10.6048 13.0813C9.93747 13.3577 9.22227 13.5 8.5 13.5C7.77773 13.5 7.06253 13.3577 6.39524 13.0813C5.72795 12.8049 5.12164 12.3998 4.61091 11.8891C4.10019 11.3784 3.69506 10.772 3.41866 10.1048C3.14226 9.43747 3 8.72227 3 8C3 7.27773 3.14226 6.56253 3.41866 5.89524C3.69506 5.22795 4.10019 4.62163 4.61091 4.11091C5.12163 3.60019 5.72795 3.19506 6.39524 2.91866ZM7.52022 6.31311C7.32496 6.11785 7.00838 6.11785 6.81311 6.31311C6.61785 6.50838 6.61785 6.82496 6.81311 7.02022L7.79289 8L6.81311 8.97978C6.61785 9.17504 6.61785 9.49162 6.81311 9.68689C7.00838 9.88215 7.32496 9.88215 7.52022 9.68689L8.5 8.70711L9.47978 9.68689C9.67504 9.88215 9.99162 9.88215 10.1869 9.68689C10.3821 9.49162 10.3821 9.17504 10.1869 8.97978L9.20711 8L10.1869 7.02022C10.3821 6.82496 10.3821 6.50838 10.1869 6.31311C9.99162 6.11785 9.67504 6.11785 9.47978 6.31311L8.5 7.29289L7.52022 6.31311Z" fill="#F60909"/>
+</svg>

assets/img/svg/main/status-chek.svg

@@ -0,0 +1,3 @@
+<svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M8.5 1.5C7.64641 1.5 6.80117 1.66813 6.01256 1.99478C5.22394 2.32144 4.50739 2.80023 3.90381 3.40381C3.30023 4.00739 2.82144 4.72394 2.49478 5.51256C2.16813 6.30117 2 7.14641 2 8C2 8.85359 2.16813 9.69883 2.49478 10.4874C2.82144 11.2761 3.30023 11.9926 3.90381 12.5962C4.50739 13.1998 5.22394 13.6786 6.01256 14.0052C6.80117 14.3319 7.64641 14.5 8.5 14.5C9.35359 14.5 10.1988 14.3319 10.9874 14.0052C11.7761 13.6786 12.4926 13.1998 13.0962 12.5962C13.6998 11.9926 14.1786 11.2761 14.5052 10.4874C14.8319 9.69883 15 8.85359 15 8C15 7.14641 14.8319 6.30117 14.5052 5.51256C14.1786 4.72394 13.6998 4.00739 13.0962 3.40381C12.4926 2.80023 11.7761 2.32144 10.9874 1.99478C10.1988 1.66813 9.35359 1.5 8.5 1.5ZM6.39524 2.91866C7.06253 2.64226 7.77773 2.5 8.5 2.5C9.22227 2.5 9.93747 2.64226 10.6048 2.91866C11.272 3.19506 11.8784 3.60019 12.3891 4.11091C12.8998 4.62164 13.3049 5.22795 13.5813 5.89524C13.8577 6.56253 14 7.27773 14 8C14 8.72227 13.8577 9.43747 13.5813 10.1048C13.3049 10.772 12.8998 11.3784 12.3891 11.8891C11.8784 12.3998 11.272 12.8049 10.6048 13.0813C9.93747 13.3577 9.22227 13.5 8.5 13.5C7.77773 13.5 7.06253 13.3577 6.39524 13.0813C5.72795 12.8049 5.12164 12.3998 4.61091 11.8891C4.10019 11.3784 3.69506 10.772 3.41866 10.1048C3.14226 9.43747 3 8.72227 3 8C3 7.27773 3.14226 6.56253 3.41866 5.89524C3.69506 5.22795 4.10019 4.62163 4.61091 4.11091C5.12163 3.60019 5.72795 3.19506 6.39524 2.91866ZM10.8536 7.02022C11.0488 6.82496 11.0488 6.50838 10.8536 6.31311C10.6583 6.11785 10.3417 6.11785 10.1464 6.31311L7.83333 8.62623L6.85355 7.64645C6.65829 7.45118 6.34171 7.45118 6.14645 7.64645C5.95118 7.84171 5.95118 8.15829 6.14645 8.35355L7.47978 9.68689C7.67504 9.88215 7.99162 9.88215 8.18689 9.68689L10.8536 7.02022Z" fill="#2ED15D"/>
+</svg>

assets/img/svg/main/vk-white.svg

@@ -0,0 +1,3 @@
+<svg width="22" height="14" viewBox="0 0 22 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.9825 14C4.46596 14 0.178638 8.74474 0 0H3.76515C3.88882 6.41842 6.66459 9.13714 8.86321 9.6977V0H12.4085V5.53553C14.5796 5.2973 16.8607 2.77477 17.6302 0H21.1755C20.8855 1.43908 20.3075 2.80165 19.4776 4.0025C18.6477 5.20335 17.5837 6.21663 16.3523 6.97898C17.7269 7.67555 18.941 8.6615 19.9145 9.87175C20.888 11.082 21.5988 12.489 22 14H18.0974C17.7373 12.6876 17.0054 11.5128 15.9934 10.6228C14.9814 9.73284 13.7343 9.16727 12.4085 8.997V14H11.9825Z" fill="white"/>
+</svg>

assets/img/svg/main/ya-white.svg

@@ -0,0 +1,3 @@
+<svg width="14" height="20" viewBox="0 0 14 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10.1991 2.77628H8.65909C5.83576 2.77628 4.35076 4.20628 4.35076 6.31461C4.35076 8.69794 5.37742 9.81461 7.48576 11.2463L9.22742 12.4196L4.22242 19.8979H0.482422L4.97409 13.2079C2.39076 11.3563 0.940755 9.55794 0.940755 6.51628C0.940755 2.70294 3.59909 0.0996094 8.64076 0.0996094H13.6458V19.8796H10.1991V2.77628Z" fill="white"/>
+</svg>