/* * Sayfa uzerinde acilan pencere (inc/popup.php). * * Ayri dosya: tema stili baska bir yerde Tailwind ile derleniyor ve derleme * araclari sunucuda yok -- derlenmis dosyaya yazilan kural bir sonraki * derlemede kaybolurdu. hermest-app'ten SONRA yukleniyor. * * Renkler temanin kendi degiskenlerinden geliyor; panelden renk secmek * istenirse tek yerden baglanabilir. */ .hermest-popup { position: fixed; inset: 0; /* * WhatsApp kutusu 9999'da. Pencere onun ustune aliniyor: telefonda yuzen * dugmeler pencerenin "Gonder" dugmesinin uzerine biniyordu (16 Eylul * 2026). Asagidaki kural ikisini zaten gizliyor; katman, gizleme bir * sekilde uygulanmazsa pencerenin yine de ustte kalmasi icin. */ z-index: 10000; display: flex; align-items: center; justify-content: center; padding: 20px; } .hermest-popup[hidden] { display: none; } .hermest-popup__backdrop { position: absolute; inset: 0; background: rgb(12 32 44 / 62%); animation: hermest-popup-fade 220ms ease-out; } .hermest-popup__dialog { position: relative; z-index: 1; width: 100%; max-width: 420px; max-height: calc(100vh - 40px); overflow-y: auto; background: #fff; border-radius: 18px; box-shadow: 0 24px 60px rgb(0 32 48 / 28%); animation: hermest-popup-rise 260ms cubic-bezier(0.2, 0.8, 0.3, 1); } .hermest-popup__close { position: absolute; top: 12px; right: 12px; display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 999px; background: rgb(255 255 255 / 86%); color: var(--hermest-color-primary, #2c4759); cursor: pointer; box-shadow: 0 2px 8px rgb(0 32 48 / 18%); } .hermest-popup__close:hover { background: #fff; } .hermest-popup__image { display: block; width: 100%; height: auto; border-radius: 18px 18px 0 0; } .hermest-popup__body { padding: 24px 24px 26px; } .hermest-popup__heading { margin: 0; font-family: var(--hermest-font-heading, inherit); font-size: 22px; line-height: 1.25; color: var(--hermest-color-primary, #2c4759); } .hermest-popup__text { margin: 10px 0 0; font-size: 15px; line-height: 1.6; color: var(--hermest-color-text, #343434); } /* Editorden gelen icerik: paragraflar, listeler ve baglantilar. */ .hermest-popup__text > :first-child { margin-top: 0; } .hermest-popup__text > :last-child { margin-bottom: 0; } .hermest-popup__text p { margin: 0 0 10px; } .hermest-popup__text ul, .hermest-popup__text ol { margin: 0 0 10px; padding-left: 20px; } .hermest-popup__text li + li { margin-top: 4px; } .hermest-popup__text a { color: var(--hermest-color-secondary, #5184a6); text-decoration: underline; } .hermest-popup__form { margin-top: 18px; } /* Form kutusu pencerede kendi golgesini ve zeminini tasimasin: pencere zaten bir kart. */ .hermest-popup__form .scfp-wrap { box-shadow: none; background: transparent; padding: 0; } .hermest-popup__note { margin: 14px 0 0; font-size: 12px; line-height: 1.5; color: #6b7280; } @keyframes hermest-popup-fade { from { opacity: 0; } to { opacity: 1; } } @keyframes hermest-popup-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } } /* Hareket azaltma tercihi: animasyon yok, pencere dogrudan gorunuyor. */ @media (prefers-reduced-motion: reduce) { .hermest-popup__backdrop, .hermest-popup__dialog { animation: none; } } @media (max-width: 480px) { .hermest-popup { padding: 12px; align-items: flex-end; } .hermest-popup__dialog { max-width: 100%; max-height: calc(100vh - 24px); } .hermest-popup__body { padding: 20px 18px 22px; } } /* * Pencere acikken yuzen dugmeler yok. * * Isareti popup.js uzerine koyuyor. Gizlemek katman yarisina girmekten * daha dogru: dugmeler pencerenin ustunde olmasa bile karartilmis zeminde * durup dikkat dagitiyor. Pencere kapaninca isaret kalkiyor, ikisi de geri * geliyor. */ .hermest-popup-open .hermest-whatsapp-widget, .hermest-popup-open .hermest-back-to-top { display: none; }