/* * Temos papildymai virš Bustion šablono: WordPress turinio tipografija, formų pranešimai, * lentelės, dokumentų sąrašai, pasiekiamumo smulkmenos. Kraunama paskutinė — be !important. */ /* ----- Pasiekiamumas ----- */ .moletuap-skip { position: absolute; left: 8px; top: 8px; z-index: 2000; background: var(--color-main); color: #fff; padding: 8px 16px; border-radius: 5px; } .moletuap-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; } a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid var(--color-subtle); outline-offset: 2px; } .play-button-btn, .video-modal-close-btn { background: none; border: 0; padding: 0; } .play-button-btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .play-button-btn .play-button { position: static; transform: none; } .video-modal-close-btn { position: absolute; top: 20px; right: 30px; } .video-modal-close-btn .video-modal-close { position: static; } /* WordPress prideda width/height atributus; šablonas nustato tik width:100%, todėl aukštis liktų fiksuotas. */ img { height: auto; } /* ----- Antraštė ----- */ .navbar-brand svg { width: 232px; height: 43px; display: block; } /* Poraštės logotipas: nuo 2026-10-14 čia TIKRAS kliento ženklas (statusis 417×515, baltas), o ne gulsčias placeholder SVG. Fiksuotas 232×43 jį suspausdavo. ⚠ Ši taisyklė yra theme.css, kuris įkeliamas PO template.css — ji ir laimi. */ .footer-logo { width: auto; height: 56px; display: block; } /* Meniu 8 punktų — šablone 6; nelaužome eilučių ir sutankiname tarpus. */ .navbar-nav .nav-link { white-space: nowrap; } @media (min-width: 992px) { .navbar-nav.gap-3 { gap: 0.5rem !important; } .navbar-nav .nav-link { font-size: 13px; } .navbar .btn-subtle { white-space: nowrap; padding: 12px 14px; font-size: 14px; } } @media (min-width: 1500px) { .navbar-nav.gap-3 { gap: 0.9rem !important; } .navbar-nav .nav-link { font-size: 14px; } } .navbar-brand .custom-logo { max-height: 56px; width: auto; } .bg-main a.small-text { color: #fff; } .bg-main a.small-text:hover { color: var(--color-subtle); } .nav-link.active { color: var(--color-main); } .dropdown-item.active { background: var(--color-accent); color: var(--color-main); } /* ----- Antraštės juosta ----- */ .bg-banner p a { color: var(--text-color-1); } .bg-banner p a:hover { color: var(--color-main); } .bg-banner h1 { overflow-wrap: anywhere; } /* ----- Turinys (WordPress redaktorius) ----- */ .moletuap-turinys h2, .moletuap-turinys h3, .moletuap-turinys h4 { margin: 1.5em 0 0.75em; } .moletuap-turinys h2 { font-size: 36px; } .moletuap-turinys h3 { font-size: 28px; } .moletuap-turinys h4 { font-size: 22px; } .moletuap-turinys p, .moletuap-turinys li { font-family: var(--font-1); font-size: 16px; color: var(--text-color-1); line-height: 1.7; } .moletuap-turinys ul, .moletuap-turinys ol { padding-left: 1.5em; margin-bottom: 1.25em; } .moletuap-turinys ul { list-style: disc; } .moletuap-turinys ol { list-style: decimal; } .moletuap-turinys li { margin-bottom: 0.4em; } .moletuap-turinys a { color: var(--color-main); text-decoration: underline; } .moletuap-turinys a:hover { color: var(--color-darker); } .moletuap-turinys img { height: auto; border-radius: 10px; } .moletuap-turinys blockquote { border-left: 4px solid var(--color-subtle); padding: 12px 24px; margin: 1.5em 0; background: var(--color-accent); border-radius: 0 10px 10px 0; } .moletuap-turinys table, .moletuap-lentele { width: 100%; border-collapse: collapse; margin: 1.5em 0; font-family: var(--font-1); } .moletuap-turinys th, .moletuap-turinys td, .moletuap-lentele th, .moletuap-lentele td { border: 1px solid var(--color-border); padding: 10px 14px; text-align: left; vertical-align: top; color: var(--text-color-1); } .moletuap-turinys th, .moletuap-lentele th { background: var(--heading-color); color: #fff; font-weight: 600; } .moletuap-lentele a { color: var(--color-main); } .wp-caption, .wp-block-image figcaption { font-size: 13px; color: var(--text-color-2); margin-top: 6px; } .alignleft { float: left; margin: 0 24px 16px 0; } .alignright { float: right; margin: 0 0 16px 24px; } .aligncenter { display: block; margin: 0 auto 16px; } .wp-block-file a:first-child { color: var(--color-main); } .wp-block-button__link { display: inline-block; background: var(--color-subtle); color: #fff; font-family: var(--font-1); font-weight: 600; border-radius: 5px; padding: 12px 20px; text-decoration: none; } .wp-block-embed iframe { max-width: 100%; } /* ----- Dokumentų ir struktūros sąrašai ----- */ .moletuap-dokumentu-sarasas li, .moletuap-struktura-sarasas li { padding: 10px 0; border-bottom: 1px solid var(--color-accent); font-family: var(--font-1); } .moletuap-dokumentu-sarasas a, .moletuap-struktura-sarasas a { color: var(--heading-color); font-weight: 600; } .moletuap-dokumentu-sarasas a:hover, .moletuap-struktura-sarasas a:hover { color: var(--color-main); } .moletuap-struktura-sarasas ul { padding-left: 24px; margin-top: 8px; } .moletuap-struktura-sarasas ul li { border: 0; padding: 6px 0; } .moletuap-struktura-sarasas ul a { font-weight: 400; } /* ----- Formos ----- */ .moletuap-alert { display: flex; align-items: center; font-family: var(--font-1); border-radius: 5px; padding: 12px 16px; margin: 16px 0; font-size: 15px; transition: opacity 0.4s ease; } .moletuap-alert--ok { background: #e6f7ea; color: #146c2e; border: 1px solid #9bd7ad; } .moletuap-alert--klaida { background: #fdeaea; color: #a11d1d; border: 1px solid #f0a8a8; } .moletuap-alert.is-hidden { opacity: 0; } .hero-card .moletuap-alert { margin: 8px 0 0; } .bus-detail-input, .hero-input, .footer-input, textarea.bus-detail-input { font-family: var(--font-1); } textarea.bus-detail-input { height: auto; min-height: 140px; } .input-label { display: block; } .bus-detail-contact-card h3 { margin-bottom: 0; } /* ----- Kortelės ----- */ .bus-card-img { width: 100%; height: 220px; object-fit: cover; border-radius: 12px; } .testimonial-initial { display: inline-flex; align-items: center; justify-content: center; background: var(--color-main); color: #fff; font-family: var(--font-1); font-weight: 700; font-size: 22px; } .blog-card time { color: inherit; } .destination-link { display: inline-block; } .service-detail-card-dark a[aria-current="page"] .link-list { color: #fff; } .accordion-header { font-size: inherit; margin: 0; } .career-card .moletuap-turinys p { margin-bottom: 0.5em; } /* ----- Tvarkaraščiai ----- */ .moletuap-tabs a { text-decoration: none; } /* ----- Puslapiavimas ----- */ .moletuap-puslapiavimas .page-numbers { display: inline-block; font-family: var(--font-1); font-weight: 600; padding: 10px 16px; margin: 0 4px; border-radius: 5px; background: #fff; color: var(--heading-color); border: 1px solid var(--color-border); } .moletuap-puslapiavimas .page-numbers.current { background: var(--color-main); color: #fff; border-color: var(--color-main); } .moletuap-puslapiavimas a.page-numbers:hover { border-color: var(--color-main); color: var(--color-main); } /* ----- Poraštė ----- */ footer address { font-style: normal; font-family: var(--font-1); font-size: 14px; line-height: 1.7; } .moletuap-copy { border-top: 1px solid rgba(255, 255, 255, 0.12); font-family: var(--font-1); } .moletuap-copy .footer-link { display: inline; } /* ----- Tobalt Maršrutai įskiepio įtraukimas į šablono tipografiją ----- */ .moletuap-tvarkarastis { font-family: var(--font-1); } @media (prefers-reduced-motion: reduce) { .fade-in-up, .fade-in-down, .fade-in-left, .fade-in-right { animation: none; opacity: 1; } * { transition-duration: 0.01ms; } } @media screen and (max-width: 575px) { .navbar-brand svg { width: 170px; } .bg-banner h1 { font-size: 40px; } } /* ===== WCAG 2.1 AA kontrastas (WAVE 2026-09-24) ===== Šablono oranžinė --color-subtle #FF9203 su BALTU tekstu duoda 2.24:1 (reikia 4.5:1). Oranžinių PAVIRŠIŲ nekeičiame — keičiame tik ant jų gulintį tekstą, kad dizainas liktų toks pat kaip šablone. Oranžinis ant TAMSAUS (#201c30) jau 7.37:1 — ten nieko neliečiame. */ :root { --color-on-subtle: #201C30; /* tekstas ant oranžinio fono — 7.37:1 */ --color-subtle-text: #A85A00; /* oranžinis TEKSTAS ant balto — 5.09:1 */ } /* 1. Oranžiniai mygtukai: baltas → tamsus tekstas (2.24 → 7.37) */ .btn-subtle, .btn-dark:hover, .btn-white:hover, .footer-btn:hover, .wp-block-button__link { color: var(--color-on-subtle); } /* 2. Oranžinis tekstas ant šviesaus fono → tamsesnis atspalvis (2.24 → 5.09). Tamsiose sekcijose (.bg-heading, .bg-main, poraštė) paliekame šabloninį. */ .testimonial-client-label, .moletuap-turinys .c-subtle, main .c-subtle:not(.bg-heading .c-subtle):not(.bg-main .c-subtle) { color: var(--color-subtle-text); } /* 3. Pilkas tekstas ant violetinės sekcijos: #A6A5AA 3.88:1 → #D0CFD4 6.13:1 */ .bg-main .c-text-2, .bg-main p.c-text-2 { color: #D0CFD4; } /* 4. Pilkas tekstas ant violetinio „bus-button" bloko: #A6A5AA/#3F1EC6 = 3.88:1 → 6.13:1. (.bg-main taisyklė aukščiau šio bloko nepagavo — fonas ateina iš .bus-button, ne iš sekcijos.) */ /* `.c-text-2` šablone paskelbtas su `!important`, todėl paprasta taisyklė jo neįveikia. Vietoj `!important` karo PERRAŠOME KINTAMĄJĮ šiame bloke — `var()` skaitomas iš paties elemento kaskados, tad `.c-text-2` savaime gauna šviesesnį atspalvį. */ .bus-button { --text-color-2: #D0CFD4; color: #D0CFD4; } /* 5. Naujienų kortelių nuorodos neturėjo spalvos taisyklės ⇒ likdavo Bootstrap numatytoji mėlyna #0D6EFD, tamsiame fone tik 3.67:1. Paveldime kortelės spalvą — kaip jau daroma su `.blog-card time`. */ .blog-card a { color: inherit; } /* 6. `.blog-img-wrapper::before` — dekoratyvus užtamsinimas užvedus pelę — turi `z-index:10` ir gulėjo VIRŠ `.stretched-link::after` (`z-index:1`), todėl persiimdavo paspaudimą ir naujienos paveikslas nustojo vesti į įrašą. Dekoratyvus sluoksnis neturi gaudyti pelės; `:hover` efektas lieka, nes jis kabinamas ant paties wrapper'io. */ .blog-img-wrapper::before { pointer-events: none; } /* 7. Užtamsinimas buvo kabinamas ant `.blog-img-wrapper:hover`, bet `.stretched-link::after` dabar dengia wrapper'į, tad tas `:hover` nebeįvyksta (priartinimas veikė, nes jis kabinamas ant `.blog-colN:hover`). Perkeliame tamsinimą ant to paties stulpelio hover — tas pats šaltinis kaip ir priartinimo, todėl efektai nebeišsiskirs. */ .blog-col1:hover .blog-img-wrapper::before, .blog-col2:hover .blog-img-wrapper::before, .blog-col3:hover .blog-img-wrapper::before, .blog-col4:hover .blog-img-wrapper::before, .blog-col5:hover .blog-img-wrapper::before, .blog-col6:hover .blog-img-wrapper::before { opacity: 1; } /* 8. Antraštės juosta PERSIPILDYDAVO ties 1280–1366 px. Plotį juostoje duoda `.navbar-size`, bet jos vidus apvyniotas `.container-lg`, kurį Bootstrap ties šiais pločiais riboja iki 1140 px — o logotipas (~216 px) + meniu su mygtukais (~1048 px) reikalauja ~1264 px. Todėl `.navbar-text` išlįsdavo už konteinerio: 1280 px — dokumento persipildymas 47 px, 1366 px — 4 px (1440 ir 1920 px buvo tvarkoje, nes tada `.navbar-size` gauna visą 1300). Bootstrap'o riba čia nieko neduoda, plotį jau valdo `.navbar-size`. CHECKLIST D5 + D7. */ .navbar .container-lg { max-width: 100%; } /* 9. `.navbar-size`, `.page-size`, `.get-started-size` turi FIKSUOTĄ `width: 1300px`, o ties 1280 px matomas plotis yra 1265 (po slankiklio) — juostos išlįsdavo 35 px ir dokumentas persipildydavo 20 px VISUOSE šablonuose (pamatuota: `main`, `.bg-main`, `.bg-banner`, `footer.bg-heading` — clientWidth 1265 / scrollWidth 1300). `max-width` leidžia susitraukti; centravimas per `margin: auto` nesikeičia. CHECKLIST D5 + D7. */ .navbar-size, .page-size, .get-started-size { width: 100%; /* 1340 = 1300 turinio + 2×20 vidinės paraštės (border-box), todėl plačiuose ekranuose turinio plotis nesikeičia, o ties 1280 px atsiranda reikalaujama ≥16 px paraštė. */ max-width: 1340px; padding-left: 20px; padding-right: 20px; } /* 10. Ties 1280–1399 px antraštės turinys (logotipas ~217 px + meniu su mygtukais ~1048 px) reikalauja ~1265 px, o konteineris su paraštėmis duoda 1225 px ⇒ 4 px persipildymas. Plėsti konteinerio nebegalima (tada nukenčia D7 paraštė), todėl ties šiais pločiais MAŽINAME meniu tarpus — matuota: `gap: 1rem` → `0.5rem` atlaisvina ~40 px. Virš 1400 px niekas nesikeičia. CHECKLIST D5 + D7. */ @media (min-width: 992px) and (max-width: 1399.98px) { .navbar-nav.gap-3 { gap: 0.5rem !important; } .navbar-text .me-lg-4 { margin-right: 0.75rem !important; } }