/* ============================================================================
   PostPronto — Theme overlay ufficiale (componenti + layout strutturali)
   Caricato dopo postpronto.css. Usa solo token --pp-* definiti in :root.
   ========================================================================== */

/* ── LOGO ──────────────────────────────────────────────────────────────── */

.pp-logo {
  line-height: 0;
}
.pp-logo-img {
  height: 40px;
  width: auto;
  max-width: min(220px, 58vw);
  display: block;
}
.pp-sidebar .pp-logo {
  padding: .25rem .5rem 1.25rem;
}
.pp-sidebar .pp-logo-img {
  height: 34px;
  max-width: 168px;
}
.pp-footer .pp-logo-img,
.pp-logo--dark .pp-logo-img {
  height: 36px;
  max-width: 190px;
}
.pp-sidebar .pp-logo--dark .pp-logo-img {
  height: 34px;
  max-width: 168px;
}

/* ── BOTTONI (semantica brand — usa token contrasto) ─────────────────── */

.pp-btn-primary,
a.pp-btn-primary {
  background: var(--pp-brand);
  color: var(--pp-brand-text);
}
.pp-btn-primary:hover,
a.pp-btn-primary:hover { background: var(--pp-brand-hover); }

.pp-btn-secondary,
a.pp-btn-secondary {
  background: var(--pp-teal-btn);
  color: var(--pp-teal-text);
}
.pp-btn-secondary:hover,
a.pp-btn-secondary:hover { background: var(--pp-teal-btn-hover); }

.pp-btn-action,
.pp-btn-accent,
a.pp-btn-action,
a.pp-btn-accent {
  background: var(--pp-orange-btn);
  color: var(--pp-orange-text);
}
.pp-btn-action:hover,
.pp-btn-accent:hover,
a.pp-btn-action:hover,
a.pp-btn-accent:hover { background: var(--pp-orange-btn-hover); }

.pp-btn-outline,
a.pp-btn-outline {
  background: var(--pp-white);
  color: var(--pp-brand);
  border: 1.5px solid var(--pp-brand);
}
.pp-btn-outline:hover,
a.pp-btn-outline:hover { background: var(--pp-brand-soft); }

.pp-btn-dark,
a.pp-btn-dark {
  background: var(--pp-navy);
  color: var(--pp-white);
}
.pp-btn-dark:hover,
a.pp-btn-dark:hover { background: var(--pp-secondary-soft); }

.pp-btn-ghost,
a.pp-btn-ghost {
  background: transparent;
  color: var(--pp-text);
  border: 1.5px solid var(--pp-border-strong);
}
.pp-btn-ghost:hover,
a.pp-btn-ghost:hover {
  background: var(--pp-surface-alt);
  color: var(--pp-navy);
}
/* ── BADGE EDITORIALI ──────────────────────────────────────────────────── */

.pp-badge-ready,
.pp-badge-published,
.pp-badge-active,
.pp-badge-success {
  background: var(--pp-success-soft);
  color: var(--pp-teal);
}
.pp-badge-planned,
.pp-badge-info {
  background: var(--pp-brand-soft);
  color: var(--pp-blue);
}
.pp-badge-draft,
.pp-badge-muted {
  background: var(--pp-surface-alt);
  color: var(--pp-muted);
  border: 1px solid var(--pp-border);
}
.pp-badge-paused,
.pp-badge-warning {
  background: var(--pp-warning-soft);
  color: var(--pp-orange);
}
.pp-badge-primary { background: var(--pp-brand-soft); color: var(--pp-blue); }

/* ── CARD ──────────────────────────────────────────────────────────────── */

.pp-card,
.pp-panel-card,
.pp-feature-card,
.pp-pricing-card {
  background: var(--pp-card);
  border: 1px solid var(--pp-border);
  border-radius: var(--pp-radius-md);
  box-shadow: var(--pp-shadow-sm);
}

.pp-kpi-card,
.pp-kpi {
  background: var(--pp-card);
  border: 1px solid var(--pp-border);
  border-radius: var(--pp-radius-md);
  box-shadow: var(--pp-shadow-sm);
  padding: 1.15rem 1.25rem;
}
.pp-kpi-trend.up { color: var(--pp-teal); }

