/* ============================================================ NaszDzien - style aplikacji (papeteria slubna) Kolor wesela jest atramentem, nie tapeta: tlo to porcelana przelamana kolorem pary przez color-mix. Dynamiczne wartosci (--w-primary, --w-secondary, --bs-*) wstrzykuje _Layout.cshtml jako inline style na ; ponizsze :root to tylko domyslne. ============================================================ */ /* ===== Tokeny ===== */ :root { --w-primary: #44604E; /* wariant o gwarantowanym kontrascie z bialym tekstem - _Layout przyciemnia jasne kolory wesela; domyslny jest ciemny, wiec równy --w-primary */ --w-primary-strong: #44604E; --w-secondary: #A8853B; --w-paper: color-mix(in srgb, var(--w-primary) 6%, #FDFCFA); --w-card: #FFFEFC; --w-ink: #262925; --w-muted: #77746C; --w-line: color-mix(in srgb, var(--w-primary) 24%, #E7E3DA); --w-line-soft: color-mix(in srgb, var(--w-primary) 12%, #EEEBE4); --w-tint: color-mix(in srgb, var(--w-primary) 9%, #FFFFFF); --w-accent-ink: color-mix(in srgb, var(--w-secondary) 72%, #4A4438); --w-font-display: "Cormorant Garamond", Georgia, serif; --w-font-body: "Jost", "Segoe UI", system-ui, sans-serif; } /* Bootstrap 5.1 fallback: brak rounded-4 / rounded-5 */ .rounded-4 { border-radius: 1rem !important; } .rounded-5 { border-radius: 1.5rem !important; } /* ===== Baza (strony goscia) ===== */ html { background: var(--w-paper); } body { background: var(--w-paper); color: var(--w-ink); font-family: var(--w-font-body); font-weight: 400; line-height: 1.65; margin-bottom: 0 !important; -webkit-font-smoothing: antialiased; } h1, h2, h3, .wx-display { font-family: var(--w-font-display); font-weight: 500; color: var(--w-ink); } ::selection { background: color-mix(in srgb, var(--w-secondary) 30%, #ffffff); } :focus-visible { outline: 2px solid var(--w-secondary); outline-offset: 2px; border-radius: 1px; } /* ===== Slownik papeterii ===== */ .wx-eyebrow { font-family: var(--w-font-body); font-size: .86rem; font-weight: 600; letter-spacing: .28em; text-transform: uppercase; color: var(--w-accent-ink); } .wx-rule { display: flex; align-items: center; gap: .9rem; justify-content: center; color: var(--w-secondary); margin: 1.1rem auto; max-width: 340px; } .wx-rule::before, .wx-rule::after { content: ""; height: 1px; flex: 1; background: var(--w-line); } .wx-rule > span { font-size: .8rem; line-height: 1; display: inline-block; } .wx-seal { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--w-line); box-shadow: inset 0 0 0 3px var(--w-paper), inset 0 0 0 4px var(--w-line); font-family: var(--w-font-display); font-style: italic; font-size: 1.35rem; color: var(--w-accent-ink); background: var(--w-card); } .wx-seal--lg { width: 62px; height: 62px; font-size: 1.8rem; } .wx-panel { background: var(--w-card); border: 1px solid var(--w-line); border-radius: 2px; } .wx-note { background: var(--w-tint); border: 1px solid var(--w-line-soft); border-radius: 2px; padding: 1rem 1.25rem; color: var(--w-muted); } .wx-note--narrow { max-width: 480px; } .wx-note--error { border-color: color-mix(in srgb, #B0413E 45%, var(--w-line)); color: #8A3330; } /* ===== Przyciski: letterpress ===== */ .btn { border-radius: 0; } .btn-primary { background: var(--w-primary-strong, var(--w-primary)); border: 1px solid var(--w-primary-strong, var(--w-primary)); color: #fff; font-family: var(--w-font-body); font-size: .78rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; padding: .68rem 1.6rem; transition: background .18s ease, border-color .18s ease; } .btn-primary:hover, .btn-primary:focus, .btn-primary:active { background: color-mix(in srgb, var(--w-primary-strong, var(--w-primary)) 84%, #000); border-color: color-mix(in srgb, var(--w-primary-strong, var(--w-primary)) 84%, #000); color: #fff; } .btn-outline-secondary, .btn-outline-primary { background: transparent; border: 1px solid var(--w-line); color: var(--w-ink); font-family: var(--w-font-body); font-size: .78rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; padding: .68rem 1.6rem; transition: border-color .18s ease, color .18s ease; } .btn-outline-secondary:hover, .btn-outline-primary:hover { background: transparent; border-color: var(--w-secondary); color: var(--w-accent-ink); } .btn-sm { padding: .45rem 1.05rem; font-size: .72rem; } /* ===== Nawigacja ===== */ /* naglowek przypiety do gory ekranu - nie chowa sie przy przewijaniu */ .wx-header { position: sticky; top: 0; z-index: 1030; } .wx-nav { background: color-mix(in srgb, var(--w-card) 82%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--w-line); } .wx-nav .navbar-brand { padding: .35rem 0; } .wx-brand-logo { height: 38px; width: auto; object-fit: contain; } .wx-nav .nav-link { font-size: .74rem; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--w-ink); padding: .55rem .9rem !important; position: relative; } .wx-nav .nav-link::after { content: ""; position: absolute; left: .9rem; right: .9rem; bottom: .25rem; height: 1px; background: var(--w-secondary); transform: scaleX(0); transform-origin: center; transition: transform .22s ease; } .wx-nav .nav-link:hover { color: var(--w-accent-ink); } .wx-nav .nav-link:hover::after { transform: scaleX(1); } /* display togglera tylko mobilnie - inaczej nadpisalibysmy bootstrapowe ukrycie na desktopie */ .wx-nav .navbar-toggler { border: 1px solid var(--w-line); border-radius: 0; width: 42px; height: 42px; color: var(--w-ink); } .wx-nav .navbar-toggler svg { width: 18px; height: 18px; transition: transform .2s ease; } .wx-nav .navbar-toggler[aria-expanded="true"] svg { transform: rotate(180deg); } @media (max-width: 991.98px) { .wx-nav .navbar-toggler { display: inline-flex; align-items: center; justify-content: center; } .wx-nav .navbar-collapse { border-top: 1px solid var(--w-line-soft); margin-top: .6rem; padding-top: .4rem; } } /* ===== Stopka: przypieta, zawsze widoczna ===== */ .wx-footer { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1030; border-top: 1px solid var(--w-line); background: color-mix(in srgb, var(--w-card) 88%, transparent); backdrop-filter: blur(10px); padding-bottom: env(safe-area-inset-bottom); } .wx-footer, .wx-footer a { font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; color: var(--w-muted); text-decoration: none; white-space: nowrap; } .wx-footer a:hover { color: var(--w-accent-ink); } /* tresc nie moze wjezdzac pod stale przypieta stopke (main.container - musi wygrac z bootstrapowym .py-3, ktore tez ma !important) */ main.container { padding-bottom: calc(3.6rem + env(safe-area-inset-bottom)) !important; } /* ===== Ukryty skrot do panelu (lewy Ctrl + lewy Alt) ===== */ .wx-admin-gate { position: fixed; right: 1rem; bottom: calc(3.4rem + env(safe-area-inset-bottom)); z-index: 1040; display: none; align-items: center; gap: .5rem; background: var(--w-card); border: 1px solid var(--w-line); color: var(--w-ink); font-size: .72rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; text-decoration: none; padding: .6rem 1.1rem; box-shadow: 0 10px 26px rgba(0, 0, 0, .12); } .wx-admin-gate.show { display: inline-flex; } .wx-admin-gate:hover { border-color: var(--w-secondary); color: var(--w-accent-ink); } /* ===== Naglowek strony ===== */ .wx-page-head { text-align: center; margin: 1.4rem 0 2.2rem; } .wx-page-head h1, .wx-page-head h2 { font-size: clamp(2rem, 5vw, 2.8rem); margin: .35rem 0 0; } .wx-page-head p { color: var(--w-muted); max-width: 46ch; margin: .5rem auto 0; } /* ===== Animacja wejscia ===== */ .wx-reveal { opacity: 0; transform: translateY(14px); animation: wxUp .7s cubic-bezier(.2, .6, .2, 1) forwards; } .wx-reveal-2 { animation-delay: .12s; } .wx-reveal-3 { animation-delay: .24s; } .wx-reveal-4 { animation-delay: .36s; } @keyframes wxUp { to { opacity: 1; transform: none; } } /* ===== Strona glowna: hero ===== */ .wx-hero { text-align: center; padding: clamp(2.2rem, 7vw, 4.5rem) 1rem 1.4rem; } .wx-hero-names { font-family: var(--w-font-display); font-weight: 500; font-size: clamp(2.6rem, 9vw, 4.6rem); line-height: 1.08; letter-spacing: .01em; margin: .9rem 0 .4rem; } .wx-hero-names .amp { font-style: italic; font-weight: 400; color: var(--w-accent-ink); font-size: .72em; padding: 0 .12em; } .wx-hero-date { font-size: .82rem; font-weight: 500; letter-spacing: .3em; text-transform: uppercase; color: var(--w-ink); } .wx-hero-date .dot { color: var(--w-secondary); padding: 0 .55em; } .wx-hero-sub { color: var(--w-muted); max-width: 44ch; margin: .9rem auto 0; } /* ===== Strona glowna: odliczanie ===== */ .wx-count { display: flex; justify-content: center; align-items: stretch; max-width: 640px; margin: 0 auto; border-top: 1px solid var(--w-line); border-bottom: 1px solid var(--w-line); padding: 1.3rem 0 1.1rem; } .wx-count-cell { flex: 1; text-align: center; position: relative; } .wx-count-cell + .wx-count-cell::before { content: ""; position: absolute; left: 0; top: 12%; bottom: 12%; width: 1px; background: var(--w-line-soft); } .wx-count-num { font-family: var(--w-font-display); font-size: clamp(2rem, 6.5vw, 3rem); font-weight: 500; line-height: 1.1; font-variant-numeric: lining-nums tabular-nums; } .wx-count-label { font-size: .64rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--w-muted); } .wx-count-summary { color: var(--w-muted); font-size: .92rem; } /* dzien slubu: zamiast paska zer - celebracja w tej samej ramie z linii */ .wx-count-today { display: flex; align-items: center; justify-content: center; gap: 1.1rem; font-family: var(--w-font-display); font-size: clamp(1.9rem, 6vw, 2.9rem); font-weight: 500; color: var(--w-ink); } .wx-count-today span[aria-hidden] { color: var(--w-secondary); font-size: .45em; } /* plynna podmiana rotujacych tekstow pod licznikiem */ .wx-count-hint { transition: opacity .35s ease; min-height: 1.4em; } .wx-count-hint.is-swapping { opacity: 0; } /* ===== Strona glowna: druzyny ===== */ .wx-teams { max-width: 860px; margin: 0 auto; } .wx-team { padding: 1.6rem 1.5rem; text-align: center; } .wx-team-head { display: flex; align-items: baseline; gap: .75rem; margin-bottom: 1.1rem; } .wx-team-head .wx-eyebrow { white-space: nowrap; } .wx-team-head::before, .wx-team-head::after { content: ""; height: 1px; flex: 1; background: var(--w-line-soft); } .wx-team-person { font-family: var(--w-font-display); font-size: 1.35rem; line-height: 1.35; padding: .4rem 0; } .wx-team-person + .wx-team-person { border-top: 1px solid var(--w-line-soft); } .wx-team-empty { color: var(--w-muted); font-size: .9rem; } .wx-vs { display: flex; flex-direction: column; align-items: center; gap: .5rem; color: var(--w-line); } .wx-vs::before, .wx-vs::after { content: ""; width: 1px; flex: 1; background: var(--w-line); min-height: 18px; } /* Ponizej lg druzyny stoja jedna pod druga: pieczec "&" kladzie sie poziomo, a linie miedzy osobami znikaja (lista i tak jest krotka) */ @media (max-width: 991.98px) { .wx-vs { flex-direction: row; } .wx-vs::before, .wx-vs::after { width: auto; height: 1px; flex: 1; min-height: 0; } .wx-team-person + .wx-team-person { border-top: 0; } .wx-team-person { padding: .15rem 0; } } /* ===== Strona glowna: indeks sekcji ===== */ .wx-index { max-width: 640px; margin: 0 auto; } .wx-index-item { display: flex; align-items: baseline; gap: 1rem; padding: 1.15rem .25rem; border-bottom: 1px solid var(--w-line); text-decoration: none; color: var(--w-ink); transition: padding-left .2s ease; } .wx-index-item:first-child { border-top: 1px solid var(--w-line); } .wx-index-item:hover { padding-left: .8rem; color: var(--w-ink); } .wx-index-title { font-family: var(--w-font-display); font-size: 1.45rem; white-space: nowrap; } .wx-index-desc { color: var(--w-muted); font-size: .88rem; flex: 1; display: none; } .wx-index-arrow { color: var(--w-secondary); font-size: 1.1rem; transition: transform .2s ease; } .wx-index-item:hover .wx-index-arrow { transform: translateX(5px); } @media (min-width: 576px) { .wx-index-desc { display: block; } } /* ===== Plan dnia ===== */ .wx-plan { max-width: 720px; margin: 0 auto; position: relative; padding: .5rem 0 1.5rem; } .wx-plan::before { content: ""; position: absolute; top: 0; bottom: 0; left: 25px; width: 1px; background: var(--w-line); } .wx-plan-item { position: relative; display: flex; gap: 1.4rem; padding: 0 0 2.2rem 0; } .wx-plan-item:last-child { padding-bottom: .25rem; } .wx-plan-icon { position: relative; z-index: 1; flex: 0 0 auto; width: 51px; height: 51px; border-radius: 50%; background: var(--w-card); border: 1px solid var(--w-line); box-shadow: inset 0 0 0 3px var(--w-paper), inset 0 0 0 4px var(--w-line-soft); display: flex; align-items: center; justify-content: center; color: var(--w-accent-ink); } .wx-plan-icon svg { width: 20px; height: 20px; fill: currentColor; } .wx-plan-body { flex: 1; padding-top: .15rem; } .wx-plan-time { font-family: var(--w-font-display); font-size: 1.5rem; font-weight: 500; line-height: 1; font-variant-numeric: lining-nums tabular-nums; color: var(--w-accent-ink); } .wx-plan-title { font-family: var(--w-font-display); font-size: 1.45rem; font-weight: 500; margin: .3rem 0 .2rem; } .wx-plan-desc { color: var(--w-muted); font-size: .95rem; max-width: 52ch; margin: 0; } /* ponizej ukladu dwukolumnowego zwezamy os, zeby cala grupa (kreska + tresc) stala na srodku, a nie kleila sie do lewej */ @media (max-width: 767.98px) { .wx-plan { max-width: min(420px, 100%); } } @media (min-width: 768px) { .wx-plan::before { left: 50%; } .wx-plan-item { width: 50%; padding-left: 0; } .wx-plan-item .wx-plan-icon { order: 2; transform: translateX(50%); } .wx-plan-item .wx-plan-body { order: 1; text-align: right; padding-right: 1.6rem; } .wx-plan-item .wx-plan-desc { margin-left: auto; } .wx-plan-item.alt { margin-left: 50%; } .wx-plan-item.alt .wx-plan-icon { order: 1; transform: translateX(-50%); } .wx-plan-item.alt .wx-plan-body { order: 2; text-align: left; padding-right: 0; padding-left: 1.6rem; } .wx-plan-item.alt .wx-plan-desc { margin-left: 0; } } /* ===== FAQ ===== */ .wx-faq { max-width: 680px; margin: 0 auto; border-top: 1px solid var(--w-line); } .wx-faq .accordion-item { background: transparent; border: 0; border-bottom: 1px solid var(--w-line); border-radius: 0; } .wx-faq .accordion-button { background: transparent; box-shadow: none !important; font-family: var(--w-font-display); font-size: 1.3rem; font-weight: 500; color: var(--w-ink); padding: 1.15rem .25rem; gap: 1rem; } .wx-faq .accordion-button:not(.collapsed) { color: var(--w-accent-ink); } /* wlasny znacznik +/x zamiast strzalki bootstrapa */ .wx-faq .accordion-button::after { content: "+"; background: none; font-family: var(--w-font-body); font-weight: 300; font-size: 1.5rem; line-height: 1; width: auto; height: auto; color: var(--w-secondary); transition: transform .25s ease; } .wx-faq .accordion-button:not(.collapsed)::after { transform: rotate(45deg); } .wx-faq .accordion-body { padding: 0 .25rem 1.35rem; color: var(--w-muted); max-width: 58ch; line-height: 1.7; } /* ===== Mapa ===== */ .wx-map-frame { max-width: 980px; margin: 0 auto; background: var(--w-card); border: 1px solid var(--w-line); padding: 8px; } .wx-map { height: clamp(320px, 56vh, 540px); width: 100%; } .wx-places { max-width: 980px; /* wyrazny oddech nad przypieta stopka */ margin: 1.6rem auto 3rem; } .wx-place { border: 1px solid var(--w-line); background: var(--w-card); padding: 1.35rem 1.5rem; height: 100%; display: flex; flex-direction: column; gap: .4rem; } .wx-place-head { display: flex; align-items: center; gap: .7rem; } .wx-place-icon { width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--w-line); background: var(--w-paper); display: inline-flex; align-items: center; justify-content: center; color: var(--w-accent-ink); flex: 0 0 auto; } .wx-place-icon svg { width: 15px; height: 15px; fill: currentColor; } .wx-place-title { font-family: var(--w-font-display); font-size: 1.4rem; margin: 0; } .wx-place-desc { color: var(--w-muted); font-size: .93rem; margin: 0; flex: 1; } .wx-place .btn { align-self: flex-start; margin-top: .5rem; } /* pinezki (content markerow Google Maps) i popup w tonie papeterii */ .wx-pin { width: 38px; height: 38px; border-radius: 50% 50% 50% 0; background: var(--w-primary-strong, var(--w-primary)); border: 2px solid #fff; box-shadow: 0 4px 12px rgba(0, 0, 0, .25); display: inline-flex; align-items: center; justify-content: center; color: #fff; transform: rotate(-45deg); } .wx-pin svg { width: 18px; height: 18px; fill: currentColor; transform: rotate(45deg); } .wx-pin--default { width: 32px; height: 32px; } .wx-pin--default svg { width: 14px; height: 14px; } /* popup Google Maps w tonie papeterii: tytul w naglowku obok X, nizej opcjonalny opis i przycisk nawigacji */ .gm-style .gm-style-iw-c { border-radius: 2px !important; border: 1px solid var(--w-line); box-shadow: 0 12px 30px rgba(0, 0, 0, .16) !important; padding: 12px 14px !important; font-family: var(--w-font-body); } .gm-style .gm-style-iw-ch { padding-top: 2px; padding-right: .5rem; } .wx-popup-title { font-family: var(--w-font-display); font-size: 1.25rem; font-weight: 500; color: var(--w-ink); display: block; line-height: 1.25; } .wx-popup-body { padding-top: .25rem; } .wx-popup-desc { color: var(--w-muted); font-size: .9rem; line-height: 1.5; margin: 0 0 .25rem; max-width: 32ch; } .wx-popup-btn { margin-top: .5rem; } /* ===== Galeria ===== */ .wx-gal-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 1rem; margin: 1.4rem 0 1.8rem; } .wx-gal-head h2 { font-size: clamp(2rem, 5vw, 2.8rem); margin: .2rem 0 0; } .wx-gal-head p { color: var(--w-muted); margin: 0; } /* odbitka naklejona na karton: mat + cienka rama */ .wx-photo { display: block; width: 100%; border: 1px solid var(--w-line); background: var(--w-card); padding: 8px; cursor: zoom-in; transition: transform .22s ease, box-shadow .22s ease; } .wx-photo:hover { transform: translateY(-3px); box-shadow: 0 14px 30px color-mix(in srgb, var(--w-primary) 16%, rgba(0, 0, 0, .10)); } .wx-photo-media { aspect-ratio: 4 / 3; overflow: hidden; background: color-mix(in srgb, var(--w-primary) 14%, #1c1c1a); } .wx-photo-media img, .wx-photo-media video { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; } .wx-photo:hover .wx-photo-media img { transform: scale(1.035); } /* podpis pod odbitka - jak odreczny opis na passe-partout */ .wx-photo-caption { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; padding: .55rem .3rem .15rem; font-family: var(--w-font-display); font-style: italic; font-size: 1.05rem; line-height: 1.35; color: var(--w-muted); text-align: center; } /* pelnoekranowy podglad */ .w-gallery-modal .modal-content { background: rgba(16, 15, 13, .97); border: 0; border-radius: 0; } .w-gallery-full-media { max-width: 100%; max-height: calc(100vh - 170px); width: auto; height: auto; box-shadow: 0 20px 60px rgba(0, 0, 0, .5); } .w-gallery-viewer { max-width: min(94vw, 1200px); } .w-gallery-full-description { max-width: min(92vw, 900px); margin: 1.1rem auto 0; color: rgba(255, 255, 255, .65); font-size: .95rem; } @media (max-width: 991.98px) { .w-gallery-full-media { max-height: calc(100vh - 200px); } } /* modal dodawania zdjecia */ .wx-modal { border: 1px solid var(--w-line); border-radius: 2px; background: var(--w-card); } .wx-modal .form-control, .wx-modal .form-select { border-radius: 0; border-color: var(--w-line); } /* ===== Strony publiczne ===== */ .wx-gate { max-width: 560px; margin: clamp(2rem, 10vh, 5rem) auto; text-align: center; } .wx-gate-panel { padding: clamp(2rem, 6vw, 3.5rem) clamp(1.5rem, 5vw, 3rem); } .wx-gate h1 { font-size: clamp(1.9rem, 5.5vw, 2.6rem); margin: .9rem 0 .6rem; } .wx-gate p { color: var(--w-muted); max-width: 42ch; margin: 0 auto .5rem; } .wx-prose { max-width: 640px; margin: 0 auto; } .wx-prose a { color: var(--w-ink); } .wx-prose-panel { padding: 1.75rem 1.75rem; } .wx-prose-panel + .wx-prose-panel { margin-top: 1rem; } .wx-prose-panel h2 { font-size: 1.5rem; margin-bottom: 1rem; } .wx-prose dt { font-size: .68rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--w-accent-ink); } .wx-prose dd { margin-bottom: .9rem; font-size: 1.05rem; } .wx-prose ol { color: var(--w-muted); padding-left: 1.1rem; margin: 0; } .wx-prose ol li + li { margin-top: .5rem; } .wx-legal { max-width: 640px; margin: 0 auto 2rem; } .wx-legal > p { color: var(--w-muted); } .wx-legal h2 { font-size: 1.35rem; margin: 2rem 0 .5rem; padding-top: 1.4rem; border-top: 1px solid var(--w-line-soft); } .wx-legal h2 + p { color: var(--w-muted); } /* ===== Ograniczenie ruchu ===== */ @media (prefers-reduced-motion: reduce) { .wx-reveal, .wx-reveal-2, .wx-reveal-3, .wx-reveal-4 { animation: none; opacity: 1; transform: none; } .wx-nav .nav-link::after, .wx-faq .accordion-button::after, .wx-index-item, .wx-index-arrow, .wx-photo, .wx-photo-media img, .wx-count-hint { transition: none; } * { scroll-behavior: auto !important; } } /* ============================================================ Panel administratora (body.admin-body) - tryb studia, bez kolorow wesela ============================================================ */ .admin-body { --adm-ink: #23282E; --adm-paper: #F6F5F2; --adm-card: #FFFFFF; --adm-line: #E3E0D9; --adm-accent: #A8853B; background-color: var(--adm-paper); color: var(--adm-ink); font-family: "Jost", "Segoe UI", system-ui, sans-serif; } .admin-body h1, .admin-body h2, .admin-body h3 { font-family: "Cormorant Garamond", Georgia, serif; font-weight: 600; } .admin-body .admin-navbar { background-color: var(--adm-ink); border-bottom: 2px solid var(--adm-accent); } .admin-body .admin-navbar .navbar-brand { font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.35rem; } .admin-body .admin-card { border: 1px solid var(--adm-line); border-radius: 2px; box-shadow: none; background: var(--adm-card); } .admin-body .btn { border-radius: 0; letter-spacing: .08em; text-transform: uppercase; font-size: .76rem; font-weight: 500; padding: .375rem .75rem; } .admin-body .btn-primary { background: var(--adm-ink); border-color: var(--adm-ink); } .admin-body .btn-primary:hover, .admin-body .btn-primary:focus { background: #3a424c; border-color: #3a424c; } .admin-body .btn-outline-primary { color: var(--adm-ink); border-color: var(--adm-line); } .admin-body .btn-outline-primary:hover { background: var(--adm-ink); border-color: var(--adm-ink); color: #fff; } .admin-body .nav-tabs { border-bottom: 1px solid var(--adm-line); } .admin-body .nav-tabs .nav-link { border: 0; border-bottom: 2px solid transparent; border-radius: 0; color: #6c6a64; font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; } .admin-body .nav-tabs .nav-link:hover { color: var(--adm-ink); } .admin-body .nav-tabs .nav-link.active { background: transparent; border-bottom-color: var(--adm-accent); color: var(--adm-ink); font-weight: 500; } .admin-body .table thead th { font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: #6c6a64; font-weight: 600; border-bottom-color: var(--adm-line); } .admin-body .form-control, .admin-body .form-select { border-radius: 0; border-color: var(--adm-line); } .admin-body .form-control:focus, .admin-body .form-select:focus { border-color: var(--adm-accent); box-shadow: 0 0 0 .2rem rgba(168, 133, 59, .12); } .admin-body .form-label { font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; color: #55534d; } /* Bootstrap 5.1 nie ma klas text-bg-* - jednolity wyglad badge */ .admin-body .badge { border-radius: 0; letter-spacing: .06em; background: #EEECE6; color: var(--adm-ink); border: 1px solid var(--adm-line); font-weight: 500; } .admin-body .alert { border-radius: 2px; } .admin-body main a:not(.btn):not(.nav-link) { color: var(--adm-ink); text-decoration-color: var(--adm-accent); } .admin-body :focus-visible { outline: 2px solid var(--adm-accent); outline-offset: 2px; } /* stopka panelu jest statyczna - kasujemy padding z czesci goscinnej */ .admin-body main { padding-bottom: 1.5rem !important; } /* pomocnicze klasy panelu */ .adm-col-60 { width: 60px; } .adm-col-90 { width: 90px; } .adm-map-picker { height: 380px; } .adm-logo-preview { max-height: 60px; max-width: 100%; } .adm-icon-preview { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid var(--adm-line); border-radius: 50%; background: var(--adm-paper); color: var(--adm-ink); } .adm-icon-preview svg { width: 20px; height: 20px; fill: currentColor; } /* dropdown wyboru ikony (partial _IconSelect) - lista jak select, ale kazda pozycja renderuje SVG przed nazwa */ .adm-icon-select-menu { max-height: 280px; overflow-y: auto; border-radius: 0; border-color: var(--adm-line); } .adm-icon-select .dropdown-item { display: flex; align-items: center; gap: .6rem; padding: .45rem .9rem; } .adm-icon-select .dropdown-item:active, .adm-icon-select .dropdown-item:hover { background: #EEECE6; color: var(--adm-ink); } .adm-icon-select svg { width: 18px; height: 18px; flex: 0 0 auto; fill: currentColor; } .adm-icon-select-none { display: inline-block; width: 18px; text-align: center; color: #6c6a64; }