@import url('/css/wt-fonts.css');

/* Ribbon identity. Opt-in screen styles: invitation artwork and print documents
   keep their own chosen theme. Semantic success/warning/error colours stay intact. */
.wt-identity {
    --wt-ink: #171417;
    --wt-muted: #686168;
    --wt-accent: #981b43;
    --wt-accent-dark: #721332;
    --wt-soft: #fcf1f3;
    --wt-line: #e6e0e3;
    --editorial-ivory: #fff;
    --editorial-paper: #fff;
    --editorial-ink: var(--wt-ink);
    --editorial-muted: var(--wt-muted);
    --editorial-berry: var(--wt-accent);
    --editorial-berry-dark: var(--wt-accent-dark);
    --editorial-line: var(--wt-line);
    --auth-ink: var(--wt-ink);
    --auth-muted: var(--wt-muted);
    --auth-berry: var(--wt-accent);
    --auth-berry-dark: var(--wt-accent-dark);
    --auth-ivory: #fff;
    --auth-line: var(--wt-line);
    --admin-ink: var(--wt-ink);
    --admin-paper: #fff;
    --admin-line: var(--wt-line);
    --admin-accent: var(--wt-accent);
    --admin-accent-dark: var(--wt-accent-dark);
    --admin-radius: 6px;
    --admin-shadow: none;
    --color-primary: var(--wt-accent);
    background-color: #fff;
    color: var(--wt-ink);
    font-family: 'Inter', Arial, sans-serif;
    text-rendering: optimizeLegibility;
    accent-color: var(--wt-accent);
}
.wt-identity :is(button, input, select, textarea) { font-family: inherit; }
.wt-identity :is(h1, h2, h3, h4) { font-family: 'Inter', Arial, sans-serif; }
.wt-identity.editorial-page :is(h1, h2, h3, h4), .wt-identity .editorial-mobile-menu__links a { font-family: 'Inter', Arial, sans-serif; }
.wt-identity :is(.editorial-feature h3, .editorial-step-list h3, .editorial-price__amount, .editorial-faq-list summary) { font-family: 'Inter', Arial, sans-serif; letter-spacing: -0.035em; }
.wt-identity :is(a, button, input, select, textarea, summary):focus-visible { outline: 2px solid var(--wt-accent); outline-offset: 4px; }
.wt-identity :is(.public-hero h1, .public-section h2, .public-cta h2, .public-prose h2, .public-prose h3, .editorial-hero h1, .editorial-section-heading h2, .editorial-proof h2, .editorial-final h2, .editorial-pricing h2, .editorial-faq h2, .auth-title, .dashboard-heading h1, .page-title, .setup-intro h1, .admin-topbar h1, .admin-subtitle, .admin-auth-title) {
    font-family: 'Inter', Arial, sans-serif;
    font-weight: 750;
    letter-spacing: -0.045em;
}
.wt-identity :is(.editorial-nav, .editorial-mobile-menu, .public-hero, .public-section, .public-index__item, .vendor-layout-header, .admin-topbar) { background: #fff; }
.wt-identity .editorial-nav { border-bottom-color: var(--wt-line); backdrop-filter: none; }
.wt-identity .editorial-nav.is-scrolled { box-shadow: none; }


.wt-identity .editorial-nav__links { margin-left: auto; }
.wt-identity .editorial-nav__dropdown { position: relative; }
.wt-identity .editorial-nav__dropdown > summary { display: flex; align-items: center; gap: 8px; min-height: 44px; cursor: pointer; list-style: none; font-size: 13px; font-weight: 600; white-space: nowrap; }
.wt-identity .editorial-nav__dropdown > summary::-webkit-details-marker { display: none; }
.wt-identity .editorial-nav__dropdown summary i { font-size: 9px; transition: transform 160ms ease; }
.wt-identity .editorial-nav__dropdown[open] summary i { transform: rotate(180deg); }
.wt-identity .editorial-nav__panel { position: absolute; top: calc(100% + 8px); left: 0; z-index: 20; display: grid; min-width: 220px; padding: 12px; background: #fff; border: 1px solid var(--wt-line); border-radius: 6px; box-shadow: 0 12px 28px #17141712; }
.wt-identity .editorial-nav__panel a { display: block; padding: 11px 12px; color: var(--wt-ink); font-size: 13px; font-weight: 500; text-decoration: none; border-radius: 3px; }
.wt-identity .editorial-nav__panel a:hover { background: var(--wt-soft); }
.wt-identity .editorial-nav__panel a::after { display: none; }
.wt-identity .editorial-nav__panel--features { width: 540px; grid-template-columns: 1fr 1fr; }
.wt-identity .editorial-nav__overview { grid-column: 1 / -1; border-bottom: 1px solid var(--wt-line); margin-bottom: 6px; }
.wt-identity .editorial-nav__account .editorial-nav__panel { left: auto; right: 0; }
.wt-identity .editorial-nav__mobile-pricing { display: none; }
.wt-identity .editorial-nav__actions > .editorial-button { display: inline-flex; }
.wt-identity .public-index__item { scroll-margin-top: 110px; }
.wt-identity .editorial-mobile-features > summary { display: flex; align-items: center; justify-content: space-between; min-height: 48px; font-size: 20px; font-weight: 600; list-style: none; cursor: pointer; }
.wt-identity .editorial-mobile-features > summary::-webkit-details-marker { display: none; }
.wt-identity .editorial-mobile-features summary i { font-size: 12px; }
.wt-identity .editorial-mobile-features > div { display: grid; padding: 8px 0 12px 16px; gap: 3px; }
.wt-identity .editorial-mobile-features > div a { padding: 9px 0; font-size: 15px; }
.wt-identity .editorial-mobile-menu { overflow-y: auto; overscroll-behavior: contain; }
.wt-identity .editorial-mobile-menu__top, .wt-identity .editorial-mobile-menu__links, .wt-identity .editorial-mobile-menu__bottom { flex-shrink: 0; }
.wt-identity .auth-account-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 16px; margin: 20px 0 24px; }
.wt-identity .auth-account-links a { color: var(--wt-muted); font-size: 12px; padding: 7px 0; text-underline-offset: 5px; }
.wt-identity .auth-account-links a[aria-current="page"] { color: var(--wt-accent); font-weight: 650; }
.wt-identity .auth-trial-note { margin: 18px 0 0; font-size: 13px; line-height: 1.6; color: var(--wt-muted); }
.wt-identity .editorial-nav__brand img { width: 206px; }
.wt-identity :is(.editorial-nav__links a, .editorial-nav__login) { color: var(--wt-ink); }
.wt-identity .editorial-button { background: var(--wt-accent); border-color: var(--wt-accent); border-radius: 4px; box-shadow: none; }
.wt-identity .editorial-button:hover { background: var(--wt-accent-dark); border-color: var(--wt-accent-dark); }
.wt-identity .editorial-button--light { background: white; color: var(--wt-accent) !important; border-color: white; }
.wt-identity .editorial-button--light:hover { background: var(--wt-soft); }
.wt-identity :is(.editorial-final, .public-cta) { background: var(--wt-accent-dark); }
.wt-identity :is(.footer, .footer-legal) { background: #fff; color: var(--wt-muted); }
.wt-identity.editorial-page .footer :is(h3, h4, .text-black, .footer-links a, .footer-description, .footer-bottom, .footer-legal-action) { color: var(--wt-ink); }
.wt-identity.editorial-page .footer :is(h3, h4, .text-black) { color: var(--wt-ink) !important; }
.wt-identity.editorial-page .footer .footer-legal-action { border-color: var(--wt-line); background: #fff; }
.wt-identity.editorial-page .footer :is(a:hover, a:focus-visible) { color: var(--wt-accent); }
.wt-identity .footer-contract-service { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--wt-line); font-size: 12px; }
.wt-identity .footer-contract-service > span { color: var(--wt-muted); }
.wt-identity .footer-contract-service a { padding-block: 6px; color: var(--wt-ink); font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }
.wt-identity .contract-service-login { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--wt-line); }
.wt-identity .public-index__item { border-color: var(--wt-line); box-shadow: none; }
.wt-identity :is(.public-index__item, .ribbon-feature, .ribbon-details__grid) h3 a { color: inherit; text-decoration: none; text-underline-offset: 5px; }
.wt-identity :is(.public-index__item, .ribbon-feature, .ribbon-details__grid) h3 a:hover { color: var(--wt-accent); text-decoration: underline; }
.wt-identity :is(.public-index__item, .ribbon-feature, .ribbon-details__grid) h3 a span { color: var(--wt-accent); font-size: .7em; white-space: nowrap; }
.wt-identity.public-auth-page { background: #fff url('/img/identity/ribbon-hero.webp') left center / 48% auto no-repeat fixed; }
.wt-identity.public-auth-page .auth-container { background: white; border-left: 1px solid var(--wt-line); }
.wt-identity.public-auth-page .auth-title { color: var(--wt-ink); }
.wt-identity :is(.btn-primary, .btn-submit, .ui-button--primary, .auth-button, .admin-button-primary) { background: var(--wt-accent); border-color: var(--wt-accent); color: #fff; border-radius: 5px; box-shadow: none; }
.wt-identity :is(.btn-primary, .btn-submit, .ui-button--primary, .auth-button, .admin-button-primary):hover { background: var(--wt-accent-dark); border-color: var(--wt-accent-dark); }
.wt-identity :is(.btn-secondary, .ui-button--secondary, .form-input, .ui-input, .admin-input, .admin-select) { border-radius: 5px; border-color: var(--wt-line); }
.wt-identity :is(.sidebar, .mobile-nav-header, .mobile-nav-menu) { background: #fff; border-color: var(--wt-line); box-shadow: none; }
.wt-identity .sidebar { border-right: 1px solid var(--wt-line); }
.wt-identity .sidebar .nav-logout { width: calc(100% - 2rem); }
.wt-identity .main-content { background: #fff; }
.wt-identity .vendor-layout-main-content { background: #fff; }
.wt-identity .vendor-layout-header .nav-link.active { background: var(--wt-soft); color: var(--wt-accent-dark); }
.wt-identity :is(.card-title, .vendor-dashboard-header h1) { font-family: 'Inter', Arial, sans-serif; font-weight: 700; letter-spacing: -0.035em; }
.wt-identity :is(.action-card .action-icon, .vendor-stat-card .icon-blue, .vendor-stat-card .icon-purple) { background: var(--wt-soft); color: var(--wt-accent); }
.wt-identity .planning-area-list > a > i:first-child { color: var(--wt-accent); }
.wt-identity .nav-item { border-radius: 5px; }
.wt-identity :is(.nav-item.active, .nav-item:hover, .mobile-nav-link.active) { background: var(--wt-soft); color: var(--wt-accent-dark); }
.wt-identity :is(.nav-item.active, .nav-item:hover) i { color: var(--wt-accent); }
.wt-identity .dashboard-heading h1 { color: var(--wt-ink); }
.wt-identity .page-header .text-2xl { font-weight: 750; letter-spacing: -0.04em; font-size: clamp(1.5rem, 2.6vw, 2.2rem); }
.wt-identity :is(.management-actions .action-btn:not(.secondary), .btn.send-invitation-btn, .notes-popup-btn.primary) { background: var(--wt-accent); color: #fff; border-radius: 5px; box-shadow: none; }
.wt-identity :is(.management-actions .action-btn:not(.secondary):hover, .btn.send-invitation-btn:hover:not(:disabled), .notes-popup-btn.primary:hover) { background: var(--wt-accent-dark); }
.wt-identity :is(.dashboard-eyebrow, .public-index__number) { color: var(--wt-accent); }
.wt-identity .next-action { background: var(--wt-soft); color: var(--wt-ink); border: 1px solid var(--wt-line); border-radius: 6px; }
.wt-identity .next-action h2 { color: var(--wt-ink); }
.wt-identity .next-action p { color: var(--wt-muted); }
.wt-identity .next-action__copy > span { color: var(--wt-accent); }
.wt-identity .next-action__icon { background: var(--wt-accent); color: white; }
.wt-identity .next-action__button { background: var(--wt-accent); color: white; border-radius: 4px; }
.wt-identity :is(.dashboard-section, .card, .category-card, .modal-content) { border-color: var(--wt-line); border-radius: 6px; box-shadow: none; }
.wt-identity .setup-intro { background: #fff url('/img/identity/ribbon-hero.webp') center bottom / 100% auto no-repeat; border-right: 1px solid var(--wt-line); color: var(--wt-ink); }
.wt-identity .setup-intro p { color: var(--wt-muted); }
.wt-identity .setup-intro img { filter: none; width: 200px; }
.wt-identity .setup-progress { color: var(--wt-accent); }
.wt-identity .admin-sidebar { background: #fff; color: var(--wt-ink); border-right: 1px solid var(--wt-line); }
.wt-identity :is(.admin-nav-link, .admin-sidebar-action) { color: var(--wt-muted); }
.wt-identity :is(.admin-nav-link:hover, .admin-nav-link.is-active) { background: var(--wt-soft); color: var(--wt-accent-dark); }
.wt-identity .admin-sidebar-footer { border-color: var(--wt-line); }
.wt-identity .admin-sidebar-footer p { color: var(--wt-muted); }
.wt-identity .admin-environment { color: var(--wt-ink); }
.wt-identity .admin-metric-strip strong { font-family: 'Inter', Arial, sans-serif; font-weight: 650; }
/* Only app-owned response controls, never the couple's invitation artwork. */
.wt-invitation-shell { background: #fff; }
.wt-invitation-shell > :is(.invitation-rsvp, .invitation-public-form, .invitation-footer) { --wt-accent: #981b43; font-family: 'Inter', Arial, sans-serif; }
.wt-invitation-shell > :is(.invitation-rsvp, .invitation-public-form) :is(.btn-primary, .btn-submit) { background: #981b43; border-color: #981b43; color: #fff; border-radius: 5px; }
.wt-invitation-shell > :is(.invitation-rsvp, .invitation-public-form) :is(.btn-primary, .btn-submit):hover { background: #721332; }
.wt-invitation-shell > :is(.invitation-rsvp, .invitation-public-form) :is(input, select, textarea, button):focus-visible { outline: 2px solid #981b43; outline-offset: 3px; }
@media (max-width: 1100px) {
    .wt-identity .editorial-nav__actions { display: flex; margin-left: auto; }
    .wt-identity .editorial-nav__actions .editorial-nav__login { display: inline-flex; }
    .wt-identity .editorial-nav__actions > .editorial-button { display: none; }
}
@media (max-width: 1020px) {
    .wt-identity .editorial-nav__mobile-pricing { display: inline-flex; align-items: center; min-height: 44px; font-size: 13px; font-weight: 600; }
}
@media (max-width: 700px) {
    .wt-identity .editorial-nav__inner { gap: 10px; }
    .wt-identity .editorial-nav__brand img { width: 128px; }
    .wt-identity .editorial-nav__actions { gap: 12px; }
    .wt-identity .editorial-nav__actions > .locale-switcher { display: none; }
    .wt-identity .editorial-nav__dropdown > summary { font-size: 12px; gap: 5px; }
    .wt-identity .editorial-nav__mobile-pricing { font-size: 12px; }
    .wt-identity .editorial-nav__login { font-size: 0.75rem; }
    .wt-identity.public-auth-page { background: white; }
    .wt-identity.public-auth-page .auth-container { border-left: 0; }
}
@media (max-width: 380px) {
    .wt-identity .editorial-nav__brand img { width: 106px; }
    .wt-identity .editorial-nav__inner { gap: 8px; }
    .wt-identity .editorial-nav__actions { gap: 8px; }
}
@media (prefers-reduced-motion: reduce) {
    .wt-identity *, .wt-identity *::before, .wt-identity *::after { scroll-behavior: auto !important; animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}
