/* ==========================================================================
   Ataş Medya İletişim — front-end (inherits theme typography where applicable)
   ========================================================================== */

:root {
    --am-phone:          #20747E;
    --am-phone-hover:    #1b656e;
    --am-phone-active:   #195e67;
    --am-phone-border:   rgba(255, 255, 255, 0.18);
    --am-wa:             #25d366;
    --am-wa-hover:       #20bd5a;
    --am-banner-sd-bg:    #0a2e1a;
    --am-banner-wa:       #25d366;
    --am-banner-wa-hover: #1fba58;
    --am-white:           #ffffff;
    --am-shadow-bar:     0 -4px 24px rgba(0, 0, 0, 0.14);
    --am-bar-height:        80px;
    --am-ig-stack-height:   54px;
    --am-ig-gradient: linear-gradient(
        90deg,
        #f09433 0%,
        #e6683c 20%,
        #dc2743 45%,
        #cc2366 68%,
        #bc1888 100%
    );
    --am-transition: 0.22s ease;
}

@media (hover: hover) and (pointer: fine) {
    .atas-medya-contact-bar__btn--phone:hover {
        background: var(--am-phone-hover);
        color:      #ffffff;
    }

    .atas-medya-contact-bar__btn--whatsapp:hover {
        background: var(--am-wa-hover);
        color:      #ffffff;
    }

    .atas-medya-banner__cta:hover {
        background: var(--am-banner-wa-hover);
        color:      #ffffff;
        -webkit-text-fill-color: #ffffff;
    }

    .atas-medya-contact-bar__btn--instagram:hover {
        filter: brightness(1.06);
        color:  #ffffff;
    }
}

