/* ===== FUZEM BABALAR GÜNÜ POP-UP — CSS ===== */
/* Bu dosyayı TSoft dosya yöneticisine yükleyin (örn. /Data/EditorFiles/tasarim/) */
/* ve sayfaya şu şekilde ekleyin:                                                 */
/* <link rel="stylesheet" href="/Data/EditorFiles/tasarim/babalar-gunu-popup.css"> */

:root{
  --fz-sari:#f9b233;        /* marka sarısı (logo ikonu) */
  --fz-sari-koyu:#e89c1c;
  --fz-antrasit:#3f4145;    /* marka yazı rengi (FUZEM) */
  --fz-gri:#6c7079;
  --fz-acik:#f4f5f7;
}

/* ---------- OVERLAY ---------- */
.fz-overlay{
  position:fixed; inset:0; z-index:2147483647;
  background:rgba(45,47,52,.45); backdrop-filter:blur(3px);
  display:flex; align-items:center; justify-content:center; padding:20px;
  animation:fzFade .3s ease;
}
@keyframes fzFade{0%{opacity:0}100%{opacity:1}}

/* ---------- POPUP ---------- */
.fz-popup{
  position:relative; width:100%; max-width:400px;
  background:#fff; border-radius:24px; padding:38px 32px 30px;
  text-align:center; overflow:hidden;
  box-shadow:0 32px 70px -12px rgba(45,47,52,.35), 0 0 0 1px rgba(255,255,255,.6) inset;
  font-family:'Poppins',-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  animation:fzPop .45s cubic-bezier(.2,.9,.3,1.15);
}
/* üstte yumuşak sarı ışık — düz border yerine modern gradient */
.fz-popup::before{
  content:""; position:absolute; top:0; left:0; right:0; height:190px;
  background:radial-gradient(120% 100% at 50% 0%, rgba(249,178,51,.20) 0%, rgba(249,178,51,0) 70%);
  pointer-events:none;
}
.fz-popup::after{
  content:""; position:absolute; top:0; left:0; right:0; height:5px;
  background:linear-gradient(90deg,var(--fz-sari-koyu),var(--fz-sari),#ffd479,var(--fz-sari));
}
.fz-popup > *{position:relative; z-index:1}

@keyframes fzPop{0%{transform:translateY(28px) scale(.96);opacity:0}100%{transform:none;opacity:1}}

.fz-ribbon{
  position:relative; overflow:hidden;
  display:inline-flex; align-items:center; gap:8px;
  background:linear-gradient(135deg,#ffc457 0%,var(--fz-sari) 45%,var(--fz-sari-koyu) 100%);
  color:#fff; font-size:12.5px; font-weight:700;
  letter-spacing:.9px; text-transform:uppercase;
  padding:10px 20px 10px 17px; border-radius:999px; margin-bottom:18px;
  text-shadow:0 1px 2px rgba(160,100,10,.35);
  box-shadow:0 10px 24px -6px rgba(232,156,28,.65), 0 0 0 1px rgba(255,255,255,.35) inset;
}
.fz-ribbon-icon{flex:none; opacity:.95}
/* üzerinden geçen ışık parıltısı */
.fz-ribbon::after{
  content:""; position:absolute; top:0; bottom:0; left:-60%; width:45%;
  background:linear-gradient(100deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.55) 50%,rgba(255,255,255,0) 100%);
  transform:skewX(-20deg); animation:fzShine 3.4s ease-in-out infinite;
}
@keyframes fzShine{
  0%,55%{left:-60%}
  85%,100%{left:120%}
}
.fz-logo{height:34px; width:auto; display:block; margin:0 auto 16px}

.fz-title{
  font-size:26px; line-height:1.3; font-weight:600;
  color:var(--fz-antrasit); letter-spacing:-.4px; margin:0 0 14px;
}
.fz-amount{
  display:inline-block; font-weight:800; font-size:34px; letter-spacing:-1px;
  white-space:nowrap; margin-top:2px;
  background:linear-gradient(100deg,var(--fz-sari-koyu) 0%,var(--fz-sari) 55%,#ffc457 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:var(--fz-sari-koyu);
}
.fz-tl{font-size:15px; vertical-align:super; margin-left:1px}
.fz-text{font-size:14px; line-height:1.6; color:var(--fz-gri); margin:0 0 22px}
.fz-text strong{color:var(--fz-antrasit); font-weight:600}

/* ---------- SINIRLI KONTENJAN rozeti ---------- */
.fz-limit{
  display:inline-flex; align-items:center; gap:7px;
  font-size:12px; font-weight:600; letter-spacing:.2px;
  color:#c2410c; background:#fff4ed; border:1px solid #ffd9c2;
  padding:6px 14px 6px 11px; border-radius:999px; margin-bottom:22px;
}
.fz-limit-dot{
  width:7px; height:7px; border-radius:50%; background:#f97316; flex:none;
  box-shadow:0 0 0 0 rgba(249,115,22,.6); animation:fzDot 1.8s infinite;
}
@keyframes fzDot{
  0%{box-shadow:0 0 0 0 rgba(249,115,22,.55)}
  70%{box-shadow:0 0 0 7px rgba(249,115,22,0)}
  100%{box-shadow:0 0 0 0 rgba(249,115,22,0)}
}
.fz-limit--sm{font-size:11px; padding:4px 11px 4px 9px; margin:0; align-self:center}

.fz-code-label{
  font-size:10px; font-weight:600; letter-spacing:1.8px; text-transform:uppercase;
  color:#a3a9b4; margin-bottom:9px;
}
.fz-code-box{
  position:relative;
  display:flex; align-items:center; justify-content:center;
  border:1.5px dashed rgba(249,178,51,.85);
  background:linear-gradient(180deg,#fffdf7 0%,#fff6e6 100%);
  border-radius:14px; padding:16px; margin-bottom:16px;
}
/* kenarlardaki kupon çentikleri */
.fz-code-box::before,.fz-code-box::after{
  content:""; position:absolute; top:50%; width:16px; height:16px;
  background:#fff; border-radius:50%; transform:translateY(-50%);
}
.fz-code-box::before{left:-9px}
.fz-code-box::after{right:-9px}
.fz-code{
  font-size:28px; font-weight:800; letter-spacing:7px; color:var(--fz-antrasit);
  font-family:'Poppins',-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  padding-left:7px;
}

/* kopyala butonu — altta, tam genişlik */
.fz-copy{
  width:100%; display:flex; align-items:center; justify-content:center; gap:9px;
  border:none; cursor:pointer; color:#fff; font-size:15px; font-weight:600;
  padding:16px; border-radius:14px;
  background:linear-gradient(135deg,#4a4d52 0%,var(--fz-antrasit) 100%);
  box-shadow:0 10px 24px -8px rgba(45,47,52,.6);
  transition:transform .2s, box-shadow .2s, background .2s;
}
.fz-copy:hover{background:#2c2e31; transform:translateY(-2px); box-shadow:0 14px 28px -8px rgba(45,47,52,.55)}
.fz-copy:active{transform:translateY(0)}
.fz-copy.copied{background:#2e9e57; box-shadow:0 10px 24px -8px rgba(46,158,87,.6)}

.fz-close{
  position:absolute; top:14px; right:14px; z-index:3;
  width:32px; height:32px; border:none; border-radius:50%;
  background:rgba(244,245,247,.9); color:#8a8f99; font-size:21px; line-height:1; cursor:pointer;
  transition:.2s;
}
.fz-close:hover{background:#e7e9ee; color:#555; transform:rotate(90deg)}

/* ---------- LAUNCHER WIDGET (kare kart) ---------- */
.fz-launcher{
  position:fixed; right:22px; bottom:22px; z-index:2147483646;
  width:214px;
  display:flex; flex-direction:column; gap:10px;
  background:#fff; border:1px solid #ececef;
  border-radius:18px; padding:18px 16px 16px;
  box-shadow:0 18px 40px -12px rgba(45,47,52,.28);
  overflow:hidden;
  font-family:'Poppins',-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  animation:fzSlideIn .45s cubic-bezier(.2,.9,.3,1.15);
}
@keyframes fzSlideIn{0%{transform:translateY(80px);opacity:0}100%{transform:none;opacity:1}}

/* üstte gradient şerit */
.fz-launcher::before{
  content:""; position:absolute; top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg,var(--fz-sari-koyu),var(--fz-sari),#ffd479);
}

.fz-launcher-open{
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px;
  border:none; background:none; cursor:pointer; padding:0;
}
.fz-launcher-info{display:flex; flex-direction:column; gap:3px}
.fz-launcher-icon{
  font-size:20px; font-weight:800; width:44px; height:44px; flex:none;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,var(--fz-sari) 0%,var(--fz-sari-koyu) 100%);
  color:#fff; border-radius:14px;
  box-shadow:0 8px 18px -4px rgba(249,178,51,.55);
}
.fz-launcher-title{color:var(--fz-antrasit); font-size:13.5px; font-weight:600; line-height:1.25; letter-spacing:-.2px}
.fz-launcher-amount{color:var(--fz-sari-koyu); font-size:12.5px; font-weight:700; font-style:normal; line-height:1.3}

.fz-launcher-codebox{
  text-align:center; font-size:12px; color:var(--fz-gri); font-weight:500;
  background:linear-gradient(180deg,#fffdf7 0%,#fff6e6 100%);
  border:1.5px dashed rgba(249,178,51,.85);
  border-radius:12px; padding:9px;
}
.fz-launcher-codebox strong{color:var(--fz-sari-koyu); font-weight:800; letter-spacing:2px; font-size:14px}

.fz-launcher-copy{
  width:100%;
  display:flex; align-items:center; justify-content:center; gap:7px;
  border:none; cursor:pointer; color:#fff;
  background:linear-gradient(135deg,#4a4d52 0%,var(--fz-antrasit) 100%);
  border-radius:12px; padding:11px; font-size:13px; font-weight:600;
  transition:background .2s;
}
.fz-launcher-copy:hover{background:#2c2e31}
.fz-launcher-copy.copied{background:#2e9e57}

/* widget üzerinde hafif nabız (dikkat çekmek için) */
.fz-launcher::after{
  content:""; position:absolute; inset:0; border-radius:16px; pointer-events:none;
  box-shadow:0 0 0 0 rgba(249,178,51,.5); animation:fzPulse 2.2s infinite;
}
@keyframes fzPulse{
  0%{box-shadow:0 0 0 0 rgba(249,178,51,.4)}
  70%{box-shadow:0 0 0 14px rgba(249,178,51,0)}
  100%{box-shadow:0 0 0 0 rgba(249,178,51,0)}
}

/* ---------- MOBİL ---------- */
@media(max-width:480px){
  .fz-popup{padding:34px 22px 24px; border-radius:20px}
  .fz-title{font-size:21px}
  .fz-amount{font-size:29px}
  .fz-limit{margin-bottom:18px}
  .fz-code{font-size:25px; letter-spacing:5px}

  /* widget → sağ altta tek yuvarlak ikon (floating buton) */
  .fz-launcher{
    left:auto; right:14px; bottom:14px; width:auto;
    padding:0; gap:0; border:none; border-radius:50%;
    background:none; box-shadow:none;
  }
  .fz-launcher::before{display:none}         /* gradient şerit gizli */
  .fz-launcher-info{display:none}            /* başlık + tutar gizli */
  .fz-limit--sm{display:none}                /* kontenjan rozeti gizli */
  .fz-launcher-codebox{display:none}         /* kod kutusu gizli */
  .fz-launcher-copy{display:none}            /* kopyala gizli (kopyalama pop-up'ta) */

  .fz-launcher-open{padding:0}
  .fz-launcher-icon{
    width:54px; height:54px; font-size:24px; border-radius:50%;
    box-shadow:0 8px 22px rgba(249,178,51,.5);
  }
  .fz-launcher::after{border-radius:50%}     /* nabız efekti yuvarlak */
}