.pp-pricing-card.is-featured,
.pp-pricing-card--featured,
.pp-price-card.is-featured {
  border-color: var(--pp-blue);
  box-shadow: var(--pp-shadow-md);
}
.pp-price-flag {
  background: var(--pp-blue);
  color: var(--pp-white);
}

/* ── SIDEBAR NAVY (token --pp-sidebar-*) ───────────────────────────────── */

.pp-sidebar,
.pp-admin-sidebar {
  background: var(--pp-sidebar-bg);
  border-right: 0;
}
.pp-side-link,
.pp-sidebar a.pp-side-link {
  color: var(--pp-sidebar-link);
}
.pp-side-link:hover,
.pp-sidebar a.pp-side-link:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--pp-sidebar-link-hover);
}
.pp-side-link.is-active,
.pp-sidebar a.pp-side-link.is-active {
  background: var(--pp-sidebar-active-bg);
  color: var(--pp-sidebar-active-text);
}
.pp-side-section {
  color: var(--pp-sidebar-muted);
}
.pp-sidebar-lang .pp-lang-switcher-btn {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.12);
  color: var(--pp-sidebar-link);
}
.pp-sidebar-lang .pp-lang-switcher-btn:hover {
  color: var(--pp-sidebar-link-hover);
  background: rgba(255, 255, 255, 0.1);
}
/* ── HEADER PUBBLICO ───────────────────────────────────────────────────── */

.pp-header--public {
  background: rgba(255, 255, 255, 0.92);
  border-bottom: 1px solid var(--pp-border);
}
.pp-nav-public a {
  color: var(--pp-muted);
  font-weight: 600;
}
.pp-nav-public a:hover,
.pp-nav-public a.is-active {
  color: var(--pp-navy);
}

/* ── LANDING HERO ──────────────────────────────────────────────────────── */

.pp-public-hero-visual {
  position: relative;
  display: grid;
  gap: 1.25rem;
  align-items: center;
}
.pp-hero-mascot {
  width: min(300px, 76vw);
  height: auto;
  margin: 0 auto;
  filter: drop-shadow(0 18px 34px rgba(21, 87, 185, 0.22));
}
@media (min-width: 901px) {
  .pp-public-hero-visual {
    grid-template-columns: 170px 1fr;
  }
  .pp-hero-mascot {
    width: min(170px, 30vw);
    margin: 0;
  }
}

.pp-public-hero-copy h1 {
  font-size: clamp(2rem, 4.5vw, 3.1rem);
  line-height: 1.08;
  letter-spacing: -0.03em;
  max-width: 14ch;
  color: var(--pp-navy);
}
.pp-public-hero-copy .pp-accent {
  display: block;
  color: var(--pp-blue);
  margin-top: .15rem;
}
.pp-public-trust-list {
  flex-direction: column;
  align-items: flex-start;
  gap: .55rem;
  margin-top: 1.35rem;
}
.pp-public-trust-list li {
  color: var(--pp-navy);
  font-weight: 600;
  font-size: .92rem;
}
.pp-public-trust-list li::marker { content: none; }

/* ── FOOTER NAVY ───────────────────────────────────────────────────────── */

.pp-footer,
.pp-footer--public {
  background: var(--pp-navy);
  color: var(--pp-footer-text);
}
.pp-footer a { color: var(--pp-footer-link); }
.pp-footer a:hover { color: var(--pp-white); opacity: .9; }

/* ── FORM ──────────────────────────────────────────────────────────────── */

.pp-input,
.pp-select,
.pp-textarea {
  border: 1px solid var(--pp-border-strong);
  border-radius: var(--pp-radius-sm);
  background: var(--pp-white);
  color: var(--pp-navy);
}
.pp-input:focus,
.pp-select:focus,
.pp-textarea:focus {
  border-color: var(--pp-blue);
  box-shadow: var(--pp-focus-ring);
  outline: none;
}
.pp-label { color: var(--pp-navy); font-weight: 600; }

/* ── TABELLE ───────────────────────────────────────────────────────────── */

