/* /profiles/profilePages.css */


body {
background:#fff;
font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
color:#000;
margin:0;
padding:10px;
line-height:1.4;
}
.page {
margin:0 auto;
max-width: 1200px;
}
.header {
display: flex;
flex-wrap: wrap;
line-height: 1.2;
gap: 0;
border-radius: 20px;
background: #f1f1f1;
padding: 20px;
min-height: 110px;
margin: 60px 0 0 0;
background: linear-gradient(45deg, #f4f5fb, #fff5f9);
background: #f6f7f9;
}
.username {
display: block;
letter-spacing: -3px;
line-height: 1;
margin: -4px 30px 10px 0;
font-size: 50px;
}
.username-seller {
display: block;
font-size: 50px;
color: black;
letter-spacing: -3px;
}
.username-category {
display: block;
font-size: 11px;
font-weight: 300;
letter-spacing: 0px;
line-height: 1;
text-transform: uppercase;
margin: 0px 0px 10px 0px;
text-align: center;
}
.about {
max-width: 880px;
color: #00000094;
line-height: 1.2;
font-weight: 400;
font-size: 13px;
white-space: pre-wrap;
width: -webkit-fill-available;
}
.about:hover{
background: white;
}
.about-edit-btn {
font-size: 10px;
text-transform: none;
padding: 4px 8px;
border-radius: 9999px;
border: 1px solid rgba(0,0,0,.2);
background: rgba(255,255,255,.8);
cursor: pointer;
}
.about-edit-btn:hover {
background: #ffffff;
}
.search-profilepages {
display:block;
width:100%;
box-sizing:border-box;
padding:12px 14px;
border:1px solid #e5e7eb;
border-radius:12px;
font-size:16px;
outline: 0;
}
.search-profilepages-but {
margin-top:8px;
padding:10px 14px;
border:1px solid #e5e7eb;
border-radius:10px;
position:absolute;
top:-5px;
right:4px;
cursor: pointer;
outline: 0;
}


.section {
margin: 0 0 30px 0;
}
.section-title {
font-size: 26px;
font-weight: 500;
margin: 20px 0px;
line-height: 1;
text-align: center;
}
.list {
list-style:none;
margin:0;
padding:0;
}
.chat-item {
padding:10px 12px;
border:1px solid #e5e7eb;
border-radius:10px;
margin-bottom:10px;
background:#fafafa;
}
.chat-item a {
color:#111;
text-decoration:none;
font-weight:500;
display:block;
}
.chat-meta {
font-size:12px;
color:#555;
margin-top:4px;
}
.products {
list-style: none;
margin: 0;
padding: 0;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(191px, 1fr));
gap: 10px;
}
.products li {
box-shadow: 0px 0px 20px 0px #00355b33;
border-radius: 20px;
}
.product-card {
border-radius: 12px;
text-decoration: none;
color: #111;
display: flex;
flex-direction: column;
overflow: hidden;
}
.product-card img {
display:block;
width:100%;
height:auto;
aspect-ratio: 3 / 4;
object-fit: cover;  
margin-bottom: 10px;
border-radius: 20px;
background:#f6f7f9; 
max-width: 400px;
}

.product-title {
font-size: 11px;
margin: 0px 20px 0px 20px;
line-height: 1.2;
font-weight: 300;
}
.product-price {
font-size: 17px;
margin: 0px 20px 10px 20px;
}
.product-empty {
font-size:14px;
color:#666;
}
.shop-more {
text-align:right;
font-size:14px;
margin-top:12px;
}
.shop-more a {
text-decoration:none;
color:#2563eb;
}

/* Интерактивность карточек: мягкие ховеры и видимый фокус */
.product-card {
transition: box-shadow .15s ease, transform .03s ease;
}
.product-card:hover {
box-shadow: 0 6px 24px rgba(17,17,17,.06);
transform: translateY(-1px);
}
.product-card:focus-visible {
outline: 2px solid #2563eb;
outline-offset: 3px;
border-radius: 14px;
}


.footer-note {
font-size: 14px;
    color: #434343;
    margin: 0 auto;
    text-align: center;
    max-width: 450px;
    background: #f3f4f7;
    padding: 30px;
    border-radius: 20px;
}


