/* Xiaomi Product Description Styles - i-Vse.ru - BLACK THEME */
. xiaomi-product-description {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
color: #e0e0e0;
line-height: 1.6;
background-color: #000;
padding: 20px 0;
}
. product-hero-section {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 30px;
margin-bottom: 60px;
padding: 40px 0;
}
. product-hero-content { flex: 1; min-width: 300px; }
. product-hero-content . product-logo {
max-width: 100%;
height: auto;
margin-bottom: 20px;
max-height: 100px;
}
. product-hero-slogan {
font-size: 20px;
color: #ff6700;
margin-bottom: 25px;
font-weight: 600;
line-height: 1.4;
}
. feature-badges {
display: flex;
flex-wrap: wrap;
gap: 12px;
margin-bottom: 20px;
}
. feature-badges span {
background-color: rgba(255, 103, 0, 0.1);
border: 1px solid #ff6700;
padding: 10px 18px;
border-radius: 8px;
font-size: 14px;
font-weight: 600;
color: #ff6700;
}
. color-options {
display: flex;
gap: 15px;
margin-top: 20px;
}
. color-option {
text-align: center;
cursor: pointer;
opacity: 0.7;
transition: opacity 0.3s;
}
. color-option. active {
opacity: 1;
}
. color-swatch {
width: 40px;
height: 40px;
border-radius: 50%;
border: 2px solid #333;
margin: 0 auto 5px;
}
. color-option. active . color-swatch {
border-color: #ff6700;
}
. color-name {
font-size: 12px;
color: #999;
}
. product-hero-image { flex: 1; min-width: 300px; text-align: center; }
. product-hero-image img {
max-height: 450px;
width: auto;
border-radius: 16px;
box-shadow: 0 20px 40px rgba(255, 103, 0, 0.1);
}
/* Стили для контентных блоков */
. product-content-section {
margin: 80px 0;
padding: 40px 0;
}
/* Блоки с полной шириной изображения */
. full-width-section . product-content-text {
width: 100%;
margin-bottom: 30px;
}
. full-width-section . full-width-image {
width: 100%;
text-align: center;
margin: 30px 0;
}
. full-width-section . full-width-image img {
max-width: 100%;
height: auto;
border-radius: 12px;
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3);
}
/* Блоки с чередованием */
. alternating-section {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 50px;
}
. alternating-section . product-content-text {
flex: 1;
min-width: 300px;
}
. alternating-section . product-content-image {
flex: 1;
min-width: 300px;
text-align: center;
}
. alternating-section: nth-child(odd) . product-content-text { order: 1; }
. alternating-section: nth-child(odd) . product-content-image { order: 2; }
. alternating-section: nth-child(even) . product-content-text { order: 2; }
. alternating-section: nth-child(even) . product-content-image { order: 1; }
. alternating-section . product-content-image img {
max-width: 100%;
height: auto;
border-radius: 12px;
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3);
}
. product-content-text h2 {
font-size: 28px;
font-weight: 700;
color: #fff;
margin-bottom: 20px;
line-height: 1.3;
tex.
