/* blokada scrolla strony, dokładana na */ .ebook-no-scroll { overflow: hidden; } .ebook-modal { position: fixed; inset: 0; display: none; z-index: 9999; } .ebook-modal.is-open { display: block; } .ebook-modal p:empty, .ebook-modal br { display: none; } .ebook-modal p { margin: 0 !important; } .ebook-modal__backdrop { position: absolute; inset: 0; background: rgba(0, 0, 0, .5); } .ebook-modal__dialog { position: relative; z-index: 1; max-width: 760px; width: 92%; height: auto; overflow-y: scroll; margin: 12vh auto; background: #fff; border-radius: 20px; padding: 30px; box-shadow: 0 20px 60px rgba(0, 0, 0, .25); border: 4px solid var(--wp--preset--color--fiolet); box-sizing: border-box; } /* Firefox scrollbar */ .ebook-modal__dialog { scrollbar-width: auto; scrollbar-color: rgba(0,0,0,.45) transparent; } /* WebKit scrollbar */ .ebook-modal__dialog::-webkit-scrollbar { width: 12px; height: 12px; background: transparent; } .ebook-modal__dialog::-webkit-scrollbar-track { background: transparent; } .ebook-modal__dialog::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,.45); border-radius: 999px; border: 3px solid transparent; background-clip: content-box; } .ebook-modal__dialog::-webkit-scrollbar-thumb:hover { background-color: rgba(0,0,0,.6); } .ebook-modal__dialog::-webkit-scrollbar-thumb:active { background-color: rgba(0,0,0,.75); } .ebook-modal__dialog::-webkit-scrollbar-button { display: none; width: 0; height: 0; } .ebook-modal__dialog::-webkit-scrollbar-corner { background: transparent; } .ebook-modal__close { position: absolute; top: 8px; right: 12px; background: transparent; border: 0; font-size: 24px; line-height: 1; cursor: pointer; } .ebook-modal__title { margin: 0 0 12px; font-size: 20px; } /* Siatka/pola formularza – działa na wrapperze #ebook-form */ #ebook-form .ebook-row{ display: grid; grid-template-columns: repeat(auto-fill, minmax(min(18rem, 100%), 1fr)); gap: 0 24px; } #ebook-form .ebook-field { margin-bottom: 20px; box-sizing: border-box; } #ebook-form .ebook-field label { display: block; font-weight: 500; margin-bottom: 6px; font-size: 14px; } #ebook-form .ebook-field input[type="text"], #ebook-form .ebook-field input[type="url"], #ebook-form .ebook-field input[type="file"], #ebook-form .ebook-field select, #ebook-form .ebook-field textarea, #ebook-form .ebook-field input[type="email"]{ width: 100%; padding: 14px 30px; border: 1px solid #16161620; border-radius: 20px; box-sizing: border-box; font-family: var(--wp--preset--font-family--raleway); outline: none; } #ebook-form .ebook-field input[type="text"]:focus, #ebook-form .ebook-field input[type="url"]:focus, #ebook-form .ebook-field input[type="file"]:focus, #ebook-form .ebook-field select:focus, #ebook-form .ebook-field textarea:focus, #ebook-form .ebook-field input[type="email"]:focus{ border-color: #9F66F0; box-shadow: 0 0 0 2px rgba(159, 102, 240, 0.3); } /* checkboxy / radios */ #ebook-form .ebook-checkboxes, #ebook-form .ebook-radios{ display: flex; align-items: flex-start; margin-top: 12px; } #ebook-form .ebook-checkboxes label, #ebook-form .ebook-radios label{ margin-right: 16px; } #ebook-form .ebook-hint { /* bazowy mały tekst – poza tooltipem zostaje zwykły */ display: block; font-size: 12px; color: #666; margin-top: 6px; } #ebook-form .ebook-error { margin-top: 6px; color: #b00020; font-size: 12px; } #ebook-form .ebook-actions { display: flex; gap: 12px; justify-content: flex-end; margin-top: 18px; } /* --- Tooltip --- */ #ebook-form .ebook-tooltip { position: relative; display: inline-block; margin-left: 10px; vertical-align: middle; } #ebook-form .ebook-tooltip__icon{ display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 999px; font-size: 13px; font-weight: 700; line-height: 1; border: 1px solid #16161620; background: var(--wp--preset--color--fiolet); color: #fff; cursor: help; padding: 0; } /* Dymek: domyślnie ukryty; pokazujemy na hover/focus */ #ebook-form .ebook-tooltip .ebook-hint { position: absolute; top: calc(100% + 10px); right: 0; z-index: 10000; min-width: 260px; max-width: min(520px, 80vw); background: #fff; color: #161616; border: 1px solid #16161620; border-radius: 12px; box-shadow: 0 12px 36px rgba(0,0,0,.18); padding: 14px 16px; margin: 0; opacity: 0; visibility: hidden; transform: translateY(4px); transition: opacity .18s ease, transform .18s ease, visibility .18s; } /* strzałka dymka */ #ebook-form .ebook-tooltip .ebook-hint::before { content: ""; position: absolute; top: -6px; right: 12px; border: 6px solid transparent; border-bottom-color: #fff; filter: drop-shadow(0 -1px 0 rgba(0,0,0,.06)); } /* pokaż na hover/focus */ #ebook-form .ebook-tooltip:hover .ebook-hint, #ebook-form .ebook-tooltip:focus-within .ebook-hint { opacity: 1; visibility: visible; transform: translateY(0); } /* linki w dymku */ #ebook-form .ebook-tooltip .ebook-hint a { text-decoration: underline; } /* przycisk submit dopasowany do inputów */ #ebook-form .ebook-actions .wp-element-button { padding: 14px 30px; border-radius: 20px; border: 1px solid #16161620; box-shadow: none; text-decoration: none; cursor: pointer; } #ebook-form .ebook-actions .wp-element-button:focus { outline: none; box-shadow: 0 0 0 2px rgba(159, 102, 240, 0.3); border-color: #9F66F0; } /* mobile: dymek szerzej */ @media (max-width: 480px) { #ebook-form .ebook-tooltip .ebook-hint { right: -8px; max-width: 92vw; min-width: 200px; } }