/* TAPS Quick Actions + WhatsApp V13.3 */

:root {
    --taps-qa-width: 96px;
    --taps-qa-height: 72px;
    --taps-qa-radius: 20px;
    --taps-qa-gap: 10px;
    --taps-qa-right: 28px;
    --taps-qa-primary: var(--taps-color-primary, #00d6ff);
    --taps-qa-secondary: var(--taps-color-secondary, #2b6cff);
    --taps-qa-accent: var(--taps-color-accent, #f5b94b);
    --taps-qa-whatsapp: #25d366;
    --taps-qa-danger: #ef233c;
}

/* Sağ hızlı işlem grubu */
.quick-actions,
.taps-quick-actions {
    position: fixed !important;
    right: var(--taps-qa-right) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 80 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    gap: var(--taps-qa-gap) !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    pointer-events: none !important;
    padding: 0 !important;
}

/* Eski sade dikdörtgenleri premium karta çevir */
.quick-actions a,
.quick-actions button,
.taps-quick-actions a,
.taps-quick-actions button,
.quick-actions .qa-action,
.taps-quick-actions .qa-action {
    pointer-events: auto !important;
    width: var(--taps-qa-width) !important;
    min-width: var(--taps-qa-width) !important;
    height: var(--taps-qa-height) !important;
    min-height: var(--taps-qa-height) !important;
    padding: 10px 9px !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    border-radius: var(--taps-qa-radius) 0 0 var(--taps-qa-radius) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    color: #fff !important;
    text-decoration: none !important;
    font-family: var(--taps-font-menu, system-ui) !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    letter-spacing: .025em !important;
    line-height: 1.05 !important;
    text-align: center !important;
    overflow: hidden !important;
    position: relative !important;
    isolation: isolate !important;
    cursor: pointer !important;
    user-select: none !important;
    backdrop-filter: blur(16px) saturate(150%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(150%) !important;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--taps-qa-secondary) 78%, #06101d 22%), color-mix(in srgb, var(--taps-qa-primary) 42%, #06101d 58%)) !important;
    box-shadow:
        0 14px 34px rgba(0,0,0,.28),
        0 0 0 1px rgba(255,255,255,.05) inset,
        0 0 28px color-mix(in srgb, var(--taps-qa-primary) 22%, transparent) !important;
    transition:
        transform .26s cubic-bezier(.2,.8,.2,1),
        box-shadow .26s ease,
        border-color .26s ease,
        filter .26s ease,
        background .26s ease !important;
}

.quick-actions a::before,
.quick-actions button::before,
.taps-quick-actions a::before,
.taps-quick-actions button::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    background:
        radial-gradient(circle at 30% 0%, rgba(255,255,255,.36), transparent 32%),
        linear-gradient(120deg, transparent 0%, rgba(255,255,255,.18) 42%, transparent 60%) !important;
    opacity: .55 !important;
    transform: translateX(-45%) skewX(-12deg) !important;
    transition: transform .42s ease, opacity .26s ease !important;
}

.quick-actions a::after,
.quick-actions button::after,
.taps-quick-actions a::after,
.taps-quick-actions button::after {
    content: "" !important;
    position: absolute !important;
    left: 14px !important;
    right: 14px !important;
    bottom: 8px !important;
    height: 2px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.75), transparent) !important;
    opacity: .34 !important;
    transition: opacity .22s ease, left .22s ease, right .22s ease !important;
}

.quick-actions a:hover,
.quick-actions button:hover,
.taps-quick-actions a:hover,
.taps-quick-actions button:hover {
    transform: translateX(-10px) scale(1.045) !important;
    border-color: color-mix(in srgb, var(--taps-qa-primary) 58%, rgba(255,255,255,.18)) !important;
    filter: saturate(112%) brightness(1.08) !important;
    box-shadow:
        0 20px 44px rgba(0,0,0,.34),
        0 0 0 1px color-mix(in srgb, var(--taps-qa-primary) 24%, transparent) inset,
        0 0 42px color-mix(in srgb, var(--taps-qa-primary) 38%, transparent) !important;
}

.quick-actions a:hover::before,
.quick-actions button:hover::before,
.taps-quick-actions a:hover::before,
.taps-quick-actions button:hover::before {
    transform: translateX(44%) skewX(-12deg) !important;
    opacity: .75 !important;
}

.quick-actions a:hover::after,
.quick-actions button:hover::after,
.taps-quick-actions a:hover::after,
.taps-quick-actions button:hover::after {
    left: 10px !important;
    right: 10px !important;
    opacity: .9 !important;
}

/* İç ikon ve label */
.quick-actions svg,
.taps-quick-actions svg,
.quick-actions .qa-icon,
.taps-quick-actions .qa-icon {
    width: 22px !important;
    height: 22px !important;
    display: block !important;
    flex: 0 0 auto !important;
    filter: drop-shadow(0 0 8px rgba(255,255,255,.18)) !important;
    transition: transform .24s ease, filter .24s ease !important;
}

.quick-actions a:hover svg,
.quick-actions button:hover svg,
.quick-actions a:hover .qa-icon,
.quick-actions button:hover .qa-icon,
.taps-quick-actions a:hover svg,
.taps-quick-actions button:hover svg,
.taps-quick-actions a:hover .qa-icon,
.taps-quick-actions button:hover .qa-icon {
    transform: translateY(-2px) scale(1.08) !important;
    filter:
        drop-shadow(0 0 8px rgba(255,255,255,.26))
        drop-shadow(0 0 16px color-mix(in srgb, var(--taps-qa-primary) 42%, transparent)) !important;
}

