#garage__box {
    padding: 20px 25px;    
    padding-bottom: 0px;
    background: #ffffff;
    box-shadow: var(--box-shadow);
    border-radius: 25px;
}

h1.title {
    font-weight: 700;
    font-size: 1.3rem;
    margin-bottom: 8px;
    color: #161617;
}

p.subtitle {
    font-size: .85em;
    font-weight: 400;
    color: #00000040;
    margin-bottom: 0px;
}

p.subtitle svg {
    margin: 0px 3px;
}

.garage__title hr {
    margin: 10px 0px 20px 0px;
    border-color: #00000010;
}

.garage__header {
    width: 100%;
    overflow: hidden;
    display: flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    overflow-x: auto;
}

.garage__header button {
    border: none;
    padding: 15px 20px;
    padding-top: 0px;
    background: transparent;
    font-size: .9rem;
    line-height: 1;
    font-weight: 500;
    color: #16161750;
    position: relative;
    transition: all 200ms;
    white-space: nowrap;
}

.garage__header .row__active {
/*    border-color: var(--color-primary);*/
    color: #161617;
}

.garage__header .row__active::before {
    transform: translateX(-50%);
    position: absolute;
    content: '';
    left: 50%;
    bottom: 0;
    width: 100%;
    height: 3px;
    background: var(--color-primary);
}

.garage__header button:hover {
    color: #161617;
}


/* ROWS */

#garage__rows {
    width: 100%;
    padding: 25px 0px;
}


/* VEHICLE ITEM */

.vehicle__item {
    width: 100%;
    background: #ffffff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: var(--box-shadow);
    margin-bottom: 20px;
}

.vehicle__details {
    padding: 15px 15px 0px 15px;
}

.vehicle__picture .picture__item {
    width: 100%;
    height: 150px;
    background: var(--color-primary);
    background-size: cover !important;
    background-position: center center !important;
    transition: all 200ms !important;
    cursor: pointer;
}

.vehicle__title {
    font-size: var(--content-size);
    font-weight: 500;
    color: #000;
    margin-bottom: 5px;

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.vehicle__attributes {
    font-size: .85em;
    font-weight: 400;
    color: #343a4080;
/*    max-height: calc(1.5em * 2);*/

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.vehicle__price {
    font-size: var(--subtitle-size);
    font-weight: 700;
    margin-top: 25px;
}

.vehicle__statistics {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: .8em;
    margin: 10px 0px 10px 0px;
    color: #000000c1;
}

.vehicle__statistics p {
    display: flex;
    align-items: center;
    margin-bottom: 0px;
    font-weight: 400;
    color: #343a40c1;
}

.vehicle__statistics svg {
    width: 13px;
    margin-top: -1px;
    stroke: #343a40c1;
    stroke-width: 1px !important;
    margin-right: 5px;
}

.vehicle__action button {
    width: 100%;
    padding: 8px 0px;
    background: transparent;
    border: 1px solid #343a40;
    transition: all 100ms linear;
    border-radius: 8px;
    font-weight: 500;
    font-size: .9em;
    color: #000;
}

.vehicle__footer {
    margin-top: 10px;
    padding: 5px 15px;
    border-top: 1px solid #343a4005;

    display: flex;
    justify-content: space-between;
    align-items: center;
}

.vehicle__footer .vehicle__location {
    font-size: .75em;
    font-weight: 300;
    color: #343a40c1;
    line-height: 1;
}

.vehicle__footer .vehicle__icons svg {
    width: 18px;
    cursor: pointer;
    margin-top: -3px;
    stroke-width: 1px;
}

#rows__motorcycle,
#rows__boat {
    display: none;
}

.box__content {
    display: none;
}


/* VEHICLE ACTIVE */

#box__active {
    flex-direction: column;
}

#box__active .vehicle__active {
    margin-bottom: 25px;
}