.pp-table th {
  background: var(--pp-surface-alt);
  color: var(--pp-muted);
  font-weight: 700;
  border-bottom: 1px solid var(--pp-border);
}
.pp-table td { border-bottom: 1px solid var(--pp-border); }

/* ── MODALI / ALERT / EMPTY / LOADING ──────────────────────────────────── */

.pp-modal-content,
.pp-modal-box {
  border-radius: var(--pp-radius-md);
  box-shadow: var(--pp-shadow-md);
  border: 1px solid var(--pp-border);
}
.pp-alert-success { background: var(--pp-success-soft); color: var(--pp-teal); border-color: var(--pp-success-border); }
.pp-alert-warning { background: var(--pp-warning-soft); color: var(--pp-warning-text); border-color: var(--pp-warning-border); }
.pp-alert-info { background: var(--pp-info-soft); color: var(--pp-blue); border-color: var(--pp-info-border); }

.pp-empty-state {
  text-align: center;
  padding: 2.5rem 1.5rem;
  color: var(--pp-muted);
}
.pp-empty-state-icon {
  font-size: 2.5rem;
  margin-bottom: .75rem;
  opacity: .85;
}
.pp-empty-state h3 {
  color: var(--pp-navy);
  margin-bottom: .5rem;
}
.pp-loading-skeleton,
.pp-skeleton {
  background: linear-gradient(90deg, var(--pp-surface-alt) 25%, rgba(184, 193, 204, 0.25) 50%, var(--pp-surface-alt) 75%);
  background-size: 200% 100%;
  animation: pp-shimmer 1.2s ease-in-out infinite;
  border-radius: var(--pp-radius-sm);
}
@keyframes pp-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ── AUTH ──────────────────────────────────────────────────────────────── */

.pp-container-auth .pp-card {
  max-width: 440px;
  margin: 0 auto;
}

/* ── DASHBOARD LAYOUT ──────────────────────────────────────────────────── */

.pp-main { background: var(--pp-bg); }
.pp-page-title,
.pp-main h1 { color: var(--pp-navy); }

/* ── RESPONSIVE SIDEBAR ────────────────────────────────────────────────── */

@media (max-width: 900px) {
  .pp-sidebar {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  }
}

/* ── LANDING COMMERCIALE BETA ──────────────────────────────────────────── */

.pp-landing-value-strip {
  background: var(--pp-brand-soft);
  border-block: 1px solid var(--pp-border);
  padding: 1.25rem 0;
}
.pp-landing-value-text {
  margin: 0;
  text-align: center;
  font-size: clamp(1rem, 2.2vw, 1.12rem);
  font-weight: 600;
  color: var(--pp-navy);
  max-width: 72ch;
  margin-inline: auto;
  line-height: 1.55;
}

.pp-sector-grid--compact {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 1rem;
}
.pp-sector-card--compact {
  background: var(--pp-card);
  border: 1px solid var(--pp-border);
  border-radius: var(--pp-radius-md);
  padding: 1.1rem 1.15rem;
  box-shadow: var(--pp-shadow-sm);
}
.pp-sector-card--compact h3 { font-size: 1.02rem; margin-bottom: .35rem; }

.pp-landing-split {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 2rem;
  align-items: center;
}
.pp-landing-checklist {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: .65rem;
}
.pp-landing-checklist li {
  font-weight: 600;
  color: var(--pp-navy);
  font-size: .95rem;
}

