/**
 * Reiter "Alle Bars"
 *
 * Farben aus der Portal-Palette (#38B5CF Markenblau, #ff9858 Markenorange),
 * damit sich der Reiter nicht vom Rest des Portals abhebt.
 *
 * @since 1.5.529
 */

/* ---------- Route: von wo nach wo ---------- */

#gstro_public_content #gstro_allbars_route {
    margin-bottom: 24px;
}

#gstro_public_content .gstro_allbars_route_box {
    padding: 6px 20px;
    background: #f4fbfc;
    border: 1px solid #E2E6EC;
    border-radius: 8px;
}

/* Eine Zeile je Paar Start -> Ziel (ab 1.5.539) */
#gstro_public_content .gstro_allbars_route_row {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 10px 0;
    border-top: 1px solid #E2E6EC;
}

#gstro_public_content .gstro_allbars_route_row:first-child {
    border-top: 0;
}

#gstro_public_content .gstro_allbars_route_head {
    padding-bottom: 6px;
}

#gstro_public_content .gstro_allbars_route_point {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    flex: 1 1 0;
}

#gstro_public_content .gstro_allbars_route_point .dashicons {
    font-size: 20px;
    width: 20px;
    height: 20px;
}

#gstro_public_content .gstro_allbars_route_icon_start { color: #38B5CF; }
#gstro_public_content .gstro_allbars_route_icon_end   { color: #ff9858; }

#gstro_public_content .gstro_allbars_route_label {
    font-size: 11px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #8c8f94;
}

#gstro_public_content .gstro_allbars_route_value {
    font-weight: 600;
    color: #1f2937;
    line-height: 1.4;
}

#gstro_public_content .gstro_allbars_route_strasse {
    font-size: 13px;
    color: #5b616b;
    line-height: 1.4;
}

#gstro_public_content .gstro_allbars_route_arrow,
#gstro_public_content .gstro_allbars_route_arrow_platz {
    color: #8c8f94;
    font-size: 20px;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
}

/* ---------- Liste ---------- */

#gstro_public_content .gstro_allbars_anzahl {
    display: inline-block;
    margin-left: 8px;
    padding: 1px 9px;
    border-radius: 11px;
    background: #38B5CF;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    vertical-align: middle;
}

#gstro_public_content table.gstro_allbars_table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #E2E6EC;
    border-radius: 8px;
    overflow: hidden;
    table-layout: auto;
}

/* Kopfzeile ohne eigene Gestaltung - wie alle anderen Tabellen im Portal
   (gstro_data_table, Darstellung kommt vom Theme). Bis 1.5.540 hatte die
   Liste einen eigenen Kopf (grau, Versalien). */
#gstro_public_content table.gstro_allbars_table th {
    white-space: nowrap;
}

#gstro_public_content table.gstro_allbars_table th.gstro_allbars_sortable {
    cursor: pointer;
}


#gstro_public_content table.gstro_allbars_table th > div {
    display: flex;
    align-items: center;
    gap: 4px;
}

#gstro_public_content th.gstro_allbars_col_insta > div {
    justify-content: flex-end;
}

/* Pfeil wie im Staedte-Plugin: dashicons-arrow-up-alt2 / -down-alt2.
   Ohne Pfeilklasse bleibt die Flaeche leer, damit die Ueberschrift beim
   Wechseln nicht springt. */
#gstro_public_content .gstro_allbars_sort_indicator {
    font-size: 14px;
    width: 14px;
    height: 14px;
    color: #38B5CF;
}

#gstro_public_content table.gstro_allbars_table td {
    padding: 11px 14px;
    border-bottom: 1px solid #E2E6EC;
    background: #fff;
    vertical-align: middle;
}

#gstro_public_content table.gstro_allbars_table tbody tr:last-child td {
    border-bottom: 0;
}

#gstro_public_content table.gstro_allbars_table tbody tr:hover td {
    background: #f4fbfc;
}

/* Start und Ziel ueber einen Streifen an der ersten Zelle, nicht ueber
   eine Flaechenfarbe - sonst konkurriert die Zeile mit dem Hover. */
#gstro_public_content tr.gstro_allbars_row_start td:first-child { box-shadow: inset 3px 0 0 #38B5CF; }
#gstro_public_content tr.gstro_allbars_row_end   td:first-child { box-shadow: inset 3px 0 0 #ff9858; }

#gstro_public_content .gstro_allbars_name {
    font-weight: 600;
    color: #1f2937;
}

#gstro_public_content td.gstro_allbars_cell_adresse {
    font-size: 13px;
    color: #707070;
}

#gstro_public_content td.gstro_allbars_cell_insta {
    text-align: right;
    white-space: nowrap;
}

#gstro_public_content .gstro_allbars_offen {
    color: #8c8f94;
    font-style: italic;
}

/* ---------- Badges ---------- */

#gstro_public_content .gstro_allbars_badge {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
    vertical-align: middle;
    white-space: nowrap;
}

#gstro_public_content .gstro_allbars_badge_start {
    background: #e8f6f9;
    color: #2a8ba1;
}

#gstro_public_content .gstro_allbars_badge_end {
    background: #fff0e4;
    color: #c96a1f;
}

#gstro_public_content .gstro_allbars_badge_vvk {
    background: #eef0f4;
    color: #5b616b;
}

/* ---------- Instagram ---------- */

#gstro_public_content a.gstro_allbars_insta {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 8px;
    border-radius: 6px;
    color: #8c8f94;
    text-decoration: none;
    transition: color .15s ease, background-color .15s ease;
}

#gstro_public_content a.gstro_allbars_insta:hover {
    color: #c13584;
    background: #fdf2f8;
}

#gstro_public_content a.gstro_allbars_insta .dashicons {
    font-size: 19px;
    width: 19px;
    height: 19px;
}

#gstro_public_content .gstro_allbars_follower {
    font-size: 12px;
    font-weight: 600;
}

/* ---------- Karte ---------- */

#gstro_public_content #gstro_allbars_map_section {
    border-radius: 8px;
    overflow: hidden;
}

/* ---------- Schmale Ansicht ---------- */

@media (max-width: 600px) {
    #gstro_public_content table.gstro_allbars_table td {
        padding: 9px 10px;
    }
}

@media (max-width: 1000px) {
    #gstro_public_content #gstro_allbars_map {
        margin-top: 24px;
    }
}

/* Namen unter der Kopfzeile ausrichten (Icon 20px + Abstand 8px) */
#gstro_public_content .gstro_allbars_route_row:not(.gstro_allbars_route_head) .gstro_allbars_route_point {
    padding-left: 28px;
}