/*
 * Juntson Haldus — custom front-end CSS
 * Only utility/component styles that theme.json can't express.
 */

:root {
  --juntson-shadow-card: 0 1px 2px 0 rgba(9, 32, 44, 0.05), 0 1px 3px 0 rgba(9, 32, 44, 0.1);
  --juntson-shadow-card-hover: 0 4px 6px -1px rgba(9, 32, 44, 0.1), 0 2px 4px -1px rgba(9, 32, 44, 0.06);
  --juntson-shadow-strong: 0 10px 15px -3px rgba(9, 32, 44, 0.1), 0 4px 6px -2px rgba(9, 32, 44, 0.05);
}

body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

@media (max-width: 768px) {
  body { padding-bottom: 5rem; }
}

/* Sticky mobile bar */
.juntson-sticky-mobile-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: #ffffff;
  border-top: 1px solid rgba(9, 32, 44, 0.1);
  box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.08);
}

@media (min-width: 768px) {
  .juntson-sticky-mobile-bar { display: none; }
}

.juntson-sticky-mobile-bar .grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.juntson-sticky-mobile-bar a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: 0.75rem;
  font-weight: 700;
  font-size: 0.75rem;
  text-decoration: none;
}

.juntson-sticky-mobile-bar a:nth-child(1) { color: var(--wp--preset--color--brand-orange); }
.juntson-sticky-mobile-bar a:nth-child(2) {
  color: var(--wp--preset--color--brand-mint-deep);
  border-left: 1px solid rgba(9, 32, 44, 0.1);
  border-right: 1px solid rgba(9, 32, 44, 0.1);
}
.juntson-sticky-mobile-bar a:nth-child(3) { color: var(--wp--preset--color--brand-blue); }

.juntson-sticky-mobile-bar .icon { font-size: 1.25rem; }

/* Hero phone CTA digit-wrapping prevention */
.juntson-phone-nowrap { white-space: nowrap; }

/* Card hover lift */
.juntson-card {
  background: #ffffff;
  border: 1px solid rgba(9, 32, 44, 0.1);
  border-radius: 1rem;
  box-shadow: var(--juntson-shadow-card);
  padding: 1.5rem;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.juntson-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--juntson-shadow-card-hover);
}

