/* Route actuality — rebuilt from the approved route-status reference. */
.route-actuality {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    margin-top: 24px;
    border: 1px solid #dde7e5;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 18px 48px rgba(28, 53, 50, .08);
}

.route-actuality::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background: url("../../img/route-status/decor/topographic-pattern.svg") center / 640px repeat;
    opacity: .12;
    pointer-events: none;
}

.route-actuality--warning,
.route-actuality--critical { background-color: #fff; }

.route-actuality__summary {
    position: relative;
    display: grid;
    grid-template-columns: 64px minmax(250px, 1fr) auto auto;
    gap: 18px;
    align-items: center;
    min-height: 104px;
    padding: 20px 22px;
    border-bottom: 1px solid #e8efed;
}

.route-actuality__summary-icon {
    display: block;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: transparent;
}

.route-actuality__summary-icon img {
    display: block;
    width: 64px;
    height: 64px;
}

.route-actuality__summary-copy {
    position: relative;
    z-index: 2;
    min-width: 0;
}

.route-actuality__summary-copy h2 {
    margin: 0;
    color: #121c31;
    font-size: clamp(22px, 2.1vw, 30px);
    font-weight: 900;
    letter-spacing: -.035em;
    line-height: 1.05;
}

.route-actuality__summary-copy p {
    display: block;
    margin: 8px 0 0;
    color: #748194;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.4;
}

.route-actuality__header-art {
    position: absolute;
    z-index: 0;
    top: -10px;
    right: 28%;
    width: 290px;
    height: 125px;
    object-fit: contain;
    opacity: .82;
    pointer-events: none;
}

.route-actuality .route-completion-people--actuality {
    position: relative;
    z-index: 2;
    min-height: 46px;
    border-color: #dfe7e8;
    background: rgba(255, 255, 255, .92);
    padding: 6px 13px 6px 6px;
    box-shadow: 0 6px 18px rgba(22, 43, 41, .06);
    backdrop-filter: blur(12px);
}

.route-actuality .route-completion-people__label {
    color: #596476;
    font-size: 12px;
}

.route-actuality__report-button {
    position: relative;
    z-index: 2;
    display: inline-flex;
    min-height: 54px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 0;
    border-radius: 14px;
    background: #ff6329;
    color: #fff;
    padding: 0 22px;
    box-shadow: 0 12px 25px rgba(255, 99, 41, .24);
    font-size: 13px;
    font-weight: 850;
    white-space: nowrap;
}

.route-actuality__report-button img { width: 22px; height: 22px; }
.route-actuality__report-button:hover { background: #ed5420; transform: translateY(-1px); }

.route-actuality__more { border: 0; }

.route-actuality__disclosure {
    display: flex;
    min-height: 58px;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 22px;
    color: #263447;
    cursor: pointer;
    list-style: none;
    transition: background-color .2s ease, color .2s ease;
}

.route-actuality__disclosure::-webkit-details-marker { display: none; }
.route-actuality__disclosure:hover { background-color: rgba(242, 247, 246, .78); }
.route-actuality__disclosure:focus-visible {
    outline: 3px solid rgba(255, 99, 41, .28);
    outline-offset: -3px;
}

.route-actuality__disclosure-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 3px;
}

.route-actuality__disclosure-copy strong {
    font-size: 13px;
    font-weight: 850;
    line-height: 1.25;
}

.route-actuality__disclosure-copy small {
    overflow: hidden;
    color: #7b8798;
    font-size: 11px;
    font-weight: 650;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.route-actuality__disclosure > img {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    transition: transform .2s ease;
}

.route-actuality__more[open] > .route-actuality__disclosure {
    border-bottom: 1px solid #e8efed;
    background-color: rgba(247, 250, 249, .74);
}

.route-actuality__more[open] > .route-actuality__disclosure > img { transform: rotate(90deg); }

.route-actuality__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 0;
    padding: 20px 18px 14px;
}

.route-actuality__more .route-actuality__grid {
    border: 0;
    padding-right: 18px;
    padding-left: 18px;
}

.route-actuality__item,
.route-actuality__item:first-child,
.route-actuality__item:last-child {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr) 16px;
    gap: 14px;
    align-items: start;
    min-width: 0;
    min-height: 146px;
    padding: 20px 18px;
    border: 1px solid #e1e8e9;
    border-radius: 16px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 8px 24px rgba(29, 51, 49, .035);
}

