html,body{background-color:#ececf2;}
body{background:transparent;font-size:14px;font-weight:400;font-display:swap;font-style:normal;font-family:'Yandex Sans Text', Arial, Helvetica, sans-serif;-webkit-text-size-adjust:100%;color:#555;}

.fa-icon {
    font-size: 43px; /* Размер иконки */
    line-height: 43px;
}

.custom-pt-md {
    padding-top:7rem;
}

.media-heading {
    font-size: 43px; /* Размер заголовка */
    line-height: 43px;
}

.snos {
    position: absolute;
    top: 3px;
    left: 80px;
    background-color: #fff;
    color: #1a68ad;
    padding: 3px 8px;
    border-radius: 5px;
    font-size: 31px;
    line-height: 31px;
}

a{outline:0;}
.m-auto{margin:0 auto;}
.nm{margin:0!important;}
.np{padding:0;}
.ws{white-space:nowrap;}
.relative{position:relative;}
.overhidden{overflow:hidden;}
.btn-default{background-color:#fff;border:1px solid transparent;color:#555;outline:0;}
.btn-default:hover{background-color:#fbfbfb;border:1px solid transparent;}
.btn-primary{background-color:#2556ff;border:1px solid transparent;color:#fff;outline:0;}
.btn-primary:hover{background-color:#204ada;border:1px solid transparent;color:#fff;outline:0;}
.btn-orange{background-color:#fc9c4d;border:1px solid transparent;color:#fff;outline:0;}

.font-200{font-weight:200;}
.font-300{font-weight:300;}
.font-400{font-weight:400;}
.font-500{font-weight:500;}
.font-600{font-weight:600;}
.courierNew{font-family: Menlo,Monaco,Consolas,"Courier New",monospace;}

.color-primary{color:#4d73fc!important;}
.color-orange{color:#fc9c4d!important;}

#headerBlock{position:relative;width:100%;display:block;overflow:hidden;padding:0 0 120px;background-color:#1e77c7;z-index:1;}
#headerBlock::before{content:'';position:absolute;width:100%;display:block;top:0;left:0;right:0;bottom:0;overflow:hidden;background:transparent url('/build/assets/fon-CdVG5DQC.png') no-repeat scroll center center;}
#headerBlock h1{margin:0 0 16px 0;font-size:33px;letter-spacing:-1px;color:#fff;text-shadow: 0px 2px 2px rgba(150, 150, 150, 0.18);}
#headerBlock p.h1{font-size:25px;letter-spacing:-1px;color:#fff;text-shadow: 0px 2px 2px rgba(150, 150, 150, 0.18);}
#headerBlock h1 span,#headerBlock p.h1 span{background-color:#16568e;color:#fff;border-radius:8px;padding:3px 12px;margin:0 0 0 -12px;}
#headerBlock p.intro{font-size:14px;color:#fff;}
#headerBlock .img-right{display:block;width:100%;margin:0 auto;overflow:hidden;}
#headerBlock .img-right img{max-height:200px;margin:0 auto;}
#headerBlock .head-info{display:block;width:100%;height:200px;min-height:200px;margin:0 0 5px 0;padding:0 15px;}

#headerBlock .menu{position:relative;z-index:2;display:block;width:100%;padding:0 30px;margin:25px 0 150px 0;}
#headerBlock .menu a.home{text-decoration:none;display:inline-block;}
#headerBlock .menu .media{color:#fff;}
#headerBlock .menu .media i{font-size:43px;line-height:43px;}
#headerBlock .menu .media .media-body .media-heading{font-size:43px;line-height:43px;}
#headerBlock .menu .media .media-body .snos{position:absolute;top:3px;left:80px;background-color:#fff;color:#1a68ad;padding:3px 8px;border-radius:5px;font-size:31px;line-height:31px;}
#headerBlock .menu a.btn,#headerBlock .menu a.btn:hover{height:43px;border-radius:8px;padding:10px 25px;border:1px solid transparent;background-color:#4d73fc;}
#headerBlock .menu a.btn i.fa{margin:0 8px 0 0;}

#searchBlock{position:relative;width:100%;display:block;overflow:hidden;z-index:3;}
#searchBlock .form{display:block;padding:25px 40px;border-radius:25px;background-color:#fff;box-shadow:0px 4px 12px 0px #0d234308;}
#searchBlock .form .input-bg{position:relative;width:100%;display:block;padding:25px;align-items:center;border-radius:12px;background:rgba(77, 115, 252, 0.1);}
#searchBlock .form .input-bg label{color:#9ea2a8!important;}
#searchBlock .form .input-bg input.form-control{background:none!important;border:0;box-shadow:none;padding:0;height:auto;font-size:24px;line-height:24px;}
#searchBlock .form .input-bg .vertical-line{width:1px;margin:0 auto;height:56px;background:#9EA2A8;}
#searchBlock .form button.btn{margin:15px 0 0;padding:12px 25px;border-radius:12px;}
#searchBlock .form button.btn i.fa{margin:0 8px 0 0;}

#appBlock{position:relative;width:100%;display:block;overflow:hidden;margin:15px 0;}
#appBlock a{text-decoration:none;color:#555;}
#appBlock .media{background:rgba(77, 115, 252, 0.1);border-radius:12px;padding:20px 18px;margin:0 0 15px;}
#appBlock .media i.fa{font-size:33px;line-height:33px;margin:3px 8px;color:#1e77c7;}
#appBlock .media .media-left{padding:0!important;width:48px!important;min-width:48px!important;margin:0 auto!important;}
#appBlock .media .media-body{padding:0 0 0 12px;}
#appBlock .media .media-body p.media-heading{font-size:18px;line-height:18px;}
#appBlock a:hover .media{background-color:#fff;}

#infoBlock{position:relative;width:100%;display:block;overflow:hidden;margin:35px 0;}
#infoBlock .media-list{width:100%;display:block;overflow:hidden;margin:15px 0 25px 0;}
#infoBlock .media{margin:15px 0 0 0;}
#infoBlock .media i.fa{font-size:33px;line-height:33px;margin:3px 8px;color:green;}
#infoBlock .media .media-body p.media-heading{font-size:18px;line-height:18px;margin:10px 0 5px 0;}
#infoBlock .reportBlock{padding:25px;border-radius:12px;width:100%;display:block;background-color:#fff;margin:25px 0;box-shadow:0px 4px 12px 0px #0d234308;}
#infoBlock .reportBlock p.name{font-size:28px;}
#infoBlock .reportBlock p.info{font-size:12px;}
#infoBlock .reportBlock .input-bg{position:relative;width:100%;display:block;padding:15px;align-items:center;border-radius:12px;background:rgba(77, 115, 252, 0.1);}
#infoBlock .reportBlock .input-bg label{color:#9ea2a8!important;}
#infoBlock .reportBlock .input-bg input.form-control{background:none!important;border:0;box-shadow:none;padding:0;height:auto;font-size:21px;line-height:21px;}
#infoBlock .reportBlock .input-bg .vertical-line{width:100%;margin:15px 0;height:1px;background:#fff;}
#infoBlock .reportBlock button.btn{margin:15px 0 0;padding:12px 25px;border-radius:12px;}
#infoBlock .reportBlock button.btn i.fa{margin:0 8px 0 0;}
#infoBlock .reportBlock .ili{position:absolute;display:inline-block;top:-8px;left:35%;right:35%;border-radius:12px;padding:1px 3px;background-color:#fff;font-size:11px;}

#plusBlock{position:relative;width:100%;display:block;overflow:hidden;margin:35px 0;}
#plusBlock .blockInfo{position:relative;width:100%;display:block;overflow:hidden;padding:35px;border-radius:25px;background-color:#f8f8ff;box-shadow:0px 4px 12px 0px #0d234308;}
#plusBlock .blockInfo .name{font-size:14px;color:#1e77c7;}
#plusBlock .blockInfo .name2{font-size:24px;}
#plusBlock .blockInfo .intro{font-size:13px;color:#7a7f85;}
#plusBlock .blockInfo .intro span{color:red;}
#plusBlock .blockInfo .media{background-color:#ececf2;border-radius:12px;padding:20px;box-shadow:0px 4px 12px 0px #0d234308;margin:25px 0 0 0;}
#plusBlock .blockInfo .media .media-count{font-size:28px;color:#1e77c7;}
#plusBlock .blockInfo .media i.fa{font-size:38px;color:#1e77c7;}
#plusBlock .blockInfo .img-right{margin:40px 0 0 0;border-radius:25px;position:relative;width:100%;display:block;overflow:hidden;}

footer{position:relative;width:100%;display:block;overflow:hidden;padding:10px 0 55px 0;}
footer .menu{position:relative;width:100%;display:block;overflow:hidden;margin:0 0 55px 0;padding:0 0 35px 0;border-bottom:1px solid #d3d3d3;}
footer .menu p.name{font-size:20px;margin:25px 0;border-bottom:1px solid #d3d3d3;display:inline-block;}
footer .media-logo{position:relative;width:100%;display:block;overflow:hidden;opacity:0.33;}
footer .media-logo .media{color:#555;margin:0 0 10px 0;}
footer .media-logo .media i{font-size:43px;line-height:43px;}
footer .media-logo .media .media-body .media-heading{font-size:43px;line-height:43px;}
footer .media-logo .media .media-body .snos{position:absolute;top:3px;left:80px;background-color:#555;color:#fff;padding:3px 8px;border-radius:5px;font-size:31px;line-height:31px;}



.inName{background:transparent url('/build/assets/t-Bc3S121c.png') repeat-x scroll 0 75%;}
.inName span{background-color:#fff;padding:0 8px 0 0;display:inline-block;}

/* Страница с авто */
#reportBlockInfo{position:relative;width:100%;display:block;margin:-180px 0 35px 0;z-index:3;}
#reportBlockInfo .page{position:relative;display:block;padding:25px 40px;border-radius:25px;background-color:#fff;box-shadow:0px 4px 12px 0px #0d234308;z-index:1;margin:0 0 25px 0;}
#reportBlockInfo .page .block-img{position:relative;display:block;width:100%;background-color:#f3f3f3;border-radius:12px;margin:0 0 25px 0;box-shadow:inset 0px 4px 12px 0px #0d234308;}
#reportBlockInfo .page .block-img img{}
#reportBlockInfo .page .vin-bg{position:relative;width:100%;display:block;padding:18px 25px;align-items:center;border-radius:12px;background:rgba(77, 115, 252, 0.1);margin:0 0 25px 0;box-shadow:inset 0px 4px 12px 0px #0d234308;}
#reportBlockInfo .page .vin-bg label{opacity:0.7;font-weight:normal;}
#reportBlockInfo .page .car-brand{font-size:24px;}
#reportBlockInfo .page .car-year{font-size:24px;}
#reportBlockInfo .page .hname{font-size:18px;margin:0 0 4px 0;color:#1e77c7;}
#reportBlockInfo .page .hinfo{font-size:12px;margin:0 0 18px 0;color:#888;}
#reportBlockInfo .page .inName{background:transparent url('/build/assets/t-Bc3S121c.png') repeat-x scroll 0 75%;}
#reportBlockInfo .page .inName span{background-color:#fff;padding:0 8px 0 0;display:inline-block;}
#reportBlockInfo .page .inValue{}
#reportBlockInfo .page .btn-primary,#reportBlockInfo .page .btn-warning{margin:15px 0 0 0;padding:12px 25px;border-radius:12px;opacity:0.88;}
#reportBlockInfo .page .btn-primary:hover,#reportBlockInfo .page .btn-warning:hover{opacity:1;}
#reportBlockInfo .page .btn-primary i.fa,#reportBlockInfo .page .btn-warning i.fa{margin:0 8px 0 0;}
#reportBlockInfo .page .alert-danger,#reportBlockInfo .page .alert-warning,#reportBlockInfo .page .alert-info{border-radius:0;margin:0;border:none;}
#reportBlockInfo .page .alert-danger{border-left:5px solid #a94442;}
#reportBlockInfo .page .alert-warning{border-left:5px solid #8a6d3b;}
#reportBlockInfo .page .alert-info{border-left:5px solid #31708f;}

.vin-bg{position:relative;width:100%;display:block;padding:18px 25px;align-items:center;border-radius:12px;background:rgba(77, 115, 252, 0.1);margin:0 0 25px 0;box-shadow:inset 0px 4px 12px 0px #0d234308;}
.vin-bg label{opacity:0.7;font-weight:normal;}
.hname{font-size:18px;margin:0 0 4px 0;color:#1e77c7;}

#reportBlockInfo .page-button{display:block;width:100%;margin-top:-85px;margin-bottom:25px;box-shadow:inset 0px 4px 12px 0px #0d234308;background-color:rgba(77, 115, 252, 0.1);padding:65px 25px 25px 25px;border-radius:25px;}
#reportBlockInfo .page-button .btn{padding:12px 25px;border-radius:12px;box-shadow:inset 0px 4px 12px 0px #0d234308;margin:25px 0 0 0;}
#reportBlockInfo .page-button .btn i.fa{margin:0 8px 0 0;}

#reportBlockInfo .fixed-block{position:sticky;top: 10px;display:block;width:100%;}
#reportBlockInfo .fixed-block .jsStickyWidget{display:block;width:100%;background-color:#fff;border-radius:12px;padding:25px;box-shadow:0px 4px 12px 0px #0d234308;}
#reportBlockInfo .fixed-block .jsStickyWidget p.name{font-size:16px;line-height:16px;margin:0 0 15px 0;color:#1e77c7;}
#reportBlockInfo .fixed-block .jsStickyWidget p.brand_model{font-size:21px;line-height:24px;margin:0 0 8px 0;}
#reportBlockInfo .fixed-block .jsStickyWidget p.vin{font-size:13px;line-height:13px;}
#reportBlockInfo .fixed-block .jsStickyWidget .btn{margin:25px 0 0 0;padding:12px 25px;border-radius:12px;}
#reportBlockInfo .fixed-block .jsStickyWidget .btn i.fa{margin:0 8px 0 0;}

.fixed-block2{display:none;width:100%;position:fixed;bottom:0;left:0;right:0;z-index:8;}
.fixed-block2 .fixed-block2-content{position:relative;display:block;width:100%;background-color:rgba(52,52,60,1);padding:8px 25px;color:#fff;border-radius:12px;overflow:hidden;margin:0 0 8px 0;}
.fixed-block2 .fixed-block2-content .btn{margin:0;padding:12px 25px;border-radius:12px;}
.fixed-block2 .fixed-block2-content .btn i.fa{margin:0 8px 0 0;}
.fixed-block2 .fixed-block2-content p.summa{font-size:21px;line-height:21px;margin:5px 0 3px 0;}
.fixed-block2 .fixed-block2-content p.vin{font-size:13px;line-height:13px;}

@media (min-width: 200px) and (max-width: 1180px) {
    #headerBlock{padding:0;}
    #headerBlock h1,#headerBlock p.h1,#headerBlock p.intro{text-align:center;}

    #headerBlock .menu{margin:25px 0 105px 0;}
    #headerBlock .menu .media i{font-size:38px;line-height:38px;}
    #headerBlock .menu .media .media-body .media-heading{font-size:38px;line-height:38px;}
    #headerBlock .menu .media .media-body .snos{font-size:26px;line-height:26px;left:70px;}
    #headerBlock .menu a.btn{height:38px;padding:8px 25px;}
    #headerBlock .img-right{margin:25px 0 55px;}

    #searchBlock .form .input-bg .vertical-line{width:100%;margin:25px auto;height:1px;background:#9EA2A8;}

    #plusBlock{margin:0 0 35px 0;}
    #plusBlock .blockInfo{padding:25px;}

    /* Страница с авто */
    #reportBlockInfo{margin:-30px 0 55px 0;}
    #reportBlockInfo .page{padding:18px 30px;}
    #reportBlockInfo .page .car-brand{font-size:16px;}
    #reportBlockInfo .page .car-year{font-size:16px;}

    #reportBlockInfo .page-button{padding:65px 15px 25px 15px;}
    #reportBlockInfo .page-button .btn{padding:8px 11px;border-radius:12px;box-shadow:inset 0px 4px 12px 0px #0d234308;font-size:12px;}
    #reportBlockInfo .page-button .btn i.fa{margin:0 5px 0 0;}

    #reportBlockInfo .fixed-block{display:none!important;}
    .fixed-block2{display:block;}
}

.unselectable{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}


.bg-new {
    background-color: #ececf2;

}

/* По умолчанию (xs-sm): вертикальный список */
.custom-rounded-top {
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
}
.custom-rounded-bottom {
    border-bottom-left-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
}

/* Для md и выше — горизонтальный ряд */
@media (min-width: 768px) {
    .custom-rounded-top {
        border-radius: 0.5rem 0 0 0.5rem;
    }
    .custom-rounded-bottom {
        border-radius: 0 0.5rem 0.5rem 0;
    }
}

@media (min-width: 576px) {
    .border-start-md {
        border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
    }
}

@media (min-width: 768px) {
    .form-control-xl-md {
        height: 75px;
        font-size: 1.25rem;
        padding: 0.75rem 1rem;
    }
}

.form-control-xl-sm {
    height: 60px;
    font-size: 1.25rem;
    padding: 0.75rem 1rem;
}

.input-no-outline:focus {
    outline: none !important;
    box-shadow: none !important;
    border-color: #ced4da !important; /* или любой другой цвет */
}

.grecaptcha-badge {
    opacity: 0;
}

.image-hover-zoom {
    transition: transform 0.3s ease-in-out;
}

.image-hover-zoom:hover {
    transform: scale(1.05);
}

/* Report Header Improvements */
.report-header-card {
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    border: 1px solid rgba(0,0,0,0.08);
    transition: box-shadow 0.3s ease;
}

.report-header-card:hover {
    box-shadow: 0 0.5rem 1.5rem rgba(0,0,0,0.1) !important;
}

.vin-badge, .plate-badge {
    background: linear-gradient(45deg, #007bff, #0056b3);
    border: 1px solid #0056b3;
    color: #ffffff;
    font-family: 'Courier New', monospace;
    letter-spacing: 0.5px;
    transition: all 0.2s ease;
    font-weight: 600;
    cursor: pointer;
    user-select: none;
}

.vin-badge:hover, .plate-badge:hover {
    background: linear-gradient(45deg, #0056b3, #004085);
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

.vin-badge:active, .plate-badge:active {
    transform: translateY(0);
    box-shadow: 0 2px 4px rgba(0,0,0,0.15);
}

/* Добавляем анимацию копирования */
.vin-badge.copied, .plate-badge.copied {
    animation: copySuccess 0.6s ease;
}

@keyframes copySuccess {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); background: linear-gradient(45deg, #28a745, #20c997); }
    100% { transform: scale(1); }
}

/* Toast анимация */
@keyframes slideInDown {
    from {
        transform: translate(-50%, -100%);
        opacity: 0;
    }
    to {
        transform: translate(-50%, 0);
        opacity: 1;
    }
}

@keyframes slideOutUp {
    from {
        transform: translate(-50%, 0);
        opacity: 1;
    }
    to {
        transform: translate(-50%, -100%);
        opacity: 0;
    }
}

.copy-toast {
    animation: slideInDown 0.3s ease-out;
}

.copy-toast.fade-out {
    animation: slideOutUp 0.3s ease-in;
}

.info-divider {
    background: linear-gradient(90deg, #007bff, transparent);
    height: 2px;
    border: none;
}

.info-row-separator {
    border-top: 1px solid rgba(0,0,0,0.05);
    opacity: 0.1;
    margin: 0.25rem 0;
}

.status-warning {
    background: linear-gradient(45deg, #fff3cd, #ffeaa7);
    border: 1px solid #ffecb5;
    border-radius: 8px;
    padding: 12px 16px;
}

.car-model-title {
    background: linear-gradient(135deg, #2c3e50, #34495e);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Mobile Responsive Improvements */
@media (max-width: 768px) {
    .report-header-card {
        #margin: 0.5rem !important;
        padding: 2rem 1.5rem !important;
    }

    .car-model-title {
        font-size: 1.4rem !important;
    }

    .vin-badge, .plate-badge {
        font-size: 0.85rem !important;
        padding: 0.75rem 1.25rem !important;
        margin-bottom: 0.75rem;
        display: block;
        width: 100%;
        text-align: center;
    }

    .info-columns {
        flex-direction: column;
    }

    .info-columns .col-md-6 {
        margin-bottom: 0.75rem;
    }

    .info-columns .col-md-6:last-child {
        margin-bottom: 0;
    }

    .status-warning {
        margin-top: 1rem;
        text-align: center;
        padding: 1rem !important;
    }

    /* Карточки дополнительных характеристик на мобильных выравниваем влево */
    .text-md-center.text-sm-start {
        text-align: left !important;
    }

    /* Улучшенные отступы для строк данных на мобильных */
    .info-columns .mb-2 {
        margin-bottom: 0.5rem !important;
        padding: 0.5rem 0.75rem;
        background: rgba(248, 249, 250, 0.7);
        border-radius: 6px;
        border: 1px solid rgba(0,0,0,0.04);
    }

    .info-columns .d-flex {
        /* Не переопределяем flex-direction, оставляем как в основном коде */
    }

    .info-columns .text-muted {
        font-size: 0.8rem !important;
        font-weight: 600 !important;
        text-transform: uppercase;
        color: #6c757d !important;
    }

    .info-columns .text-end {
        font-size: 0.95rem !important;
        font-weight: 500 !important;
        color: #2c3e50 !important;
    }

    .info-row-separator {
        display: none;
    }
}

/* Animation for loading placeholders */
@keyframes shimmer {
    0% {
        background-position: -200px 0;
    }
    100% {
        background-position: calc(200px + 100%) 0;
    }
}

.shimmer-placeholder {
    background: linear-gradient(90deg, #f0f0f0 0px, #e0e0e0 40px, #f0f0f0 80px);
    background-size: 200px;
    animation: shimmer 1.5s infinite;
}

/* Simple Summary Block Improvements */
.summary-items-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 0.75rem;
}

@media (max-width: 768px) {
    .summary-items-grid {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }
}

@media (min-width: 992px) {
    .summary-items-grid {
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
        gap: 1rem;
    }
}