/**
 * Site-wide motion, layout, and theme consistency.
 * Loaded last so tokens from color.css win.
 */

.spacer {
    height: var(--ttms-header-height, 5em);
    min-height: var(--ttms-header-height, 5em);
}

html, body {
    scroll-padding-top: calc(var(--ttms-header-height, 5em) + 0.5em);
}

#landing {
    margin-top: var(--ttms-header-height, 5em);
}

/* Page titles — don’t stretch edge-to-edge on ultrawide */
h1.title {
    max-width: min(var(--ttms-title-max, 1120px), calc(100% - 1.25rem)) !important;
    width: 100%;
    margin-inline: auto;
}

[data-theme="dark"] h1.title {
    background: color-mix(in srgb, var(--bg-surface) 78%, transparent);
    border-color: var(--border-light);
}

/* Shared primary / secondary CTAs */
.client-pricing-sales__cta--primary {
    background: var(--cta-primary-bg) !important;
    color: var(--cta-primary-ink, #fff) !important;
}

.client-pricing-sales__cta--primary:hover {
    box-shadow: 0 10px 24px color-mix(in srgb, var(--primary-blue-dark) 28%, transparent);
}

.client-pricing-sales__cta--secondary {
    background: var(--hub-panel-icon-bg) !important;
    color: var(--hub-panel-ink, var(--text-primary)) !important;
    border-color: var(--hub-panel-icon-border) !important;
}

.client-pricing-sales__cta--secondary:hover {
    border-color: color-mix(in srgb, var(--primary-orange) 55%, var(--hub-panel-border)) !important;
    background: var(--hub-panel-icon-hover-bg) !important;
}

/* Cards + buttons: light lift */
.client-card,
.client-pricing-sales__plan,
.onboarding .ttms-onboarding-plan-card,
.ttms-location-card,
.locations-list-container .location-card {
    transition:
        transform var(--dur, 0.32s) var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1)),
        box-shadow var(--dur, 0.32s) var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1)),
        border-color var(--dur-fast, 0.18s) ease,
        background var(--dur, 0.32s) ease;
}

.client-card:hover,
.onboarding .ttms-onboarding-plan-card:hover,
:is(body.frontpage, body.pricing-page) .client-pricing-sales__plan:hover {
    transform: translateY(-3px);
}

.menu-toggle-btn,
.main-header .account-btn,
.main-header .notification-btn {
    transition:
        transform var(--dur-fast, 0.18s) var(--ease-spring, cubic-bezier(0.34, 1.4, 0.64, 1)),
        background var(--dur-fast, 0.18s) ease,
        border-color var(--dur-fast, 0.18s) ease,
        box-shadow var(--dur, 0.32s) var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1)),
        color var(--dur-fast, 0.18s) ease;
}

.menu-toggle-btn .icon {
    fill: currentColor;
    color: inherit;
}

/* Menu panel uses hub tokens */
.menu-panel {
    background: var(--hub-panel-bg-gradient, rgba(255, 255, 255, 0.96)) !important;
    border-left-color: var(--hub-panel-border-subtle, rgba(0, 0, 0, 0.1)) !important;
    box-shadow: var(--hub-panel-shadow, var(--shadow-medium)) !important;
    color: var(--hub-panel-ink, var(--text-primary));
}

.menu-panel .menu-header {
    background: var(--hub-panel-header-gradient, transparent);
    border-bottom: 1px solid var(--hub-panel-border, transparent);
}

.menu-panel #navigation a {
    transition:
        transform var(--dur-fast, 0.18s) var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1)),
        background var(--dur-fast, 0.18s) ease,
        color var(--dur-fast, 0.18s) ease;
}

.menu-panel #navigation a:hover {
    transform: translateX(-3px);
}

/* Footer socials */
.site-footer .footer-links--socials .social-link {
    transition:
        transform var(--dur-fast, 0.18s) var(--ease-spring, cubic-bezier(0.34, 1.4, 0.64, 1)),
        background var(--dur-fast, 0.18s) ease,
        color var(--dur-fast, 0.18s) ease;
}

.site-footer .footer-links--socials .social-link:hover {
    transform: translateY(-3px) scale(1.06);
}

.site-footer .footer-links--nav a {
    transition: color var(--dur-fast, 0.18s) ease, transform var(--dur-fast, 0.18s) ease;
}

.site-footer .footer-links--nav a:hover {
    color: var(--primary-orange);
}

/* Guest notify settings — tokenized */
.ttms-guest-notify-settings {
    border-color: var(--hub-panel-border) !important;
    background: var(--hub-panel-surface) !important;
}

.ttms-guest-notify-settings__summary {
    color: var(--hub-panel-ink) !important;
}

.ttms-guest-notify-settings__summary::after {
    border-color: var(--hub-panel-ink-muted) !important;
}

.ttms-guest-notify-settings__body {
    border-top-color: var(--hub-panel-border-subtle) !important;
}

/* Onboarding / marketing page links */
.simple-marketing-page__body a {
    color: color-mix(in srgb, var(--primary-orange) 55%, var(--primary-blue));
}

[data-theme="dark"] .simple-marketing-page__body a {
    color: var(--primary-orange-light);
}

/* Content columns at large widths */
.location-container,
.clients-container,
.locations-list-container {
    max-width: var(--ttms-header-max, 1400px);
}

/* Icon buttons press */
.ttms-icon-btn:active,
.menu-toggle-btn:active,
.main-header .account-btn:active,
.main-header .notification-btn:active {
    transform: scale(0.96);
}

@media (prefers-reduced-motion: reduce) {
    .client-card,
    .client-pricing-sales__plan,
    .onboarding .ttms-onboarding-plan-card,
    .menu-toggle-btn,
    .main-header .account-btn,
    .main-header .notification-btn,
    .menu-panel #navigation a,
    .site-footer .footer-links--socials .social-link {
        transition: none;
    }

    .client-card:hover,
    .onboarding .ttms-onboarding-plan-card:hover,
    .menu-panel #navigation a:hover,
    .site-footer .footer-links--socials .social-link:hover {
        transform: none;
    }
}