.route-actuality__item + .route-actuality__item { border-left: 1px solid #e1e8e9; }
.route-actuality__item-icon { display: block; width: 56px; height: 56px; }
.route-actuality__item-copy { min-width: 0; }
.route-actuality__item-chevron { width: 16px; height: 16px; margin-top: 4px; opacity: .75; }

.route-actuality__label {
    display: block;
    color: #7b8798;
    font-size: 11px;
    font-weight: 750;
    line-height: 1.3;
}

.route-actuality__value {
    display: block;
    margin-top: 7px;
    color: #162034;
    font-size: 16px;
    font-weight: 900;
    letter-spacing: -.015em;
    line-height: 1.28;
}

.route-actuality__item > p,
.route-actuality__item-copy > p {
    margin: 8px 0 0;
    color: #677386;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
}

.route-actuality__item-copy .route-actuality__meta { color: #8a94a3; font-size: 10px; }
.route-actuality--positive .route-actuality__item--condition .route-actuality__value { color: #168a58; }
.route-actuality--warning .route-actuality__item--condition .route-actuality__value { color: #cf581e; }
.route-actuality--critical .route-actuality__item--condition .route-actuality__value { color: #bd332d; }

.route-actuality__issues {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9px;
    margin: 0;
    padding: 0 22px 18px;
    border: 0;
    color: #687487;
    font-size: 11px;
    font-weight: 800;
}

.route-actuality__issues > img { width: 21px; height: 21px; margin-right: 2px; }
.route-actuality__issue {
    border: 1px solid #f4d6c5;
    border-radius: 999px;
    background: #fff7f2;
    color: #be4c1e;
    padding: 8px 13px;
}

.route-completions {
    margin: 0 18px 18px;
    padding: 0;
    overflow: hidden;
    border: 1px solid #dfe7e8;
    border-radius: 17px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 9px 28px rgba(31, 56, 53, .04);
}

.route-completions__head {
    display: grid;
    grid-template-columns: 31px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 17px 20px;
    border-bottom: 1px solid #e8eeef;
}

.route-completions__head-icon { width: 29px; height: 29px; }
.route-completions__head .route-actuality__label { display: none; }
.route-completions__head h3 {
    margin: 0;
    color: #172033;
    font-size: 20px;
    font-weight: 900;
    letter-spacing: -.025em;
}

.route-completions__count {
    min-width: 34px;
    height: 32px;
    border-radius: 10px;
    background: #f2f5f7;
    color: #526075;
}

.route-completions__list { gap: 12px; margin: 0; padding: 14px 16px 16px; }

.route-completion-card {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr) auto;
    gap: 12px 14px;
    align-items: center;
    min-width: 0;
    padding: 16px;
    border: 1px solid #e2e9ea;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 6px 20px rgba(27, 52, 49, .035);
}

.route-completion-card__avatar {
    width: 54px;
    height: 54px;
    background: #edf2f4;
    color: #d95320;
    font-size: 16px;
}

.route-completion-card__copy > div { gap: 7px; font-size: 13px; }
.route-completion-card__copy > div strong { color: #172033; font-size: 14px; font-weight: 900; }
.route-completion-card__copy > div span { color: #7d8999; }

.route-completion-card__copy p {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 6px;
    margin: 7px 0 0;
    border-radius: 999px;
    background: #fff0d5;
    color: #66502b;
    padding: 6px 10px;
    font-size: 11px;
    font-weight: 800;
}

.route-completion-card__copy p > img { width: 15px; height: 15px; }
.route-completion-card__copy small { display: inline-block; margin: 7px 6px 0 0; border-radius: 999px; background: #f4f6f8; color: #657184; padding: 5px 9px; font-size: 10px; }
.route-completion-card__status-dot { display: none; }

.route-completion-card__evidence {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 0;
}

.route-completion-card__photos,
.route-completion-card__photos[data-photo-count="3"],
.route-completion-card__photos[data-photo-count="4"] { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.route-completion-card__photos a { aspect-ratio: 3 / 2; border-radius: 11px; }

.route-completion-card__comment {
    margin: 0;
    min-height: 52px;
    border: 1px solid #e7ecee;
    border-left: 1px solid #e7ecee;
    border-radius: 11px;
    background: #fafcfc url("../../img/route-status/icons/report.svg") 14px 14px / 20px 20px no-repeat;
    color: #526074;
    padding: 13px 14px 13px 46px;
    font-size: 12px;
    line-height: 1.55;
}

.route-completion-card__map-shell {
    grid-column: 1 / -1;
    overflow: hidden;
    border: 1px solid #dde8e8;
    border-radius: 13px;
    background: #f7faf9;
}

.route-completion-card__map-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    padding: 11px 13px;
}

.route-completion-card__map-head strong { color: #263646; font-size: 12px; font-weight: 850; }
.route-completion-card__map-head span { color: #7b8794; font-size: 10px; }

.route-completion-card__map {
    position: relative;
    width: 100%;
    height: 210px;
    overflow: hidden;
    border-top: 1px solid #e3eceb;
    background: #eaf1ed;
    color: #6c7785;
    font-size: 11px;
}

.route-completion-card__map[data-map-initialized="error"] { display: grid; place-items: center; padding: 20px; }
.route-completion-card__map .maplibregl-canvas { cursor: default; }

.route-completion-card__map-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    padding: 10px 12px 12px;
    border-top: 1px solid #e3eceb;
}

.route-completion-card__map-legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #e1e8e8;
    border-radius: 999px;
    background: #fff;
    color: #556271;
    padding: 5px 8px;
    font-size: 9px;
    font-weight: 800;
}

.route-completion-card__map-legend i { width: 8px; height: 8px; flex: 0 0 8px; border: 2px solid rgba(255,255,255,.9); border-radius: 50%; box-shadow: 0 0 0 1px rgba(38,54,70,.14); }

.route-completion-card__meta {
    grid-column: 1 / 3;
    grid-row: 3;
    justify-content: flex-start;
    align-self: center;
    justify-self: start;
    width: max-content;
}

.route-completion-card__meta span {
    min-height: 34px;
    border-radius: 10px;
    background: #f4f7f8;
    padding: 7px 10px;
    font-size: 10px;
}

.route-completion-card__meta img { width: 16px; height: 16px; }
.route-completion-card__actions {
    grid-column: 2 / -1;
    grid-row: 3;
    justify-self: end;
    width: max-content;
    justify-content: flex-end;
    align-items: center;
    padding-top: 0;
    border-top: 0;
}

.route-completion-card__action {
    min-height: 42px;
    border-radius: 10px;
    padding: 9px 14px;
    font-size: 11px;
}

.route-completion-card__action > img { width: 18px; height: 18px; flex: 0 0 18px; }
.route-completion-card__action--useful,
.route-completion-card__action--done { border-color: #b9dfcf; background: #f0faf6; color: #237557; }
.route-completion-card__action--verify { border-color: #b9dfcf; background: #f0faf6; color: #237557; }
.route-completion-card__chevron { width: 14px !important; height: 14px !important; margin-left: 2px; transform: rotate(90deg); }
.route-completion-card__verify[open] .route-completion-card__chevron { transform: rotate(-90deg); }
.route-completion-card__verify[open] { width: 100%; }
.route-completion-card__verify-form { margin-left: auto; }

.route-completions__all { margin: 0 16px 16px; }
.route-completions__empty { margin: 16px 20px; }
.route-completions__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 18px;
    border-top: 1px solid #e6ecee;
}

.route-completions__cta {
    min-height: 44px;
    gap: 9px;
    margin: 0;
    border: 1px solid #ec9e78;
    border-radius: 12px;
    background: #fff;
    color: #c95525;
    padding: 0 16px;
    font-size: 12px;
}

.route-completions__cta img { width: 20px; height: 20px; }
.route-completions__correction { margin: 0; }
.route-completions__correction > summary {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    list-style: none;
    color: #687487;
    cursor: pointer;
    font-size: 11px;
    font-weight: 750;
}

.route-completions__correction > summary::-webkit-details-marker { display: none; }
.route-completions__correction > summary img { width: 18px; height: 18px; }
.route-completions__correction > summary img:last-child { width: 14px; height: 14px; }
.route-completions__correction[open] { width: min(100%, 600px); }
.route-completions__correction[open] > summary { margin-left: auto; }

html[data-theme="dark"] body.page-route-detail .route-actuality {
    border-color: #33494a !important;
    background: #112028 !important;
    box-shadow: 0 18px 48px rgba(0, 0, 0, .2);
}

html[data-theme="dark"] .route-actuality::before { opacity: .07; }

html[data-theme="dark"] .route-actuality__summary,
html[data-theme="dark"] .route-completions__head,
html[data-theme="dark"] .route-completions__footer { border-color: #304548; }
html[data-theme="dark"] .route-actuality__summary-copy h2,
html[data-theme="dark"] .route-actuality__value,
html[data-theme="dark"] .route-completions__head h3,
html[data-theme="dark"] .route-completion-card__copy > div strong { color: #f4f7f8; }
html[data-theme="dark"] .route-actuality__summary-copy p,
html[data-theme="dark"] .route-actuality__item-copy > p,
html[data-theme="dark"] .route-completion-card__comment { color: #bdc9d1; }
html[data-theme="dark"] .route-actuality__item,
html[data-theme="dark"] .route-completions,
html[data-theme="dark"] .route-completion-card { border-color: #33494d; background-color: #172932; }
html[data-theme="dark"] .route-completion-card__comment { border-color: #385057; background-color: #13242c; }
html[data-theme="dark"] .route-completion-card__map-shell { border-color: #385057; background: #13242c; }
html[data-theme="dark"] .route-completion-card__map-head strong { color: #ecf4f5; }
html[data-theme="dark"] .route-completion-card__map-head span { color: #9dabb4; }
html[data-theme="dark"] .route-completion-card__map,
html[data-theme="dark"] .route-completion-card__map-legend { border-color: #385057; }
html[data-theme="dark"] .route-completion-card__map-legend span { border-color: #40545a; background: #1a3038; color: #c6d2d7; }
html[data-theme="dark"] .route-actuality .route-completion-people--actuality { border-color: #40565c; background: rgba(23, 41, 50, .92); }
html[data-theme="dark"] .route-actuality__disclosure { color: #f4f7f8; }
html[data-theme="dark"] .route-actuality__disclosure:hover,
html[data-theme="dark"] .route-actuality__more[open] > .route-actuality__disclosure { background-color: rgba(37, 58, 65, .7); }
html[data-theme="dark"] .route-actuality__more[open] > .route-actuality__disclosure { border-color: #304548; }
html[data-theme="dark"] body.page-route-detail .route-completion-card__action--verify {
    border-color: #396b55;
    background: #193629;
    color: #9ce3b7;
}

@media (max-width: 1020px) {
    .route-actuality__summary { grid-template-columns: 56px minmax(220px, 1fr) auto; }
    .route-actuality__summary-icon,
    .route-actuality__summary-icon img { width: 56px; height: 56px; }
    .route-actuality__header-art { right: 14%; opacity: .5; }
    .route-actuality .route-completion-people--actuality { grid-column: 3; grid-row: 1; }
    .route-actuality__report-button { grid-column: 3; grid-row: 2; }
    .route-actuality__grid { grid-template-columns: 1fr; }
    .route-actuality__item,
    .route-actuality__item:first-child,
    .route-actuality__item:last-child { min-height: 0; }
}

@media (max-width: 700px) {
    .route-actuality { margin-top: 14px; border-radius: 18px; }
    .route-actuality__summary {
        grid-template-columns: 48px minmax(0, 1fr);
        gap: 12px;
        padding: 16px;
    }
    .route-actuality__summary-icon,
    .route-actuality__summary-icon img { width: 48px; height: 48px; }
    .route-actuality__summary-copy h2 { font-size: 20px; }
    .route-actuality__summary-copy p { font-size: 11px; }
    .route-actuality__header-art { display: none; }
    .route-actuality .route-completion-people--actuality { grid-column: 1 / -1; grid-row: auto; justify-self: start; }
    .route-actuality__report-button { grid-column: 1 / -1; grid-row: auto; width: 100%; }
    .route-actuality__disclosure { min-height: 56px; padding: 11px 16px; }
    .route-actuality__more .route-actuality__grid { grid-template-columns: 1fr; padding: 14px 12px 10px; }
    .route-actuality__item,
    .route-actuality__item:first-child,
    .route-actuality__item:last-child { grid-template-columns: 46px minmax(0, 1fr) 14px; gap: 11px; padding: 15px 13px; border-radius: 14px; }
    .route-actuality__item-icon { width: 46px; height: 46px; }
    .route-actuality__value { font-size: 14px; }
    .route-actuality__issues { padding: 3px 14px 15px; }
    .route-completions { margin: 0 10px 10px; border-radius: 15px; }
    .route-completions__head { grid-template-columns: 27px minmax(0, 1fr) auto; padding: 15px 14px; }
    .route-completions__head-icon { width: 25px; height: 25px; }
    .route-completions__head h3 { font-size: 17px; }
    .route-completions__list { padding: 10px; }
    .route-completion-card { grid-template-columns: 44px minmax(0, 1fr); gap: 10px; padding: 12px; }
    .route-completion-card__avatar { width: 44px; height: 44px; }
    .route-completion-card__photos,
    .route-completion-card__photos[data-photo-count="3"],
    .route-completion-card__photos[data-photo-count="4"] { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
    .route-completion-card__map-head { display: grid; gap: 2px; }
    .route-completion-card__map { height: 180px; }
    .route-completion-card__meta { grid-column: 1 / -1; grid-row: auto; width: auto; }
    .route-completion-card__actions { grid-column: 1 / -1; grid-row: auto; width: auto; justify-self: stretch; flex-direction: column; align-items: stretch; }
    .route-completion-card__actions > *,
    .route-completion-card__actions .route-completion-card__action { width: 100%; }
    .route-completion-card__verify-form { grid-template-columns: minmax(0, 1fr); max-width: none; }
    .route-completions__footer { flex-direction: column; align-items: stretch; padding: 12px; }
    .route-completions__cta { justify-content: center; width: 100%; }
    .route-completions__correction > summary { justify-content: center; width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .route-actuality__report-button,
    .route-actuality__disclosure,
    .route-actuality__disclosure > img { transition: none; }
}
