/**
 * Obsidian — minimalistické přepsání komponent (zaoblené prvky, monochrom)
 */

/* —— Header & navigace (admin-like: plná barva přímo na liště) —— */
.site-header,
header.site-header {
    background: var(--color-linen) !important;
    background-color: var(--color-linen) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-bottom: 1px solid var(--border-hairline) !important;
    box-shadow: none !important;
}

@media (max-width: 768px) {
    .site-header,
    header.site-header {
        background: var(--color-linen) !important;
        background-color: var(--color-linen) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    .page-stories-archive .story-filters {
        background-color: var(--color-linen) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
}

.site-utility-bar {
    background-color: var(--color-linen) !important;
    border-bottom-color: var(--border-hairline) !important;
    font-size: 0.7rem !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase;
}

.site-utility-bar a,
.site-utility-account__trigger {
    color: var(--color-muted) !important;
}

.site-utility-bar a:hover,
.site-utility-account__trigger:hover {
    color: var(--color-ink) !important;
}

.site-breadcrumb {
    background: transparent !important;
    border-color: var(--border-hairline) !important;
}

.site-breadcrumb__list {
    letter-spacing: 0.14em !important;
    font-size: 0.65rem !important;
}

.site-topbar .nav-container {
    width: 100%;
    max-width: none;
    justify-content: center;
    padding-inline: var(--page-gutter);
}

.site-topbar .logo {
    display: flex;
    justify-content: center;
}

.logo-mark .logo-svg-mark {
    transition: transform 0.45s var(--easing);
}

.logo-mark .logo-svg-mark path,
.logo-mark .logo-svg-mark stop {
    transition:
        fill 0.35s var(--easing),
        stroke 0.35s var(--easing),
        stop-color 0.35s var(--easing);
}

.site-topbar:hover .logo-mark,
.site-header.is-nav-open .logo-mark,
.site-header.is-breadcrumb-open .logo-mark {
    --logo-stop-inner: var(--color-ink-soft);
    --logo-stop-bright: var(--color-sage-light);
    --logo-stop-outer: var(--color-muted);
    --logo-hole-fill: var(--color-ink);
    --logo-hole-stroke: var(--color-ink-soft);
}

.site-topbar:hover .logo-mark .logo-svg-mark,
.site-header.is-nav-open .logo-mark .logo-svg-mark,
.site-header.is-breadcrumb-open .logo-mark .logo-svg-mark {
    transform: rotate(90deg);
}

.site-topbar-search-strip {
    background: transparent !important;
    border-bottom: 1px solid var(--border-hairline);
}

.site-search {
    border: 1px solid var(--border-soft) !important;
    border-radius: var(--radius-pill) !important;
    background: rgba(255, 255, 255, 0.03) !important;
    box-shadow: none !important;
    height: 40px;
}

.site-search:focus-within {
    border-color: rgba(255, 255, 255, 0.28) !important;
    background: rgba(255, 255, 255, 0.05) !important;
}

.site-search__input {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    font-size: 0.8125rem !important;
    letter-spacing: 0.02em;
    color: var(--color-ink) !important;
}

.site-nav-mega {
    background: var(--surface-elevated) !important;
    border-top: 1px solid var(--border-hairline) !important;
    border-radius: 0 0 var(--radius-lg) var(--radius-lg);
}

.site-nav-mega__col-title,
.site-nav-mega__heading {
    color: var(--color-muted) !important;
    font-family: var(--font-body) !important;
    font-size: 0.65rem !important;
    font-weight: 500 !important;
    letter-spacing: 0.16em !important;
}

.site-nav-mega a,
.site-nav-mega__list a {
    color: var(--color-ink-soft) !important;
    font-size: 0.75rem !important;
    letter-spacing: 0.08em !important;
}

.site-nav-mega a:hover {
    color: var(--color-ink) !important;
}

/* —— Nadpisy —— */
.page-heading,
.site-page-heading,
.obrlobus-section__title {
    font-family: var(--font-heading) !important;
    font-weight: 400 !important;
    letter-spacing: -0.02em !important;
    color: var(--color-ink) !important;
}

.page-heading::after {
    background: var(--border-soft) !important;
    height: 1px !important;
    width: 3rem !important;
    opacity: 1 !important;
    border-radius: var(--radius-pill) !important;
}

/* —— Karty & panely —— */
.obr-card,
.obrlobus-dash-card,
.auth-form,
.story-filters__bar,
.page-placeholder {
    border-radius: var(--radius-md) !important;
    border: 1px solid var(--border-soft) !important;
    background: var(--color-paper) !important;
    box-shadow: none !important;
}

.obr-card:hover,
.obrlobus-dash-card:hover {
    transform: none !important;
    border-color: rgba(255, 255, 255, 0.22) !important;
    box-shadow: none !important;
}

/* Grayscale → barva při hoveru (Obsidian) */
.gallery-card .card-image,
.obr-card .card-image,
.obrlobus-promo__image {
    filter: grayscale(100%) contrast(1.05);
    transition: filter 0.55s var(--easing), opacity 0.4s ease;
}

.gallery-card:hover .card-image,
.obr-card:hover .card-image,
.obr-card.mobile-active .card-image,
.obrlobus-promo__slide.is-active .obrlobus-promo__image {
    filter: grayscale(0%) contrast(1);
}

.gallery-card .card-image,
.obr-card .card-image {
    border-radius: var(--radius-sm) var(--radius-sm) 0 0;
}

/* —— Filtry — minimalistické chipy —— */
.story-filters__bar {
    padding: 1rem 0 !important;
    border: none !important;
    border-top: 1px solid var(--border-hairline) !important;
    border-bottom: 1px solid var(--border-hairline) !important;
    background: transparent !important;
    border-radius: 0 !important;
}

.story-filters__chip {
    border-radius: var(--radius-pill) !important;
    border: 1px solid transparent !important;
    background: transparent !important;
    color: var(--color-muted) !important;
    font-size: 0.75rem !important;
    font-weight: 400 !important;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 0.45rem 0.85rem !important;
    min-height: auto !important;
}

.story-filters__chip:hover,
.story-filters__chip:focus-visible {
    color: var(--color-ink-soft) !important;
    border-color: var(--border-soft) !important;
    background: rgba(255, 255, 255, 0.03) !important;
}

.story-filters__chip.is-active {
    color: var(--color-linen) !important;
    background: var(--color-ink) !important;
    border-color: var(--color-ink) !important;
}

.story-filters__label {
    font-size: 0.62rem !important;
    letter-spacing: 0.18em !important;
    color: var(--color-muted-light) !important;
}

.story-filters--panel .story-filters__bar--panel {
    border: none !important;
    padding: 0 !important;
}

.story-filters--panel .story-filters__trigger,
.story-filters--panel .story-filters__mobile-toggle {
    background: #ffffff !important;
    color: #1a1a1a !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.28) !important;
}

.story-filters--panel .story-filters__drawer {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

@media (max-width: 768px) {
    .story-filters--panel .story-filters__drawer {
        background: transparent !important;
        border: none !important;
    }
}

/* —— Domovská stránka —— */
.obrlobus-promo__viewport {
    border: none !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--shadow-md) !important;
    background: var(--color-cream) !important;
    overflow: hidden;
}

.obrlobus-promo__nav {
    border-radius: var(--radius-pill) !important;
    background: rgba(10, 10, 10, 0.75) !important;
    border: 1px solid var(--border-soft) !important;
    box-shadow: none !important;
}

.obrlobus-promo__nav:hover,
.obrlobus-promo__nav:focus-visible {
    border-color: rgba(255, 255, 255, 0.28) !important;
    color: var(--color-ink) !important;
}

.obrlobus-dash-card {
    transition: border-color 0.3s ease, transform 0.3s ease !important;
}

.obrlobus-dash-card__count,
.obrlobus-dash-card__value {
    color: var(--color-muted) !important;
    font-family: var(--font-body) !important;
    animation: none !important;
    transition: none !important;
}

.obrlobus-dash-card__label {
    color: var(--color-ink) !important;
}

/* —— Typografie obsahu —— */
.page-prose,
.page-list-intro,
.obrlobus-intro__text {
    font-family: var(--font-body) !important;
    font-weight: 400;
    color: var(--color-muted) !important;
    line-height: 1.75 !important;
}

/* —— Auth & dialogy —— */
.site-auth-overlay__dialog,
.ui-card,
.auth-form {
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--shadow-md) !important;
}

.auth-form input,
.auth-form select {
    border-radius: var(--radius-sm) !important;
}

.auth-form button[type="submit"],
.btn-primary {
    border-radius: var(--radius-pill) !important;
    background: var(--color-ink) !important;
    color: var(--color-linen) !important;
    font-weight: 500 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase;
    font-size: 0.75rem !important;
}

.auth-form button[type="submit"]:hover,
.btn-primary:hover {
    background: var(--color-ink-soft) !important;
}

/* —— Patička —— */
footer {
    background: var(--color-linen) !important;
    border-top: 1px solid var(--border-hairline) !important;
    color: var(--color-muted) !important;
}

/* —— Typewriter kurzor —— */
.intro-typewriter__cursor {
    background-color: var(--color-ink);
    width: 2px;
    min-width: 2px;
    border-radius: var(--radius-pill);
}

/* —— Bannery rozcestníku —— */
.banner {
    border-radius: var(--radius-lg);
    isolation: isolate;
}

.banner-content {
    border-radius: 0 !important;
    box-shadow: none !important;
}

.banner-content h2 {
    font-weight: 400 !important;
    letter-spacing: -0.01em !important;
}

.reveal-visual {
    filter: grayscale(100%) !important;
    border-radius: 0 !important;
}

.banner:hover .reveal-visual,
.banner:focus-visible .reveal-visual {
    filter: grayscale(0%) !important;
}

/* —— Můj účet — bez vnořeného rámečku formuláře v panelu —— */
body.page-account .account-panel .auth-form {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    max-width: none !important;
}