.juntson-card--orange { border: 2px solid var(--wp--preset--color--brand-orange); }
.juntson-card--navy   { background: var(--wp--preset--color--brand-navy); color: #ffffff; }
.juntson-card--navy * { color: inherit; }

/* Bullet-less lists inside cards (✓ checkmark is the affordance). */
.juntson-card ul,
.juntson-card .wp-block-list,
.juntson-hero-cards ul,
.juntson-hero-cards .wp-block-list {
  list-style: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}

.juntson-card ul li,
.juntson-hero-cards ul li {
  padding-left: 0;
}

/* Default link styling inside cards — navy, no underline, hover orange. */
.juntson-card a,
.juntson-card .wp-block-post-title a {
  color: var(--wp--preset--color--brand-navy) !important;
  text-decoration: none !important;
}

.juntson-card a:hover,
.juntson-card .wp-block-post-title a:hover {
  color: var(--wp--preset--color--brand-orange) !important;
  text-decoration: underline !important;
}

/* Category-term pill keeps brand-blue tint, no underline. */
.juntson-card .wp-block-post-terms,
.juntson-card .wp-block-post-terms a {
  color: var(--wp--preset--color--brand-blue) !important;
  text-decoration: none !important;
}
.juntson-card .wp-block-post-terms a:hover {
  color: var(--wp--preset--color--brand-blue-deep) !important;
}

/* Section-level "Vaata kõiki uudiseid →" / "Vaata kogu hinnakirja →" —
 * these are paragraph links rendered with .has-brand-blue-color. Navy
 * by default, orange + underline on hover. */
section .has-brand-blue-color a {
  color: var(--wp--preset--color--brand-navy) !important;
  text-decoration: none !important;
}
section .has-brand-blue-color a:hover {
  color: var(--wp--preset--color--brand-orange) !important;
  text-decoration: underline !important;
}

/* Exception: hero CTA cards keep their bold brand colours.
 * .juntson-card--orange (Avarii) → orange CTA
 * .juntson-card--navy (Hakka halduspartneriks) → orange CTA on dark bg */
.juntson-card--orange a {
  color: var(--wp--preset--color--brand-orange) !important;
}
.juntson-card--orange a:hover {
  color: var(--wp--preset--color--brand-orange-deep) !important;
}

.juntson-card--navy a {
  color: var(--wp--preset--color--brand-orange) !important;
}
.juntson-card--navy a:hover {
  color: #ffffff !important;
}

/* ============================================
 * Link decoration overrides
 * ============================================
 * Default: WordPress underlines all links. We strip underlines from
 * navigation / footer / button contexts where the visual styling
 * (color, weight, background) is the affordance — and keep underlines
 * only for inline body links inside post content.
 */

/* Header navigation + CTA buttons — no underline */
.juntson-header a,
.juntson-nav a,
.juntson-header-ctas a,
.juntson-sticky-mobile-bar a {
  text-decoration: none;
}

/* Navigation block items — consistent padding + hover */
.juntson-nav .wp-block-navigation-item__content,
.juntson-nav a {
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  transition: background-color 0.15s ease;
}

.juntson-nav .wp-block-navigation-item__content:hover,
.juntson-nav a:hover {
  text-decoration: none;
  background: rgba(9, 32, 44, 0.04);
}

/* Avarii item — orange + bold (visual emergency affordance).
 * The "juntson-nav-avarii" className is set on the wp:navigation-link block. */
.juntson-nav .wp-block-navigation-item.juntson-nav-avarii .wp-block-navigation-item__content,
.juntson-nav .wp-block-navigation-item.juntson-nav-avarii a {
  color: var(--wp--preset--color--brand-orange) !important;
  font-weight: 700 !important;
}

.juntson-nav .wp-block-navigation-item.juntson-nav-avarii .wp-block-navigation-item__content:hover,
.juntson-nav .wp-block-navigation-item.juntson-nav-avarii a:hover {
  color: var(--wp--preset--color--brand-orange-deep) !important;
}

/* Footer link colour — navy by default, hover gives orange + underline.
 * !important needed because theme.json elements.link applies brand-blue
 * via a more specific :is(...) selector that we'd otherwise have to mirror. */
footer.wp-block-group a,
footer.wp-block-group a:visited {
  text-decoration: none;
  color: var(--wp--preset--color--brand-navy) !important;
}

footer.wp-block-group a:hover {
  text-decoration: underline;
  color: var(--wp--preset--color--brand-orange) !important;
}

/* Footer phone — keep brand-orange even at rest (CTA affordance). */
footer.wp-block-group a[href^="tel:"] {
  color: var(--wp--preset--color--brand-orange) !important;
  font-weight: 700;
}

footer.wp-block-group a[href^="tel:"]:hover {
  color: var(--wp--preset--color--brand-orange-deep) !important;
}

/* Emergency "Avarii kodus" link in "Kiired teed" footer column stays orange. */
footer.wp-block-group .wp-block-list a[href="/avarii/"] {
  color: var(--wp--preset--color--brand-orange) !important;
  font-weight: 700;
}

/* Remove ugly bullets + indent from footer lists.
 * The Astro original showed clean stacked text lines without bullets. */
footer.wp-block-group ul,
footer.wp-block-group .wp-block-list {
  list-style: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}

footer.wp-block-group ul li,
footer.wp-block-group .wp-block-list li {
  padding-left: 0;
}

/* WP block buttons — strip underline (the button is the affordance) */
.wp-block-button__link {
  text-decoration: none !important;
}

/* Site-logo wrapper — kill default underline that wraps logo image */
.wp-block-site-logo a {
  text-decoration: none;
}

/* ============================================
 * Hinnakiri page — Üldtingimused rules box list
 * ============================================
 * The bullet list inside the orange-border rules box should sit left-aligned
 * to the box's inner padding, not pushed to the constrained center.
 */
.juntson-pricing-rules-box .wp-block-list,
.juntson-pricing-rules-box ul.juntson-pricing-rules {
  margin: 0 !important;
  padding-left: 1.25rem !important;
  list-style: disc !important;
  color: var(--wp--preset--color--brand-navy);
}

.juntson-pricing-rules-box .wp-block-list li,
.juntson-pricing-rules-box ul.juntson-pricing-rules li {
  margin: 0.25rem 0;
  font-size: 0.95rem;
  line-height: 1.5;
}

/* H2 section headings on hinnakiri page have generous top spacing */
.page-template-default h2.wp-block-heading {
  margin-top: 2rem;
}

/* ============================================
 * Fluent Forms — match brand styling
 * ============================================
 * FF default styling clashes with brand-cream / brand-mint section
 * backgrounds and uses generic blue buttons. Override to navy labels,
 * cream-friendly inputs, brand-orange submit button.
 */

/* Form container — generous spacing */
.frm-fluent-form {
  font-family: inherit;
}

.frm-fluent-form .ff-t-container,
.frm-fluent-form .ff-el-group {
  margin-bottom: 1.25rem;
}

/* Labels — brand-navy, bold, slightly larger */
.frm-fluent-form .ff-el-input--label label,
.frm-fluent-form label {
  color: var(--wp--preset--color--brand-navy);
  font-weight: 600;
  font-size: 0.95rem;
  margin-bottom: 0.375rem;
  display: block;
}

/* Required asterisk — brand-orange (not default red) */
.frm-fluent-form .ff-el-is-required.asterisk-right label::after,
.frm-fluent-form label .ff-el-is-required {
  color: var(--wp--preset--color--brand-orange);
}

/* Inputs / selects / textareas */
.frm-fluent-form .ff-el-form-control,
.frm-fluent-form input[type="text"],
.frm-fluent-form input[type="email"],
.frm-fluent-form input[type="tel"],
.frm-fluent-form input[type="number"],
.frm-fluent-form select,
.frm-fluent-form textarea {
  width: 100%;
  padding: 0.75rem 1rem;
  font-size: 1rem;
  line-height: 1.5;
  color: var(--wp--preset--color--brand-navy);
  background-color: #ffffff;
  border: 1px solid rgba(9, 32, 44, 0.2);
  border-radius: 0.5rem;
  box-shadow: 0 1px 2px 0 rgba(9, 32, 44, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.frm-fluent-form .ff-el-form-control:focus,
.frm-fluent-form input:focus,
.frm-fluent-form select:focus,
.frm-fluent-form textarea:focus {
  outline: none;
  border-color: var(--wp--preset--color--brand-blue);
  box-shadow: 0 0 0 3px rgba(31, 142, 196, 0.15);
}

.frm-fluent-form textarea {
  min-height: 6rem;
  resize: vertical;
}

.frm-fluent-form ::placeholder {
  color: rgba(9, 32, 44, 0.4);
  opacity: 1;
}

/* Submit button — brand-orange CTA, rounded, white text */
.frm-fluent-form .ff-btn-submit,
.frm-fluent-form .ff-btn,
.frm-fluent-form button[type="submit"] {
  display: inline-block;
  padding: 0.875rem 1.75rem;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1;
  color: #ffffff !important;
  background-color: var(--wp--preset--color--brand-orange) !important;
  border: 0;
  border-radius: 0.75rem;
  box-shadow: 0 1px 3px 0 rgba(239, 87, 44, 0.3);
  cursor: pointer;
  transition: background-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.frm-fluent-form .ff-btn-submit:hover,
.frm-fluent-form .ff-btn:hover,
.frm-fluent-form button[type="submit"]:hover {
  background-color: var(--wp--preset--color--brand-orange-deep) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 6px -1px rgba(239, 87, 44, 0.3);
}

/* Help / hint text under fields */
.frm-fluent-form .ff-el-help-message,
.frm-fluent-form .ff-help {
  font-size: 0.85rem;
  color: var(--wp--preset--color--brand-purple);
  margin-top: 0.25rem;
}

/* Validation error message — restrained red */
.frm-fluent-form .ff-el-is-error .ff-el-form-control {
  border-color: #d04545;
  box-shadow: 0 0 0 3px rgba(208, 69, 69, 0.12);
}

.frm-fluent-form .error,
.frm-fluent-form .ff-el-input--label .text-danger,
.frm-fluent-form .ff_t_error {
  color: #d04545;
  font-size: 0.85rem;
  margin-top: 0.25rem;
}

/* Success message after submit — navy text on subtle mint background */
.frm-fluent-form .ff-message-success,
.frm-fluent-form .ff_response_message {
  background: var(--wp--preset--color--brand-mint);
  color: var(--wp--preset--color--brand-navy);
  padding: 1.25rem 1.5rem;
  border-radius: 0.75rem;
  border-left: 4px solid var(--wp--preset--color--brand-mint-deep);
  font-size: 1rem;
}