
/* ASPIRIN UI V146 */


/* =========================================================
   CAR INSPECTION MAP
   ========================================================= */

.a146-map-wrap {
    position:relative;

    width:100%;
    max-width:330px;

    margin:
        12px auto 5px;
}


.a146-map {
    display:block;

    width:100%;
    height:auto;
}


.a146-outline {
    fill:
        rgba(255,255,255,.018);

    stroke:
        rgba(255,255,255,.18);

    stroke-width:2.3;
}


.a146-wheel {
    fill:#35383e;
}


.a146-glass {
    pointer-events:none;

    fill:
        rgba(80,150,185,.11);

    stroke:
        rgba(105,165,195,.25);

    stroke-width:1.6;
}


.a146-roof {
    pointer-events:none;

    fill:
        rgba(255,255,255,.025);

    stroke:
        rgba(255,255,255,.10);

    stroke-width:1.5;
}


.a146-zone {
    cursor:pointer;

    fill:
        rgba(255,255,255,.025);

    stroke:
        rgba(255,255,255,.14);

    stroke-width:2;

    transition:
        .15s ease;
}


.a146-zone.selected {
    fill:
        rgba(217,255,67,.17);

    stroke:
        #d9ff43;

    stroke-width:3;
}


.a146-zone.issue {
    fill:
        rgba(255,92,72,.14);

    stroke:
        rgba(255,105,85,.78);
}


.a146-zone.issue.selected {
    fill:
        rgba(217,255,67,.18);

    stroke:
        #d9ff43;
}


.a146-text {
    pointer-events:none;

    fill:#858a93;

    font-size:8px;

    font-weight:700;

    text-anchor:middle;
}


.a146-text-small {
    pointer-events:none;

    fill:#858a93;

    font-size:6.6px;

    font-weight:700;

    text-anchor:middle;
}


.a146-front-label {
    fill:#9fa3aa;
}


.a146-side-l {
    fill:#777c85;

    font-size:7px;

    font-weight:800;

    text-anchor:start;
}


.a146-side-r {
    fill:#777c85;

    font-size:7px;

    font-weight:800;

    text-anchor:end;
}


/* =========================================================
   SELECTION INFO
   ========================================================= */

.a146-selection {
    margin-top:9px;

    padding:10px 11px;

    border-radius:13px;

    background:
        rgba(217,255,67,.065);

    color:#d9ff43;

    font-size:9px;

    font-weight:850;

    line-height:1.45;
}


.a146-selection strong {
    color:white;
}


.a146-tip {
    margin-top:5px;

    color:#777c84;

    font-size:8px;

    line-height:1.4;
}


/* =========================================================
   VIDEO
   ========================================================= */

.a146-video-loading {
    min-width:220px;

    padding:22px;

    border-radius:17px;

    background:#15171a;

    color:#c7cad0;

    text-align:center;

    font-size:11px;

    line-height:1.5;
}


.a146-video-loading span {
    display:block;

    margin-top:7px;

    color:#7f848c;

    font-size:9px;
}


.a146-player {
    display:block;

    width:min(
        94vw,
        720px
    );

    max-height:82vh;

    background:black;

    border-radius:15px;
}