.vehicle__active {
    width: 100%;
    border-radius: 25px;
    background: #ffffff;

    overflow: hidden;
    border-radius: 20px;

    box-shadow: 0px 0px 100px 0px #00000005;
}

.vehicle__active .active__picture {
    width: 100%;
    height: 100%;

    background-size: cover !important;
    background-position: center center !important;

    display: flex;
    justify-content: center;
    align-items: center;
}

.vehicle__active .active__content {
    width: 100%;
    height: 100%;
    background: #ffffff;
    padding: 25px 0px;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
}

.vehicle__active .active__type {
    padding: 3px 5px;
    background: var(--color-primary);
    font-weight: 600;
    color: #ffffff;
    border-radius: 5px;
    line-height: 1;
    margin-bottom: 10px;
    font-size: .8em;
}

.vehicle__active .active__status {
    padding: 3px 5px;
    background: #62E5C7;
    font-weight: 600;
    color: #ffffff;
    border-radius: 5px;
    line-height: 1;
    font-size: .8em;
}

.vehicle__active .active__date {
    font-size: .9em;
    font-weight: 300;
    color: #343a4050;
}

.vehicle__active .active__title {
    white-space: nowrap !important;
    font-size: 1.4em;
    font-weight: 700;
    margin-bottom: 10px;
    line-height: 1;
    color: #161617;
}

.vehicle__active .active__subtitle {
    margin-bottom: 5px;
    font-size: .9rem;
    font-weight: 300;
    color: #c1c1c1;
}

.text_color {
    color: var(--color-primary);
}

.active__box {
    padding: 15px 35px;
    display: flex;
    justify-content: flex-end;
}

.active__header {
    padding: 10px 0px;
    margin-left: 35px;
}

.active__header h1 {
    font-size: .9rem;
    font-weight: 400;
}

.active__header p {
    font-size: 1.3rem;
    margin-bottom: 0px;
    font-weight: 600;
}

.vehicle__active .active__price {
    font-size: 1em;
    font-weight: 400;
    color: #343a40;
    margin-bottom: 15px;
    line-height: 1;
}

.vehicle__active .progress__bar {
    width: 100%;
    height: 5px;
    background: #f1f1f1;
    overflow: hidden;
    margin-top: 15px;
}

.vehicle__active .inside__bar {
    height: 5px;
    width: 50%;
    max-width: 95%;
    background: #19377b;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .75em;
    font-weight: 500;
    color: #ffffff;
}

.vehicle__active .active__text {
    padding-left: 25px;
    width: 100%;
}

.vehicle__active .active__actions {
    width: 100%;
    margin-top: 5px;
    padding: 0px 25px;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    padding-right: 25px;
}

.vehicle__active .active__actions label {
    margin-right: 5px;
    cursor: pointer;
}

.vehicle__active .active__actions label svg {
    width: 20px;
    color: #c1c1c1;
}

.vehicle__active .active__actions button {
    font-size: .8em;
    font-weight: 400;
    border: 1px solid var(--color-primary);
    background: transparent;
    margin-right: 10px;
    padding: 5px 10px;
    border-radius: 10px;
}

.vehicle__active .active__actions button:last-child {
    margin: 0px !important;
}

.vehicle__active .active__actions button.action__trash {
    border-color: #FE5126;
    background-color: #FE5126;
    color: #ffffff;
}

.vehicle__active .active__actions button.action__edit {
    border-color: var(--color-secondary);
    background-color: transparent;
    color: var(--color-secondary);
}

.vehicle__active .active__actions button.action__icon {
    font-size: 1.5  rem;
    padding: 0px !important;
    border: none;
}

.vehicle__active .active__actions button.action__publish {
    border-color: #00a500;
    background-color: transparent;
    color: #00a500;
}


/* VEHICLE ANALYSIS */

#box__inactive,
#box__analysis {
    flex-direction: column;
}

.vehicle__analysis {
    margin-bottom: 25px;
}

