/* TF Kontakt — style frontu. Neutralna baza; tokeny/theme-compat dopracujemy w Fazie 6. */
.tfk {
  --tfk-accent: #1d4ed8;
  --tfk-accent-d: #1e3a8a;
  --tfk-bg: #ffffff;
  --tfk-border: #d7dbe0;
  --tfk-text: #1f2733;
  --tfk-muted: #5a6472;
  --tfk-ok: #047857;
  --tfk-err: #b91c1c;
  --tfk-radius: 10px;
  font-size: 16px;
  color: var(--tfk-text);
}

/* Honeypot — niewidoczny dla ludzi, dostępny dla botów */
.tfk-hp { position: absolute !important; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }

.tfk__title { margin: 0 0 .75rem; font-size: 1.25rem; line-height: 1.3; }

.tfk__form { display: grid; gap: .85rem; max-width: 560px; }
.tfk--flyout .tfk__form,
.tfk--modal .tfk__dialog .tfk__form { max-width: none; }

/* Wyrównanie karty inline (formularz ma stałą szerokość 560px) */
.tfk-align-center .tfk__form { margin-left: auto; margin-right: auto; }
.tfk-align-right  .tfk__form { margin-left: auto; margin-right: 0; }
.tfk-align-left   .tfk__form { margin-left: 0; margin-right: auto; }

.tfk__field { margin: 0; display: grid; gap: .3rem; }
.tfk__field label { font-weight: 600; font-size: .92rem; }
.tfk__req { color: var(--tfk-err); }

.tfk__form input[type="text"],
.tfk__form input[type="email"],
.tfk__form input[type="tel"],
.tfk__form select,
.tfk__form textarea {
  width: 100%;
  padding: .6rem .7rem;
  border: 1px solid var(--tfk-border);
  border-radius: var(--tfk-radius);
  font: inherit;
  background: var(--tfk-bg);
  color: var(--tfk-text);
  box-sizing: border-box;
}
.tfk__form input:focus,
.tfk__form select:focus,
.tfk__form textarea:focus {
  outline: 2px solid var(--tfk-accent);
  outline-offset: 1px;
  border-color: var(--tfk-accent);
}
.tfk__form [aria-invalid="true"] { border-color: var(--tfk-err); }

.tfk__credit { display: grid; gap: .85rem; padding: .75rem; border: 1px dashed var(--tfk-border); border-radius: var(--tfk-radius); }

.tfk__sprawa-info { margin: 0; font-weight: 600; color: var(--tfk-accent-d); }

.tfk__consent label { display: flex; gap: .5rem; align-items: flex-start; font-weight: 400; font-size: .9rem; line-height: 1.45; }
.tfk__consent input { margin-top: .2rem; flex: 0 0 auto; }

.tfk__clause { font-size: .85rem; color: var(--tfk-muted); }
.tfk__clause summary { cursor: pointer; font-weight: 600; }
.tfk__clause-body { margin-top: .5rem; }
.tfk__clause-body a { color: var(--tfk-accent); }

.tfk__actions { margin: 0; }
.tfk__submit,
.tfk__open {
  appearance: none; border: 0; cursor: pointer;
  background: var(--tfk-accent); color: #fff;
  padding: .7rem 1.4rem; border-radius: var(--tfk-radius);
  font: inherit; font-weight: 700;
}
.tfk__submit:hover, .tfk__open:hover { background: var(--tfk-accent-d); }
.tfk__submit[disabled] { opacity: .65; cursor: progress; }

.tfk__msg { margin: 0; font-size: .92rem; min-height: 1.2em; }
.tfk__msg--ok { color: var(--tfk-ok); font-weight: 600; }
.tfk__msg--err { color: var(--tfk-err); font-weight: 600; }

/* — Flyout (floating quick-contact) — */
.tfk--flyout { position: fixed; right: 18px; bottom: 18px; z-index: 9990; }
.tfk--flyout-left { right: auto; left: 18px; }
.tfk__fab {
  display: inline-flex; align-items: center; gap: .5rem;
  background: var(--tfk-accent); color: #fff; border: 0; cursor: pointer;
  padding: .7rem 1.1rem; border-radius: 999px; font: inherit; font-weight: 700;
  box-shadow: 0 6px 20px rgba(0,0,0,.18);
}
.tfk__fab:hover { background: var(--tfk-accent-d); }
.tfk__panel {
  position: absolute; right: 0; bottom: calc(100% + 10px);
  width: min(360px, 90vw); max-height: min(80vh, 540px); overflow: auto;
  background: var(--tfk-bg);
  border: 1px solid var(--tfk-border); border-radius: 14px;
  box-shadow: 0 12px 40px rgba(0,0,0,.22); padding: 1.1rem; box-sizing: border-box;
}
.tfk--flyout-left .tfk__panel { right: auto; left: 0; }

/* — Modal — */
.tfk__overlay {
  position: fixed; inset: 0; z-index: 9995;
  background: rgba(15,23,42,.55);
  display: flex; align-items: center; justify-content: center; padding: 1rem;
}
.tfk__dialog {
  position: relative; background: var(--tfk-bg);
  width: min(560px, 100%); max-height: 90vh; overflow: auto;
  border-radius: 14px; padding: 1.5rem;
}
.tfk__close {
  position: absolute; top: .6rem; right: .7rem;
  background: transparent; border: 0; cursor: pointer;
  font-size: 1.6rem; line-height: 1; color: var(--tfk-muted);
}
.tfk__panel .tfk__close { font-size: 1.4rem; }

/* — Responsywność flyout (Hide On Mobile / Tablet / Desktop, wzór: WordPress) — */
@media (max-width: 767px) { .tfk-hide-mobile { display: none !important; } }
@media (min-width: 768px) and (max-width: 1024px) { .tfk-hide-tablet { display: none !important; } }
@media (min-width: 1025px) { .tfk-hide-desktop { display: none !important; } }

[hidden] { display: none !important; }

@media (prefers-reduced-motion: no-preference) {
  .tfk__panel, .tfk__dialog { animation: tfk-in .16s ease-out; }
  @keyframes tfk-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
}