.pp-visual-placeholder {
  min-height: 220px;
  border-radius: var(--pp-radius-md);
  border: 1px dashed var(--pp-border-strong);
  background: linear-gradient(145deg, var(--pp-surface-alt) 0%, var(--pp-brand-soft) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 1.5rem;
  color: var(--pp-muted);
  font-weight: 700;
  font-size: .88rem;
}
.pp-landing-visual-media {
  min-height: 220px;
  border-radius: var(--pp-radius-md);
  border: 1px solid #E5E7EB;
  overflow: hidden;
  background: #F3F4F6;
}
.pp-landing-visual-img {
  display: block;
  width: 100%;
  min-height: 220px;
  max-height: 300px;
  object-fit: cover;
}
.pp-visual-placeholder--hero { background: linear-gradient(135deg, #E8F0FA 0%, #FFF3E0 100%); }
.pp-visual-placeholder--multichannel { background: linear-gradient(135deg, #E6F7F7 0%, #E8F0FA 100%); }
.pp-visual-placeholder--calendar { background: linear-gradient(135deg, #E8F0FA 0%, #F7F9FC 100%); }
.pp-visual-placeholder--before_after { background: linear-gradient(90deg, #F7F9FC 50%, #E8F0FA 50%); }
.pp-visual-placeholder--chat { min-height: 280px; }

.pp-landing-visual-grid { align-items: stretch; }
.pp-landing-visual-card { margin: 0; }
.pp-landing-visual-card figcaption { margin-top: .55rem; text-align: center; }

.pp-container-narrow { max-width: 760px; }
.pp-faq-list { display: grid; gap: .75rem; }
.pp-faq-item { padding: 1rem 1.15rem; }
.pp-faq-item summary {
  cursor: pointer;
  font-weight: 700;
  color: var(--pp-navy);
  list-style: none;
}
.pp-faq-item summary::-webkit-details-marker { display: none; }
.pp-faq-item[open] summary { margin-bottom: .65rem; color: var(--pp-blue); }

@media (max-width: 900px) {
  .pp-landing-split { grid-template-columns: 1fr; }
  .pp-public-hero-visual { grid-template-columns: 1fr; }
}

/* ── LANDING PUBBLICA — brand lock blu / bianco / navy ─────────────────── */

.pp-body--landing {
  background: #F7F9FC;
}
.pp-body--landing .pp-public-hero-copy h1,
.pp-body--landing .pp-public-hero-copy .pp-accent,
.pp-body--landing .pp-hero h1 .pp-accent {
  color: var(--pp-blue);
}
.pp-body--landing .pp-public-hero-copy h1 {
  color: var(--pp-navy);
}
.pp-body--landing .pp-public-hero-copy .pp-accent {
  display: block;
}
.pp-body--landing .pp-header--public .pp-btn-primary,
.pp-body--landing .pp-header--public a.pp-btn-primary {
  background: var(--pp-brand);
  color: var(--pp-brand-text);
}
.pp-body--landing .pp-landing-value-strip {
  background: #E8F0FA;
  border-block-color: rgba(184, 193, 204, 0.45);
}
.pp-body--landing .pp-public-final-cta {
  background: linear-gradient(135deg, var(--pp-navy) 0%, var(--pp-blue) 100%);
  color: var(--pp-white);
}
.pp-body--landing .pp-btn-light,
.pp-body--landing a.pp-btn-light {
  color: var(--pp-brand);
  background: var(--pp-white);
}
.pp-body--landing .pp-public-final-cta .pp-btn-light,
.pp-body--landing .pp-public-final-cta a.pp-btn-light {
  color: var(--pp-brand);
  background: var(--pp-white);
}
.pp-body--landing .pp-pricing-help .pp-btn-action,
.pp-body--landing .pp-pricing-help a.pp-btn-action {
  background: var(--pp-orange-btn);
  color: var(--pp-orange-text);
}

/* ── DISABLED + WIZARD (contrasto — ultima parola sul theme overlay) ─── */

button.pp-btn[disabled],
button.pp-btn.is-disabled,
.pp-btn[disabled],
.pp-btn.is-disabled {
  background: #E5E7EB;
  color: #4B5563;
  border: 1.5px solid #D1D5DB;
  box-shadow: none;
  cursor: not-allowed;
  transform: none;
  opacity: 1;
}

button.pp-btn.pp-btn-primary[disabled],
button.pp-btn.pp-btn-primary.is-disabled {
  background: #E5E7EB;
  color: #4B5563;
}

.pp-steps .pp-step.is-active {
  border-color: var(--pp-brand);
  background: var(--pp-brand-soft);
  color: var(--pp-brand-text-on-soft);
}

.pp-steps .pp-step.is-active .pp-step-n {
  background: var(--pp-brand);
  color: var(--pp-brand-text);
}