.vehicle__analysis {
    width: 100%;
    border-radius: 25px;
    background: #ffffff;

    overflow: hidden;
    border-radius: 20px;

    box-shadow: 0px 0px 100px 0px #00000005;
}

.vehicle__analysis .analysis__picture {
    width: 100%;
    height: 100%;

    background-size: cover !important;
    background-position: center center !important;

    display: flex;
    justify-content: center;
    align-items: center;
}

.vehicle__analysis .analysis__content {
    width: 100%;
    height: 100%;
    background: #ffffff;
    padding: 25px 0px;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
}

.vehicle__analysis .analysis__type {
    padding: 3px 5px;
    background: var(--color-primary);
    font-weight: 600;
    color: #ffffff;
    border-radius: 5px;
    line-height: 1;
    margin-bottom: 10px;
    font-size: .8em;
}

.vehicle__analysis .analysis__status {
    padding: 3px 5px;
    background: orange;
    font-weight: 600;
    color: #ffffff;
    border-radius: 5px;
    margin-bottom: 10px;
    line-height: 1;
    font-size: .8em;
}

.vehicle__analysis .analysis__date {
    font-size: .9em;
    font-weight: 300;
    color: #343a4050;
}

.vehicle__analysis .analysis__title {
    white-space: nowrap !important;
    font-size: 1.4em;
    font-weight: 700;
    margin-bottom: 10px;
    line-height: 1;
    color: #161617;
}

.text_color {
    color: var(--color-primary);
}

.vehicle__analysis .analysis__price {
    font-size: 1em;
    font-weight: 400;
    color: #343a40;
    margin-bottom: 15px;
    line-height: 1;
}

.vehicle__analysis .progress__bar {
    width: 100%;
    height: 5px;
    background: #f1f1f1;
    overflow: hidden;
    margin-top: 15px;
}

.vehicle__analysis .inside__bar {
    height: 5px;
    width: 50%;
    max-width: 95%;
    background: #19377b;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .75em;
    font-weight: 500;
    color: #ffffff;
}

.vehicle__analysis .analysis__text {
    padding-left: 25px;
    width: 50%;
}

.vehicle__analysis .analysis__actions {
    width: 50%;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    padding-right: 25px;
}

.vehicle__analysis .analysis__actions button {
    font-size: .9em;
    font-weight: 400;
    border: 1px solid var(--color-primary);
    background: transparent;
    margin-right: 10px;
    padding: 10px 15px;
    border-radius: 15px;
}

.vehicle__analysis .analysis__actions button:last-child {
    margin: 0px !important;
}

.vehicle__analysis .analysis__actions button.action__trash {
    border-color: red;
    background-color: transparent;
    color: #ff0000;
}

.vehicle__analysis .analysis__actions button.action__edit {
    border-color: var(--color-secondary);
    background-color: transparent;
    color: var(--color-secondary);
}

.vehicle__analysis .analysis__actions button.action__icon {
    font-size: 1.5  rem;
    padding: 0px !important;
    border: none;
}

.vehicle__analysis .analysis__actions button.action__publish {
    border-color: #00a500;
    background-color: transparent;
    color: #00a500;
}


/* VEHICLE DRAFT */

#box__draft {
    display: none;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

#box__draft .vehicle__draft {
    margin-bottom: 25px;
}

.vehicle__draft {
    width: 100%;
    border-radius: 25px;
    background: #ffffff;

    overflow: hidden;
    border-radius: 20px;

    box-shadow: 0px 0px 100px 0px #00000005;
}

.vehicle__draft .draft__picture {
    width: 100%;
    height: 100%;

    background-size: cover !important;
    background-position: center center !important;

    display: flex;
    justify-content: center;
    align-items: center;
}

.vehicle__draft .draft__content {
    width: 100%;
    height: 100%;
    background: #ffffff;
    padding: 25px 0px 0px 0px;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
}