.atas-medya-contact-bar {
    font-family: inherit;
    font-size:   inherit;
    line-height: inherit;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Fixed bottom bar — viewport altına bitişik; güvenli alan renkli satırların içinde uzar (boş şerit yok) */
.atas-medya-contact-bar {
    position:        fixed;
    bottom:          0;
    left:            0;
    right:           0;
    z-index:         999990;
    display:         flex;
    flex-direction:  column;
    align-items:     stretch;
    box-shadow:      var(--am-shadow-bar);
    box-sizing:      border-box;
}

.atas-medya-contact-bar__primary {
    display:         flex;
    flex:            1 1 auto;
    flex-direction:  row;
    align-items:     stretch;
    align-self:      stretch;
    width:           100%;
    min-height:      calc(var(--am-bar-height) + env(safe-area-inset-bottom, 0px));
}

.atas-medya-contact-bar__btn {
    flex:            1 1 0;
    display:         flex;
    align-items:     center;
    justify-content: center;
    align-self:      stretch;
    gap:             12px;
    padding:         14px 20px;
    min-height:      0;
    text-decoration: none;
    transition:      background var(--am-transition), box-shadow var(--am-transition);
    cursor:          pointer;
    box-sizing:      border-box;
}

.atas-medya-contact-bar__btn--phone {
    background:   var(--am-phone);
    color:        var(--am-white);
    border-right: 1px solid var(--am-phone-border);
}

/* Son sütunda sağ çizgi yok (yalnızca WA + telefon) */
.atas-medya-contact-bar__btn--phone:last-child {
    border-right: none;
}

.atas-medya-contact-bar__btn--phone:focus-visible {
    background: var(--am-phone-hover);
    color:      #ffffff;
    outline:    2px solid rgba(255, 255, 255, 0.65);
    outline-offset: 2px;
}

.atas-medya-contact-bar__btn--phone:active {
    background: var(--am-phone-active);
}

.atas-medya-contact-bar__btn--whatsapp {
    background:   var(--am-wa);
    color:        var(--am-white);
    border-right: 1px solid rgba(255, 255, 255, 0.18);
}

.atas-medya-contact-bar__btn--whatsapp:focus-visible {
    background: var(--am-wa-hover);
    color:      #ffffff;
    outline:    2px solid rgba(255, 255, 255, 0.65);
    outline-offset: 2px;
}

.atas-medya-contact-bar__btn--whatsapp:active {
    background: #1ba64a;
}

/* Instagram (third column, same height as others) */
.atas-medya-contact-bar__btn--instagram {
    background:   var(--am-ig-gradient);
    color:        #ffffff;
}

.atas-medya-contact-bar__btn--instagram:focus-visible {
    outline:        2px solid rgba(255, 255, 255, 0.85);
    outline-offset:   -2px;
    filter:           brightness(1.05);
}

.atas-medya-contact-bar__primary--triple .atas-medya-contact-bar__label-number--ig {
    font-size:   0.8125rem;
    font-weight: 700;
}

.atas-medya-contact-bar__primary--triple .atas-medya-contact-bar__btn {
    gap:     8px;
    padding: 12px 8px;
}

@media (min-width: 420px) {
    .atas-medya-contact-bar__primary--triple .atas-medya-contact-bar__btn {
        gap:     10px;
        padding: 14px 12px;
    }

    .atas-medya-contact-bar__primary--triple .atas-medya-contact-bar__label-number--ig {
        font-size: 0.9375rem;
    }
}

/* Dar ekran: üstte WA + telefon; altta Instagram — gradient home indicator’a kadar; sayfa alt boşluğu uyumu */
@media (max-width: 520px) {
    body.atas-medya-has-bar.atas-medya-has-ig {
        padding-bottom: calc(var(--am-bar-height) + var(--am-ig-stack-height) + env(safe-area-inset-bottom, 0px)) !important;
    }

    .atas-medya-contact-bar__primary--triple {
        display:               grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows:    minmax(var(--am-bar-height), auto) minmax(calc(var(--am-ig-stack-height) + env(safe-area-inset-bottom, 0px)), auto);
        min-height:            calc(var(--am-bar-height) + var(--am-ig-stack-height) + env(safe-area-inset-bottom, 0px));
        align-items:           stretch;
    }

    .atas-medya-contact-bar__primary--triple .atas-medya-contact-bar__btn--whatsapp {
        grid-column: 1;
        grid-row:    1;
    }

    .atas-medya-contact-bar__primary--triple .atas-medya-contact-bar__btn--phone {
        grid-column:   2;
        grid-row:      1;
        border-right:  none;
    }

    .atas-medya-contact-bar__primary--triple .atas-medya-contact-bar__btn--instagram {
        grid-column:    1 / -1;
        grid-row:       2;
        align-self:     stretch;
        min-height:     calc(var(--am-ig-stack-height) + env(safe-area-inset-bottom, 0px));
        border-top:     1px solid rgba(255, 255, 255, 0.22);
        padding-top:    10px;
        padding-bottom: 10px;
        box-sizing:     border-box;
    }

    .atas-medya-contact-bar__primary--triple .atas-medya-contact-bar__label-number--ig {
        font-size: 0.9375rem;
    }
}

.atas-medya-contact-bar__icon {
    display:         flex;
    align-items:     center;
    justify-content: center;
    flex-shrink:     0;
    width:           28px;
    height:          28px;
    color:           #ffffff;
}

.atas-medya-contact-bar__icon svg {
    display: block;
    width:   100%;
    height:  100%;
    fill:    currentColor;
}

.atas-medya-contact-bar__icon path {
    fill: currentColor;
}

.atas-medya-contact-bar__label {
    display:        flex;
    flex-direction: column;
    align-items:    flex-start;
    line-height:    1.3;
    min-width:      0;
    text-align:     left;
}

.atas-medya-contact-bar__label-title {
    font-size:      0.6875rem;
    font-weight:    600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color:          rgba(255, 255, 255, 0.78);
    white-space:    nowrap;
}

.atas-medya-contact-bar__label-number {
    font-size:      1rem;
    font-weight:    600;
    color:          var(--am-white);
    white-space:    nowrap;
    overflow:       hidden;
    text-overflow:  ellipsis;
}

/* Top slide-down strip (Montserrat enqueued in PHP) */
.atas-medya-banner {
    position:   fixed;
    top:        0;
    left:       0;
    right:      0;
    z-index:    999991;
    background: var(--am-banner-sd-bg);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.28);

    font-family: 'Montserrat', system-ui, -apple-system, sans-serif;

    box-sizing:  border-box;
    padding-top: calc(env(safe-area-inset-top, 0px) + 10px);

    transform:  translateY(-100%);
    opacity:    0;
    transition: transform 0.48s cubic-bezier(0.16, 1, 0.3, 1),
                opacity   0.38s ease;
    will-change: transform, opacity;

    -webkit-text-size-adjust: 100%;
    text-size-adjust:         100%;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.atas-medya-banner[hidden] {
    display: none;
}

.atas-medya-banner.is-visible {
    transform: translateY(0);
    opacity:   1;
}

.atas-medya-banner__shell {
    max-width:     1200px;
    margin:        0 auto;
    width:         100%;
    padding:       8px max(40px, env(safe-area-inset-right, 0px)) 16px max(40px, env(safe-area-inset-left, 0px));
    box-sizing:    border-box;
}

.atas-medya-banner__inner {
    display:         flex;
    flex-wrap:     nowrap;
    align-items:     center;
    justify-content: space-between;
    gap:             24px;
}

.atas-medya-banner__text {
    flex:           1 1 auto;
    min-width:      0;
    display:        flex;
    flex-direction: column;
    gap:            4px;
    overflow-wrap:  break-word;
    word-wrap:      break-word;
}

.atas-medya-banner__headline {
    margin:         0;
    font-size:      15px;
    font-weight:    600;
    color:          #ffffff;
    line-height:    1.3;
    letter-spacing: 0.2px;
}

.atas-medya-banner__sub {
    margin:         0;
    font-size:      13px;
    font-weight:    500;
    color:          #ffffff;
    line-height:    1.35;
    letter-spacing: 0.3px;
}

.atas-medya-banner__cta {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    gap:             10px;
    padding:         12px 26px;
    min-height:      44px;
    background:      var(--am-banner-wa);
    color:           #ffffff;
    border-radius:   100px;
    text-decoration: none;
    white-space:     nowrap;
    flex-shrink:     0;
    transition:      background 0.2s ease, transform 0.15s ease;
}

.atas-medya-banner__cta:focus-visible {
    background: var(--am-banner-wa-hover);
    color:      #ffffff;
    outline:    2px solid rgba(255, 255, 255, 0.75);
    outline-offset: 2px;
}

.atas-medya-banner__cta:focus-visible .atas-medya-banner__cta-label {
    -webkit-text-fill-color: #ffffff;
}

.atas-medya-banner__cta:active {
    transform: scale(0.99);
}

.atas-medya-banner__cta-badge {
    display:         flex;
    align-items:     center;
    justify-content: center;
    flex-shrink:     0;
    width:           26px;
    height:          26px;
    background:      transparent;
    line-height:     0;
    color:           #ffffff;
}

.atas-medya-banner__cta-badge svg {
    display:    block;
    width:      22px;
    height:     22px;
    flex-shrink: 0;
    fill:       #ffffff;
    color:      #ffffff;
}

.atas-medya-banner__cta-badge path {
    fill: #ffffff;
}

.atas-medya-banner__cta-label {
    font-family:    inherit;
    font-size:      13px;
    font-weight:    600;
    letter-spacing: 0.3px;
    color:          #ffffff;
    -webkit-text-fill-color: #ffffff;
}

.atas-medya-banner__cta:visited .atas-medya-banner__cta-label {
    color:                   #ffffff;
    -webkit-text-fill-color: #ffffff;
}

body.atas-medya-has-bar {
    padding-bottom: calc(var(--am-bar-height) + env(safe-area-inset-bottom, 0px)) !important;
}

@media (max-width: 600px) {
    .atas-medya-banner__shell {
        padding: 8px 20px 18px 20px;
    }

    .atas-medya-banner__inner {
        flex-direction: column;
        align-items:    stretch;
        gap:            14px;
        flex-wrap:      wrap;
    }

    .atas-medya-banner__headline {
        font-size: 14px;
    }

    .atas-medya-banner__sub {
        font-size: 12px;
    }

    .atas-medya-banner__cta {
        width:           100%;
        justify-content: center;
        white-space:     normal;
        text-align:      center;
        padding:         14px 24px;
        min-height:      48px;
    }

    .atas-medya-banner__cta-label {
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    :root {
        --am-bar-height: 76px;
    }

    .atas-medya-contact-bar__btn {
        padding:   12px 14px;
        gap:       10px;
    }

    .atas-medya-contact-bar__icon {
        width:  26px;
        height: 26px;
    }

    .atas-medya-contact-bar__label-number {
        font-size: 0.9375rem;
    }

    .atas-medya-banner__shell {
        padding: 6px 16px 14px 16px;
    }
}

@media (max-width: 400px) {
    .atas-medya-contact-bar__primary--triple .atas-medya-contact-bar__btn {
        padding: 10px 4px;
        gap:     6px;
    }

    .atas-medya-contact-bar__primary--triple .atas-medya-contact-bar__icon {
        width:  22px;
        height: 22px;
    }
}

@media (max-width: 360px) {
    .atas-medya-contact-bar__label-title {
        display: none;
    }

    .atas-medya-contact-bar__primary--triple .atas-medya-contact-bar__label-number--ig {
        font-size: 0.75rem;
    }
}

.admin-bar .atas-medya-banner {
    top: 32px;
}

@media (max-width: 782px) {
    .admin-bar .atas-medya-banner {
        top: 46px;
    }
}