/* ILD - WP Özelleştir > Ek CSS'ten temaya taşınan bildirim kartı stilleri. */
/* =========================================================
   BİLDİRİM KARTI - GÜVENLİ ÜST PANEL GÖRÜNÜMÜ
   Not: Kart gizliyken zorla görünür yapmaz.
   ========================================================= */

@media (min-width: 769px) {
  #ild-push-permission-card[style*="display: block"],
  #ild-push-permission-card[style*="display:block"],
  #ild-push-permission-card[style*="display: flex"],
  #ild-push-permission-card[style*="display:flex"] {
    left: 50% !important;
    right: auto !important;
    top: 43px !important;
    bottom: auto !important;
    transform: translateX(-50%) !important;

    width: min(680px, 42vw) !important;
    max-width: 680px !important;
    min-width: 520px !important;

    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;

    padding: 5px 12px !important;
    border-radius: 14px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 12px !important;

    overflow: hidden !important;
    background: linear-gradient(135deg, rgba(14, 44, 98, .92), rgba(20, 83, 180, .94)) !important;
    border: 1px solid rgba(255, 255, 255, .22) !important;
    box-shadow:
      0 6px 18px rgba(2, 8, 23, .18),
      inset 0 1px 0 rgba(255, 255, 255, .20) !important;

    z-index: 999991 !important;
  }

  body.admin-bar #ild-push-permission-card[style*="display: block"],
  body.admin-bar #ild-push-permission-card[style*="display:block"],
  body.admin-bar #ild-push-permission-card[style*="display: flex"],
  body.admin-bar #ild-push-permission-card[style*="display:flex"] {
    top: 75px !important;
  }

  #ild-push-permission-card .ild-push-title {
    font-size: 13px !important;
    line-height: 1 !important;
    margin: 0 !important;
    white-space: nowrap !important;
    flex: 0 0 auto !important;
  }

  #ild-push-permission-card .ild-push-text {
    font-size: 12px !important;
    line-height: 1 !important;
    margin: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 230px !important;
    flex: 1 1 auto !important;
  }

  #ild-push-permission-card .ild-push-actions {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-left: 0 !important;
    flex: 0 0 auto !important;
  }

  #ild-push-permission-card .ild-push-allow {
    position: relative !important;
    overflow: hidden !important;
    padding: 6px 11px !important;
    border-radius: 9px !important;
    font-size: 12.5px !important;
    line-height: 1 !important;
    min-height: 30px !important;
    box-shadow: 0 4px 10px rgba(15, 23, 42, .12) !important;
  }

  #ild-push-permission-card .ild-push-deny,
  #ild-push-permission-card .ild-push-dismiss {
    font-size: 12.5px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  #ild-push-permission-card .ild-push-allow::after {
    content: "";
    position: absolute;
    pointer-events: none;
    top: -35%;
    left: -50%;
    width: 24%;
    height: 170%;
    background: linear-gradient(
      90deg,
      transparent,
      rgba(56, 189, 248, .65),
      rgba(255, 255, 255, .95),
      rgba(56, 189, 248, .65),
      transparent
    );
    transform: translateX(-160%) skewX(-18deg);
    animation: ildPushCylonSweep 8s ease-in-out infinite;
  }

  @keyframes ildPushCylonSweep {
    0%, 72% {
      transform: translateX(-160%) skewX(-18deg);
      opacity: 0;
    }

    74% {
      opacity: .95;
    }

    83% {
      transform: translateX(560%) skewX(-18deg);
      opacity: .95;
    }

    91% {
      transform: translateX(-160%) skewX(-18deg);
      opacity: .8;
    }

    94%, 100% {
      transform: translateX(-160%) skewX(-18deg);
      opacity: 0;
    }
  }
}

@media (min-width: 769px) and (max-width: 1180px) {
  #ild-push-permission-card[style*="display: block"],
  #ild-push-permission-card[style*="display:block"],
  #ild-push-permission-card[style*="display: flex"],
  #ild-push-permission-card[style*="display:flex"] {
    width: 46vw !important;
    min-width: 390px !important;
  }

  #ild-push-permission-card .ild-push-text {
    display: none !important;
  }
}

@media (max-width: 768px) {
  #ild-push-permission-card {
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
    top: auto !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: none !important;
    transform: none !important;
  }
}