.vehicle__draft .draft__status {
    padding: 3px 5px;
    background: orange;
    font-weight: 600;
    color: #ffffff;
    border-radius: 5px;
    margin-bottom: 10px;
    line-height: 1;
    font-size: .8em;
}

.vehicle__draft .draft__type {
    padding: 3px 5px;
    background: var(--color-primary);
    font-weight: 600;
    color: #ffffff;
    border-radius: 5px;
    line-height: 1;
    margin-bottom: 10px;
    font-size: .8em;
}

.vehicle__draft .draft__title {
    white-space: nowrap !important;
    font-size: 1.4em;
    font-weight: 700;
    margin-bottom: 15px;
    line-height: 1;
    color: #161617;
}

.text_color {
    color: var(--color-secondary);
}

.vehicle__draft .draft__price {
    font-size: 1em;
    font-weight: 400;
    color: #343a40;
    margin-bottom: 15px;
    line-height: 1;
}

.vehicle__draft .progress__bar {
    width: 100%;
    height: 5px;
    background: #f1f1f1;
    overflow: hidden;
    margin-top: 15px;
}

.vehicle__draft .inside__bar {
    height: 5px;
    width: 50%;
    max-width: 95%;
    background: #19377b;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .75em;
    font-weight: 500;
    color: #ffffff;
}

.vehicle__draft .draft__text {
    padding-left: 25px;
    width: 50%;
}

.vehicle__draft .draft__actions {
    width: 50%;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    padding-right: 25px;
}

.vehicle__draft .draft__actions button {
    font-size: .9em;
    font-weight: 400;
    border: 1px solid var(--color-primary);
    background: transparent;
    margin-right: 10px;
    padding: 10px 15px;
    border-radius: 15px;
}

.vehicle__draft .draft__actions button:last-child {
    margin: 0px !important;
}

.vehicle__draft .draft__actions button.action__trash {
    border-color: red;
    background-color: transparent;
    color: #ff0000;
}

.vehicle__draft .draft__actions button.action__edit {
    border-color: var(--color-secondary);
    background-color: transparent;
    color: var(--color-secondary);
}

.vehicle__draft .draft__actions button.action__icon {
    font-size: 1.5  rem;
    padding: 0px !important;
    border: none;
}

.vehicle__draft .draft__actions button.action__publish {
    border-color: #00a500;
    background-color: transparent;
    color: #00a500;
}



/* NOTHING */

#rows__nothing {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    flex-wrap: wrap;
    padding: 50px 0px;
    display: none;
}

#rows__nothing h1 {
    text-align: center;
    font-size: 2em;
    font-weight: 300;
    color: #343a40;
}

#rows__nothing p {
    text-align: center;
    font-size: .8em;
    font-weight: 300;
    color: #343a4080;
}

#rows__nothing button {
    padding: 9px 18px;
    background: var(--color-primary);
    border-radius: 15px;
    color: #ffffff;
    font-weight: 600;
    font-size: .9em;
    border: none;
}


/* SWALL */

.swal2-popup {
    border-radius: 50px;
    padding: 40px 15px 65px 15px;
}

.swal2-popup button {
    padding: 10px 20px;
    border-radius: 15px;
    font-weight: 700;
}

.swal2-popup  button.swal2-confirm {
    background: #fc4c65 !important;
}

.swal2-popup  button.swal2-cancel {
    background: #c1c1c1 !important;
}

.swal2-popup .swal2-title {
    font-size: 1.8em !important;
    font-weight: 700 !important;
    color: #161617 !important;
}

.swal2-popup .swal2-html-container {
    font-size: 1rem;
    font-weight: 400;
}

.swal2-popup .swal2-warning {
    border-color: #ff94a4 !important;
    color: #ffa4b2 !important;
} 

.swal2-popup button:focus-visible {
    box-shadow: none !important;
}

.swal2-backdrop-show {
    backdrop-filter: blur(4px) !important;
    background: rgba(0,0,0,0.5) !important;
}