/* DiginApps — professional polish layer
 * Adds skip-link, accessible focus rings, micro-interactions, refined surfaces.
 * Uses existing CSS custom properties (--da-*) — no hard-coded brand colors.
 */

/* ───── Skip to content (a11y, SEO bonus) ───── */
.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 10000;
    background: var(--da-text);
    color: #fff;
    padding: 10px 16px;
    border-radius: var(--da-radius-sm);
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .18);
}
.skip-link:focus {
    left: 12px;
    top: 12px;
    outline: none;
}

/* ───── Universal accessible focus ring ───── */
:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
    outline: 2px solid var(--da-accent);
    outline-offset: 3px;
    border-radius: 6px;
}

/* Don't add ring to elements that already have a strong background-based focus */
.da-button:focus-visible,
.da-button-primary:focus-visible,
.da-button-secondary:focus-visible {
    outline-offset: 4px;
    box-shadow:
        0 0 0 3px var(--da-bg),
        0 0 0 5px var(--da-accent);
}

/* ───── Bundled-logo image sizing ───── */
.da-logo-wrap--bundled {
    display: flex;
    align-items: center;
}
.da-logo-wrap--bundled .da-brand-logo {
    display: inline-flex;
    align-items: center;
    line-height: 0;
}
.da-logo-wrap--bundled .da-brand-logo img {
    height: clamp(66px, 6.5vw, 84px);
    width: auto;
    max-width: 360px;
    display: block;
    transition: transform .35s cubic-bezier(.2, .9, .25, 1);
}
.da-logo-wrap--bundled .da-brand-logo:hover img {
    transform: translateY(-1px);
}
@media (max-width: 600px) {
    .da-logo-wrap--bundled .da-brand-logo img {
        height: 60px;
    }
}

/* ───── Card / surface micro-lift on hover ───── */
.da-surface,
.da-product-card,
.da-product-card-shell,
.da-detail-card,
.da-related-card {
    transition: transform .35s cubic-bezier(.2, .9, .25, 1),
                box-shadow .35s cubic-bezier(.2, .9, .25, 1),
                border-color .25s ease;
}
.da-product-card:hover,
.da-related-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 22px 44px rgba(23, 24, 36, .08),
                0 4px 12px rgba(23, 24, 36, .04);
    border-color: rgba(var(--da-accent-rgb), .22);
}

/* ───── Buttons: subtle interactive shine ───── */
.da-button,
.da-button-primary,
.da-button-secondary,
.da-btn {
    transition: transform .2s ease,
                box-shadow .25s ease,
                background-color .25s ease,
                color .25s ease,
                border-color .25s ease;
    will-change: transform;
}
.da-button:hover,
.da-btn:hover {
    transform: translateY(-1px);
}
.da-button:active,
.da-btn:active {
    transform: translateY(0);
    transition-duration: .08s;
}
.da-button--primary:hover {
    box-shadow: 0 12px 26px rgba(var(--da-accent-rgb), .22),
                0 2px 6px rgba(var(--da-accent-rgb), .12);
}

/* ───── Anchor links: don't hide under sticky header ───── */
:where(h1, h2, h3, h4, [id]) {
    scroll-margin-top: calc(var(--da-header-height, 96px) + 16px);
}

/* ───── Hero / front-page subtle radial backdrop ───── */
.is-da-front .da-section--top {
    position: relative;
    isolation: isolate;
}
.is-da-front .da-section--top::before {
    content: "";
    position: absolute;
    inset: -10% -10% auto -10%;
    height: 70%;
    background:
        radial-gradient(60% 70% at 30% 20%,
            rgba(var(--da-accent-rgb), .10) 0%,
            rgba(var(--da-accent-rgb), 0) 60%);
    z-index: -1;
    pointer-events: none;
}

/* ───── Showcase hero polish ───── */
.da-showcase-hero-media img {
    transition: transform .6s cubic-bezier(.2, .9, .25, 1),
                filter .35s ease;
}
.da-single-cover:hover img {
    transform: scale(1.015);
    filter: saturate(1.05);
}

/* ───── Eyebrow / pill refinement ───── */
.da-eyebrow,
.da-panel-kicker {
    text-transform: uppercase;
    letter-spacing: .14em;
    font-weight: 600;
    font-size: .78rem;
    color: var(--da-accent);
}

/* ───── Image rendering quality ───── */
img {
    image-rendering: auto;
}
.wp-post-image,
.da-product-media img,
.da-single-cover img {
    image-rendering: -webkit-optimize-contrast;
}

/* ───── Selection ───── */
::selection {
    background: rgba(var(--da-accent-rgb), .22);
    color: var(--da-text);
}

