avtopost.kultmost.ru/templates/profile/partner/competition_member.html
2026-08-17 05:53:53 -04:00

437 lines
26 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{% extends "base.html" %}
{% import "/components/header.html" as header %}
{% import "/components/footer.html" as footer %}
{% import "competition/card.html" as card %}
{% import "components/profile_card.html" as profile_card %}
{% import "components/profile_nav.html" as profile_nav %}
{% block title %}Просмотр картин художника "{{member.username}}" в заявке на конкурс "{{competition.title}}"{% endblock %}
{% block content %}
{{ header.section(user) }}
<section class="c_dg3k4">
<div class="c_gtoe9">
{{ profile_card.profile_card(user) }}
<div class="c_ru432">
{{ profile_nav.profile_nav(user, 'competitions') }}
<!-- <div class="c_3ihvi"><a class="c_ctfod b_289i1" href="/form/competition"><span class="c_d2l0b b_al8e7">Добавить</span></a></div> -->
<div class="c_tihtk" id="main">
<div class="c_y4qo1 b_seqqq">
<a class="c_zc628 b_hf068" href="/profile/partner/competition/{{competition._id}}#main">
<header class="c_33jl3 b_q4al0">
<h2 class="c_b2jz8 b_5ckkw"><svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.86875 9.75L10.0688 13.95L9 15L3 9L9 3L10.0688 4.05L5.86875 8.25H15V9.75H5.86875Z" fill="#5F1798"></path>
</svg> Вернуться</h2>
</header>
</a>
<a class="c_d4rhd b_wy3rt" href="/competition/{{competition._id}}">
<span class="c_4sl8i b_bvl0d">Открыть страницу конкурса</span>
</a>
<div class="c_d4rhd b_wy3rt" id="stop-btn">
<span class="c_4sl8i b_bvl0d">Остановить прием заявок на конкурс</span>
</div>
<a href="/profile/partner/competition/{{competition._id}}#main" id="{{member.id}}">
<div class="c_cvs7y b_bdo54">
<div class="b_rmkjd">
<img class="b_axk6u" src="/a/{{member._id}}" crossorigin="anonymous" fetchpriority="high" loading="eager">
<div class="b_2nlvt">
<p class="b_3dduk">{{member.living_place or ''}}</p>
<p class="b_d1iwe">{{member.username or ''}}</p>
<p class="b_10yj8">{% if 'user' in member.roles %}{{member.grade or ''}}{% endif %}</p>
</div>
</div>
<div class="b_94nsn">
<p class="b_vskv8">Картины {{posts|length}}</p>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M15.1875 14.6875C16.0625 13.8125 16.5 12.75 16.5 11.5C16.5 10.25 16.0625 9.1875 15.1875 8.3125C14.3125 7.4375 13.25 7 12 7C10.75 7 9.6875 7.4375 8.8125 8.3125C7.9375 9.1875 7.5 10.25 7.5 11.5C7.5 12.75 7.9375 13.8125 8.8125 14.6875C9.6875 15.5625 10.75 16 12 16C13.25 16 14.3125 15.5625 15.1875 14.6875ZM10.0875 13.4125C9.5625 12.8875 9.3 12.25 9.3 11.5C9.3 10.75 9.5625 10.1125 10.0875 9.5875C10.6125 9.0625 11.25 8.8 12 8.8C12.75 8.8 13.3875 9.0625 13.9125 9.5875C14.4375 10.1125 14.7 10.75 14.7 11.5C14.7 12.25 14.4375 12.8875 13.9125 13.4125C13.3875 13.9375 12.75 14.2 12 14.2C11.25 14.2 10.6125 13.9375 10.0875 13.4125ZM5.35 16.9625C3.35 15.6042 1.9 13.7833 1 11.5C1.9 9.21667 3.35 7.39583 5.35 6.0375C7.35 4.67917 9.56667 4 12 4C14.4333 4 16.65 4.67917 18.65 6.0375C20.65 7.39583 22.1 9.21667 23 11.5C22.1 13.7833 20.65 15.6042 18.65 16.9625C16.65 18.3208 14.4333 19 12 19C9.56667 19 7.35 18.3208 5.35 16.9625ZM17.1875 15.5125C18.7625 14.5208 19.9667 13.1833 20.8 11.5C19.9667 9.81667 18.7625 8.47917 17.1875 7.4875C15.6125 6.49583 13.8833 6 12 6C10.1167 6 8.3875 6.49583 6.8125 7.4875C5.2375 8.47917 4.03333 9.81667 3.2 11.5C4.03333 13.1833 5.2375 14.5208 6.8125 15.5125C8.3875 16.5042 10.1167 17 12 17C13.8833 17 15.6125 16.5042 17.1875 15.5125Z" fill="#5F1798"/>
</svg>
{% if competition.type_ == 'artist' %}
{% if member.status%}
<div class="b_thlt1">
<span class="b_5dr47">Проходит</span>
</div>
{%else%}
<div class="b_thlt1_2">
<span class="b_5dr47_2">На рассмотрении</span>
</div>
{%endif%}
{% endif %}
</div>
</div>
</a>
<div class="menua">
<a class="icona" href="/artists/{{member._id}}">
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5F1798">
<path
d="M234-276q51-39 114-61.5T480-360q69 0 132 22.5T726-276q35-41 54.5-93T800-480q0-133-93.5-226.5T480-800q-133 0-226.5 93.5T160-480q0 59 19.5 111t54.5 93Zm146.5-204.5Q340-521 340-580t40.5-99.5Q421-720 480-720t99.5 40.5Q620-639 620-580t-40.5 99.5Q539-440 480-440t-99.5-40.5ZM480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm100-95.5q47-15.5 86-44.5-39-29-86-44.5T480-280q-53 0-100 15.5T294-220q39 29 86 44.5T480-160q53 0 100-15.5ZM523-537q17-17 17-43t-17-43q-17-17-43-17t-43 17q-17 17-17 43t17 43q17 17 43 17t43-17Zm-43-43Zm0 360Z" />
</svg>
<span>Профиль</span>
</a>
<a class="icona" href="tel:{{member.phone.split(',')[-1].strip()}}"><svg xmlns="http://www.w3.org/2000/svg" height="24px"
viewBox="0 -960 960 960" width="24px" fill="#5F1798">
<path
d="M162-120q-18 0-30-12t-12-30v-162q0-13 9-23.5t23-14.5l138-28q14-2 28.5 2.5T342-374l94 94q38-22 72-48.5t65-57.5q33-32 60.5-66.5T681-524l-97-98q-8-8-11-19t-1-27l26-140q2-13 13-22.5t25-9.5h162q18 0 30 12t12 30q0 125-54.5 247T631-329Q531-229 409-174.5T162-120Zm556-480q17-39 26-79t14-81h-88l-18 94 66 66ZM360-244l-66-66-94 20v88q41-3 81-14t79-28Zm358-356ZM360-244Z" />
</svg>
<span>{{ member.phone.split(',')[-1].strip() }}</span>
</a>
<a class="icona" href="mailto:{{member.email}}"> <svg xmlns="http://www.w3.org/2000/svg" height="24px"
viewBox="0 -960 960 960" width="24px" fill="#5F1798">
<path
d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480v58q0 59-40.5 100.5T740-280q-35 0-66-15t-52-43q-29 29-65.5 43.5T480-280q-83 0-141.5-58.5T280-480q0-83 58.5-141.5T480-680q83 0 141.5 58.5T680-480v58q0 26 17 44t43 18q26 0 43-18t17-44v-58q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93h200v80H480Zm85-315q35-35 35-85t-35-85q-35-35-85-35t-85 35q-35 35-35 85t35 85q35 35 85 35t85-35Z" />
</svg>
<span>{{member.email}}</span>
</a>
<div class="icona"><span>Написать</span></div>
<div class="icona">
<a class="icona" href="{% if social_vk %}https://vk.ru/im?sel={{social_vk.id}}{%else%}#{%endif%}"
{% if not social_vk %}onclick="showToast({message: 'У пользователя не привязан ВК'})"{%endif%}>
<img src="/static/icons/vk.svg" height="40">
</a>
<a class="icona" href="https://telegram.me/{{member.phone.split(',')[-1].strip()}}">
<img src="/static/icons/tg.svg" height="40">
<!-- <span>Написать в ТГ</span> -->
</a>
<a class="icona" href="https://max.ru/{{member.phone.split(',')[-1].strip()}}">
<img src="/static/icons/max.svg" height="40" style="border-radius: 50% 50% 50% 30%;">
<!-- <span>Написать в MAX</span> -->
</a>
<a class="icona" href="https://wa.me/{{member.phone.split(',')[-1].strip()}}">
<img src="/static/icons/wapp.svg" height="40">
<!-- <span>Написать в WA</span> -->
</a>
</div>
</div>
{% if not member.status %}
<button class="c_fx6lz b_rbvwo pass-btn {%if member.check == false %}hidden{%endif%}" data-status="pass">
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="0.5" y="0.5" width="29" height="29" rx="9" fill="#0ED646" fill-opacity="0.2" />
<rect x="0.5" y="0.5" width="29" height="29" rx="9" stroke="#0ED646" />
<path d="M13 19.4L9 15.4L10.4 14L13 16.6L19.6 10L21 11.4L13 19.4Z" fill="white" />
</svg>
<span class="c_42f14 b_w4gig">Проходит</span>
</button>
<script>
const competitionId = '{{competition._id}}';
const memberId = '{{member._id}}';
const passBtn = document.querySelector('.pass-btn');
const failBtn = document.querySelector('.fail-btn');
async function selectMember(status) {
try {
const response = await fetch('/api/partner/competition/select', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
competition_id: competitionId,
user_id: memberId,
status: status
})
});
if (response.ok) {
showToast({message: 'Уведомление отправлено конкурсанту', duration:3000});
memberinfo.style.display='block'
if (status === 'pass') {
// failBtn.classList.add('hidden');
st = document.querySelector('.b_thlt1_2')
st.classList = 'b_thlt1'
st.querySelector('.b_5dr47_2').classList('b_5dr47')
passBtn.classList.add('hidden');
} else {
passBtn.classList.add('hidden');
// failBtn.classList.add('selected');
}
} else {
showToast({message: 'Ошибка при сохранении', status: 'error', duration:3000});
}
} catch (error) {
console.error('Error:', error);
showToast({message: 'Ошибка соединения', status: 'error', duration:3000});
}
}
passBtn.addEventListener('click', () => selectMember('pass'));
failBtn.addEventListener('click', () => selectMember('fail'));
</script>
{%endif%}
</div>
<div class="c_ntoq3 b_6ycbz">
{% for post in posts %}
<figure class="c_4b1hy b_uu2ub">
<div class="b_1fvkt">
<picture>
<img crossorigin="anonymous" fetchpriority="high" loading="eager" alt="{{ post.title }}" class="b_1fvkt"
src="/b/posts/{{ post.medias[0] }}" data-src="/b/posts/{{ post.medias_original[0] }}">
</picture>
</div>
<figcaption class="c_3g8gh b_pvw5a">
<div class="c_c8wrm b_07qm3">
<div class="b_xz6em"><img class="b_ob59y" src="/a/{{post.user._id}}" crossorigin="anonymous" fetchpriority="high" loading="eager">
<div class="c_9hjdk b_ffruz">
<p class="c_wkstd b_qla2q">{{post.user.living_place or ''}}</p>
<p class="c_zm0m4 b_09est">{{post.user.username}}</p>
<p class="c_wkstd b_qla2q">{{post.grade or ''}}</p>
</div>
</div>
<header class="c_v6850 b_hl9hh">
<h2 class="c_9hvtd b_f5fb2">{{post.title}}</h2>
</header>
<div class="c_yn9r0 b_sq9vg">
<p class="c_i6v7p b_x0s7s">{{post.size}}</p>
<p class="c_ciefo b_tob1o">{{post.description}}</p>
</div>
<p class="c_6cezu b_6spaf">Подробнее</p>
</div>
<p class="c_82q4g b_s9h8y">{{ (post.competition.generation_time.strftime('%d.%m.%Y')) if
post.competition
else ''}}</p>
</figcaption>
</figure>
{% endfor %}
</div>
</div>
</div>
</div>
</section>
<script defer>
document.querySelectorAll('.c_6cezu.b_6spaf').forEach(toggle => {
toggle.addEventListener('click', () => {
const parent = toggle.parentElement; // ваш parent
const secondDiv = parent.querySelectorAll('div')[2];
const secondP = secondDiv.querySelectorAll('p')[1];
const isClamped = secondP.classList.contains('clamp');
if (isClamped) {
secondP.classList.remove('clamp');
toggle.textContent = 'Подробнее';
} else {
secondP.classList.add('clamp');
toggle.textContent = 'Скрыть';
}
});
});
</script>
<script>
const competition_id = '{{competition._id}}';
document.querySelectorAll('.b_k2cle button').forEach(button => {
button.addEventListener('click', async function () {
const parent = this.parentElement; // .c_0ajvr
if (!parent) return;
// Remove active from all buttons
parent.querySelectorAll('button').forEach(btn => btn.classList.remove('active'));
// Make clicked button active
this.classList.add('active');
// Prepare payload
const payload = {
status: this.textContent.trim(),
post_id: this.dataset.post_id,
competition_id: competition_id
};
try {
const res = await fetch('/api/partner/competition/request', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(payload)
});
if (!res.ok) {
// handle server error (optional)
console.error('Request failed', res.status, await res.text());
} else {
// optional: handle success response
const data = await res.json().catch(() => null);
console.log('Success', data);
}
} catch (err) {
console.error('Network/error sending request', err);
}
// Hide other buttons
parent.querySelectorAll('button').forEach(btn => {
if (btn !== this) btn.classList.add('hidden');
});
});
});
</script>
{{ footer.section(user) }}
{% endblock %}
{% block head %}
{{ header.style() }}
{{card.style()}}
{{ profile_nav.style() }}
<style>
.c_d4rhd { cursor: pointer; box-shadow: 0 4px 14px -4px rgba(95,23,152,.5); transition: transform .18s, box-shadow .18s, background .18s; }
.c_d4rhd:hover { background: #6d1ba9; transform: translateY(-2px); box-shadow: 0 10px 24px -6px rgba(95,23,152,.6); }
.c_d4rhd:active { transform: translateY(0); box-shadow: 0 4px 12px -4px rgba(95,23,152,.5); }
@media (prefers-reduced-motion: reduce) { .c_d4rhd:hover, .c_d4rhd:active { transform: none; } }
.b_thlt1 { align-items: center; background: rgba(14, 214, 70, 0.20); border-radius: 30px; display: flex; justify-content: center; padding: 1.5px 10px; }
.b_5dr47 { color: #0ED646; font-family: Inter; font-size: 12px; font-style: normal; font-weight: 700; line-height: normal; }
.b_thlt1_2 { align-items: center; background: rgba(95, 23, 152, 0.20); border-radius: 30px; display: flex; justify-content: center; padding: 1.5px 10px; }
.b_5dr47_2 { color: #5F1798; font-family: Inter; font-size: 12px; font-style: normal; font-weight: 700; line-height: normal; }
/* Активное состояние */
.c_fx6lz.active,
.c_deket.active {
width: 100% !important;
flex: 1 1 100%;
}
/* Скрываем неактивную кнопку */
.c_fx6lz.hidden,
.c_deket.hidden {
display: none;
}
.menua{width: 100%;
display: flex;
flex-direction: column;
gap: 7px;
margin: 10px 20px;}
.b_aafot { border-radius: 50%; height: 70px; min-width: 70px; object-fit: cover; max-width: 170px; object-position: top;}
.b_6e4lx { width: 100%; text-align: center; color: #000; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; }
.b_84c5q { background: #fff; border-radius: 50%; align-items: center; aspect-ratio: 1/1; bottom: 0; display: flex; height: 20px; justify-content: center; position: absolute; right: 0; width: 20px; }
.b_84c5q {
background: #fff;
border-radius: 50%;
align-items: center;
aspect-ratio: 1/1;
bottom: 0;
display: flex;
height: 20px;
justify-content: center;
right: 0;
width: 24px;
}
.b_aspvt { align-items: center; display: flex; gap: 10px; }
.b_le4se { align-items: center; align-self: stretch; display: flex; gap: 10px; }
.b_8650w { fill: #5F1798; height: 12px; width: 12px; }
.b_thj0f { height: 18px; width: 18px; }
.icona{display: flex;
gap: 10px;
align-items: center;}
.icona>span{color: #5F1798;}
.b_8i3gf { color: #5F1798; font-family: Inter; font-size: 12px; font-style: normal; font-weight: 700; line-height: normal; }
.b_hyq4a { align-items: center; background: rgba(95, 23, 152, 0.20); border-radius: 30px; display: flex; justify-content: center; padding: 0 10px; }
.b_ttzl3 { color: #0ED646; font-family: Inter; font-size: 12px; font-style: normal; font-weight: 700; line-height: normal; }
.b_sqm8o { align-items: center; background: rgba(14, 214, 70, 0.20); border-radius: 30px; display: flex; justify-content: center; padding: 1.5px 10px; }
.b_q1zds { align-items: flex-start; display: flex; gap: 10px; }
.b_5ckkw { color: #000; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; }
.b_q4al0 { align-items: center; align-self: stretch; display: flex; }
.b_hf068 { align-items: flex-start; background: #FFF; border-radius: 10px; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 20px 0 rgba(0, 0, 0, 0.20); display: flex; flex-direction: column; gap: 10px; justify-content: center; padding: 10px 20px; width: 335px; }
.b_bvl0d { color: #FFF; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; }
.b_wy3rt { align-items: center; background: #5F1798; border-radius: 5px; display: flex; justify-content: center; padding: 15px 0; width: 335px; }
.b_seqqq { align-content: center; align-items: center; align-self: stretch; display: flex; flex-wrap: wrap; gap: 20px; }
.b_1fvkt { align-self: stretch; border-radius: 5px; flex-shrink: 0; }
.b_ob59y { border-radius: 1em; height: 70px; min-width: 70px; max-width: 150px; vertical-align: top; object-fit: cover;}
.b_qla2q { -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: #000; display: -webkit-box; font-family: Inter; font-size: 13px; font-style: normal; font-weight: 400; line-height: normal; overflow: hidden; text-overflow: ellipsis; }
.b_09est { color: #000; font-family: Inter; font-size: 15px; font-style: normal; font-weight: 700; line-height: normal; }
.b_ffruz { align-items: flex-start; display: flex; flex-direction: column; flex: 1 0 0; justify-content: center; }
.b_xz6em { align-items: center; align-self: stretch; display: flex; gap: 13px; }
.b_f5fb2 { color: #000; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; }
.b_hl9hh { align-items: center; display: flex; }
.b_x0s7s { color: #3A3A3A; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 400; line-height: normal; }
.b_tob1o { -webkit-box-orient: vertical; -webkit-line-clamp: 2; color: #3A3A3A; display: -webkit-box; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 400; line-height: normal; overflow: hidden; text-overflow: ellipsis; }
.b_sq9vg { align-items: flex-start; display: flex; flex-direction: column; gap: 3px; }
.b_6spaf { color: #5F1798; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; }
.b_07qm3 { align-items: flex-start; align-self: stretch; display: flex; flex-direction: column; gap: 10px; }
.b_x7rs8 { fill: #FFF; height: 9.4px; width: 12px; }
.b_azehi { flex-shrink: 0; height: 24px; width: 24px; }
.b_j8dal { align-items: center; background: rgba(14, 214, 70, 0.20); border-radius: 9.5px; border: 1px solid #0ED646; display: flex; height: 30px; justify-content: center; padding: 3px; width: 30px; }
.b_w4gig { color: #000; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; }
.b_rbvwo { width: 335px; align-items: center; background: rgba(14, 214, 70, 0.10); border-radius: 5px; border: 1px solid #0ED646; display: flex; flex: 1 0 0; gap: 8px; justify-content: center; padding: 8px 0; }
.b_tepda { fill: #FFF; height: 14px; width: 14px; }
.b_l2e99 { align-items: center; background: rgba(220, 53, 69, 0.20); border-radius: 9.5px; border: 1px solid #DC3545; display: flex; height: 30px; justify-content: center; padding: 3px; width: 30px; }
.b_xi2or { -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: #000; display: -webkit-box; font-family: Inter; font-size: 10px; font-style: normal; font-weight: 400; line-height: normal; overflow: hidden; text-overflow: ellipsis; }
.b_mhif2 { width: 335px; align-items: center; background: rgba(220, 53, 69, 0.10); border-radius: 5px; border: 1px solid #DC3545; display: flex; flex: 1 0 0; gap: 8px; justify-content: center; padding: 8px 0; }
.b_k2cle { align-items: flex-start; align-self: stretch; display: flex; gap: 10px; }
.b_s9h8y { bottom: 10px; color: rgba(58, 58, 58, 0.75); font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; position: absolute; right: 10px; text-align: right; }
.b_pvw5a { align-items: flex-start; align-self: stretch; display: flex; flex-direction: column; flex: 1 0 0; justify-content: space-between; padding: 10px 20px 37px 20px; }
.b_uu2ub { align-items: flex-start; background: #FDFAFF; border-radius: 5px; border: 1px solid #5F1798; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 20px 0 rgba(0, 0, 0, 0.20); display: flex; flex-direction: column; width: 335px; }
.b_1ucb2 { align-self: stretch; border-radius: 5px; flex-shrink: 0; }
.b_9x6uc { align-items: flex-start; align-self: stretch; display: flex; flex-direction: column; flex: 1 0 0; justify-content: space-between; padding: 10px 20px 37px 20px; }
.b_nzwgs { align-items: flex-start; background: #FDFAFF; border-radius: 5px; border: 1px solid #5F1798; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 20px 0 rgba(0, 0, 0, 0.20); display: flex; flex-direction: column; height: 532px; width: 335px; }
.b_6ycbz { align-content: flex-start; align-items: flex-start; align-self: stretch; display: flex; flex-wrap: wrap; gap: 20px; justify-content: center;}
.b_bdo54 { align-items: flex-start; background: #FFF; border-radius: 10px; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 20px 0 rgba(0, 0, 0, 0.20); display: flex; flex-direction: column; gap: 10px; justify-content: center; padding: 10px 20px; width: 335px; }
.b_rmkjd { align-items: center; align-self: stretch; display: flex; gap: 13px; }
.b_axk6u { aspect-ratio: 1/1; border-radius: 1em; height: 70px; width: 70px; object-fit: cover; }
.b_2nlvt { align-items: flex-start; display: flex; flex-direction: column; flex: 1 0 0; justify-content: center; }
.b_3dduk { color: #3A3A3A; font-family: Inter; font-size: 14px; font-style: italic; font-weight: 400; line-height: normal; }
.b_d1iwe { -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: #000; display: -webkit-box; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 700; line-height: normal; overflow: hidden; text-overflow: ellipsis; }
.b_10yj8 { -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: #000; display: -webkit-box; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; overflow: hidden; text-overflow: ellipsis; }
.b_94nsn { align-items: center; align-self: stretch; display: flex; gap: 10px; }
.b_vskv8 { color: #5F1798; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; }
/* Mobile */
@media (max-width: 699px) {
.b_1fvkt { align-self: stretch; border-radius: 5px; flex-shrink: 0;}
.c_y4qo1 { align-content: flex-start; align-items: flex-start; align-self: stretch; display: flex; flex-wrap: wrap; gap: 20px; justify-content: center; }
.c_kfo3i { align-self: stretch; border-radius: 5px; flex-shrink: 0; height: 334px; }
.c_3g8gh { align-items: flex-start; align-self: stretch; display: flex; flex-direction: column; flex-shrink: 0; height: 311px; justify-content: space-between; padding: 10px 20px 37px 20px; }
.c_4b1hy { align-items: flex-start; background: #FDFAFF; border-radius: 5px; border: 1px solid #5F1798; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 20px 0 rgba(0, 0, 0, 0.20); display: flex; flex-direction: column; width: 335px; }
.c_cngvx { align-self: stretch; border-radius: 5px; }
.c_rlt8j { align-items: flex-start; align-self: stretch; display: flex; flex-direction: column; height: 311px; justify-content: space-between; padding: 10px 20px 37px 20px; }
.c_qqh2e { align-items: flex-start; background: #FDFAFF; border-radius: 5px; border: 1px solid #5F1798; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 20px 0 rgba(0, 0, 0, 0.20); display: flex; flex-direction: column; width: 335px; }
.c_ntoq3 { align-content: flex-start; align-items: flex-start; align-self: stretch; display: flex; flex-wrap: wrap; gap: 20px; justify-content: center; }
.c_jcujv { align-items: center; background: #FFF; display: flex; flex-direction: column; gap: 30px; width: 375px; }
}
/* Tablet */
@media (min-width: 700px) and (max-width: 900px) {
.c_jcujv { align-items: flex-start; background: #FFF; display: flex; flex-direction: column; gap: 30px; padding-left: 50px; width: 800px; }
}
/* Desktop */
@media (min-width: 901px) {
.c_b2jz8 { -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: #000; display: -webkit-box; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; overflow: hidden; text-overflow: ellipsis; }
.c_jcujv { align-items: flex-start; background: #FFF; display: flex; flex-direction: column; gap: 30px; padding-left: 100px; width: 1600px; }
}</style>
<style>
/* Mobile */
@media (max-width: 699px) {
.c_mrl59 { align-items: center; background: #5F1798; border-radius: 25px; bottom: -15px; display: flex; height: 50px; justify-content: center; position: absolute; right: -15px; width: 50px; }
}
/* Tablet */
@media (min-width: 700px) and (max-width: 900px) {
.c_iiehk { align-items: center; border-radius: 5px; display: flex; flex-direction: column; gap: 20px; width: 335px; }
.c_nnsh6>a>img{display: none;}
.c_cvs7y { align-items: flex-start; background: #FFF; border-radius: 10px; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 20px 0 rgba(0, 0, 0, 0.20); display: flex; flex-direction: column; gap: 10px; justify-content: center; padding: 10px 20px; width: 340px; }
}
/* Desktop */
@media (min-width: 901px) {
.c_iiehk { align-items: flex-end; border-radius: 5px; display: flex; flex-direction: column; gap: 20px; width: 310px; }
.c_nnsh6>a>img{display: none;}
}.clamp{-webkit-line-clamp: unset;}</style>
{{ footer.style() }}
{% endblock %}