/* Категории (чипсы) */
.categories {
display:flex;
flex-wrap:wrap;
gap:8px;
padding:0;
list-style:none;
margin:16px 0;
}
.category-link {
display: inline-block;
padding: 8px 12px;
border: 0;
border-radius: 999px;
background: #edeff3;
color: #111;
text-decoration: none;
font-size: 11px;
line-height: 1;
}

.category-link:hover {
background: #ffffff;
box-shadow: 0px 0px 0px 1px black;
}

.category-link:active {
transform: translateY(1px);
}

.category-link.active {
background: #111;
color: #fff;
border-color: #111;
}

.category-link:focus-visible {
outline: 2px solid #2563eb;
outline-offset: 2px;
}



/* Пагинация на страницах категорий */
.pager {
display:flex;
gap:12px;
align-items:center;
justify-content:center;
margin: 16px 0 0 0;
}
.pager-link {
display:inline-block;
padding:8px 12px;
border:1px solid #e5e7eb;
border-radius:10px;
background:#fafafa;
color:#111;
text-decoration:none;
font-size:14px;
line-height:1;
transition: background .15s ease, border-color .15s ease, transform .05s ease;
}
.pager-link:hover { background:#f3f4f6; border-color:#d1d5db; }
.pager-link:active { transform: translateY(1px); }
.pager-link:focus-visible { outline:2px solid #2563eb; outline-offset:2px; }




@media (max-width: 935px) {
.products {grid-template-columns: repeat(auto-fit, minmax(176px, 1fr));  }  
}

@media (max-width: 600px) {
.products {grid-template-columns: repeat(auto-fit, minmax(136px, 1fr));  }  
}

@media (max-width: 466px) {
.products {grid-template-columns: repeat(auto-fit, minmax(134px, 1fr));  }  
}


/* Меньше движения для тех, кто это просит */
@media (prefers-reduced-motion: reduce) {
* {
animation: none !important;
transition: none !important;
scroll-behavior: auto !important;
}
}



/* --- Редактирование описания магазина / категории --- */
.shop-about-edit-form {
width: 50%;
min-width: 250px;
display: flex;
flex-direction: column;
position: absolute;
background: #bbc0cd;
padding: 18px;
top: 110px;
left: 50%;
transform: translate(-50%, -0%);
z-index: 1;
border-radius: 14px;
gap: 10px;
align-items: center;
box-shadow: 0px 10px 40px 0px #00000038;
}
.shop-about-textarea {
border: 0;
outline: 0;
border-radius: 7px;
padding: 10px;
min-width: 250px;
width: -webkit-fill-available;
}
.shop-about-edit-button {
font-size: 10px;
cursor: pointer;
border: 0;
border-radius: 999px;
color: white;
background: black;
padding: 6px 12px;
text-transform: uppercase;
}
.shop-about-save-button, .shop-about-cancel-button {
width: 100%;
padding: 11px;
border: 0;
border-radius: 9px;
font-size: 13px;
text-transform: uppercase;
cursor: pointer;
color: white;
max-width: 170px;
}
.shop-about-save-button {
background: #000000;
}
.shop-about-cancel-button {
background: #ffffff45;
}
.shop-about-message {
color: #000;
font-size: 16px;
}

/* Верхняя навигация */
.top-nav  {
display: flex;
position: fixed;
margin: 0;
bottom: 0;
right: 0;
z-index: 48;
padding: 4px;
box-sizing: border-box;
}
.top-nav-logo {
margin: 70px auto -50px;
display: flex;
justify-content: center;
padding: 6px 14px;
line-height: 1;
color: #434343;
max-width: 1200px;
text-transform: uppercase;
flex-wrap: wrap;
gap: 10px;
}
.top-nav-logo-phone {}
.top-nav-social {
display: flex;
font-weight: 100;
gap: 10px;
}
.top-nav-social a{
color: #000;
}
.top-nav a {
color: #000000;
display: flex;
align-items: center;
gap: 5px;
padding: 7px 10px;
background: #ffe9e9;
border-radius: 6px;
font-size: 12px;
}
.top-nav a:hover {
background: #f0f0f0;
}
.top-nav img {
width: 20px;
border-radius: 999px;
}

.top-nav-logo-empty {}
.top-nav-social {
display: flex;
gap: 20px;
}
#shopContactsEditContainer {
position: relative;
max-width: 1200px;
margin: auto;
}