/* Rozkłady Jazdy - frontend styles * Wszystkie kolory i tła są zmiennymi CSS — motyw / klasa .rj-transparent-mode mogą je nadpisać. */ :root{ --rj-form-bg: #f7fafc; --rj-card-bg: #ffffff; --rj-border: #e2e8f0; --rj-radius: .5rem; --rj-radius-sm: .375rem; --rj-text-muted: #718096; --rj-text-strong: #1a202c; --rj-accent: #2563eb; --rj-accent-text: #ffffff; --rj-table-head-bg: #edf2f7; --rj-table-row-border: #e2e8f0; --rj-error-bg: #fff5f5; --rj-error-border: #fed7d7; --rj-error-text: #742a2a; --rj-info-bg: #ebf8ff; --rj-info-border: #bee3f8; --rj-info-text: #2a4365; --rj-today-color: #38a169; --rj-time-pill-bg: #edf2f7; /* Pola formularza i dropdowny — zawsze nieprzezroczyste, by tekst nie zlewał się z tłem motywu. */ --rj-input-bg: #ffffff; --rj-input-text: #1a202c; --rj-input-border: #cbd5e0; --rj-dropdown-bg: #ffffff; --rj-dropdown-shadow: 0 4px 12px rgba(0,0,0,.12); } /* Tryb ciemny — automatyczne wykrywanie systemowej preferencji. * Działa dla motywów które nie przełączają samodzielnie ani nie wspierają systemowej preferencji. */ @media (prefers-color-scheme: dark){ :root{ --rj-form-bg: #1a1f2e; --rj-card-bg: #232936; --rj-border: #2d3548; --rj-text-muted: #94a3b8; --rj-text-strong: #f1f5f9; --rj-accent: #60a5fa; --rj-accent-text: #0f172a; --rj-table-head-bg: #2d3548; --rj-table-row-border: #2d3548; --rj-error-bg: #4a1a1a; --rj-error-border: #7f1d1d; --rj-error-text: #fecaca; --rj-info-bg: #1e3a5f; --rj-info-border: #3b6394; --rj-info-text: #bfdbfe; --rj-today-color: #4ade80; --rj-time-pill-bg: #2d3548; --rj-input-bg: #232936; --rj-input-text: #f1f5f9; --rj-input-border: #475569; --rj-dropdown-bg: #232936; --rj-dropdown-shadow: 0 4px 16px rgba(0,0,0,.45); } } /* Tryb ciemny — wykrywanie po klasach które motywy często ustawiają na lub . * Obsługiwane konwencje: * - .dark, .dark-mode, .is-dark — generic * - [data-theme="dark"], [data-color-mode="dark"] — generic data-attr * - .s-dark, .site-s-dark — motyw Smart Mag (popularne motywy newsowe) * - .theme-dark, .night-mode — inne motywy * Ma wyższy priorytet niż @media — pozwala motywowi nadpisać wybór użytkownika. */ html.dark, html.dark-mode, html.is-dark, html.s-dark, html.site-s-dark, html.theme-dark, html.night-mode, html[data-theme="dark"], html[data-color-mode="dark"], body.dark, body.dark-mode, body.is-dark, body[data-theme="dark"], body[data-color-mode="dark"], html.s-dark body, html.site-s-dark body{ --rj-form-bg: #1a1f2e; --rj-card-bg: #232936; --rj-border: #2d3548; --rj-text-muted: #94a3b8; --rj-text-strong: #f1f5f9; --rj-accent: #60a5fa; --rj-accent-text: #0f172a; --rj-table-head-bg: #2d3548; --rj-table-row-border: #2d3548; --rj-error-bg: #4a1a1a; --rj-error-border: #7f1d1d; --rj-error-text: #fecaca; --rj-info-bg: #1e3a5f; --rj-info-border: #3b6394; --rj-info-text: #bfdbfe; --rj-today-color: #4ade80; --rj-time-pill-bg: #2d3548; --rj-input-bg: #232936; --rj-input-text: #f1f5f9; --rj-input-border: #475569; --rj-dropdown-bg: #232936; --rj-dropdown-shadow: 0 4px 16px rgba(0,0,0,.45); } /* Auto-detekcja dark mode po RZECZYWISTYM kolorze tła (JS w public.js). * Działa dla motywów które nie używają standardowych klas (`.dark`, `[data-theme="dark"]`) * a mają własny custom dark mode (np. WP block themes, motywy z custom togglem JS). * Ten selektor matchuje wcześniej niż `body.rj-force-*` (te są wyżej w pliku i mają !important). */ body.rj-detected-dark{ --rj-form-bg: #1a1f2e; --rj-card-bg: #232936; --rj-border: #2d3548; --rj-text-muted: #94a3b8; --rj-text-strong: #f1f5f9; --rj-accent: #60a5fa; --rj-accent-text: #0f172a; --rj-table-head-bg: #2d3548; --rj-table-row-border: #2d3548; --rj-error-bg: #4a1a1a; --rj-error-border: #7f1d1d; --rj-error-text: #fecaca; --rj-info-bg: #1e3a5f; --rj-info-border: #3b6394; --rj-info-text: #bfdbfe; --rj-today-color: #4ade80; --rj-time-pill-bg: #2d3548; --rj-input-bg: #232936; --rj-input-text: #f1f5f9; --rj-input-border: #475569; --rj-dropdown-bg: #232936; --rj-dropdown-shadow: 0 4px 16px rgba(0,0,0,.45); } /* Wymuszone tryby ustawione w admin („Ustawienia → Tryb kolorów"). Mają najwyższy priorytet. */ body.rj-force-dark{ --rj-form-bg: #1a1f2e; --rj-card-bg: #232936; --rj-border: #2d3548; --rj-text-muted: #94a3b8; --rj-text-strong: #f1f5f9; --rj-accent: #60a5fa; --rj-accent-text: #0f172a; --rj-table-head-bg: #2d3548; --rj-table-row-border: #2d3548; --rj-error-bg: #4a1a1a; --rj-error-border: #7f1d1d; --rj-error-text: #fecaca; --rj-info-bg: #1e3a5f; --rj-info-border: #3b6394; --rj-info-text: #bfdbfe; --rj-today-color: #4ade80; --rj-time-pill-bg: #2d3548; --rj-input-bg: #232936; --rj-input-text: #f1f5f9; --rj-input-border: #475569; --rj-dropdown-bg: #232936; --rj-dropdown-shadow: 0 4px 16px rgba(0,0,0,.45); } body.rj-force-light{ --rj-form-bg: #f7fafc !important; --rj-card-bg: #ffffff !important; --rj-border: #e2e8f0 !important; --rj-text-muted: #718096 !important; --rj-text-strong: #1a202c !important; --rj-accent: #2563eb !important; --rj-accent-text: #ffffff !important; --rj-table-head-bg: #edf2f7 !important; --rj-table-row-border: #e2e8f0 !important; --rj-error-bg: #fff5f5 !important; --rj-error-border: #fed7d7 !important; --rj-error-text: #742a2a !important; --rj-info-bg: #ebf8ff !important; --rj-info-border: #bee3f8 !important; --rj-info-text: #2a4365 !important; --rj-today-color: #38a169 !important; --rj-time-pill-bg: #edf2f7 !important; --rj-input-bg: #ffffff !important; --rj-input-text: #1a202c !important; --rj-input-border: #cbd5e0 !important; --rj-dropdown-bg: #ffffff !important; --rj-dropdown-shadow: 0 4px 12px rgba(0,0,0,.12) !important; } /* Tryb jasny wymuszony przez motyw — gdy systemowa preferencja to ciemny ale motyw chce jasny. * Obsługiwane konwencje: .light, .light-mode, .s-light, .site-s-light (Smart Mag), .theme-light. */ html.light, html.light-mode, html.s-light, html.site-s-light, html.theme-light, html[data-theme="light"], html[data-color-mode="light"], body.light, body.light-mode, body[data-theme="light"], body[data-color-mode="light"], html.s-light body, html.site-s-light body{ --rj-form-bg: #f7fafc; --rj-card-bg: #ffffff; --rj-border: #e2e8f0; --rj-text-muted: #718096; --rj-text-strong: #1a202c; --rj-accent: #2563eb; --rj-accent-text: #ffffff; --rj-table-head-bg: #edf2f7; --rj-table-row-border: #e2e8f0; --rj-error-bg: #fff5f5; --rj-error-border: #fed7d7; --rj-error-text: #742a2a; --rj-info-bg: #ebf8ff; --rj-info-border: #bee3f8; --rj-info-text: #2a4365; --rj-today-color: #38a169; --rj-time-pill-bg: #edf2f7; --rj-input-bg: #ffffff; --rj-input-text: #1a202c; --rj-input-border: #cbd5e0; --rj-dropdown-bg: #ffffff; --rj-dropdown-shadow: 0 4px 12px rgba(0,0,0,.12); } /* Tryb przezroczysty — dziedziczenie kolorów z motywu, bez wypełnień. */ .rj-transparent-mode, .rj-transparent-mode .rj-search-form, .rj-transparent-mode .rj-stop, .rj-transparent-mode .rj-carrier, .rj-transparent-mode .rj-route, .rj-transparent-mode .rj-search-results, .rj-transparent-mode .rj-route-card, .rj-transparent-mode .rj-transfer-item, .rj-transparent-mode .rj-next-day-block, .rj-transparent-mode .rj-view-switcher{ --rj-form-bg: transparent; --rj-card-bg: transparent; --rj-table-head-bg: transparent; --rj-time-pill-bg: transparent; --rj-border: rgba(127,127,127,.25); --rj-table-row-border: rgba(127,127,127,.2); } .rj-transparent-mode .rj-btn{background:transparent;color:inherit;border-color:currentColor;opacity:.85} .rj-transparent-mode .rj-btn-primary, .rj-transparent-mode .rj-btn-active{background:var(--rj-accent);color:var(--rj-accent-text);opacity:1} .rj-transparent-mode .rj-results-table th{color:inherit} /* Wyszukiwarka */ .rj-search-form{display:flex;flex-direction:column;gap:1rem;background:var(--rj-form-bg);border:1px solid var(--rj-border);border-radius:var(--rj-radius);padding:1.25rem;margin:1rem 0} .rj-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem 1rem} .rj-form-row-from-to{display:grid;grid-template-columns:1fr auto 1fr;gap:.5rem 1rem;align-items:end;margin-bottom:.25rem} .rj-swap-btn{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid var(--rj-input-border);background:var(--rj-input-bg);color:var(--rj-input-text);border-radius:50%;cursor:pointer;padding:0;transition:transform .15s ease,background .15s ease;align-self:end;margin-bottom:1px} .rj-swap-btn:hover{background:var(--rj-accent);color:var(--rj-accent-text);border-color:var(--rj-accent);transform:rotate(180deg)} .rj-swap-btn:focus{outline:2px solid var(--rj-accent);outline-offset:2px} .rj-form-cell{display:flex;flex-direction:column;gap:.25rem;min-width:0} .rj-form-row{display:flex;flex-direction:column;gap:.25rem} .rj-search-form label{font-weight:600;font-size:.95rem} .rj-search-form input[type=text], .rj-search-form input[type=date]{padding:.6rem .8rem;border:1px solid var(--rj-input-border);border-radius:var(--rj-radius-sm);font-size:1rem;background:var(--rj-input-bg);color:var(--rj-input-text);width:100%;box-sizing:border-box;min-width:0} .rj-search-form input[type=text]::placeholder, .rj-search-form input[type=date]::placeholder{color:var(--rj-text-muted);opacity:.85} .rj-form-row-options{display:flex;flex-direction:row;flex-wrap:wrap;gap:1rem;align-items:center} .rj-radio,.rj-checkbox{display:inline-flex;align-items:center;gap:.4rem;font-weight:400} .rj-form-row-actions{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap} .rj-btn-search{padding:.85rem 2rem;font-size:1.05rem;flex:1 1 auto;min-width:220px;max-width:360px} @media(max-width:640px){ .rj-form-grid{grid-template-columns:1fr} .rj-btn-search{max-width:none;width:100%} .rj-form-row-from-to{grid-template-columns:1fr;gap:.25rem} .rj-swap-btn{align-self:center;margin:.25rem 0} } /* Przyciski */ .rj-btn{display:inline-block;padding:.55rem 1rem;border:1px solid var(--rj-accent);background:var(--rj-card-bg);color:var(--rj-accent);border-radius:var(--rj-radius-sm);font-weight:600;cursor:pointer;text-decoration:none;line-height:1.2} .rj-btn-primary{background:var(--rj-accent);color:var(--rj-accent-text)} .rj-btn-active{background:var(--rj-accent);color:var(--rj-accent-text)} .rj-search-time,.rj-form-hint{margin:0;color:var(--rj-text-muted);font-size:.875rem} /* Sekcja zdjęcie + mapa na stronie przystanku. Grid 2-kolumnowy desktop, 1-kolumna mobile. */ .rj-stop-media{padding:0;margin:1.25rem 0} .rj-stop-media-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:start} .rj-stop-photo img{width:100%;height:auto;max-height:360px;object-fit:cover;border-radius:var(--rj-radius);display:block;background:var(--rj-table-head-bg)} .rj-stop-map{display:flex;flex-direction:column} .rj-leaflet-container{width:100%;height:300px;border-radius:var(--rj-radius);border:1px solid var(--rj-border);background:var(--rj-table-head-bg);cursor:pointer} .rj-stop-map-caption{margin:.5rem 0 0;color:var(--rj-text-muted);font-size:.875rem} .rj-stop-map-caption a{color:var(--rj-accent);text-decoration:none} .rj-stop-map-caption a:hover{text-decoration:underline} /* Jeśli tylko jeden z dwóch elementów istnieje (zdjęcie LUB mapa), grid pokazuje go na pełnej szerokości. */ .rj-stop-media-grid:has(.rj-stop-photo:only-child), .rj-stop-media-grid:has(.rj-stop-map:only-child){grid-template-columns:1fr;max-width:720px;margin:0 auto} @media(max-width:768px){ .rj-stop-media-grid{grid-template-columns:1fr} .rj-leaflet-container{height:240px} .rj-stop-photo img{max-height:240px} } /* Dark mode — mapa Leaflet ma jasne atrybucje, dostosujmy popup. */ body.rj-detected-dark .leaflet-popup-content-wrapper, body.rj-force-dark .leaflet-popup-content-wrapper{background:var(--rj-card-bg);color:var(--rj-text-strong)} body.rj-detected-dark .leaflet-popup-tip, body.rj-force-dark .leaflet-popup-tip{background:var(--rj-card-bg)} /* Sloty reklamowe — wycentrowane bloki pod banner / Google AdSense. * Renderowane przez RJ_Ad_Slots::render('slot_name') w templates. Domyślnie zawierają * shortcode [rotator_reklam strefa="rj_NAZWA"] (jeśli plugin Rotator Reklam jest aktywny), * fallback to puste (slot widoczny w HTML, ale bez wizualnej reprezentacji). */ .rj-ad-slot{ display:flex; justify-content:center; align-items:center; margin:1.5rem auto; width:100%; min-height:1px; /* zachowuje miejsce w layout nawet jak strefa nie ma reklam */ } .rj-ad-slot:empty{display:none} /* gdy zawartość pusta, nie zostawiaj białej dziury */ .rj-ad-slot > *{max-width:100%} /* Wariant tabular (pomiędzy tabelami wyników) — większy margines pionowy. */ .rj-ad-slot-search_middle, .rj-ad-slot-search_top, .rj-ad-slot-search_bottom{margin:2rem auto} /* Wariant strona-content (pod content na podstronach) — mniejszy margines. */ .rj-ad-slot-stop_below, .rj-ad-slot-carrier_below, .rj-ad-slot-route_below, .rj-ad-slot-city_below, .rj-ad-slot-cities_top{margin:1.25rem auto} .rj-form-row-browse{display:flex;justify-content:center;margin-top:.25rem;padding-top:.75rem;border-top:1px dashed var(--rj-border)} .rj-browse-cities{display:inline-flex;align-items:center;gap:.5rem;color:var(--rj-text-muted);text-decoration:none;font-weight:500;font-size:.95rem;padding:.5rem .85rem;border-radius:var(--rj-radius-sm);transition:background .15s,color .15s} .rj-browse-cities:hover{background:var(--rj-table-head-bg);color:var(--rj-accent)} .rj-browse-cities .rj-browse-arrow{transition:transform .2s;font-weight:600} .rj-browse-cities:hover .rj-browse-arrow{transform:translateX(3px)} /* Tabele */ .rj-results-table{width:100%;border-collapse:collapse;margin:1rem 0;background:transparent} .rj-results-table th,.rj-results-table td{padding:.6rem .75rem;border-bottom:1px solid var(--rj-table-row-border);text-align:left} .rj-results-table th{background:var(--rj-table-head-bg);font-weight:600} .rj-time{font-variant-numeric:tabular-nums;font-weight:600;color:var(--rj-text-strong)} .rj-line-number{color:var(--rj-text-muted);font-weight:400} /* Komunikaty */ .rj-no-results{padding:1rem;background:var(--rj-error-bg);border:1px solid var(--rj-error-border);border-radius:var(--rj-radius-sm);color:var(--rj-error-text)} .rj-notice{padding:.75rem 1rem;border-radius:var(--rj-radius-sm);margin:1rem 0} .rj-notice-error{background:var(--rj-error-bg);color:var(--rj-error-text);border:1px solid var(--rj-error-border)} .rj-notice-info{background:var(--rj-info-bg);color:var(--rj-info-text);border:1px solid var(--rj-info-border)} .rj-results-meta{margin:.5rem 0;color:var(--rj-text-muted);font-size:.9rem} .rj-results-title{margin-top:1.25rem;margin-bottom:.5rem} /* Połączenia z przesiadką */ .rj-transfer-list{display:flex;flex-direction:column;gap:.75rem;margin:1rem 0} .rj-transfer-item{padding:.75rem 1rem;border:1px solid var(--rj-border);border-radius:var(--rj-radius);background:var(--rj-card-bg)} .rj-transfer-summary{font-size:1rem;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem} .rj-transfer-info{margin-left:auto;color:var(--rj-text-muted);font-size:.9rem} .rj-transfer-legs{margin-top:.5rem;display:flex;flex-direction:column;gap:.25rem;font-size:.92rem} /* Strona przystanku */ .rj-stop-header{display:flex;align-items:baseline;flex-wrap:wrap;gap:.5rem} .rj-stop-header .rj-city{color:var(--rj-text-muted);font-weight:400} .rj-mode-switcher{display:flex;gap:.5rem;margin:1rem 0} .rj-view-switcher{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;margin:1rem 0;padding:.6rem .75rem;background:var(--rj-form-bg);border:1px solid var(--rj-border);border-radius:var(--rj-radius)} .rj-view-switcher .rj-view-label{font-weight:600;margin-right:.25rem} .rj-view-switcher .rj-btn{padding:.4rem .8rem;font-size:.92rem} .rj-view-switcher .rj-btn-today{border-color:var(--rj-today-color);color:var(--rj-today-color)} .rj-view-switcher .rj-today-dot{color:var(--rj-today-color);margin-left:.25rem} .rj-current-time{color:var(--rj-text-muted)} .rj-departures-grid{list-style:none;padding:0;margin:.5rem 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:.5rem} .rj-departures-grid li{padding:.5rem;text-align:center;background:var(--rj-time-pill-bg);border-radius:var(--rj-radius-sm);font-variant-numeric:tabular-nums;font-weight:600} /* Strona trasy / przewoźnika */ .rj-routes-list{display:flex;flex-direction:column;gap:1rem} .rj-route-card{padding:1rem;border:1px solid var(--rj-border);border-radius:var(--rj-radius);background:var(--rj-card-bg)} .rj-route-stops{margin:.5rem 0 0;padding-left:1.25rem} .rj-travel-time{margin-left:.5rem;color:var(--rj-text-muted);font-size:.85rem} .rj-route-collapsible{padding:0} .rj-route-collapsible[open]{border-color:var(--rj-accent)} .rj-route-summary{display:flex;align-items:center;gap:.6rem;padding:.85rem 1rem;cursor:pointer;list-style:none;flex-wrap:wrap} .rj-route-summary::-webkit-details-marker{display:none} .rj-route-summary::before{content:'▸';display:inline-block;color:var(--rj-text-muted);transition:transform .15s ease;width:1em} .rj-route-collapsible[open] .rj-route-summary::before{transform:rotate(90deg)} .rj-route-summary-icon{display:inline-flex;color:var(--rj-accent)} .rj-route-summary-name{font-weight:600;flex:1 1 200px;min-width:0} .rj-route-summary-meta{color:var(--rj-text-muted);font-size:.9rem} .rj-route-summary-actions{margin-left:auto} .rj-link-route{font-size:.9rem;color:var(--rj-accent);text-decoration:none} .rj-link-route:hover{text-decoration:underline} .rj-route-collapsible[open] .rj-route-stops{padding:.25rem 1rem 1rem 2.5rem} /* Listy zbiorcze */ .rj-carriers-list,.rj-stops-list{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.5rem} .rj-carriers-list li,.rj-stops-list li{padding:.5rem .75rem;background:var(--rj-form-bg);border-radius:var(--rj-radius-sm);border:1px solid var(--rj-border)} /* Autocomplete */ .rj-autocomplete{position:relative} .rj-autocomplete-list{position:absolute;z-index:50;top:100%;left:0;right:0;background:var(--rj-dropdown-bg);color:var(--rj-input-text);border:1px solid var(--rj-input-border);border-top:0;border-radius:0 0 var(--rj-radius-sm) var(--rj-radius-sm);max-height:240px;overflow:auto;list-style:none;padding:0;margin:0;box-shadow:var(--rj-dropdown-shadow)} .rj-autocomplete-list li{padding:.5rem .75rem;cursor:pointer;background:var(--rj-dropdown-bg)} .rj-autocomplete-list li:hover,.rj-autocomplete-list li.rj-active{background:var(--rj-table-head-bg);color:var(--rj-text-strong)} .rj-carrier-logo{max-width:160px;height:auto} .rj-next-day-block{margin-top:1.5rem;padding:1rem;background:var(--rj-form-bg);border:1px dashed var(--rj-border);border-radius:var(--rj-radius)} .rj-form-hint{font-size:.85rem;color:var(--rj-text-muted);margin-left:.5rem} /* Ikony SVG */ .rj-icon{display:inline-block;vertical-align:middle;line-height:1;flex-shrink:0} .rj-icon-h1{margin-right:.5rem;color:var(--rj-accent);vertical-align:-.15em} .rj-icon-btn{margin-right:.4rem;vertical-align:-.2em} .rj-icon-card{color:var(--rj-accent);flex-shrink:0} .rj-stop-header h1, .rj-carrier-header h1, .rj-route-header h1, .rj-city-header h1{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap} .rj-ac-city{color:var(--rj-text-muted);font-size:.9em} .rj-ac-city-group{font-weight:600;border-bottom:1px dashed var(--rj-border);background:rgba(127,127,127,.05)} .rj-ac-city-group:hover{background:rgba(127,127,127,.12)} /* ═══════════════════════════════════════════════════════════════════════ Wspólny design „card page" — używany przez miejscowości, indeks miast itp. ═══════════════════════════════════════════════════════════════════════ */ .rj-card-page{margin:1rem 0} .rj-page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:1.25rem 1.5rem;background:linear-gradient(135deg,var(--rj-form-bg),var(--rj-card-bg));border:1px solid var(--rj-border);border-radius:var(--rj-radius);margin-bottom:1.5rem;position:relative;overflow:hidden} .rj-page-header::before{content:"";position:absolute;top:0;left:0;width:5px;height:100%;background:var(--rj-accent)} .rj-page-header-main{flex:1 1 auto;min-width:0} .rj-page-title{display:flex;align-items:center;gap:.6rem;margin:0 0 .35rem;font-size:1.85rem;line-height:1.2;font-weight:700;color:var(--rj-text-strong)} .rj-page-title .rj-icon{color:var(--rj-accent)} .rj-page-meta{margin:0;color:var(--rj-text-muted);font-size:.95rem} .rj-page-header-aside{display:inline-flex;flex-direction:column;align-items:flex-end;gap:.35rem;font-variant-numeric:tabular-nums;font-weight:600;color:var(--rj-text-muted);background:var(--rj-card-bg);padding:.5rem .85rem;border-radius:var(--rj-radius-sm);border:1px solid var(--rj-border);font-size:.95rem;flex-shrink:0} .rj-reverse-link{display:inline-flex;align-items:center;gap:.3rem;font-size:.82rem;font-weight:500;color:var(--rj-accent);text-decoration:none;padding:.18rem .5rem;border-radius:var(--rj-radius-sm);background:rgba(37,99,235,.08);transition:background .15s ease} .rj-reverse-link:hover{background:rgba(37,99,235,.18);text-decoration:none} .rj-section{margin:1.5rem 0} .rj-section-title{display:flex;align-items:center;gap:.5rem;margin:0 0 1rem;font-size:1.2rem;font-weight:600;color:var(--rj-text-strong)} .rj-section-title .rj-icon{color:var(--rj-accent)} /* Karty przystanków w miejscowości */ .rj-stops-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:.85rem} .rj-stop-card{display:flex;flex-direction:column;gap:.5rem;padding:.95rem 1rem;background:var(--rj-card-bg);border:1px solid var(--rj-border);border-radius:var(--rj-radius);text-decoration:none;color:inherit;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease} .rj-stop-card:hover{border-color:var(--rj-accent);box-shadow:0 4px 12px rgba(0,0,0,.08);transform:translateY(-1px)} .rj-stop-card-head{display:flex;align-items:center;gap:.5rem} .rj-stop-card-name{font-weight:600;color:var(--rj-text-strong);line-height:1.3} .rj-stop-card-next{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;padding-top:.45rem;border-top:1px dashed var(--rj-border);font-size:.92rem} .rj-stop-card-label{color:var(--rj-text-muted);font-size:.85rem} .rj-stop-card-time{font-weight:700;font-variant-numeric:tabular-nums;color:var(--rj-accent);font-size:1.05rem} .rj-stop-card-direction{color:var(--rj-text-muted)} .rj-stop-card-empty .rj-stop-card-label{font-style:italic;opacity:.7} /* Karty miejscowości w indeksie */ .rj-cities-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.7rem} .rj-city-card{display:flex;align-items:center;gap:.5rem;padding:.75rem .95rem;background:var(--rj-card-bg);border:1px solid var(--rj-border);border-radius:var(--rj-radius);text-decoration:none;color:inherit;transition:all .15s ease;flex-wrap:wrap} .rj-city-card:hover{border-color:var(--rj-accent);background:var(--rj-form-bg);transform:translateY(-1px)} .rj-city-card-name{font-weight:600;color:var(--rj-text-strong);flex:1 1 auto;line-height:1.3} .rj-city-card-count{color:var(--rj-text-muted);font-size:.85rem;background:var(--rj-form-bg);padding:.15rem .55rem;border-radius:999px;font-weight:500} .rj-city-card:hover .rj-city-card-count{background:var(--rj-accent);color:var(--rj-accent-text)} /* Listy linii (pill) */ .rj-pill-list{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.5rem} .rj-pill{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .85rem;background:var(--rj-card-bg);border:1px solid var(--rj-border);border-radius:999px;text-decoration:none;color:inherit;font-size:.92rem;transition:all .15s ease} .rj-pill:hover{border-color:var(--rj-accent);background:var(--rj-form-bg)} .rj-pill-badge{display:inline-block;padding:.15em .55em;background:var(--rj-accent);color:var(--rj-accent-text);border-radius:.3em;font-weight:700;font-size:.85em} .rj-pill small{color:var(--rj-text-muted);margin-left:.25rem} /* Indeks alfabetyczny */ .rj-alpha-nav{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem;padding:.75rem 1rem;background:var(--rj-form-bg);border:1px solid var(--rj-border);border-radius:var(--rj-radius);margin-bottom:1.5rem;position:sticky;top:0;z-index:5} .rj-alpha-label{color:var(--rj-text-muted);font-weight:600;margin-right:.5rem;font-size:.9rem} .rj-alpha-link{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:0 .4rem;text-decoration:none;color:var(--rj-accent);border-radius:var(--rj-radius-sm);font-weight:600;transition:all .15s ease} .rj-alpha-link:hover{background:var(--rj-accent);color:var(--rj-accent-text)} .rj-alpha-section{margin-top:1.5rem;scroll-margin-top:60px} .rj-alpha-heading{margin:0 0 .75rem;padding:.4rem .8rem;display:inline-block;background:var(--rj-accent);color:var(--rj-accent-text);border-radius:var(--rj-radius-sm);font-size:1.4rem;min-width:2.5rem;text-align:center;font-weight:700} /* Nawigacja dolna strony */ .rj-page-nav{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2rem;padding-top:1rem;border-top:1px solid var(--rj-border)} /* Lista linii / tras (collapsible) — większy padding i pill-badge */ .rj-route-summary{display:flex;align-items:center;gap:.75rem;padding:1rem 1.25rem;cursor:pointer;list-style:none;flex-wrap:wrap} .rj-route-summary::before{content:'▸';color:var(--rj-text-muted);transition:transform .15s ease} .rj-route-collapsible[open] .rj-route-summary::before{transform:rotate(90deg)} .rj-route-collapsible{border:1px solid var(--rj-border);border-radius:var(--rj-radius);background:var(--rj-card-bg);overflow:hidden;transition:border-color .15s ease} .rj-route-collapsible[open]{border-color:var(--rj-accent)} .rj-route-summary-name{font-weight:600;flex:1 1 220px;min-width:0;color:var(--rj-text-strong);display:flex;flex-direction:column;gap:.15rem} .rj-route-summary-dir{color:var(--rj-text-muted);font-weight:400;font-size:.85rem} .rj-route-summary-meta{color:var(--rj-text-muted);font-size:.88rem;padding:.2rem .6rem;background:var(--rj-form-bg);border-radius:999px} .rj-route-summary-actions{margin-left:auto} .rj-link-route{font-size:.88rem;color:var(--rj-accent);text-decoration:none;font-weight:600} .rj-link-route:hover{text-decoration:underline} /* Lista przystanków pod summary (collapsed body) */ .rj-route-stops-list{list-style:none;padding:0 1.25rem 1rem 1.25rem;margin:0;border-top:1px solid var(--rj-border)} .rj-route-stops-list li{padding:.4rem 0;border-bottom:1px dashed var(--rj-border)} .rj-route-stops-list li:last-child{border-bottom:0} .rj-route-stops-list a{display:flex;align-items:center;gap:.45rem;text-decoration:none;color:inherit} .rj-route-stops-list a:hover{color:var(--rj-accent)} .rj-route-stops-list small{color:var(--rj-text-muted)} /* Timeline na stronie trasy */ .rj-route-timeline{list-style:none;padding:0;margin:0;position:relative} .rj-route-timeline::before{content:"";position:absolute;left:11px;top:1rem;bottom:1rem;width:2px;background:var(--rj-border)} .rj-route-timeline-item{position:relative;padding:.5rem 0 .5rem 2rem;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap} .rj-route-timeline-dot{position:absolute;left:5px;top:.85rem;width:14px;height:14px;border-radius:50%;background:var(--rj-card-bg);border:2px solid var(--rj-accent);z-index:1} .rj-route-timeline-first .rj-route-timeline-dot, .rj-route-timeline-last .rj-route-timeline-dot{background:var(--rj-accent);width:16px;height:16px;left:4px;top:.8rem} .rj-route-timeline-name{font-weight:600;color:var(--rj-text-strong);text-decoration:none} .rj-route-timeline-name:hover{color:var(--rj-accent)} .rj-route-timeline-city{color:var(--rj-text-muted);font-size:.85rem} .rj-route-timeline-travel{margin-left:auto;font-size:.82rem;color:var(--rj-text-muted);font-variant-numeric:tabular-nums;background:var(--rj-form-bg);padding:.1rem .5rem;border-radius:.3rem} /* Bloki godzin odjazdów per pattern */ .rj-departures-block{margin-bottom:1.25rem} .rj-departures-block-title{margin:.5rem 0;font-size:1rem;font-weight:600;color:var(--rj-text-strong)} .rj-departures-block-title small{color:var(--rj-text-muted);font-weight:400} /* Kierunek w nagłówku trasy */ .rj-route-direction{display:inline-flex;align-items:center;gap:.5rem;font-size:.92rem} @media(max-width:640px){ .rj-results-table{font-size:.92rem} .rj-form-row-options{flex-direction:column;align-items:flex-start} .rj-view-switcher{flex-direction:column;align-items:stretch} .rj-view-switcher .rj-btn{width:100%;text-align:center} .rj-page-header{flex-direction:column;padding:1rem} .rj-page-title{font-size:1.4rem} .rj-page-header-aside{align-self:flex-start} .rj-stops-grid{grid-template-columns:1fr} .rj-cities-grid{grid-template-columns:1fr 1fr} .rj-alpha-nav{position:relative} }