/* ───── Inputs ───── */
input[type="text"],
input[type="email"],
input[type="search"],
input[type="url"],
textarea,
select {
    transition: border-color .2s ease, box-shadow .2s ease;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
input[type="url"]:focus,
textarea:focus,
select:focus {
    border-color: var(--da-accent);
    box-shadow: 0 0 0 3px rgba(var(--da-accent-rgb), .18);
    outline: none;
}

/* ───── Mobile menu transitions ───── */
@media (max-width: 920px) {
    .da-header-actions {
        transition: opacity .25s ease, transform .25s ease;
    }
    .da-header-actions[hidden] {
        display: block;
        opacity: 0;
        transform: translateY(-6px);
        pointer-events: none;
    }
}

/* ───── Reduced motion: kill all the above movement ───── */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
    .da-product-card:hover,
    .da-related-card:hover,
    .da-button:hover,
    .da-btn:hover,
    .da-single-cover:hover img,
    .da-logo-wrap--bundled .da-brand-logo:hover img {
        transform: none;
    }
}

/* (CLS-critical aspect-ratio kuralları inline critical CSS'e taşındı;
 * bu dosya async yüklendiği için image yer ayırma kuralları render-blocking olmalı.) */

/* ───── WCAG AA contrast fixes ─────
 * Logo'nun orange (#d18222) hâli arka plana karşı sadece 3.0:1 kontrast veriyor (AA Large pass,
 * normal text fail). Aşağıda interaktif metin/buton elemanlarında daha koyu --da-accent-strong
 * (#8a4d0f, ~8.5:1) kullanılır. Logo görsel olarak değişmez, sadece text-renderleri etkilenir.
 */
.da-button--ghost,
.da-btn--muted,
a.da-text-link,
.da-text-link,
.da-related-card .da-text-link,
.da-related-card,
.da-card-cta--ghost,
.da-card-version {
    color: var(--da-accent-strong);
}

/* Primary buton: orange bg (logo rengi) korunur, text koyu —
 * #d18222 + beyaz = 3.04:1 (fail), #d18222 + #1a1a1a = 7.6:1 (AAA pass). */
.da-button--primary,
.da-btn--primary,
.da-card-cta--primary,
a.da-button.da-button--primary {
    color: #1a1a1a;
    font-weight: 600;
}
.da-button--primary:hover,
.da-btn--primary:hover {
    color: #0d0d0d;
}
/* Accent renkli badge'lerde de aynı kontrast: orange bg üstüne dark text */
.da-badge.da-showcase-hero-badge,
.da-pill-meta.da-pill-meta--accent {
    color: #1a1a1a;
}
.da-button--ghost {
    border-color: rgba(var(--da-accent-strong-rgb), .48);
    background: transparent;
}
.da-button--ghost:hover,
.da-button--ghost:focus-visible {
    background: rgba(var(--da-accent-strong-rgb), .08);
    border-color: var(--da-accent-strong);
    color: var(--da-accent-strong);
}

/* Related cards View details */
.da-related-card,
.da-related-card .da-text-link {
    color: var(--da-text);
}
.da-related-card .da-text-link {
    color: var(--da-accent-strong);
    font-weight: 500;
}
.da-related-card:hover {
    border-color: rgba(var(--da-accent-strong-rgb), .35);
}

/* Footer: bg dark navy (#182129). Light text gerekli — açık beyaz #fff = ~16:1 kontrast.
 * Önceki turda hatalı override (dark text on dark bg) düzeltildi. */
.da-site-footer a,
.da-site-footer .da-footer-link,
.da-site-footer .da-footer-title,
.da-site-footer h3,
.da-site-footer strong {
    color: #ffffff;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color .2s ease, color .2s ease;
}
.da-site-footer a:hover,
.da-site-footer .da-footer-link:hover {
    color: #ffffff;
    border-bottom-color: rgba(255, 255, 255, .55);
}
.da-site-footer p,
.da-site-footer .da-footer-meta,
.da-site-footer .da-footer-copy,
.da-site-footer .da-footer-text {
    color: rgba(255, 255, 255, .82); /* ≈14.5:1 — AA/AAA pass */
}

/* Eyebrow: accent yerine accent-strong (daha okunaklı) */
.da-eyebrow,
.da-panel-kicker {
    color: var(--da-accent-strong);
}

/* In Review / muted badge — beyaz üzerinde okunabilirlik */
.da-badge.da-badge--muted,
.da-pill-meta {
    color: var(--da-text-strong);
    background: rgba(0, 0, 0, .04);
    border: 1px solid var(--da-border);
}

/* ───── Print ───── */
@media print {
    .da-site-header,
    .da-mobile-nav,
    .da-menu-toggle,
    .da-search-panel,
    .da-lightbox,
    .da-button-row,
    footer {
        display: none !important;
    }
    body {
        background: #fff;
        color: #000;
        font-size: 11pt;
    }
    a {
        color: #000;
        text-decoration: underline;
    }
    a[href]::after {
        content: " (" attr(href) ")";
        font-size: 9pt;
        color: #555;
    }
}