.quick-actions span,
.taps-quick-actions span,
.quick-actions small,
.taps-quick-actions small {
    color: inherit !important;
}

/* Tip bazlı renkler */
.quick-actions a[href*="wa.me"],
.quick-actions a[href*="api.whatsapp"],
.quick-actions a[href*="whatsapp"],
.quick-actions .qa-whatsapp,
.taps-quick-actions .qa-whatsapp {
    background:
        linear-gradient(135deg, #0f8f49, var(--taps-qa-whatsapp)) !important;
    box-shadow:
        0 14px 34px rgba(0,0,0,.28),
        0 0 0 1px rgba(255,255,255,.06) inset,
        0 0 30px color-mix(in srgb, var(--taps-qa-whatsapp) 34%, transparent) !important;
}

.quick-actions a[href*="wa.me"]:hover,
.quick-actions a[href*="api.whatsapp"]:hover,
.quick-actions a[href*="whatsapp"]:hover,
.quick-actions .qa-whatsapp:hover,
.taps-quick-actions .qa-whatsapp:hover {
    border-color: color-mix(in srgb, var(--taps-qa-whatsapp) 70%, white 10%) !important;
    box-shadow:
        0 20px 44px rgba(0,0,0,.34),
        0 0 0 1px color-mix(in srgb, var(--taps-qa-whatsapp) 26%, transparent) inset,
        0 0 46px color-mix(in srgb, var(--taps-qa-whatsapp) 52%, transparent) !important;
}

.quick-actions .danger,
.quick-actions .qa-offer,
.quick-actions a[href*="contact"],
.quick-actions a[href*="teklif"],
.taps-quick-actions .qa-offer {
    background:
        linear-gradient(135deg, #ef233c, color-mix(in srgb, var(--taps-qa-danger) 72%, var(--taps-qa-accent) 28%)) !important;
    box-shadow:
        0 14px 34px rgba(0,0,0,.28),
        0 0 0 1px rgba(255,255,255,.06) inset,
        0 0 30px color-mix(in srgb, var(--taps-qa-danger) 34%, transparent) !important;
}

.quick-actions .qa-call,
.quick-actions a[href^="tel:"],
.taps-quick-actions .qa-call {
    background:
        linear-gradient(135deg, #0869b7, var(--taps-qa-secondary)) !important;
}

.quick-actions .qa-services,
.quick-actions a[href*="services"],
.quick-actions a[href*="hizmet"],
.taps-quick-actions .qa-services {
    background:
        linear-gradient(135deg, #075985, color-mix(in srgb, var(--taps-qa-primary) 48%, #075985 52%)) !important;
}

/* Açık mod */
html[data-theme="light"] .quick-actions a,
html[data-theme="light"] .quick-actions button,
html[data-theme="light"] .taps-quick-actions a,
html[data-theme="light"] .taps-quick-actions button {
    border-color: rgba(7,17,31,.10) !important;
    box-shadow:
        0 16px 34px rgba(8,20,36,.14),
        0 0 0 1px rgba(255,255,255,.45) inset,
        0 0 30px color-mix(in srgb, var(--taps-qa-primary) 20%, transparent) !important;
}

/* Sağ boş alanı daha az sade göstermek için ince ışık çizgisi */
.quick-actions::before,
.taps-quick-actions::before {
    content: "" !important;
    position: absolute !important;
    right: -10px !important;
    top: -26px !important;
    bottom: -26px !important;
    width: 1px !important;
    background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--taps-qa-primary) 38%, transparent), transparent) !important;
    box-shadow: 0 0 22px color-mix(in srgb, var(--taps-qa-primary) 22%, transparent) !important;
    opacity: .72 !important;
}

/* Mobil */
@media (max-width: 920px) {
    :root {
        --taps-qa-width: 78px;
        --taps-qa-height: 62px;
        --taps-qa-right: 12px;
        --taps-qa-radius: 16px;
    }

    .quick-actions a,
    .quick-actions button,
    .taps-quick-actions a,
    .taps-quick-actions button {
        font-size: 10px !important;
    }

    .quick-actions svg,
    .taps-quick-actions svg,
    .quick-actions .qa-icon,
    .taps-quick-actions .qa-icon {
        width: 19px !important;
        height: 19px !important;
    }
}

@media (max-width: 640px) {
    .quick-actions,
    .taps-quick-actions {
        top: auto !important;
        right: 10px !important;
        bottom: 18px !important;
        transform: none !important;
        flex-direction: row !important;
        gap: 8px !important;
    }

    .quick-actions a,
    .quick-actions button,
    .taps-quick-actions a,
    .taps-quick-actions button {
        width: 64px !important;
        min-width: 64px !important;
        height: 58px !important;
        min-height: 58px !important;
        border-radius: 18px !important;
    }

    .quick-actions a:hover,
    .quick-actions button:hover,
    .taps-quick-actions a:hover,
    .taps-quick-actions button:hover {
        transform: translateY(-6px) scale(1.045) !important;
    }

    .quick-actions::before,
    .taps-quick-actions::before {
        display: none !important;
    }
}