/*
 * SMC shared UI layer: one look for the home page and all public pages.
 * File: /wp-content/themes/smc/assets/css/smc-ui.css
 * Loaded on every front-end page after the page stylesheets (inc/enqueue.php, smc_ui_enqueue).
 *
 * How it works:
 * - Design rules are scoped to body.smc-ui. That class is added only to the public pages
 *   listed in smc_ui_is_public_page() (inc/enqueue.php), so account and admin screens are untouched.
 * - Header menu animation is site-wide (no scope).
 * - Change a token or a rule here and every public page follows.
 * - Motion (reveal on scroll, CTA bubbles, menu open/close) lives in assets/js/smc-ui.js.
 */

/* ============================================================
   1. TOKENS
   ============================================================ */

:root {
    --smc-ui-ink: #0b1220;
    --smc-ui-text: #556070;
    --smc-ui-muted: #6b7686;
    --smc-ui-accent: #2db6ff;
    --smc-ui-accent-soft: #f2f8ff;
    --smc-ui-accent-line: #dcecff;
    --smc-ui-gradient: linear-gradient(140deg, #5ccbff 0%, #2db6ff 100%);
    --smc-ui-cta: linear-gradient(135deg, #52c6ff 0%, #2db6ff 55%, #26a8f2 100%);
    --smc-ui-border: #e6edf5;
    --smc-ui-radius: 20px;
    --smc-ui-shadow: 0 1px 2px rgba(15, 23, 42, 0.03), 0 10px 26px rgba(15, 50, 90, 0.05);
    --smc-ui-shadow-hover: 0 2px 4px rgba(15, 23, 42, 0.04), 0 22px 44px rgba(15, 50, 90, 0.10);
    --smc-ui-ease: cubic-bezier(0.16, 1, 0.3, 1);
    --smc-ui-gutter: 24px;
}

/* ============================================================
   2. PAGE CANVAS AND COLUMN
   ============================================================ */

.smc-ui ::selection {
    background: #bfe8ff;
    color: var(--smc-ui-ink);
}

.smc-ui h1,
.smc-ui h2,
.smc-ui h3 {
    text-wrap: balance;
}

/* clip (not hidden) still stops sideways scroll but keeps position: sticky working */
html:has(body.smc-ui),
body.smc-ui {
    overflow-x: clip;
}

/* Sticky header (layout.css) always stays visible, also inside the iOS app.
   main.js still toggles .hidden-header on scroll; it is intentionally not styled. */

/* One left edge: same gutter for header, page heading and content */
body.smc-ui .smc-container {
    padding-left: var(--smc-ui-gutter);
    padding-right: var(--smc-ui-gutter);
}

/* Inner pages: white canvas with a soft blue light from the top right (no off-brand violet) */
.smc-ui .smc-services-page,
.smc-ui .smc-about-page,
.smc-ui .smc-faq-page,
.smc-ui .smc-contact-page,
.smc-ui .smc-area-page,
.smc-ui .smc-careers-page,
.smc-ui .smc-founders-page,
.smc-ui .smc-page--standard,
.smc-ui .smc-auth.smc-privacy-policy,
.smc-ui .smc-auth.smc-terms-of-service {
    background:
        radial-gradient(1100px 520px at 100% -8%, rgba(45, 182, 255, 0.10), rgba(45, 182, 255, 0) 65%),
        linear-gradient(180deg, #f7fbff 0%, #ffffff 520px);
}

/* Page heading and content start on the container edge (they were centered at different widths) */
.smc-ui .smc-services-hero .smc-section-header,
.smc-ui .smc-about-header,
.smc-ui .smc-contact-hero-inner,
.smc-ui .smc-contact-header,
.smc-ui .smc-contact-layout,
.smc-ui .smc-services-grid {
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    text-align: left;
}

/* ============================================================
   3. PAGE HEADING (h1, lead, eyebrow)
   ============================================================ */

.smc-ui .smc-services-hero,
.smc-ui .smc-about-hero,
.smc-ui .smc-faq-hero,
.smc-ui .smc-contact-hero,
.smc-ui .smc-area-hero,
.smc-ui .smc-founders-hero {
    padding-top: 4.4rem;
    padding-bottom: 2.2rem;
}

.smc-ui .smc-services-hero .smc-section-title,
.smc-ui .smc-about-title,
.smc-ui .smc-faq-title,
.smc-ui .smc-contact-title,
.smc-ui .smc-area-title,
.smc-ui .smc-careers-title,
.smc-ui .smc-founders-title,
.smc-ui .smc-legal-title {
    margin: 0 0 0.9rem;
    font-size: clamp(1.35rem, 1.6vw, 1.5rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: var(--smc-ui-ink);
}

.smc-ui .smc-services-hero .smc-section-subtitle,
.smc-ui .smc-about-subtitle,
.smc-ui .smc-faq-subtitle,
.smc-ui .smc-contact-subtitle,
.smc-ui .smc-area-subtitle,
.smc-ui .smc-founders-lead,
.smc-ui .smc-legal-subtitle {
    max-width: 46em;
    font-size: 1.02rem;
    line-height: 1.7;
    color: var(--smc-ui-text);
}

.smc-ui .smc-careers-subtitle {
    font-size: 1.02rem;
    font-weight: 500;
    color: var(--smc-ui-text);
}

/* Eyebrow above the page title: the same pill as on the home page */
.smc-hr-eyebrow,
.smc-ui .smc-about-kicker,
.smc-ui .smc-contact-kicker,
.smc-ui .smc-careers-hero-eyebrow,
.smc-ui .smc-founders-card--hero .smc-founders-kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 1.15rem;
    padding: 0.32rem 0.85rem;
    border-radius: 999px;
    background: var(--smc-ui-accent-soft);
    border: 1px solid var(--smc-ui-accent-line);
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: none;
    color: #2a4a6b;
}

.smc-ui .smc-careers-hero-eyebrow svg {
    color: var(--smc-ui-accent);
}

/* Small section label inside cards ("Our story", "Owners") */
.smc-ui .smc-founders-kicker {
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--smc-ui-accent);
}

/* Heading entrance: the same rise as the home hero */
@media (prefers-reduced-motion: no-preference) {
    .smc-ui .smc-services-hero .smc-section-header > *,
    .smc-ui .smc-about-header > *,
    .smc-ui .smc-faq-header > *,
    .smc-ui .smc-contact-header > *,
    .smc-ui .smc-area-hero-copy > *,
    .smc-ui .smc-careers-hero > *,
    .smc-ui .smc-founders-card--hero > *,
    .smc-ui .smc-legal-header > * {
        animation: smc-ui-rise 0.9s var(--smc-ui-ease) both;
    }

    .smc-ui .smc-services-hero .smc-section-header > :nth-child(2),
    .smc-ui .smc-about-header > :nth-child(2),
    .smc-ui .smc-faq-header > :nth-child(2),
    .smc-ui .smc-contact-header > :nth-child(2),
    .smc-ui .smc-area-hero-copy > :nth-child(2),
    .smc-ui .smc-careers-hero > :nth-child(2),
    .smc-ui .smc-founders-card--hero > :nth-child(2),
    .smc-ui .smc-legal-header > :nth-child(2) { animation-delay: 0.07s; }

    .smc-ui .smc-services-hero .smc-section-header > :nth-child(3),
    .smc-ui .smc-about-header > :nth-child(3),
    .smc-ui .smc-faq-header > :nth-child(3),
    .smc-ui .smc-contact-header > :nth-child(3),
    .smc-ui .smc-area-hero-copy > :nth-child(3),
    .smc-ui .smc-careers-hero > :nth-child(3),
    .smc-ui .smc-founders-card--hero > :nth-child(3),
    .smc-ui .smc-legal-header > :nth-child(3) { animation-delay: 0.14s; }

    .smc-ui .smc-services-hero .smc-section-header > :nth-child(n+4),
    .smc-ui .smc-area-hero-copy > :nth-child(n+4),
    .smc-ui .smc-founders-card--hero > :nth-child(n+4),
    .smc-ui .smc-legal-header > :nth-child(n+4) { animation-delay: 0.21s; }
}

@keyframes smc-ui-rise {
    from { opacity: 0; transform: translateY(18px); filter: blur(6px); }
    to   { opacity: 1; transform: none; filter: none; }
}

/* ============================================================
   4. SECTION AND CARD TITLES
   ============================================================ */

.smc-ui .smc-section-title {
    letter-spacing: -0.025em;
    color: var(--smc-ui-ink);
}

.smc-ui .smc-service-title,
.smc-ui .smc-services-addons-title,
.smc-ui .smc-contact-card-title,
.smc-ui .smc-area-card-title,
.smc-ui .smc-careers-section-title,
.smc-ui .smc-about-hero-title,
.smc-ui .smc-about-values-header .smc-section-title,
.smc-ui .smc-about-areas-text .smc-section-title,
.smc-ui .smc-about-trust-text .smc-section-title,
.smc-ui .smc-founders-section-head h2 {
    font-size: 1.15rem;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -0.02em;
    color: var(--smc-ui-ink);
}

.smc-ui .smc-service-title a,
.smc-ui .smc-service-title-link {
    color: inherit;
}

.smc-ui .smc-card-title,
.smc-ui .smc-addon-title,
.smc-ui .smc-about-value-title,
.smc-ui .smc-careers-job-title,
.smc-ui .smc-founders-person-body h3 {
    font-size: 1.02rem;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: -0.01em;
    color: var(--smc-ui-ink);
}

.smc-ui .smc-service-intro,
.smc-ui .smc-card-text,
.smc-ui .smc-addon-text,
.smc-ui .smc-about-value-text,
.smc-ui .smc-contact-card-subtitle {
    line-height: 1.65;
    color: var(--smc-ui-text);
}

/* ============================================================
   5. CARDS: one surface for every block
   ============================================================ */

.smc-ui .smc-card,
.smc-ui .smc-panel,
.smc-ui .smc-service-block,
.smc-ui .smc-addon-card,
.smc-ui .smc-faq-item,
.smc-ui .smc-contact-card,
.smc-ui .smc-contact-info-card,
.smc-ui .smc-area-card,
.smc-ui .smc-careers-job,
.smc-ui .smc-careers-sidebar-card,
.smc-ui .smc-founders-card,
.smc-ui .smc-legal-box {
    border-radius: var(--smc-ui-radius);
    border: 1px solid var(--smc-ui-border);
    background-color: #ffffff;
    box-shadow: var(--smc-ui-shadow);
    transition: transform 0.28s var(--smc-ui-ease), box-shadow 0.28s ease, border-color 0.28s ease;
}

/* The thin blue top stripe differed from card to card; one surface means no stripe */
.smc-ui .smc-service-block::before,
.smc-ui .smc-panel::before,
.smc-ui .smc-faq-item::before,
.smc-ui .smc-contact-card::before,
.smc-ui .smc-contact-info-card::before,
.smc-ui .smc-area-card::before,
.smc-ui .smc-careers-sidebar-card::before,
.smc-ui .smc-founders-card::before,
.smc-ui .smc-legal-box::before {
    display: none;
}

/* Soft panel: brand tint only */
.smc-ui .smc-panel.smc-panel--soft {
    background: var(--smc-ui-accent-soft);
    border-color: var(--smc-ui-accent-line);
}

.smc-ui .smc-faq-item.is-open {
    border-color: rgba(45, 182, 255, 0.45);
}

/* Blue disc with a white icon (icon PNG used as a mask) */
.smc-ui .smc-card-icon {
    position: relative;
    width: 54px;
    height: 54px;
    margin: 0 auto 0.9rem;
    border-radius: 16px;
    background: var(--smc-ui-gradient);
    box-shadow: 0 8px 18px rgba(45, 182, 255, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.35);
    transition: transform 0.3s var(--smc-ui-ease), box-shadow 0.3s ease;
}

.smc-ui .smc-card-icon::after {
    content: "";
    position: absolute;
    inset: 0;
    background-color: #ffffff;
    -webkit-mask: var(--smc-ui-icon) center / 28px 28px no-repeat;
    mask: var(--smc-ui-icon) center / 28px 28px no-repeat;
}

.smc-ui .smc-card-icon--reputable  { --smc-ui-icon: url('../img/icons/reputable.png'); }
.smc-ui .smc-card-icon--standards  { --smc-ui-icon: url('../img/icons/standards.png'); }
.smc-ui .smc-card-icon--flexible   { --smc-ui-icon: url('../img/icons/flexible.png'); }
.smc-ui .smc-card-icon--house      { --smc-ui-icon: url('../img/icons/hou-apt.png'); }
.smc-ui .smc-card-icon--move       { --smc-ui-icon: url('../img/icons/move-in-out.png'); }
.smc-ui .smc-card-icon--office     { --smc-ui-icon: url('../img/icons/offices.png'); }
.smc-ui .smc-card-icon--commercial { --smc-ui-icon: url('../img/icons/commercial.png'); }

/* ============================================================
   6. BUTTONS AND LINKS
   ============================================================ */

.smc-ui .smc-btn-primary {
    box-shadow: 0 10px 22px rgba(45, 182, 255, 0.26);
    transition: transform 0.22s var(--smc-ui-ease), box-shadow 0.22s ease, background-color 0.18s ease;
}

.smc-ui .smc-link-arrow {
    transition: transform 0.25s var(--smc-ui-ease);
}

/* ============================================================
   7. BLUE CALL TO ACTION BLOCK
   ============================================================ */

.smc-ui .smc-section-accent {
    position: relative;
    overflow: hidden;
    padding: 2.6rem 2.8rem;
    border-radius: 24px;
    background:
        radial-gradient(520px 260px at 92% 0%, rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0) 70%),
        var(--smc-ui-cta);
    box-shadow: 0 22px 50px rgba(45, 182, 255, 0.28);
}

.smc-ui .smc-section-accent .smc-section-inner {
    position: relative;
    z-index: 1;
}

.smc-ui .smc-section-accent .smc-section-title {
    color: #ffffff;
    letter-spacing: -0.02em;
}

.smc-ui .smc-section-accent .smc-section-subtitle {
    color: rgba(255, 255, 255, 0.92);
}

.smc-ui .smc-section-actions {
    flex-wrap: wrap;
    gap: 0.8rem 1.2rem;
}

.smc-ui .smc-section-accent .smc-btn-ghost {
    background: #ffffff;
    color: var(--smc-ui-accent);
    border: none;
    box-shadow: 0 8px 18px rgba(6, 60, 120, 0.16);
}

/* Bubbles are injected by smc-ui.js into every .smc-section-accent */
.smc-ui-bubbles {
    display: none;
    position: absolute;
    inset: 0;
    overflow: hidden;
    border-radius: inherit;
    pointer-events: none;
}

.smc-ui-bubbles i {
    position: absolute;
    bottom: -60px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.4);
    background: radial-gradient(circle at 32% 30%, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.12) 38%, rgba(255, 255, 255, 0.04) 70%);
    opacity: 0;
}

.smc-ui-bubbles i:nth-child(1) { left: 6%;  width: 26px; height: 26px; animation-duration: 9s;  animation-delay: 0s; }
.smc-ui-bubbles i:nth-child(2) { left: 21%; width: 14px; height: 14px; animation-duration: 7s;  animation-delay: 2.2s; }
.smc-ui-bubbles i:nth-child(3) { left: 44%; width: 34px; height: 34px; animation-duration: 11s; animation-delay: 1s; }
.smc-ui-bubbles i:nth-child(4) { left: 63%; width: 18px; height: 18px; animation-duration: 8s;  animation-delay: 3.4s; }
.smc-ui-bubbles i:nth-child(5) { left: 79%; width: 42px; height: 42px; animation-duration: 12s; animation-delay: 0.6s; }
.smc-ui-bubbles i:nth-child(6) { left: 92%; width: 12px; height: 12px; animation-duration: 7s;  animation-delay: 4.2s; }

@media (prefers-reduced-motion: no-preference) {
    .smc-ui-bubbles {
        display: block;
    }

    .smc-ui-bubbles i {
        animation-name: smc-ui-bubble;
        animation-timing-function: linear;
        animation-iteration-count: infinite;
    }

    /* One sheen across the block when it scrolls in */
    .smc-ui .smc-section-accent::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: -40%;
        width: 35%;
        background: linear-gradient(100deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.28) 50%, rgba(255, 255, 255, 0) 100%);
        transform: skewX(-18deg);
        pointer-events: none;
    }

    .smc-ui-anim .smc-section-accent.is-in::after {
        animation: smc-ui-sheen 1.4s cubic-bezier(0.65, 0, 0.35, 1) 0.4s both;
    }
}

@keyframes smc-ui-bubble {
    0%   { opacity: 0; transform: translate(0, 0) scale(0.7); }
    12%  { opacity: 1; }
    50%  { transform: translate(10px, -170px) scale(1); }
    85%  { opacity: 0.8; }
    100% { opacity: 0; transform: translate(-6px, -340px) scale(1.05); }
}

@keyframes smc-ui-sheen {
    from { left: -40%; }
    to   { left: 120%; }
}

/* ============================================================
   8. SCROLL REVEAL (classes set by smc-ui.js; content stays visible without JS)
   ============================================================ */

@media (prefers-reduced-motion: no-preference) {
    .smc-ui-anim [data-reveal],
    .smc-ui-anim [data-reveal-group] > * {
        opacity: 0;
        transform: translateY(22px);
        filter: blur(4px);
        transition: opacity 0.8s var(--smc-ui-ease), transform 0.8s var(--smc-ui-ease), filter 0.8s ease;
        transition-delay: var(--smc-ui-delay, 0s);
    }

    .smc-ui-anim [data-reveal].is-in,
    .smc-ui-anim [data-reveal-group].is-in > * {
        opacity: 1;
        transform: none;
        filter: none;
    }

    /* After the reveal, hover transitions run at their own speed */
    .smc-ui-anim [data-reveal].is-done {
        transition: transform 0.28s var(--smc-ui-ease), box-shadow 0.28s ease, border-color 0.28s ease;
    }

    .smc-ui-anim [data-reveal-group].is-in > *:nth-child(2) { transition-delay: 0.08s; }
    .smc-ui-anim [data-reveal-group].is-in > *:nth-child(3) { transition-delay: 0.16s; }
    .smc-ui-anim [data-reveal-group].is-in > *:nth-child(4) { transition-delay: 0.24s; }

    .smc-ui-anim [data-reveal-group].is-in .smc-card-icon {
        animation: smc-ui-pop 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) both;
    }

    .smc-ui-anim [data-reveal-group].is-in > *:nth-child(1) .smc-card-icon { animation-delay: 0.15s; }
    .smc-ui-anim [data-reveal-group].is-in > *:nth-child(2) .smc-card-icon { animation-delay: 0.23s; }
    .smc-ui-anim [data-reveal-group].is-in > *:nth-child(3) .smc-card-icon { animation-delay: 0.31s; }
    .smc-ui-anim [data-reveal-group].is-in > *:nth-child(4) .smc-card-icon { animation-delay: 0.39s; }
}

@keyframes smc-ui-pop {
    from { transform: scale(0.6); opacity: 0; }
    to   { transform: none; opacity: 1; }
}

/* ============================================================
   9. HOVER (only where a real pointer exists, so phones never stick)
   ============================================================ */

@media (hover: hover) {
    .smc-ui .smc-btn-primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 16px 32px rgba(45, 182, 255, 0.34);
    }

    .smc-ui a.smc-card:hover,
    .smc-ui .smc-card:not(.smc-review-card):hover,
    .smc-ui .smc-addon-card:hover,
    .smc-ui .smc-careers-job:hover {
        transform: translateY(-4px);
        border-color: rgba(45, 182, 255, 0.45);
        box-shadow: var(--smc-ui-shadow-hover);
    }

    .smc-ui .smc-faq-item:hover {
        border-color: rgba(45, 182, 255, 0.45);
    }

    .smc-ui .smc-card:hover .smc-card-icon {
        transform: translateY(-2px) rotate(-4deg);
        box-shadow: 0 12px 24px rgba(45, 182, 255, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.35);
    }

    .smc-ui .smc-link-arrow:hover,
    .smc-ui .smc-card-service-link:hover .smc-link-arrow {
        transform: translateX(4px);
    }
}

/* ============================================================
   9b. FORM FIELDS (all public pages: contact, request, community care)
   ============================================================ */

.smc-ui .smc-input,
.smc-ui .smc-select,
.smc-ui .smc-textarea {
    border-radius: 12px;
    border: 1px solid #d6e0eb;
    color: var(--smc-ui-ink);
    background-color: #ffffff;
}

.smc-ui .smc-input:focus,
.smc-ui .smc-select:focus,
.smc-ui .smc-textarea:focus {
    border-color: var(--smc-ui-accent);
    box-shadow: 0 0 0 3px rgba(45, 182, 255, 0.15);
    outline: none;
}

.smc-ui .smc-form-label {
    color: var(--smc-ui-ink);
}

.smc-ui .smc-plan-option {
    border-radius: 16px;
    border: 1px solid #d6e0eb;
}

.smc-ui .smc-plan-option.smc-plan-option-active {
    border-color: var(--smc-ui-accent);
    background: var(--smc-ui-accent-soft);
    box-shadow: 0 0 0 3px rgba(45, 182, 255, 0.12);
}

.smc-ui input[type="checkbox"],
.smc-ui input[type="radio"] {
    accent-color: var(--smc-ui-accent);
}

/* ============================================================
   9b2. CAREERS (/careers/ list, job window, ?apply= questionnaire)
   Same heading, surfaces and form look as the other public pages and /request/.
   ============================================================ */

/* List: heading spacing like services, about, contact */
.smc-ui .smc-careers-page {
    padding-top: 0;
}

.smc-ui .smc-careers-hero {
    margin-bottom: 0;
    padding: 4.4rem 0 2.2rem;
}

.smc-ui .smc-careers-badge {
    border-color: var(--smc-ui-accent-line);
    background: var(--smc-ui-accent-soft);
    color: #2a4a6b;
    font-weight: 600;
}

.smc-ui .smc-careers-section-head {
    margin-bottom: 1rem;
}

/* Job card facts: calm chips, not heavy pills */
.smc-ui .smc-careers-pill {
    border-color: var(--smc-ui-border);
    background: #f7fafd;
    color: var(--smc-ui-ink);
    font-weight: 600;
}

.smc-ui .smc-careers-job-company,
.smc-ui .smc-careers-job-footnote {
    font-weight: 500;
    color: var(--smc-ui-muted);
}

.smc-ui .smc-careers-job-footnote strong {
    font-weight: 600;
    color: var(--smc-ui-ink);
}

.smc-ui .smc-careers-job-summary {
    color: var(--smc-ui-text);
}

.smc-ui .smc-careers-job {
    padding: 22px;
}

/* Sidebar: one card with sections (no cards inside a card), card titles with a blue disc */
.smc-ui .smc-careers-sidebar-card {
    padding: 22px;
}

.smc-ui .smc-careers-info {
    gap: 0;
}

.smc-ui .smc-careers-infoblock {
    padding: 16px 0;
    border: 0;
    border-top: 1px solid var(--smc-ui-border);
    border-radius: 0;
    background: transparent;
}

.smc-ui .smc-careers-infoblock:first-child {
    padding-top: 4px;
    border-top: 0;
}

.smc-ui .smc-careers-infoblock h3 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 10px;
    font-size: 0.98rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    text-transform: none;
    color: var(--smc-ui-ink);
}

.smc-ui .smc-careers-info-icon {
    flex: 0 0 auto;
    display: inline-grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: var(--smc-ui-gradient);
    color: #ffffff;
    box-shadow: 0 6px 14px rgba(45, 182, 255, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.smc-ui .smc-careers-infoblock p,
.smc-ui .smc-careers-infoblock li {
    font-size: 0.9rem;
    line-height: 1.6;
    color: var(--smc-ui-text);
}

.smc-ui .smc-careers-contact {
    margin-top: 4px;
    padding-top: 16px;
    border-top: 1px solid var(--smc-ui-border);
}

.smc-ui .smc-careers-contact-title {
    font-size: 0.98rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    text-transform: none;
    color: var(--smc-ui-ink);
}

.smc-ui .smc-careers-empty {
    border: 1px solid var(--smc-ui-border);
    border-radius: var(--smc-ui-radius);
    box-shadow: var(--smc-ui-shadow);
}

.smc-ui .smc-careers-empty-title {
    font-weight: 700;
    color: var(--smc-ui-ink);
}

/* Job window: the site surface, normal section titles */
.smc-ui .smc-careers-modal-card {
    border: 1px solid var(--smc-ui-border);
    border-radius: 24px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 30px 70px rgba(15, 50, 90, 0.18);
}

.smc-ui .smc-careers-modal-card::before,
.smc-ui .smc-ja-card::before {
    display: none;
}

.smc-ui .smc-careers-modal-body h2 {
    font-size: 1.15rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--smc-ui-ink);
}

.smc-ui .smc-careers-modal-body h3 {
    margin: 20px 0 8px;
    font-size: 0.98rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    text-transform: none;
    color: var(--smc-ui-ink);
}

.smc-ui .smc-careers-modal-body p,
.smc-ui .smc-careers-modal-body li {
    color: var(--smc-ui-text);
}

.smc-ui .smc-careers-key-details,
.smc-ui .smc-careers-form-note {
    border-color: var(--smc-ui-accent-line);
    background: var(--smc-ui-accent-soft);
}

.smc-ui .smc-careers-meta-label {
    font-weight: 600;
    color: var(--smc-ui-muted);
}

/* Questionnaire: page heading above the card, the card and steps like /request/ */
.smc-ui .smc-ja-page {
    padding-top: 2.4rem;
}

.smc-ui .smc-ja-pagehead {
    max-width: var(--smc-careers-max, 1120px);
    margin: 0 auto 1.6rem;
}

.smc-ui .smc-ja-pagehead .smc-ja-title {
    margin: 0 0 0.9rem;
    font-size: clamp(1.35rem, 1.6vw, 1.5rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: var(--smc-ui-ink);
}

.smc-ui .smc-ja-pagehead .smc-ja-sub {
    max-width: 46em;
    margin: 0;
    font-size: 1.02rem;
    line-height: 1.7;
    color: var(--smc-ui-text);
}

.smc-ui .smc-ja-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.smc-ui .smc-ja-card {
    border-radius: 24px;
    border: 1px solid var(--smc-ui-border);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03), 0 24px 60px rgba(15, 50, 90, 0.10);
}

.smc-ui .smc-ja-progress {
    margin-top: 0;
}

.smc-ui .smc-ja-progress-bar {
    background: var(--smc-ui-gradient);
}

.smc-ui .smc-ja-steps {
    gap: 4px;
    padding: 8px;
    border-radius: 18px;
    border: 1px solid var(--smc-ui-border);
    background: #f8fbff;
}

.smc-ui .smc-ja-step-dot {
    padding: 6px 10px 6px 6px;
    border: 1px solid transparent;
    border-radius: 12px;
    font-weight: 700;
    color: var(--smc-ui-muted);
    transition: background-color 0.24s ease, border-color 0.24s ease, box-shadow 0.24s ease, color 0.24s ease;
}

.smc-ui .smc-ja-step-num {
    background: #ffffff;
    border: 1px solid #d6e0eb;
    color: var(--smc-ui-muted);
    font-weight: 700;
}

.smc-ui .smc-ja-step-dot.is-current {
    background: #ffffff;
    border-color: var(--smc-ui-accent-line);
    color: var(--smc-ui-ink);
    box-shadow: 0 6px 16px rgba(15, 50, 90, 0.08);
}

.smc-ui .smc-ja-step-dot.is-current .smc-ja-step-num {
    background: var(--smc-ui-gradient);
    border-color: transparent;
    color: #ffffff;
    box-shadow: 0 6px 14px rgba(45, 182, 255, 0.28);
}

.smc-ui .smc-ja-step-dot.is-done {
    color: var(--smc-ui-ink);
}

.smc-ui .smc-ja-step-dot.is-done .smc-ja-step-num {
    background: #e1f1ff;
    border-color: transparent;
    color: var(--smc-ui-accent);
}

.smc-ui .smc-ja-h {
    font-size: 1.05rem;
    letter-spacing: -0.02em;
    color: var(--smc-ui-ink);
}

.smc-ui .smc-ja-intro,
.smc-ui .smc-ja-hint {
    color: var(--smc-ui-text);
}

.smc-ui .smc-ja-job {
    border: 1px solid var(--smc-ui-border);
    border-radius: var(--smc-ui-radius);
    box-shadow: var(--smc-ui-shadow);
}

.smc-ui .smc-ja-job-title {
    font-size: 1.02rem;
    font-weight: 700;
    color: var(--smc-ui-ink);
}

.smc-ui .smc-ja-notices,
.smc-ui .smc-ja-sum {
    border-color: var(--smc-ui-border);
}

/* Entrance: the same rise as every public page heading */
@media (prefers-reduced-motion: no-preference) {
    .smc-ui .smc-ja-pagehead > * {
        animation: smc-ui-rise 0.9s var(--smc-ui-ease) both;
    }

    .smc-ui .smc-ja-pagehead > :nth-child(2) { animation-delay: 0.07s; }

    .smc-ui .smc-careers-hero > :nth-child(n+4) { animation-delay: 0.21s; }
}

@media (max-width: 640px) {
    .smc-ui .smc-careers-hero {
        padding: 2.4rem 0 1.4rem;
    }

    .smc-ui .smc-ja-page {
        padding-top: 1.6rem;
    }

    .smc-ui .smc-ja-pagehead .smc-ja-title {
        font-size: 1.3rem;
        line-height: 1.2;
    }

    .smc-ui .smc-careers-job,
    .smc-ui .smc-careers-sidebar-card {
        padding: 18px;
    }
}

/* ============================================================
   9c. REQUEST FORM (/request/ and /community-care/ share .smc-request)
   ============================================================ */

.smc-ui .smc-request {
    padding-top: calc(4.4rem + env(safe-area-inset-top));
    background:
        radial-gradient(1100px 520px at 100% -8%, rgba(45, 182, 255, 0.10), rgba(45, 182, 255, 0) 65%),
        linear-gradient(180deg, #f7fbff 0%, #ffffff 520px);
}

/* Heading and form card share one left edge */
:is(.smc-ui, body .smc-account-page) .smc-request .smc-page-header.smc-request-header {
    max-width: none;
    margin: 0 0 1.6rem;
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-page-title {
    margin: 0 0 0.9rem;
    font-size: clamp(1.35rem, 1.6vw, 1.5rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: var(--smc-ui-ink);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-page-subtitle {
    max-width: 46em;
    font-size: 1.02rem;
    line-height: 1.7;
    color: var(--smc-ui-text);
}

@media (prefers-reduced-motion: no-preference) {
    :is(.smc-ui, body .smc-account-page) .smc-request-header > * {
        animation: smc-ui-rise 0.9s var(--smc-ui-ease) both;
    }

    :is(.smc-ui, body .smc-account-page) .smc-request-header > :nth-child(2) { animation-delay: 0.07s; }

    /* No transform animation on the form card: it holds fixed dialogs (confirm, legal reader),
       and an animated transform would trap them inside the card */
}

/* The form card */
:is(.smc-ui, body .smc-account-page) .smc-request .smc-request-form {
    border-radius: 24px;
    border: 1px solid var(--smc-ui-border);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03), 0 24px 60px rgba(15, 50, 90, 0.10);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-request-form::before,
:is(.smc-ui, body .smc-account-page) .smc-request .smc-confirm-card::before {
    display: none;
}

/* Steps: blue numbers, the current one filled; done steps stay calm blue (no green) */
:is(.smc-ui, body .smc-account-page) .smc-request .smc-form-steps {
    padding: 8px;
    border-radius: 18px;
    border: 1px solid var(--smc-ui-border);
    background: #f8fbff;
    box-shadow: none;
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-form-step {
    border: 1px solid transparent;
    background: transparent;
    color: var(--smc-ui-muted);
    font-weight: 700;
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-form-step-number {
    background: #ffffff;
    border: 1px solid #d6e0eb;
    color: var(--smc-ui-muted);
    font-weight: 700;
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-form-step.is-active {
    background: #ffffff;
    border-color: var(--smc-ui-accent-line);
    color: var(--smc-ui-ink);
    box-shadow: 0 6px 16px rgba(15, 50, 90, 0.08);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-form-step.is-active .smc-form-step-number {
    background: var(--smc-ui-gradient);
    border-color: transparent;
    color: #ffffff;
    box-shadow: 0 6px 14px rgba(45, 182, 255, 0.28);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-form-step.is-complete {
    background: transparent;
    border-color: transparent;
    color: var(--smc-ui-ink);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-form-step.is-complete .smc-form-step-number {
    background: #e1f1ff;
    border-color: transparent;
    color: var(--smc-ui-accent);
}

/* Section titles inside the form */
:is(.smc-ui, body .smc-account-page) .smc-request .smc-form-section-title {
    font-size: 1.05rem;
    letter-spacing: -0.02em;
    color: var(--smc-ui-ink);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-plan-block-title {
    color: var(--smc-ui-ink);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-plan-small-help,
:is(.smc-ui, body .smc-account-page) .smc-request .smc-plan-block-help,
:is(.smc-ui, body .smc-account-page) .smc-request .smc-plan-option-note {
    color: var(--smc-ui-text);
}

/* Add-on tiles */
:is(.smc-ui, body .smc-account-page) .smc-request .smc-addons-grid label {
    border-color: var(--smc-ui-border);
    border-radius: 14px;
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-addons-grid label:has(input:checked) {
    border-color: var(--smc-ui-accent-line);
    background: var(--smc-ui-accent-soft);
}

/* Soft blue panels: time window and the estimate */
:is(.smc-ui, body .smc-account-page) .smc-request .smc-plan-block-time,
:is(.smc-ui, body .smc-account-page) .smc-request .smc-estimate {
    border-radius: 18px;
    border: 1px solid var(--smc-ui-accent-line);
    background: var(--smc-ui-accent-soft);
}

/* The estimate is the moment of truth: big, calm numbers */
:is(.smc-ui, body .smc-account-page) .smc-request .smc-estimate {
    padding: 1.2rem 1.25rem 1.1rem;
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-estimate-title {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--smc-ui-ink);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-estimate-stats {
    gap: 2rem;
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-estimate-stat-label {
    color: var(--smc-ui-muted);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-estimate-stat-value {
    font-size: 1.15rem;
    letter-spacing: -0.02em;
    color: var(--smc-ui-ink);
}

/* The price is blue in every estimate block (step 2 and its step 3 copy) */
:is(.smc-ui, body .smc-account-page) .smc-request #smc-estimate-amount,
:is(.smc-ui, body .smc-account-page) .smc-request #smc-estimate-amount-step3 {
    color: var(--smc-ui-accent);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-estimate-breakdown {
    border-color: var(--smc-ui-border);
    background: #ffffff;
}

/* Layout: form on the left, live summary on the right (desktop); summary below the form on phones */
:is(.smc-ui, body .smc-account-page) .smc-request .smc-request-wrapper {
    max-width: 1120px;
}

@media (min-width: 1024px) {
    :is(.smc-ui, body .smc-account-page) .smc-request .smc-request-wrapper:has(.smc-rq-summary) {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 320px;
        column-gap: 28px;
        align-items: start;
    }

    :is(.smc-ui, body .smc-account-page) .smc-request .smc-request-header {
        grid-column: 1 / -1;
    }

    :is(.smc-ui, body .smc-account-page) .smc-request .smc-request-form {
        grid-column: 1;
    }

    .smc-ui .smc-rq-summary {
        grid-column: 2;
        grid-row: 2;
        position: sticky;
        top: 100px;
    }
}

.smc-rq-summary {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-top: 0;
}

@media (max-width: 1023px) {
    .smc-rq-summary {
        margin-top: 18px;
    }

    /* On phones the price lives in the bottom bar; keep only "What happens next" here */
    .smc-rq-summary > .smc-rq-card:first-child {
        display: none;
    }
}

.smc-rq-card {
    padding: 1.2rem 1.25rem;
    border-radius: var(--smc-ui-radius);
    border: 1px solid var(--smc-ui-border);
    background: #ffffff;
    box-shadow: var(--smc-ui-shadow);
}

.smc-rq-label {
    margin: 0 0 0.5rem;
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--smc-ui-accent);
}

.smc-rq-service {
    margin: 0 0 0.9rem;
    font-size: 0.98rem;
    font-weight: 700;
    color: var(--smc-ui-ink);
}

.smc-rq-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    padding: 0.85rem 0;
    border-top: 1px solid var(--smc-ui-border);
    border-bottom: 1px solid var(--smc-ui-border);
}

.smc-rq-stat {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.smc-rq-stat span {
    font-size: 0.76rem;
    color: var(--smc-ui-muted);
}

.smc-rq-stat strong {
    display: inline-block;
    font-size: 1.25rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--smc-ui-ink);
}

.smc-rq-stat .smc-rq-price {
    color: var(--smc-ui-accent);
}

.smc-rq-empty,
.smc-rq-fine {
    margin: 0.75rem 0 0;
    font-size: 0.82rem;
    line-height: 1.55;
    color: var(--smc-ui-text);
}

.smc-rq-empty[hidden] {
    display: none;
}

.smc-rq-next-list {
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: rq;
    display: grid;
    gap: 0.7rem;
}

.smc-rq-next-list li {
    position: relative;
    padding-left: 2.1rem;
    font-size: 0.88rem;
    line-height: 1.5;
    color: var(--smc-ui-text);
    counter-increment: rq;
}

.smc-rq-next-list li::before {
    content: counter(rq);
    position: absolute;
    left: 0;
    top: -1px;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    background: #e1f1ff;
    color: var(--smc-ui-accent);
    font-size: 0.78rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

.smc-rq-call {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--smc-ui-border);
    font-size: 0.84rem;
    line-height: 1.35;
    color: var(--smc-ui-text);
    text-decoration: none;
}

.smc-rq-call strong {
    font-size: 0.95rem;
    color: var(--smc-ui-ink);
}

.smc-rq-call-icon {
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--smc-ui-gradient);
    color: #ffffff;
    box-shadow: 0 6px 14px rgba(45, 182, 255, 0.28);
}

.smc-rq-call-icon svg {
    width: 16px;
    height: 16px;
}

/* A value that just changed gives a small pulse, so the client notices the price react */
@media (prefers-reduced-motion: no-preference) {
    [data-rq-mirror].is-updated {
        animation: smc-rq-pulse 0.5s var(--smc-ui-ease);
    }
}

@keyframes smc-rq-pulse {
    0%   { transform: scale(1); }
    40%  { transform: scale(1.08); }
    100% { transform: scale(1); }
}

/* Mobile price bar */
.smc-rq-bar {
    display: none;
}

@media (max-width: 1023px) {
    .smc-ui .smc-request {
        padding-bottom: calc(110px + env(safe-area-inset-bottom));
    }

    .smc-rq-bar {
        position: fixed;
        left: 12px;
        right: 12px;
        bottom: calc(12px + env(safe-area-inset-bottom));
        z-index: 40;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        padding: 0.75rem 1rem;
        border-radius: 16px;
        border: 1px solid var(--smc-ui-border);
        background: rgba(255, 255, 255, 0.96);
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        box-shadow: 0 14px 34px rgba(15, 50, 90, 0.16);
        transform: translateY(140%);
        opacity: 0;
        pointer-events: none;
        transition: transform 0.4s var(--smc-ui-ease), opacity 0.3s ease;
    }

    .smc-rq-bar.is-visible {
        transform: none;
        opacity: 1;
    }

    /* Round floating buttons (scroll to top, chat) step up above the price bar while it is shown */
    .smc-scroll-top,
    #smc-cw-btn {
        transition: bottom 0.35s var(--smc-ui-ease), opacity 0.2s ease, transform 0.2s ease;
    }

    body:has(.smc-rq-bar.is-visible) .smc-scroll-top {
        bottom: calc(86px + env(safe-area-inset-bottom)) !important;
    }

    body:has(.smc-rq-bar.is-visible) #smc-cw-btn {
        bottom: calc(150px + env(safe-area-inset-bottom)) !important;
    }

    .smc-rq-bar-label {
        font-size: 0.8rem;
        color: var(--smc-ui-text);
    }

    .smc-rq-bar-values {
        display: inline-flex;
        align-items: baseline;
        gap: 0.5rem;
    }

    .smc-rq-bar-values strong {
        font-size: 1.15rem;
        font-weight: 800;
        color: var(--smc-ui-accent);
    }

    .smc-rq-bar-values span {
        font-size: 0.82rem;
        color: var(--smc-ui-muted);
    }
}

/* Quantities (add-ons, specific tasks, commercial extras): label on the left, one clear stepper on the right */
:is(.smc-ui, body .smc-account-page) .smc-request .smc-addon-cell--expanded > label {
    border-color: var(--smc-ui-accent-line);
    background: var(--smc-ui-accent-soft);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-form-row.smc-addons-extra {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding-left: 0.85rem;
    padding-right: 0.6rem;
    background: #ffffff;
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-addon-cell--expanded .smc-form-row.smc-addons-extra {
    border-color: var(--smc-ui-accent-line);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-addons-grid .smc-addons-extra .smc-form-label {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    background: none;
    box-shadow: none;
    font-size: 0.82rem;
    font-weight: 500;
    line-height: 1.35;
    text-align: left;
    color: var(--smc-ui-text);
    cursor: default;
    transform: none;
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-form-row.smc-addons-extra .smc-stepper {
    flex: 0 0 auto;
    min-width: 0;
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-stepper {
    height: 40px;
    border: 1px solid var(--smc-ui-border);
    border-radius: 12px;
    background: #ffffff;
    box-shadow: none;
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-stepper:focus-within {
    border-color: var(--smc-ui-accent);
    box-shadow: 0 0 0 3px rgba(45, 182, 255, 0.16);
    transform: none;
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-stepper-btn,
.smc-account-page .smc-request .smc-stepper-btn {
    width: 40px !important;
    min-width: 40px;
    height: 100%;
    border: none !important;
    background: var(--smc-ui-accent-soft) !important;
    color: #0a7cb8 !important;
    font-size: 1.15rem;
    font-weight: 700 !important;
    line-height: 1;
    transition: background-color 0.2s var(--smc-ui-ease), color 0.2s var(--smc-ui-ease), opacity 0.2s var(--smc-ui-ease);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-stepper-input {
    width: 48px;
    min-width: 48px;
    height: 100%;
    padding: 0 4px;
    font-size: 0.98rem;
    font-weight: 700;
    color: var(--smc-ui-ink);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-stepper.is-min .smc-stepper-btn-minus,
:is(.smc-ui, body .smc-account-page) .smc-request .smc-stepper.is-max .smc-stepper-btn-plus {
    background: #f6f9fc !important;
    color: #b9c4d0 !important;
    cursor: default;
}

@media (hover: hover) {
    :is(.smc-ui, body .smc-account-page) .smc-request .smc-stepper:not(.is-min) .smc-stepper-btn-minus:hover,
    :is(.smc-ui, body .smc-account-page) .smc-request .smc-stepper:not(.is-max) .smc-stepper-btn-plus:hover {
        background: #e1f1ff !important;
    }
}

/* Specific tasks: the row stays one line on phones too, stepper on the right */
:is(.smc-ui, body .smc-account-page) .smc-request .smc-task-row {
    border-color: var(--smc-ui-border);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-task-row:has(input[type="checkbox"]:checked) {
    border-color: var(--smc-ui-accent-line);
    background: var(--smc-ui-accent-soft);
}

@media (max-width: 768px) {
    :is(.smc-ui, body .smc-account-page) .smc-request .smc-task-row {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
    }

    :is(.smc-ui, body .smc-account-page) .smc-request .smc-task-qty {
        width: auto;
        margin-left: auto;
    }

    :is(.smc-ui, body .smc-account-page) .smc-request .smc-task-qty .smc-stepper {
        width: auto;
    }

    :is(.smc-ui, body .smc-account-page) .smc-request .smc-stepper-input {
        width: 48px;
    }
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-task-qty > span.smc-qty-unit:not(.is-generic) {
    display: inline;
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--smc-ui-muted);
    white-space: nowrap;
}

/* Worker quantity stepper (visit checklist, sticker extras) */
.smc-account-page .smc-stepper--qty {
    display: inline-flex;
    align-items: stretch;
    flex: 0 0 auto;
    height: 36px;
    margin-left: 0.5rem;
    border: 1px solid var(--smc-ui-border);
    border-radius: 11px;
    background: #ffffff;
    overflow: hidden;
    vertical-align: middle;
}

.smc-account-page .smc-stepper--qty:focus-within {
    border-color: var(--smc-ui-accent);
    box-shadow: 0 0 0 3px rgba(45, 182, 255, 0.16);
}

.smc-account-page .smc-stepper--qty .smc-stepper-btn {
    width: 36px;
    min-width: 36px;
    min-height: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    background: var(--smc-ui-accent-soft);
    color: #0a7cb8;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1;
    box-shadow: none;
    cursor: pointer;
}

.smc-account-page .smc-stepper--qty input.smc-stepper-input {
    width: 44px;
    min-width: 44px;
    min-height: 0;
    height: 100%;
    margin: 0;
    padding: 0 2px;
    border: none;
    border-radius: 0;
    background: #ffffff;
    box-shadow: none;
    font-size: 0.95rem;
    font-weight: 700;
    text-align: center;
    color: var(--smc-ui-ink);
    -moz-appearance: textfield;
    appearance: textfield;
}

.smc-account-page .smc-stepper--qty input.smc-stepper-input::-webkit-outer-spin-button,
.smc-account-page .smc-stepper--qty input.smc-stepper-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.smc-account-page .smc-stepper--qty input.smc-stepper-input:focus {
    outline: none;
    box-shadow: none;
}

.smc-account-page .smc-stepper--qty.is-min .smc-stepper-btn-minus,
.smc-account-page .smc-stepper--qty.is-max .smc-stepper-btn-plus {
    background: #f6f9fc;
    color: #b9c4d0;
    cursor: default;
}

body .smc-worker-checklist-view .smc-worker-svc-chip {
    width: 100%;
}

body .smc-worker-checklist-view .smc-worker-svc-chip .smc-stepper--qty {
    margin-left: auto;
}

.smc-account-page .smc-extras-add-row .smc-stepper--qty {
    height: 46px;
    margin-left: 0;
}

@media (max-width: 640px) {
    .smc-account-page .smc-stepper--qty {
        height: 42px;
    }

    .smc-account-page .smc-stepper--qty .smc-stepper-btn {
        width: 42px;
        min-width: 42px;
    }
}

/* Phones: bigger touch targets */
@media (max-width: 640px) {
    :is(.smc-ui, body .smc-account-page) .smc-request .smc-stepper {
        height: 44px;
    }

    :is(.smc-ui, body .smc-account-page) .smc-request .smc-stepper-btn,
    .smc-account-page .smc-request .smc-stepper-btn {
        width: 44px !important;
        min-width: 44px;
    }
}

/* Short description under the cleaning type */
:is(.smc-ui, body .smc-account-page) .smc-request .smc-rq-type-hint {
    margin: 0.5rem 0 0;
    font-size: 0.86rem;
    line-height: 1.5;
    color: var(--smc-ui-text);
}

/* Missing answer: field outlined, hint in words, one gentle shake */
:is(.smc-ui, body .smc-account-page) .smc-request .smc-field-error-msg {
    margin: 0.4rem 0 0;
    font-size: 0.84rem;
    font-weight: 500;
    color: #b91c1c;
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-check.is-error {
    border-radius: 10px;
    background: #fff5f5;
    box-shadow: 0 0 0 2px #fecaca;
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-check.is-error + .smc-field-error-msg {
    margin-bottom: 0.4rem;
}

@media (prefers-reduced-motion: no-preference) {
    :is(.smc-ui, body .smc-account-page) .smc-request [data-rq-hint] {
        animation: smc-rq-hint-in 0.35s var(--smc-ui-ease) both;
    }

    :is(.smc-ui, body .smc-account-page) .smc-request .smc-rq-shake {
        animation: smc-rq-shake 0.45s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
    }
}

@keyframes smc-rq-hint-in {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: none; }
}

@keyframes smc-rq-shake {
    10%, 90% { transform: translateX(-1px); }
    20%, 80% { transform: translateX(3px); }
    30%, 50%, 70% { transform: translateX(-5px); }
    40%, 60% { transform: translateX(5px); }
}

/* Confirm dialog: key terms before the final click */
:is(.smc-ui, body .smc-account-page) .smc-request .smc-confirm-terms {
    margin-top: 14px;
    padding: 1rem 1.1rem;
    border-radius: 16px;
    border: 1px solid var(--smc-ui-accent-line);
    background: var(--smc-ui-accent-soft);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-confirm-terms[hidden] {
    display: none;
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-confirm-terms-title {
    margin: 0 0 0.5rem;
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--smc-ui-ink);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-confirm-terms ul {
    margin: 0;
    padding-left: 1.1rem;
    display: grid;
    gap: 0.35rem;
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-confirm-terms li,
:is(.smc-ui, body .smc-account-page) .smc-request .smc-confirm-terms-meta {
    font-size: 0.84rem;
    line-height: 1.55;
    color: var(--smc-ui-text);
}

:is(.smc-ui, body .smc-account-page) .smc-request .smc-confirm-terms-meta {
    margin: 0.7rem 0 0;
    font-size: 0.78rem;
}

/* Confirm dialog */
:is(.smc-ui, body .smc-account-page) .smc-request .smc-confirm-card {
    border-radius: 24px;
    border-color: var(--smc-ui-border);
}

@media (hover: hover) {
    :is(.smc-ui, body .smc-account-page) .smc-request .smc-form-step:not(.is-active):hover {
        background: #ffffff;
        border-color: var(--smc-ui-border);
    }

    :is(.smc-ui, body .smc-account-page) .smc-request .smc-plan-option:hover,
    :is(.smc-ui, body .smc-account-page) .smc-request .smc-addons-grid label:hover {
        border-color: rgba(45, 182, 255, 0.45);
    }
}

@media (max-width: 640px) {
    .smc-ui .smc-request {
        padding-top: calc(2.4rem + env(safe-area-inset-top));
    }

    :is(.smc-ui, body .smc-account-page) .smc-request .smc-page-title {
        font-size: 1.3rem;
        line-height: 1.2;
    }

    :is(.smc-ui, body .smc-account-page) .smc-request .smc-request-form {
        border-radius: 20px;
    }

    :is(.smc-ui, body .smc-account-page) .smc-request .smc-estimate-stat-value {
        font-size: 1.25rem;
    }

    /* Promo code: field on its own line, button below at full width */
    :is(.smc-ui, body .smc-account-page) .smc-request .smc-estimate-promo .smc-form-row > div {
        flex-wrap: wrap;
    }

    :is(.smc-ui, body .smc-account-page) .smc-request .smc-estimate-promo .smc-input {
        flex: 1 1 100% !important;
        min-width: 0;
    }

    :is(.smc-ui, body .smc-account-page) .smc-request .smc-estimate-promo .smc-btn {
        flex: 1 1 100%;
        justify-content: center;
    }
}

/* ============================================================
   9d. LEGAL READER (checkboxes with data-legal-url, see smc-ui.js)
   ============================================================ */

.smc-legal-reader-lock,
.smc-legal-reader-lock body {
    overflow: hidden;
}

.smc-legal-reader {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: rgba(11, 18, 32, 0.45);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0s linear 0.25s;
}

.smc-legal-reader.is-open {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.25s ease;
}

.smc-legal-reader-card {
    width: min(720px, 100%);
    max-height: min(86vh, 820px);
    display: flex;
    flex-direction: column;
    border-radius: 22px;
    background: #ffffff;
    box-shadow: 0 30px 80px rgba(11, 18, 32, 0.30);
    overflow: hidden;
    transform: translateY(14px) scale(0.98);
    transition: transform 0.35s var(--smc-ui-ease);
}

.smc-legal-reader.is-open .smc-legal-reader-card {
    transform: none;
}

.smc-legal-reader-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--smc-ui-border);
}

.smc-legal-reader-title {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--smc-ui-ink);
}

.smc-legal-reader-close {
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: #f1f5f9;
    color: var(--smc-ui-ink);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.smc-legal-reader-body {
    flex: 1 1 auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding: 1.1rem 1.25rem 1.4rem;
    font-size: 0.9rem;
    line-height: 1.65;
    color: var(--smc-ui-text);
    outline: none;
}

.smc-legal-reader-body h2,
.smc-legal-reader-body h3 {
    margin: 1.2rem 0 0.4rem;
    font-size: 1rem;
    font-weight: 800;
    color: var(--smc-ui-ink);
}

.smc-legal-reader-body h2:first-child,
.smc-legal-reader-body section:first-child h2 {
    margin-top: 0;
}

.smc-legal-reader-body p {
    margin: 0 0 0.6rem;
}

.smc-legal-reader-body ul,
.smc-legal-reader-body ol {
    margin: 0 0 0.7rem;
    padding-left: 1.2rem;
}

.smc-legal-reader-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0.9rem 1.25rem calc(0.9rem + env(safe-area-inset-bottom));
    border-top: 1px solid var(--smc-ui-border);
    background: #fbfdff;
}

.smc-legal-reader-hint {
    margin: 0;
    font-size: 0.84rem;
    color: var(--smc-ui-muted);
}

.smc-legal-reader-hint.is-done {
    color: var(--smc-ui-accent);
    font-weight: 600;
}

.smc-legal-reader-agree[disabled] {
    opacity: 0.45;
    cursor: not-allowed;
    box-shadow: none;
    transform: none;
}

@media (max-width: 640px) {
    .smc-legal-reader {
        align-items: flex-end;
        padding: 0;
    }

    .smc-legal-reader-card {
        max-height: 92vh;
        border-radius: 22px 22px 0 0;
        transform: translateY(40px);
    }

    .smc-legal-reader-foot {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
    }

    .smc-legal-reader-agree {
        width: 100%;
        justify-content: center;
    }
}

/* ============================================================
   10. HEADER MOBILE MENU (site-wide)
   ============================================================ */

.smc-burger span {
    transition: transform 0.32s var(--smc-ui-ease), opacity 0.2s ease;
    transform-origin: center;
}

.smc-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.smc-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; transform: scaleX(0.2); }
.smc-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Menu tiles sit on the same edge as the logo and the page content */
@media (max-width: 860px) {
    .smc-mobile-menu {
        padding-left: 0;
        padding-right: 0;
    }
}

@media (max-width: 860px) and (prefers-reduced-motion: no-preference) {
    .smc-mobile-menu.is-open {
        animation: smc-ui-menu 0.36s var(--smc-ui-ease) both;
    }

    .smc-mobile-menu.is-open li,
    .smc-mobile-menu.is-open .smc-mobile-actions > * {
        animation: smc-ui-menu-item 0.42s var(--smc-ui-ease) both;
    }

    .smc-mobile-menu.is-open li:nth-child(1) { animation-delay: 0.04s; }
    .smc-mobile-menu.is-open li:nth-child(2) { animation-delay: 0.07s; }
    .smc-mobile-menu.is-open li:nth-child(3) { animation-delay: 0.10s; }
    .smc-mobile-menu.is-open li:nth-child(4) { animation-delay: 0.13s; }
    .smc-mobile-menu.is-open li:nth-child(5) { animation-delay: 0.16s; }
    .smc-mobile-menu.is-open li:nth-child(6) { animation-delay: 0.19s; }
    .smc-mobile-menu.is-open li:nth-child(7) { animation-delay: 0.22s; }
    .smc-mobile-menu.is-open li:nth-child(8) { animation-delay: 0.25s; }
    .smc-mobile-menu.is-open li:nth-child(n+9) { animation-delay: 0.28s; }
    .smc-mobile-menu.is-open .smc-mobile-actions > * { animation-delay: 0.3s; }
}

/* While collapsing, the entrance keyframes must not hold opacity at 1 */
.smc-mobile-menu.is-closing,
.smc-mobile-menu.is-closing li,
.smc-mobile-menu.is-closing .smc-mobile-actions > * {
    animation: none !important;
}

@keyframes smc-ui-menu {
    from { opacity: 0; transform: translateY(-10px); }
    to   { opacity: 1; transform: none; }
}

@keyframes smc-ui-menu-item {
    from { opacity: 0; transform: translateY(10px) scale(0.97); }
    to   { opacity: 1; transform: none; }
}

/* ============================================================
   12. ACCOUNT AREA (every page built on main.smc-account-page:
       client, commercial, worker, coordinator, admin)
   account.css keeps the structure; this layer sets the look through its own tokens.
   ============================================================ */

html:has(.smc-account-page),
body:has(.smc-account-page),
html:has(.smc-auth),
body:has(.smc-auth),
html:has(.smc-404),
body:has(.smc-404) {
    overflow-x: clip;
}

.smc-account-page,
.smc-auth,
.smc-404 {
    --smc-account-card-shadow: var(--smc-ui-shadow);
    --smc-account-card-topline: 0 solid transparent;
    --smc-account-title: var(--smc-ui-ink);
    --smc-account-text: var(--smc-ui-ink);
    --smc-account-muted: var(--smc-ui-text);
    --smc-account-focus: var(--smc-ui-accent);
    --smc-account-focus-ring: rgba(45, 182, 255, 0.18);
    --smc-account-border-soft: var(--smc-ui-border);
    padding-top: 3rem;
    background:
        radial-gradient(1100px 520px at 100% -8%, rgba(45, 182, 255, 0.10), rgba(45, 182, 255, 0) 65%),
        linear-gradient(180deg, #f7fbff 0%, #f8fafc 520px);
}

.smc-account-page .smc-container {
    padding-left: var(--smc-ui-gutter);
    padding-right: var(--smc-ui-gutter);
}

/* Cards: one surface, no top stripe */
.smc-account-page .smc-order-details,
.smc-account-page .smc-dashboard-card,
.smc-account-page .smc-profile-card,
.smc-account-page .smc-ws-dash-card,
.smc-account-nav,
.smc-auth .smc-auth-box,
.smc-404 .smc-404-box {
    border: 1px solid var(--smc-ui-border);
    box-shadow: var(--smc-ui-shadow);
}

.smc-account-page .smc-order-details::before,
.smc-account-nav::before,
.smc-auth .smc-auth-box::before,
.smc-404 .smc-404-box::before {
    display: none;
}

/* Side menu */
.smc-account-nav {
    padding: 22px 14px 18px;
}

.smc-account-nav-title {
    padding: 0 0.6rem;
    font-size: 0.72rem;
    letter-spacing: 0.1em;
    color: var(--smc-ui-muted);
}

.smc-account-nav li {
    margin-bottom: 2px;
}

.smc-account-nav a {
    background-color: transparent;
    color: var(--smc-ui-ink);
    font-weight: 500;
    border-radius: 12px;
}

.smc-account-nav .active,
.smc-account-nav a.active {
    background: var(--smc-ui-accent-soft);
    color: var(--smc-ui-ink);
    font-weight: 700;
    box-shadow: inset 3px 0 0 var(--smc-ui-accent);
}

.smc-account-nav a.smc-account-nav-workspace-btn {
    margin-top: 6px;
    justify-content: center;
    background: var(--smc-ui-gradient);
    color: #ffffff;
    font-weight: 700;
    box-shadow: 0 8px 18px rgba(45, 182, 255, 0.26);
}

.smc-account-nav a.smc-account-logout {
    background-color: transparent;
    color: #c0352b;
}

@media (hover: hover) {
    .smc-account-nav a:hover {
        background-color: #f2f8ff;
        transform: none;
    }

    .smc-account-nav a.smc-account-nav-workspace-btn:hover {
        background: var(--smc-ui-gradient);
        filter: brightness(1.04);
    }

    .smc-account-nav a.smc-account-logout:hover {
        background-color: #fff5f5;
    }
}

/* Page heading inside the account */
.smc-account-page .smc-dashboard-title {
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: -0.025em;
}

.smc-account-page .smc-dashboard-subtitle {
    font-size: 0.95rem;
    color: var(--smc-ui-text);
}

.smc-account-page .smc-order-details-title,
.smc-account-page .smc-order-block-title {
    letter-spacing: -0.02em;
    color: var(--smc-ui-ink);
}

/* Buttons */
.smc-account-page .smc-btn-primary,
.smc-auth .smc-btn-primary,
.smc-404 .smc-btn-primary {
    box-shadow: 0 8px 18px rgba(45, 182, 255, 0.24);
}

/* Lists as tables: calm rows instead of heavy floating pills */
.smc-account-page .smc-orders-table tr {
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    border-color: var(--smc-ui-border);
}

.smc-account-page .smc-orders-table th {
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    color: var(--smc-ui-muted);
}

@media (hover: hover) {
    .smc-account-page .smc-orders-table tbody tr:hover {
        transform: none;
        box-shadow: var(--smc-ui-shadow);
        border-color: rgba(45, 182, 255, 0.4);
    }
}

/* Status pills: confirmed and active speak the brand blue */
.smc-account-page .smc-status {
    font-weight: 600;
    letter-spacing: 0;
}

.smc-account-page .smc-status--confirmed,
.smc-account-page .smc-status--active {
    background-color: #e6f6ff;
    color: #0a7cb8;
}

/* Fields */
.smc-account-page .smc-input:focus,
.smc-account-page .smc-select:focus,
.smc-account-page .smc-textarea:focus,
.smc-auth .smc-input:focus {
    border-color: var(--smc-ui-accent);
    box-shadow: 0 0 0 3px rgba(45, 182, 255, 0.15);
}

/* Leftover old blues (sky #0ea5e9 / #0369a1 / #38bdf8) mapped to the brand blue */
.smc-account-page .smc-name-badge,
.smc-account-page .smc-sf-badge,
.smc-account-page .smc-ref-step-num,
.smc-account-page .smc-ws-dash-card-bar:not([style*="background"]) {
    background: var(--smc-ui-gradient);
}

.smc-account-page .smc-loy-progress-fill {
    background: var(--smc-ui-gradient);
}

.smc-account-page .page-numbers.current {
    border-color: var(--smc-ui-accent);
    background: var(--smc-ui-accent-soft);
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-address-card.is-default {
    border-color: var(--smc-ui-accent);
    box-shadow: 0 0 0 3px rgba(45, 182, 255, 0.12), var(--smc-ui-shadow);
}

.smc-account-page .smc-address-badge,
.smc-account-page .smc-wd-count,
.smc-account-page .smc-cal-tl-event-freq,
.smc-account-page .smc-wt-tag {
    color: #0a7cb8;
    background: var(--smc-ui-accent-soft);
    border-color: var(--smc-ui-accent-line);
}

.smc-account-page .smc-wt-avatar.smc-wt-tone-sky {
    color: #0a7cb8;
    border-color: var(--smc-ui-accent-line);
}

.smc-account-page .smc-calendar-dot {
    background: var(--smc-ui-accent);
}

.smc-account-page .smc-calendar-count {
    background: var(--smc-ui-accent-soft);
    border-color: var(--smc-ui-accent-line);
}

.smc-account-page .smc-wd-stat {
    background: #fbfdff;
    border-color: var(--smc-ui-border);
}

.smc-account-page .smc-report-list-item.has-unread {
    border-left-color: var(--smc-ui-accent);
}

.smc-account-page .stt-address a {
    color: #0a7cb8;
    border-color: currentColor;
}

/* 12a. Account dashboard (/account/) */

/* Order of importance: next cleaning, latest request, progress, quick actions */
.smc-account-main > .smc-dashboard-header { order: 0; }
.smc-account-main > .smc-dash-next        { order: 1; }
.smc-account-main > .smc-dash-latest      { order: 2; }
.smc-account-main > .smc-dash-progress    { order: 3; }
.smc-account-main > .smc-dash-actions     { order: 4; }

/* Admin, coordinator and worker: their progress statistics stay first */
.smc-account-main > .smc-dash-progress--staff { order: 1; }
.smc-account-main:has(.smc-dash-progress--staff) > .smc-dash-next { order: 2; }
.smc-account-main:has(.smc-dash-progress--staff) > .smc-dash-latest { order: 3; }

.smc-account-page .smc-account-main {
    gap: 1.25rem;
}

.smc-account-page .smc-dashboard-header {
    margin-bottom: 0.4rem;
}

.smc-account-page .smc-name-badge {
    font-size: 0.74rem;
    font-weight: 700;
    padding: 0.25rem 0.7rem;
}

.smc-account-page .smc-order-details {
    padding: 1.6rem 1.75rem;
}

.smc-account-page .smc-order-details-title {
    font-size: 1.15rem;
    font-weight: 800;
}

/* Next cleaning: the hero of the dashboard */
.smc-account-page .smc-next-card {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 1.4rem;
    align-items: start;
    border-color: var(--smc-ui-accent-line);
    background:
        radial-gradient(420px 200px at 100% 0%, rgba(45, 182, 255, 0.08), rgba(45, 182, 255, 0) 70%),
        #ffffff;
}

.smc-next-date {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 92px;
    padding: 0.7rem 0 0.8rem;
    border-radius: 18px;
    background: var(--smc-ui-gradient);
    color: #ffffff;
    box-shadow: 0 10px 22px rgba(45, 182, 255, 0.28);
    line-height: 1;
}

.smc-next-date-month {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.92;
}

.smc-next-date-day {
    margin: 0.3rem 0 0.25rem;
    font-size: 1.35rem;
    font-weight: 800;
    letter-spacing: -0.03em;
}

.smc-next-date-wday {
    font-size: 0.78rem;
    font-weight: 600;
    opacity: 0.92;
}

.smc-account-page .smc-next-label {
    margin: 0 0 0.35rem;
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--smc-ui-accent);
}

.smc-account-page .smc-next-when {
    margin: 0 0 0.35rem;
    font-size: 1.2rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--smc-ui-ink);
}

.smc-next-time {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0 0 1.1rem;
    font-size: 0.95rem;
    color: var(--smc-ui-text);
}

.smc-next-time svg {
    color: var(--smc-ui-accent);
}

.smc-account-page .smc-next-card .smc-order-action-btns {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem 0.9rem;
}

.smc-next-report {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--smc-ui-text);
    text-decoration: none;
}

.smc-next-note {
    margin: 0.85rem 0 0;
    font-size: 0.78rem;
    color: var(--smc-ui-muted);
}

.smc-next-note a {
    color: inherit;
    text-decoration: underline;
}

/* Latest request: facts in a calm grid, price in brand blue */
.smc-account-page .smc-dash-latest .smc-order-block-title {
    margin: -0.4rem 0 1rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--smc-ui-muted);
}

.smc-account-page .smc-dash-latest .smc-order-def-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem 1.5rem;
}

.smc-account-page .smc-dash-latest .smc-order-row {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.smc-account-page .smc-dash-latest .smc-order-row dt,
.smc-account-page .smc-dash-latest .smc-order-row dd {
    padding: 0;
    border: none;
    margin: 0;
}

.smc-account-page .smc-dash-latest .smc-order-row dt {
    font-size: 0.76rem;
    font-weight: 500;
    color: var(--smc-ui-muted);
    line-height: 1.3;
}

.smc-account-page .smc-dash-latest .smc-order-row dd {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-dash-latest .smc-order-row--price dd {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--smc-ui-accent);
}

.smc-account-page .smc-dash-latest .smc-order-action-block {
    margin-top: 1.3rem;
    padding-top: 1.1rem;
    border-top: 1px solid var(--smc-ui-border);
}

/* Progress / loyalty */
.smc-account-page .smc-loy-tier-name {
    font-size: 1.25rem;
    letter-spacing: -0.02em;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-loy-tier-sub,
.smc-account-page .smc-loy-progress-msg {
    color: var(--smc-ui-text);
}

.smc-account-page .smc-loy-progress-track {
    height: 8px;
    background: #eaf1f8;
}

@media (prefers-reduced-motion: no-preference) {
    .smc-account-page .smc-loy-progress-fill {
        animation: smc-acc-grow 1.1s var(--smc-ui-ease) 0.2s both;
        transform-origin: left center;
    }
}

@keyframes smc-acc-grow {
    from { transform: scaleX(0); }
    to   { transform: scaleX(1); }
}

/* Quick actions: icon, title, text, arrow */
.smc-account-page .smc-dashboard-cards {
    gap: 1rem;
    margin-top: 0;
}

.smc-account-page .smc-dashboard-card {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 1.3rem 1.3rem 1.2rem;
    border: 1px solid var(--smc-ui-border);
    box-shadow: var(--smc-ui-shadow);
    transition: transform 0.28s var(--smc-ui-ease), box-shadow 0.28s ease, border-color 0.28s ease;
}

.smc-account-page .smc-dashboard-card::after {
    content: "";
    position: absolute;
    top: 1.35rem;
    right: 1.2rem;
    width: 8px;
    height: 8px;
    border-top: 2px solid var(--smc-ui-muted);
    border-right: 2px solid var(--smc-ui-muted);
    transform: rotate(45deg);
    transition: transform 0.25s var(--smc-ui-ease), border-color 0.25s ease;
}

.smc-dash-ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-bottom: 0.8rem;
    border-radius: 12px;
    background: var(--smc-ui-gradient);
    color: #ffffff;
    box-shadow: 0 6px 14px rgba(45, 182, 255, 0.26);
}

.smc-dash-ico svg {
    width: 20px;
    height: 20px;
}

.smc-account-page .smc-dashboard-card .smc-order-block-title {
    margin: 0 0 0.3rem;
    font-size: 1rem;
}

.smc-account-page .smc-dashboard-card .smc-dashboard-subtitle {
    font-size: 0.88rem;
    line-height: 1.5;
}

@media (hover: hover) {
    .smc-account-page .smc-dashboard-card:hover {
        transform: translateY(-3px);
        background-color: #ffffff;
        border-color: rgba(45, 182, 255, 0.45);
        box-shadow: var(--smc-ui-shadow-hover);
    }

    .smc-account-page .smc-dashboard-card:hover::after {
        border-color: var(--smc-ui-accent);
        transform: translateX(3px) rotate(45deg);
    }

    .smc-next-report:hover {
        color: var(--smc-ui-ink);
    }
}

@media (max-width: 900px) {
    .smc-account-page .smc-dashboard-cards {
        grid-template-columns: 1fr;
    }

    .smc-account-page .smc-dashboard-card {
        display: grid;
        grid-template-columns: 40px minmax(0, 1fr);
        column-gap: 0.9rem;
        padding-right: 2.5rem;
    }

    .smc-account-page .smc-dashboard-card .smc-dash-ico {
        grid-row: 1 / span 2;
        margin: 0;
    }

    .smc-account-page .smc-dashboard-card::after {
        top: 50%;
        margin-top: -4px;
    }

    .smc-account-page .smc-dash-latest .smc-order-def-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .smc-account-page .smc-order-details {
        padding: 1.25rem 1.15rem;
    }

    .smc-account-page .smc-next-card {
        grid-template-columns: 72px minmax(0, 1fr);
        gap: 1rem;
    }

    .smc-next-date {
        width: 72px;
        border-radius: 16px;
    }

    .smc-next-date-day {
        font-size: 1.25rem;
    }

    .smc-account-page .smc-next-when {
        font-size: 1.05rem;
    }

    .smc-account-page .smc-next-card .smc-order-action-btns {
        grid-column: 1 / -1;
    }

    .smc-account-page .smc-next-card .smc-order-action-btns .smc-btn {
        flex: 1 1 auto;
        justify-content: center;
    }
}

/* 12b. Lists (my requests, all requests, invoices, clients, task history, paystubs, visits, loyalty) */

.smc-account-page .smc-orders-title {
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: -0.025em;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-orders-subtitle,
.smc-account-page .smc-orders-summary {
    font-size: 0.9rem;
    color: var(--smc-ui-text);
}

/* Search and filters: one height, one radius */
.smc-account-page .smc-sf-search-wrap {
    min-height: 44px;
    border-radius: 12px !important;
    border: 1px solid #d6e0eb !important;
    background: #ffffff !important;
    box-shadow: none !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.smc-account-page .smc-sf-search-wrap:focus-within {
    border-color: var(--smc-ui-accent) !important;
    box-shadow: 0 0 0 3px rgba(45, 182, 255, 0.15) !important;
}

.smc-account-page .smc-sf-toggle {
    height: 44px !important;
    border-radius: 12px !important;
    border-color: #d6e0eb !important;
    box-shadow: none !important;
    color: var(--smc-ui-ink) !important;
}

.smc-account-page .smc-sf-toggle[aria-expanded="true"] {
    background: var(--smc-ui-accent-soft) !important;
    border-color: var(--smc-ui-accent) !important;
}

.smc-account-page .smc-sf-panel {
    border-radius: 14px;
    border: 1px solid var(--smc-ui-border);
    background: #fbfdff;
}

/* Desktop table: flat rows with hairlines, a light hover, compact actions in one line */
.smc-account-page .smc-orders-table {
    min-width: 640px;
    border-collapse: collapse;
    border-spacing: 0;
}

.smc-account-page .smc-orders-table th {
    padding: 0.7rem 0.9rem;
    border-bottom: 1px solid var(--smc-ui-border);
}

.smc-account-page .smc-orders-table tbody tr {
    background: transparent;
    box-shadow: none;
    border-radius: 0;
}

.smc-account-page .smc-orders-table td {
    padding: 0.85rem 0.9rem;
    border-bottom: 1px solid var(--smc-ui-border);
    font-size: 0.9rem;
    vertical-align: middle;
}

.smc-account-page .smc-orders-table td a:not(.smc-btn) {
    color: var(--smc-ui-ink) !important;
    text-decoration: none !important;
}

.smc-account-page .smc-orders-table td:first-child strong,
.smc-account-page .smc-orders-table td:first-child > a {
    white-space: nowrap;
}

.smc-account-page .smc-orders-table td:last-child > div {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.smc-account-page .smc-orders-table td .smc-btn {
    display: inline-flex;
    width: auto;
    min-height: 34px;
    margin: 0 0.3rem 0 0 !important;
    padding: 0.35rem 0.9rem;
    font-size: 0.82rem;
    border-radius: 999px;
}

.smc-account-page .smc-orders-table td .smc-btn:last-child {
    margin-right: 0 !important;
}

.smc-account-page .smc-orders-table td .smc-btn-neutral,
.smc-account-page .smc-order-card-actions .smc-btn-neutral {
    background: #ffffff;
    border: 1px solid #d6e0eb;
    color: var(--smc-ui-ink);
}

@media (hover: hover) {
    .smc-account-page .smc-orders-table tbody tr:hover {
        background: #f7fbff;
        box-shadow: none;
    }

    .smc-account-page .smc-orders-table td a:not(.smc-btn):hover {
        color: #0a7cb8 !important;
    }

    .smc-account-page .smc-orders-table td .smc-btn-neutral:hover,
    .smc-account-page .smc-order-card-actions .smc-btn-neutral:hover {
        border-color: var(--smc-ui-accent);
        background: #ffffff;
    }
}

/* Pagination */
.smc-account-page .smc-pagination a,
.smc-account-page .smc-pagination span {
    border-radius: 10px;
    border-color: var(--smc-ui-border);
}

/* Phone cards */
.smc-account-page .smc-order-card {
    gap: 0.45rem;
    padding: 1rem 1rem 0.95rem;
    border-radius: 16px;
    border: 1px solid var(--smc-ui-border);
    box-shadow: var(--smc-ui-shadow);
}

.smc-account-page .smc-order-card-num {
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-order-card-service {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-order-card-meta,
.smc-account-page .smc-order-card-meta a,
.smc-account-page .smc-order-card-address,
.smc-account-page .smc-order-card-address a {
    font-size: 0.86rem;
    color: var(--smc-ui-text) !important;
    text-decoration: none;
}

.smc-account-page .smc-order-card-actions {
    flex-direction: row;
    gap: 0.5rem;
    margin-top: 0.4rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--smc-ui-border);
}

.smc-account-page .smc-order-card-actions .smc-btn {
    flex: 1 1 0;
    min-height: 40px;
    margin: 0 !important;
    justify-content: center;
    font-size: 0.88rem;
}

@media (max-width: 640px) {
    /* The list sits on the page canvas; only the items are cards (no card inside a card) */
    .smc-account-page .smc-order-details:has(.smc-orders-mobile-list) {
        padding: 0;
        border: none;
        background: transparent;
        box-shadow: none;
    }

    .smc-account-page .smc-orders-mobile-list {
        gap: 0.75rem;
    }
}

/* 12c. Profile (/profile/): header on the canvas, each topic its own card */

.smc-account-page .smc-profile-card {
    padding: 0;
    border: none;
    background: transparent;
    box-shadow: none;
}

.smc-account-page .smc-profile-card::before {
    display: none;
}

.smc-account-page .smc-profile-header {
    margin-bottom: 1.1rem;
}

.smc-account-page .smc-profile-title {
    margin: 0 0 0.35rem;
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: -0.025em;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-profile-card .smc-card {
    margin: 0 0 1rem;
    padding: 1.5rem 1.6rem;
    text-align: left;
}

.smc-account-page .smc-profile-card .smc-card .smc-order-block-title,
.smc-account-page .smc-connected-accounts__title {
    margin: 0 0 1rem;
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: -0.015em;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-profile-card .smc-grid {
    gap: 0.9rem 1rem;
    margin-bottom: 0.9rem;
}

.smc-account-page .smc-input[readonly] {
    background: #f6f9fc;
    color: var(--smc-ui-text);
}

.smc-account-page .smc-order-note {
    margin: 0.35rem 0 0;
    font-size: 0.8rem;
    color: var(--smc-ui-muted);
}

/* Actions sit at the bottom of their own card */
.smc-account-page .smc-profile-card .smc-form-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem 1.1rem;
    margin-top: 1.1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--smc-ui-border);
}

.smc-account-page .smc-profile-card .smc-pw-actions {
    justify-content: space-between;
    flex-direction: row-reverse;
}

.smc-pw-forgot {
    font-size: 0.86rem;
    font-weight: 600;
    color: var(--smc-ui-text);
    text-decoration: none;
}

/* Connected sign-in accounts: white rows, a small status instead of a green fill */
.smc-account-page .smc-connected-accounts__desc {
    margin: -0.6rem 0 1rem;
    font-size: 0.86rem;
    color: var(--smc-ui-text);
}

.smc-account-page .smc-connected-accounts__list {
    display: grid;
    gap: 0.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.smc-account-page .smc-connected-accounts__item {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.65rem 0.8rem;
    border-radius: 12px;
    border: 1px solid var(--smc-ui-border);
    background: #ffffff !important;
}

.smc-account-page .smc-connected-accounts__name {
    flex: 1 1 auto;
    font-weight: 600;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-connected-accounts__item.is-connected .smc-connected-accounts__name::after {
    content: "Connected";
    margin-left: 0.55rem;
    padding: 0.12rem 0.5rem;
    border-radius: 999px;
    background: #e9f8ef;
    color: #18794e;
    font-size: 0.72rem;
    font-weight: 700;
    vertical-align: 1px;
}

.smc-account-page .smc-connected-accounts__item .smc-btn {
    min-height: 34px;
    padding: 0.35rem 0.85rem !important;
    font-size: 0.8rem !important;
    background: #ffffff;
    border: 1px solid #d6e0eb;
    color: var(--smc-ui-ink);
}

/* Danger zone */
.smc-account-page .smc-danger-card {
    border-color: #f2d6d4 !important;
}

.smc-account-page .smc-danger-card .smc-order-block-title {
    color: #b42318 !important;
}

.smc-account-page .smc-danger-card .smc-account-message {
    max-width: none;
    background: #fff8f0;
    border-color: #f5dcc0;
    color: #8a4b0f;
}

.smc-account-page .smc-profile-card .smc-danger-card .smc-form-actions {
    justify-content: flex-start;
}

.smc-account-page .smc-danger-card .smc-btn-danger {
    background: #ffffff;
    border: 1px solid #e8b4b0;
    color: #b42318;
    box-shadow: none;
}

@media (hover: hover) {
    .smc-pw-forgot:hover {
        color: #0a7cb8;
    }

    .smc-account-page .smc-danger-card .smc-btn-danger:hover {
        background: #fff5f5;
        border-color: #b42318;
    }

    .smc-account-page .smc-connected-accounts__item .smc-btn:hover {
        border-color: #e8b4b0;
        color: #b42318;
    }
}

@media (max-width: 640px) {
    .smc-account-page .smc-profile-card .smc-card {
        padding: 1.2rem 1.1rem;
    }

    .smc-account-page .smc-profile-card .smc-form-actions .smc-btn {
        width: 100%;
        justify-content: center;
    }

    .smc-account-page .smc-profile-card .smc-pw-actions {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
    }
}

/* 12d. Secondary buttons in the account: outlined, so only one blue button leads each screen */
.smc-account-page .smc-btn-secondary:not(.smc-btn-danger) {
    background: #ffffff;
    color: var(--smc-ui-ink);
    border: 1px solid #d6e0eb;
    box-shadow: none;
}

@media (hover: hover) {
    .smc-account-page .smc-btn-secondary:not(.smc-btn-danger):hover {
        background: #ffffff;
        color: var(--smc-ui-ink);
        border-color: var(--smc-ui-accent);
        box-shadow: none;
        transform: none;
    }
}

/* Plain text fields keep the site font (textarea fell back to monospace) */
.smc-account-page textarea,
.smc-account-page .smc-textarea {
    font-family: inherit;
}

/* 12e. Address book (/addresses/) */
.page-account-addresses .smc-link-back {
    display: none;
}

.smc-account-page .smc-addresses-wrap {
    gap: 0;
}

.smc-account-page .smc-addr-head {
    align-items: center;
    padding-bottom: 1.1rem;
    margin-bottom: 0.4rem;
    border-bottom: 1px solid var(--smc-ui-border);
}

.smc-account-page .smc-addresses-title {
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: -0.015em;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-addresses-subtitle {
    font-size: 0.86rem;
    color: var(--smc-ui-text);
}

.smc-account-page .smc-addr-subhead {
    display: flex;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start;
    gap: 0.75rem;
    margin: 1.3rem 0 0.8rem;
}

.smc-account-page .smc-addr-subhead .smc-addresses-title {
    font-size: 0.98rem;
}

.smc-addr-ico {
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--smc-ui-accent-soft);
    color: var(--smc-ui-accent);
}

.smc-addr-ico svg {
    width: 20px;
    height: 20px;
}

.smc-account-page .smc-address-card {
    border-radius: 16px;
    border: 1px solid var(--smc-ui-border);
    box-shadow: var(--smc-ui-shadow);
}

.smc-account-page .smc-address-card-name {
    font-weight: 800;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-address-line {
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-address-meta {
    color: var(--smc-ui-muted);
}

/* "Set default" makes no sense on the card that already is the default */
.smc-account-page .smc-address-card.is-default [data-smc-action="set-default"] {
    display: none;
}

.smc-account-page .smc-address-card-actions {
    padding-top: 0.7rem;
    border-top: 1px solid var(--smc-ui-border);
}

/* Empty list: a calm dashed placeholder instead of an info alert */
#smc-addresses-list-residential .smc-account-message,
#smc-addresses-list-commercial .smc-account-message {
    justify-content: center;
    padding: 1.1rem 1rem !important;
    border: 1.5px dashed #cfe3f3 !important;
    border-radius: 14px;
    background: #fbfdff !important;
    color: var(--smc-ui-muted) !important;
    font-size: 0.88rem;
}

#smc-addresses-list-residential .smc-account-message::before,
#smc-addresses-list-commercial .smc-account-message::before {
    display: none;
}

/* Editor: a soft panel inside the card, add-ons look like the request form tiles */
.smc-account-page .smc-address-form {
    padding: 1.3rem 1.3rem 1.4rem;
    border-radius: 16px;
    border: 1px solid var(--smc-ui-accent-line);
    background: #fbfdff;
    box-shadow: none;
}

.smc-account-page .smc-address-form-title {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-address-form label:has(input[type="checkbox"]) {
    background: #ffffff;
    border: 1px solid var(--smc-ui-border);
    border-radius: 12px;
}

.smc-account-page .smc-address-form label:has(input[type="checkbox"]:checked) {
    background: var(--smc-ui-accent-soft);
    border-color: var(--smc-ui-accent-line);
}

@media (prefers-reduced-motion: no-preference) {
    .smc-account-page .smc-address-form.smc-editor-open {
        animation: smc-acc-fade 0.35s ease both;
    }
}

/* 12f. Reports inbox (/reports/) */
.smc-account-page .smc-account-card {
    border: 1px solid var(--smc-ui-border);
    box-shadow: var(--smc-ui-shadow);
}

.smc-account-page .smc-account-card::before {
    display: none;
}

.smc-account-page .smc-account-eyebrow {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: var(--smc-ui-accent);
}

.smc-account-page .smc-account-title {
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: -0.025em;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-account-subtitle {
    font-size: 0.9rem;
    color: var(--smc-ui-text);
}

.smc-account-page .smc-reports-list {
    gap: 0.6rem;
}

.smc-account-page .smc-report-list-item {
    display: block;
    padding: 0.95rem 1.1rem;
    border-radius: 14px;
    border: 1px solid var(--smc-ui-border);
    background: #ffffff;
    box-shadow: none;
    text-decoration: none;
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.smc-account-page .smc-report-list-item.has-unread {
    background: #f4faff;
    border-color: var(--smc-ui-accent-line);
    box-shadow: inset 3px 0 0 var(--smc-ui-accent);
}

.smc-account-page .smc-report-list-col--main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
        "top meta"
        "user user"
        "snip snip";
    gap: 0.25rem 1rem;
    align-items: center;
}

.smc-account-page .smc-report-list-top {
    grid-area: top;
    justify-content: flex-start !important;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    min-width: 0;
}

.smc-account-page .smc-report-list-top strong {
    font-size: 0.98rem;
    font-weight: 700;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-report-list-num {
    position: static;
    font-size: 0.74rem;
    font-weight: 500;
    color: var(--smc-ui-muted);
    font-variant-numeric: tabular-nums;
}

.smc-account-page .smc-report-unread {
    position: static;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 999px;
    background: var(--smc-ui-gradient);
    color: #ffffff;
    font-size: 0.72rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.smc-account-page .smc-report-list-meta {
    grid-area: meta;
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.8rem;
    color: var(--smc-ui-muted);
    white-space: nowrap;
}

.smc-account-page .smc-report-list-user {
    grid-area: user;
    font-size: 0.85rem;
    color: var(--smc-ui-text);
}

.smc-account-page .smc-report-list-snippet {
    grid-area: snip;
    margin-top: 0.2rem;
    font-size: 0.88rem;
    line-height: 1.5;
    color: var(--smc-ui-ink);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Conversation view */
.smc-account-page .smc-report-thread-box {
    border-radius: 16px;
    border: 1px solid var(--smc-ui-border);
    background: #fbfdff;
}

/* A closed conversation does not need an empty chat window */
.smc-account-page .smc-reports-card--threadpage:has(.smc-account-message--warning) .smc-report-thread-box {
    min-height: 0;
    height: auto;
}

.smc-account-page .smc-report-message {
    border-radius: 14px;
    border: 1px solid var(--smc-ui-border);
    background: #ffffff;
    box-shadow: none;
}

.smc-account-page .smc-report-message-body {
    color: var(--smc-ui-ink);
    line-height: 1.55;
}

/* A closed conversation is a normal state, not an error */
.smc-reports-page .smc-status--cancelled {
    background: #f1f4f8;
    color: #5b6675;
}

@media (hover: hover) {
    .smc-account-page .smc-report-list-item:hover {
        border-color: rgba(45, 182, 255, 0.45);
        background: #fbfdff;
    }
}

@media (max-width: 640px) {
    .smc-account-page .smc-account-card:has(.smc-reports-list) {
        padding: 0;
        border: none;
        background: transparent;
        box-shadow: none;
    }

    .smc-account-page .smc-report-list-col--main {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "top"
            "user"
            "meta"
            "snip";
    }
}

/* 12g. Refer & Earn (/referrals/): the share link leads, steps read as a flow */
.smc-account-page .smc-order-details:has(.smc-ref-page) {
    padding: 0;
    border: none;
    background: transparent;
    box-shadow: none;
}

.smc-account-page .smc-ref-page {
    gap: 1rem;
}

.smc-account-page .smc-ref-card {
    padding: 1.4rem 1.5rem;
    border-radius: var(--smc-ui-radius);
    border: 1px solid var(--smc-ui-border);
    background: #ffffff;
    box-shadow: var(--smc-ui-shadow);
}

.smc-account-page .smc-ref-card:nth-child(2) { order: -1; }

/* Share card: the main action, with a soft brand glow */
.smc-account-page .smc-ref-card:nth-child(2) {
    border-color: var(--smc-ui-accent-line);
    background:
        radial-gradient(420px 200px at 100% 0%, rgba(45, 182, 255, 0.10), rgba(45, 182, 255, 0) 70%),
        #ffffff;
}

.smc-account-page .smc-ref-card-title {
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: var(--smc-ui-accent);
}

.smc-account-page .smc-ref-link-input {
    min-height: 46px;
    border-radius: 12px;
    border: 1px solid #d6e0eb;
    background: #f6f9fc;
    font-weight: 600;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-ref-copy-btn {
    min-height: 46px;
    border-radius: 12px;
    background: var(--smc-ui-gradient);
    border: none;
    color: #ffffff;
    font-weight: 700;
    box-shadow: 0 8px 18px rgba(45, 182, 255, 0.24);
}

.smc-account-page .smc-ref-share-btn {
    border-radius: 999px;
}

/* Steps: white tiles joined by a line, like on the home page */
.smc-account-page .smc-ref-steps {
    position: relative;
    gap: 1rem;
}

.smc-account-page .smc-ref-step {
    position: relative;
    background: transparent;
    border: none;
    padding: 0.4rem 0.6rem;
}

.smc-account-page .smc-ref-step:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 1.55rem;
    left: calc(50% + 28px);
    right: calc(-50% - 1rem + 28px);
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(90deg, #8fd8ff, #e3f3ff);
}

.smc-account-page .smc-ref-step-num {
    width: 42px;
    height: 42px;
    box-shadow: 0 8px 18px rgba(45, 182, 255, 0.26);
}

.smc-account-page .smc-ref-step-title {
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-ref-step-desc {
    color: var(--smc-ui-text);
}

/* Wallet */
.smc-account-page .smc-ref-balance-big {
    letter-spacing: -0.03em;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-ref-empty {
    padding: 1.2rem 1rem;
    border: 1.5px dashed #cfe3f3;
    border-radius: 14px;
    background: #fbfdff;
    color: var(--smc-ui-muted);
}

/* Copy is the quiet action, the phone share sheet is the main one */
.smc-account-page .smc-ref-copy-btn {
    background: #ffffff !important;
    border: 1px solid #d6e0eb !important;
    color: var(--smc-ui-ink) !important;
    box-shadow: none !important;
}

.smc-account-page .smc-ref-share-mobile {
    background: var(--smc-ui-gradient) !important;
    border: none !important;
    color: #ffffff !important;
    font-weight: 700;
    box-shadow: 0 8px 18px rgba(45, 182, 255, 0.24) !important;
}

@media (max-width: 640px) {
    .smc-account-page .smc-ref-card {
        padding: 1.2rem 1.1rem;
    }

    /* Steps become a vertical timeline with the numbers on the left edge */
    .smc-account-page .smc-ref-steps {
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .smc-account-page .smc-ref-step {
        display: grid;
        grid-template-columns: 42px minmax(0, 1fr);
        column-gap: 0.9rem;
        padding: 0 0 1.2rem;
        text-align: left;
    }

    .smc-account-page .smc-ref-step:last-child {
        padding-bottom: 0;
    }

    .smc-account-page .smc-ref-step-num {
        grid-row: 1 / span 2;
        margin: 0;
    }

    .smc-account-page .smc-ref-step-title {
        margin-top: 0.5rem;
    }

    .smc-account-page .smc-ref-step:not(:last-child)::after {
        top: 48px;
        bottom: 4px;
        left: 20px;
        right: auto;
        width: 2px;
        height: auto;
        background: linear-gradient(180deg, #8fd8ff, #e3f3ff);
    }
}

/* 12h. Order / request details (/account-order/) */
.smc-account-page .smc-order-view {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    padding: 0;
    border: none;
    background: transparent;
    box-shadow: none;
    overflow: visible;
}

.smc-account-page .smc-order-view > * {
    grid-column: 1 / -1;
    margin: 0;
}

.smc-account-page .smc-order-view > .smc-ob--client,
.smc-account-page .smc-order-view > .smc-ob--address,
.smc-account-page .smc-order-view > .smc-ob--property,
.smc-account-page .smc-order-view > .smc-ob--addons {
    grid-column: auto;
}

.smc-account-page .smc-order-view > .smc-ob--client  { order: 1; }
.smc-account-page .smc-order-view > .smc-ob--address { order: 2; }
.smc-account-page .smc-order-view > .smc-ob--service { order: 3; }
.smc-account-page .smc-order-view > .smc-ob--pricing { order: 4; }
.smc-account-page .smc-order-view > .smc-ob--property,
.smc-account-page .smc-order-view > .smc-ob--tasks,
.smc-account-page .smc-order-view > .smc-ob--commercial { order: 5; }
.smc-account-page .smc-order-view > .smc-ob--addons  { order: 6; }
.smc-account-page .smc-order-view > .smc-ob--info    { order: 7; }
.smc-account-page .smc-order-view > .smc-ob--notes   { order: 8; }
.smc-account-page .smc-order-view > .smc-order-pending { order: 0; }
.smc-account-page .smc-order-view > .smc-ob--change  { order: 9; }

/* Header on the canvas: back link, title, status, actions */
.smc-account-page .smc-order-view > .smc-order-details-header {
    order: -1;
    align-items: flex-end;
    margin: 0 0 0.2rem;
}

/* Back is one of our buttons (project rule: no bare text links for navigation) */
.smc-account-page .smc-btn.smc-order-back {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    width: auto;
    min-height: 36px;
    margin: 0 0 0.35rem;
    padding: 0.35rem 1rem 0.35rem 0.7rem;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
}

.smc-account-page .smc-order-details-header:has(> .smc-order-back) {
    flex-wrap: wrap;
}

.smc-account-page .smc-order-details-header > .smc-order-back {
    order: -2;
}

.smc-account-page .smc-order-details-header:has(> .smc-order-back)::before {
    content: "";
    order: -1;
    flex-basis: 100%;
    height: 0;
}

.smc-account-page .smc-order-view .smc-order-details-title {
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: -0.025em;
}

.smc-account-page .smc-order-view .smc-order-details-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem 0.9rem;
    font-size: 0.86rem;
    color: var(--smc-ui-text);
}

.smc-order-head-edit {
    min-height: 40px;
    padding: 0.45rem 1.1rem;
}

/* Blocks are the cards */
.smc-account-page .smc-order-view .smc-order-block {
    padding: 1.3rem 1.4rem;
    border-radius: var(--smc-ui-radius);
    border: 1px solid var(--smc-ui-border);
    background: #ffffff;
    box-shadow: var(--smc-ui-shadow);
}

.smc-account-page .smc-order-view .smc-order-block-title {
    margin: 0 0 0.9rem;
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--smc-ui-accent);
}

.smc-account-page .smc-order-view .smc-order-row dt {
    font-weight: 500;
    color: var(--smc-ui-muted);
}

.smc-account-page .smc-order-view .smc-order-row dd {
    font-weight: 600;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-order-view .smc-order-row dd a:not(.smc-btn) {
    color: var(--smc-ui-ink);
    text-decoration: none;
}

/* Service: facts as tiles, the price stands out */
.smc-account-page .smc-ob--service .smc-order-def-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.smc-account-page .smc-ob--service .smc-order-row {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 0.7rem 0.85rem;
    border-radius: 12px;
    background: #f7fafd;
}

.smc-account-page .smc-ob--service .smc-order-row dt,
.smc-account-page .smc-ob--service .smc-order-row dd {
    padding: 0;
    border: none;
    margin: 0;
    line-height: 1.35;
}

.smc-account-page .smc-ob--service .smc-order-row dt {
    font-size: 0.74rem;
}

.smc-account-page .smc-ob--service .smc-order-row--price {
    background: var(--smc-ui-accent-soft);
}

.smc-account-page .smc-ob--service .smc-order-row--price dd {
    font-size: 1.15rem;
    font-weight: 800;
    color: #0a7cb8;
}

.smc-inline-link {
    display: inline-flex;
    align-items: baseline;
    gap: 0.4rem;
    font-weight: 700;
    color: var(--smc-ui-ink) !important;
    text-decoration: none;
}

.smc-inline-link span {
    font-size: 0.8rem;
    font-weight: 600;
    color: #0a7cb8;
}

/* Change / cancel card for clients */
.smc-account-page .smc-ob--change {
    border-color: var(--smc-ui-accent-line) !important;
    background: #fbfdff !important;
}

.smc-account-page .smc-ob--change .smc-order-block-title {
    font-size: 1rem;
    letter-spacing: -0.01em;
    text-transform: none;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-ob--change .smc-btn-ghost {
    background: #ffffff;
    border: 1px solid #e8b4b0;
    color: #b42318;
}

.smc-account-page .smc-btn-danger-solid {
    background: #d92d20;
    border: none;
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(217, 45, 32, 0.22);
}

/* Staff notice about pending client changes */
.smc-account-page .smc-order-pending {
    padding: 1.1rem 1.25rem;
    border-radius: 16px;
    border: 1px solid #f5c58a;
    background: #fff8ef;
}

.smc-account-page .smc-order-pending .smc-order-block-title {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    color: #9a4d0b;
}

@media (hover: hover) {
    .smc-order-back:hover {
        color: var(--smc-ui-ink);
    }

    .smc-account-page .smc-btn-danger-solid:hover {
        background: #b42318;
    }
}

@media (max-width: 900px) {
    .smc-account-page .smc-order-view {
        grid-template-columns: minmax(0, 1fr);
    }

    .smc-account-page .smc-order-view > .smc-ob--client,
    .smc-account-page .smc-order-view > .smc-ob--address,
    .smc-account-page .smc-order-view > .smc-ob--property,
    .smc-account-page .smc-order-view > .smc-ob--addons {
        grid-column: 1 / -1;
    }

    .smc-account-page .smc-ob--service .smc-order-def-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .smc-account-page .smc-order-view .smc-order-block {
        padding: 1.1rem 1.05rem;
    }

    /* Label and value on one line, like a receipt */
    .smc-account-page .smc-order-view .smc-order-block:not(.smc-ob--service) .smc-order-def-list {
        display: grid !important;
        grid-template-columns: minmax(96px, 38%) minmax(0, 1fr) !important;
        column-gap: 0.9rem;
        row-gap: 0;
    }

    .smc-account-page .smc-order-view .smc-order-block:not(.smc-ob--service) .smc-order-row {
        display: contents !important;
    }

    .smc-account-page .smc-order-view .smc-order-block:not(.smc-ob--service) .smc-order-row dt,
    .smc-account-page .smc-order-view .smc-order-block:not(.smc-ob--service) .smc-order-row dd {
        padding: 0.55rem 0 !important;
        border-bottom: 1px solid var(--smc-ui-border) !important;
        margin: 0;
        overflow-wrap: break-word;
        word-break: normal;
    }

    .smc-account-page .smc-order-view .smc-order-block:not(.smc-ob--service) .smc-order-row:last-child dt,
    .smc-account-page .smc-order-view .smc-order-block:not(.smc-ob--service) .smc-order-row:last-child dd {
        border-bottom: none !important;
    }

    .smc-order-head-edit {
        width: 100%;
        justify-content: center;
    }
}

/* 12i. Visit details (/account-visit-details/): pairs side by side only when both exist */
.smc-account-page .smc-visit-view:has(.smc-vb--cleaners) > .smc-vb--overview,
.smc-account-page .smc-visit-view:has(.smc-vb--overview) > .smc-vb--cleaners,
.smc-account-page .smc-visit-view:has(.smc-vb--timeline):has(.smc-vb--billing) > .smc-vb--timeline,
.smc-account-page .smc-visit-view:has(.smc-vb--timeline):has(.smc-vb--billing) > .smc-vb--billing {
    grid-column: auto;
}

.smc-account-page .smc-visit-view > .smc-vb--overview  { order: 1; }
.smc-account-page .smc-visit-view > .smc-vb--cleaners  { order: 2; }
.smc-account-page .smc-visit-view > .smc-vb--timeline  { order: 3; }
.smc-account-page .smc-visit-view > .smc-vb--billing   { order: 4; }
.smc-account-page .smc-visit-view > .smc-vb--review    { order: 5; }
.smc-account-page .smc-visit-view > .smc-vb--note      { order: 6; }
.smc-account-page .smc-visit-view > .smc-vb--checklist { order: 7; }
.smc-account-page .smc-visit-view > .smc-vb--services  { order: 8; }
.smc-account-page .smc-visit-view > .smc-vb--addons    { order: 9; }

/* Cleaners */
.smc-account-page .vd-worker-chip {
    border-radius: 999px;
    border: 1px solid var(--smc-ui-border);
    background: #ffffff;
    color: var(--smc-ui-ink);
    font-weight: 600;
}

.smc-account-page .vd-worker-initials {
    background: var(--smc-ui-gradient);
    color: #ffffff;
}

/* Checklist: a clean list with hairlines, quiet pending, clear done */
.smc-account-page .smc-visit-view .vd-svc-list {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.smc-account-page .smc-visit-view .vd-svc-row {
    padding: 0.6rem 0.2rem;
    border: none;
    border-bottom: 1px solid var(--smc-ui-border);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.smc-account-page .smc-visit-view .vd-svc-row:last-child {
    border-bottom: none;
}

.smc-account-page .smc-visit-view .vd-svc-label {
    font-size: 0.9rem;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-visit-view .vd-svc-badge {
    border-radius: 999px;
    font-size: 0.68rem;
    letter-spacing: 0.04em;
}

.smc-account-page .smc-visit-view .vd-svc-badge--pending {
    background: transparent;
    color: var(--smc-ui-muted);
}

.smc-account-page .vd-svc-icon--addon {
    color: var(--smc-ui-accent);
    font-size: 16px;
    font-weight: 900;
}

/* Billing tiles */
.smc-account-page .vd-billing-tile {
    border-radius: 12px;
    border: 1px solid var(--smc-ui-border);
    background: #f7fafd;
}

.smc-account-page .vd-billing-total {
    border-color: var(--smc-ui-accent-line) !important;
    background: var(--smc-ui-accent-soft) !important;
}

.smc-account-page .vd-billing-total .vd-billing-tile-value {
    color: #0a7cb8;
}

/* Review ask */
.smc-account-page .smc-vb--review {
    border-color: var(--smc-ui-accent-line) !important;
    background:
        radial-gradient(420px 200px at 100% 0%, rgba(45, 182, 255, 0.10), rgba(45, 182, 255, 0) 70%),
        #ffffff !important;
}

.smc-account-page .vd-comment-box {
    border-radius: 12px;
    border: 1px solid var(--smc-ui-border);
    background: #fbfdff;
    color: var(--smc-ui-ink);
}

/* 12j. Invoice details: amount due and Pay Now at the top */
.smc-inv-summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem 1.5rem;
    padding: 1.35rem 1.5rem;
    border-radius: var(--smc-ui-radius);
    border: 1px solid var(--smc-ui-border);
    background: #ffffff;
    box-shadow: var(--smc-ui-shadow);
}

.smc-inv-summary.is-payable {
    border-color: var(--smc-ui-accent-line);
    background:
        radial-gradient(420px 200px at 100% 0%, rgba(45, 182, 255, 0.10), rgba(45, 182, 255, 0) 70%),
        #ffffff;
}

.smc-inv-summary-amount {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.smc-inv-summary-label {
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--smc-ui-accent);
}

.smc-inv-summary-amount strong {
    font-size: 1.4rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    color: var(--smc-ui-ink);
}

.smc-inv-summary-due {
    font-size: 0.86rem;
    color: var(--smc-ui-text);
}

.smc-account-page .smc-inv-summary .smc-order-action-block {
    margin: 0;
    padding: 0;
    border: none;
}

.smc-account-page .smc-inv-summary .smc-order-action-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.smc-account-page .smc-inv-summary .smc-btn-neutral {
    background: #ffffff;
    border: 1px solid #d6e0eb;
    color: var(--smc-ui-ink);
}

@media (max-width: 640px) {
    .smc-inv-summary {
        flex-direction: column;
        align-items: stretch;
        padding: 1.2rem 1.1rem;
    }

    .smc-account-page .smc-inv-summary .smc-order-action-btns .smc-btn,
    .smc-account-page .smc-inv-summary .smc-order-action-btns button {
        flex: 1 1 100%;
        justify-content: center;
    }
}

/* 12k. Order edit (/account-order-edit-v2/): the request form inside one account card */
body .smc-account-main .smc-request-wrapper {
    padding-left: 0;
    padding-right: 0;
}

@media (max-width: 640px) {
    body .smc-account-main .smc-order-block:has(> .smc-request) {
        padding: 1.2rem 1rem;
    }
}

/* 12l. Delete account (/account-delete/, outside the account layout) */
.smc-account-delete-page {
    background:
        radial-gradient(1100px 520px at 100% -8%, rgba(45, 182, 255, 0.10), rgba(45, 182, 255, 0) 65%),
        linear-gradient(180deg, #f7fbff 0%, #f8fafc 520px) !important;
}

.smc-account-delete-page .smc-account-delete-panel {
    border: 1px solid var(--smc-ui-border);
    box-shadow: var(--smc-ui-shadow-hover);
}

.smc-account-delete-page .smc-account-delete-panel::before {
    display: none;
}

.smc-account-delete-page .smc-account-delete-title {
    font-size: 1.25rem;
    font-weight: 800;
    letter-spacing: -0.025em;
    color: var(--smc-ui-ink);
}

.smc-account-delete-page .smc-account-delete-subtitle {
    color: var(--smc-ui-text);
}

.smc-account-delete-page .smc-input:focus {
    border-color: #d92d20;
    box-shadow: 0 0 0 3px rgba(217, 45, 32, 0.12);
}

.smc-account-delete-page .smc-btn-danger {
    background: #d92d20;
    border: none;
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(217, 45, 32, 0.22);
}

.smc-account-delete-page .smc-btn-danger:disabled,
.smc-account-delete-page .smc-btn-danger[aria-disabled="true"] {
    background: #f1c4c0;
    box-shadow: none;
    cursor: not-allowed;
}

.smc-account-delete-page .smc-btn-secondary {
    background: #ffffff;
    border: 1px solid #d6e0eb;
    color: var(--smc-ui-ink);
    box-shadow: none;
}

/* 12m. Calendar (/calendar/) */
.smc-account-page .smc-orders-summary strong {
    font-size: 1.15rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-stat-chip {
    border-radius: 999px;
    font-weight: 600;
}

.smc-account-page .smc-calendar-nav-btn {
    min-width: 40px;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.smc-account-page .smc-calendar-cell {
    border-radius: 12px;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

.smc-account-page .smc-calendar-daylink {
    border-radius: 12px;
    border: 1px solid var(--smc-ui-border) !important;
    background: #ffffff;
    box-shadow: none !important;
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.smc-account-page .smc-calendar-cell.is-empty .smc-calendar-empty,
.smc-account-page .smc-calendar-cell.is-empty {
    background: transparent;
    border: none;
    color: transparent;
}

/* One indicator per day: the visit count pill (the dot repeated it) */
.smc-account-page .smc-calendar-dot,
.smc-account-page .smc-calendar-indicators .smc-calendar-empty {
    display: none;
}

.smc-account-page .smc-calendar-count {
    min-width: 24px;
    height: 22px;
    padding: 0 7px;
    border-radius: 999px;
    border: none !important;
    background: var(--smc-ui-accent-soft);
    color: #0a7cb8;
    font-size: 0.75rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.smc-account-page .smc-calendar-day {
    font-weight: 700;
    color: var(--smc-ui-ink);
}

/* Sunday is just a day, not an error */
.smc-account-page .smc-calendar-cell.is-sunday:not(.is-today) .smc-calendar-day {
    color: var(--smc-ui-muted) !important;
}

/* Today: the number sits in a brand circle */
.smc-account-page .smc-calendar-cell.is-today .smc-calendar-daylink {
    border-color: var(--smc-ui-accent-line) !important;
    outline: none !important;
}

.smc-account-page .smc-calendar-cell.is-today .smc-calendar-day {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--smc-ui-gradient);
    color: #ffffff;
}

.smc-account-page .smc-calendar-cell.is-selected .smc-calendar-daylink {
    border-color: var(--smc-ui-accent) !important;
    background: var(--smc-ui-accent-soft);
}

@media (hover: hover) {
    .smc-account-page .smc-calendar-cell:not(.is-empty) .smc-calendar-daylink:hover {
        border-color: rgba(45, 182, 255, 0.5) !important;
        background: #fbfdff;
        transform: none;
    }
}

/* 12n. Tasks Today (/tasks-today/): day switcher and task cards for workers */
.smc-account-page .stt-week-tabs {
    gap: 0.5rem;
}

.smc-account-page .stt-day-tab {
    border-radius: 12px !important;
    border: 1px solid var(--smc-ui-border) !important;
    background: #ffffff !important;
    color: var(--smc-ui-ink) !important;
    font-weight: 700;
    box-shadow: none !important;
}

.smc-account-page .stt-day-tab.is-active {
    border-color: transparent !important;
    background: var(--smc-ui-gradient) !important;
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(45, 182, 255, 0.26) !important;
}

.smc-account-page .stt-day-tab.is-active .stt-dtab-badge {
    background: rgba(255, 255, 255, 0.25);
    color: #ffffff;
}

.smc-account-page .stt-card {
    border: 1px solid var(--smc-ui-border) !important;
    border-radius: 16px !important;
    box-shadow: var(--smc-ui-shadow) !important;
    overflow: hidden;
}

.smc-account-page .stt-future-flag {
    background: #f7fafd;
    color: var(--smc-ui-muted);
    letter-spacing: 0.06em;
}

.smc-account-page .stt-name {
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: var(--smc-ui-ink);
}

/* The visit time is what a cleaner looks for first */
.smc-account-page .stt-time {
    font-size: 1rem;
    font-weight: 700;
    color: var(--smc-ui-ink);
}

.smc-account-page .stt-address,
.smc-account-page .stt-address a {
    color: var(--smc-ui-ink) !important;
}

.smc-account-page .stt-address svg {
    color: var(--smc-ui-accent);
}

.smc-account-page .stt-meta {
    color: var(--smc-ui-text);
}

.smc-account-page .stt-action .smc-btn {
    border-radius: 12px;
}

@media (max-width: 640px) {
    .smc-account-page .smc-order-details:has(.stt-week-tabs) {
        padding: 0;
        border: none;
        background: transparent;
        box-shadow: none;
    }
}

@media (hover: hover) {
    .smc-account-page .stt-day-tab:not(.is-active):hover {
        border-color: rgba(45, 182, 255, 0.5) !important;
    }
}

/* 12o. Icons drawn as SVG masks instead of Unicode glyphs (the iOS app mirrors the site; glyphs render inconsistently) */
.smc-sf-clear-q,
.smc-pay-modal-close,
.smc-order-row__remove,
.cv-remove-btn {
    font-size: 0 !important;
    line-height: 0 !important;
}

.smc-sf-clear-q::before,
.smc-pay-modal-close::before,
.smc-order-row__remove::before,
.cv-remove-btn::before {
    content: "";
    display: inline-block;
    width: 12px;
    height: 12px;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center / contain no-repeat;
}

.smc-pay-modal-close::before {
    width: 16px;
    height: 16px;
}

.stt-dtab-done,
.vd-svc-icon--done,
.smc-invoice-view .smc-visit-service-icon,
.smc-pay-icon {
    font-size: 0 !important;
}

.stt-dtab-done::before,
.vd-svc-icon--done::before,
.smc-invoice-view .smc-visit-service-icon::before,
.smc-pay-icon::before {
    content: "";
    display: inline-block;
    width: 12px;
    height: 12px;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
    vertical-align: middle;
}

.smc-pay-icon::before {
    width: 30px;
    height: 30px;
}

.smc-pay-state-failed .smc-pay-icon::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l9.5 17h-19z'/%3E%3Cpath d='M12 10v4'/%3E%3Cpath d='M12 17.5v.01'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l9.5 17h-19z'/%3E%3Cpath d='M12 10v4'/%3E%3Cpath d='M12 17.5v.01'/%3E%3C/svg%3E");
}

/* 12p. Worker task screens (task details, sticker task details, checklist): brand over inline sky blues */
.smc-account-page .smc-task-hero__eyebrow {
    color: var(--smc-ui-accent);
    letter-spacing: 0.1em;
}

.smc-account-page .smc-task-hero__title {
    font-size: 1.3rem;
    letter-spacing: -0.025em;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-task-progress__step {
    background: #f6f9fc;
    color: var(--smc-ui-muted);
    border-radius: 12px;
}

.smc-account-page .smc-task-progress__step span {
    background: #ffffff;
    border: 1px solid #d6e0eb;
    color: var(--smc-ui-muted);
}

.smc-account-page .smc-task-progress__step.is-active {
    background: var(--smc-ui-accent-soft);
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-task-progress__step.is-active span {
    background: var(--smc-ui-gradient);
    border-color: transparent;
    color: #ffffff;
    box-shadow: 0 6px 14px rgba(45, 182, 255, 0.28);
}

.smc-account-page .smc-task-progress__step.is-done span {
    border-color: transparent;
}

.smc-account-page .smc-task-info-card {
    background: #ffffff;
    border-color: var(--smc-ui-border);
    border-radius: 16px;
    box-shadow: var(--smc-ui-shadow);
}

.smc-account-page .smc-task-info-row {
    border-bottom-color: var(--smc-ui-border);
}

.smc-account-page .smc-task-info-row__icon {
    color: var(--smc-ui-accent);
}

.smc-account-page .smc-task-info-row__label {
    color: var(--smc-ui-muted);
}

.smc-account-page .smc-task-info-row__value {
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-task-info-row__value a {
    color: #0a7cb8;
}

.smc-account-page .smc-task-svc-pill {
    border-color: var(--smc-ui-accent-line);
    background: var(--smc-ui-accent-soft);
    color: #0a7cb8;
}

.smc-account-page .smc-task-actions__primary {
    background: var(--smc-ui-gradient);
    border-radius: 14px;
    box-shadow: 0 10px 22px rgba(45, 182, 255, 0.28);
}

.smc-account-page .smc-task-actions__secondary {
    color: var(--smc-ui-text);
}

.smc-account-page .smc-task-actions__back,
.smc-account-page .smc-task-shell a.smc-link-arrow {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--smc-ui-text);
    font-weight: 600;
    text-decoration: none;
}

@media (hover: hover) {
    .smc-account-page .smc-task-actions__primary:hover {
        background: var(--smc-ui-gradient);
        filter: brightness(1.04);
    }
}

/* 12q. Worker task details (/task-details/): order-view cards, address first */
.smc-account-page .smc-worker-task-view > * {
    order: 0;
}

.smc-account-page .smc-worker-task-view > .smc-order-details-header {
    order: -1;
}

.smc-account-page .smc-worker-task-view > .smc-wb--address,
.smc-account-page .smc-worker-task-view > .smc-wb--client {
    grid-column: auto;
}

.smc-account-page .smc-worker-task-view > .smc-wb--address:not(:has(+ .smc-wb--client)) {
    grid-column: 1 / -1;
}

.smc-account-page .smc-worker-task-view > .smc-account-message {
    margin: 0;
}

.smc-account-page .smc-worker-task-view .smc-account-message.smc-task-shift-note {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 0.9rem 1.2rem;
    flex-wrap: wrap;
    padding: 1rem 1.2rem;
    text-align: left;
    line-height: 1.5;
}

.smc-account-page .smc-worker-task-view .smc-account-message.smc-task-shift-note::before {
    display: none;
}

.smc-account-page .smc-worker-task-view .smc-task-shift-note strong {
    display: block;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-worker-task-view .smc-order-row dd a.smc-map-link {
    padding: 0;
    font-weight: 600;
}

.smc-account-page .smc-worker-task-view .smc-task-shift-note > div {
    flex: 1 1 260px;
}

.smc-account-page .smc-worker-task-view .smc-order-head-edit {
    width: auto;
    flex: 0 0 auto;
}

.smc-account-page .smc-task-shift-note .smc-btn {
    flex-shrink: 0;
}

.smc-account-page .smc-worker-task-view .smc-order-row--flag {
    margin: 0.2rem 0;
    padding: 0.55rem 0.75rem;
    border-radius: 10px;
    background: #fff7e6;
}

.smc-account-page .smc-worker-task-view .smc-order-row--flag dt,
.smc-account-page .smc-worker-task-view .smc-order-row--flag dd {
    color: #8a5a00;
    font-weight: 700;
}

.smc-account-page .smc-worker-task-view .smc-order-block-sub {
    margin-left: 0.4rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: var(--smc-ui-muted);
}

.smc-account-page .smc-worker-task-view .smc-task-std-hint {
    margin: -0.3rem 0 0.8rem;
    font-size: 0.84rem;
    color: var(--smc-ui-text);
}

.smc-account-page .smc-worker-task-view .smc-order-row dd a.smc-map-link,
.smc-account-page .smc-worker-task-view .smc-order-row dd a[href^="tel:"],
.smc-account-page .smc-worker-task-view .smc-order-row dd a[href^="mailto:"] {
    color: #0a7cb8;
}

.smc-account-page .smc-worker-task-view > .smc-order-action-block {
    order: 50;
    margin: 0;
}

.smc-account-page .smc-worker-task-view .smc-order-action-btns:not(:has(.smc-btn)) {
    display: none;
}

.smc-account-page .smc-worker-task-view .smc-order-action-btns .smc-btn {
    min-height: 48px;
    padding-inline: 1.6rem;
}

.smc-account-page .smc-worker-task-view #smc-worker-msg:empty {
    display: none;
}

@media (max-width: 640px) {
    .smc-account-page .smc-task-shift-note .smc-btn {
        width: 100%;
        justify-content: center;
    }
}

/* Buttons render in the site face, not the browser default */
.smc-account-page button,
.smc-account-page select,
.smc-account-page input {
    font-family: inherit;
}

/* 12r. Worker visit checklist (/task-checklist/): readable rows, brand segmented choice */
body .smc-worker-checklist-view .smc-order-block + .smc-order-block {
    margin-top: 0;
}

body .smc-worker-checklist-view .smc-prev-visit-copy-block {
    background: var(--smc-ui-accent-soft);
    border-color: var(--smc-ui-accent-line);
    box-shadow: none;
}

.smc-worker-checklist-view .smc-prev-visit-copy-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.9rem 1.2rem;
    flex-wrap: wrap;
}

.smc-worker-checklist-view .smc-prev-visit-copy-text {
    flex: 1 1 260px;
}

.smc-worker-checklist-view .smc-prev-visit-copy-title {
    margin-bottom: 2px;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--smc-ui-ink);
}

.smc-worker-checklist-view .smc-prev-visit-copy-num {
    font-weight: 500;
    color: var(--smc-ui-muted);
}

.smc-worker-checklist-view .smc-prev-visit-copy-sub {
    font-size: 0.85rem;
    color: var(--smc-ui-text);
}

.smc-worker-checklist-view #smc-copy-prev-visit {
    flex-shrink: 0;
    white-space: nowrap;
}

body .smc-worker-checklist-view .smc-worker-planned-list {
    display: grid;
    gap: 0;
    border: 1px solid var(--smc-ui-border);
    border-radius: 14px;
    overflow: hidden;
    background: #ffffff;
}

body .smc-worker-checklist-view .smc-worker-planned-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem 1rem;
    padding: 0.7rem 0.9rem;
    border: none;
    border-bottom: 1px solid var(--smc-ui-border);
    border-radius: 0;
    background: #ffffff;
}

body .smc-worker-checklist-view .smc-worker-planned-row:last-child {
    border-bottom: none;
}

body .smc-worker-checklist-view .smc-worker-planned-left {
    flex: 1 1 auto;
    min-width: 0;
}

body .smc-worker-checklist-view .smc-worker-svc-chip {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0;
    border: none;
    background: transparent;
}

body .smc-worker-checklist-view .smc-worker-svc-dot {
    flex: 0 0 6px;
    width: 6px;
    height: 6px;
    overflow: hidden;
    border-radius: 50%;
    background: var(--smc-ui-accent);
    color: transparent;
    font-size: 0;
}

body .smc-worker-checklist-view .smc-worker-svc-label {
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--smc-ui-ink);
    line-height: 1.35;
}

body .smc-worker-checklist-view .smc-worker-planned-right {
    display: inline-flex;
    flex: 0 0 auto;
    width: auto;
    padding: 3px;
    gap: 3px;
    border: none;
    border-radius: 12px;
    background: #f1f5f9;
}

body .smc-worker-checklist-view .smc-worker-choice {
    position: relative;
    flex: 0 0 auto;
    min-width: 86px;
    margin: 0;
    cursor: pointer;
}

body .smc-worker-checklist-view .smc-worker-choice input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

body .smc-worker-checklist-view .smc-worker-choice span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 0.8rem;
    border: none;
    border-radius: 9px;
    background: transparent;
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--smc-ui-text);
    transition: background-color 0.2s var(--smc-ui-ease), color 0.2s var(--smc-ui-ease), box-shadow 0.2s var(--smc-ui-ease);
}

body .smc-worker-checklist-view .smc-worker-choice input[value="done"]:checked + span {
    background: var(--smc-ui-gradient);
    color: #ffffff;
    box-shadow: 0 6px 14px rgba(45, 182, 255, 0.26);
}

body .smc-worker-checklist-view .smc-worker-choice input[value="not_done"]:checked + span {
    background: #ffffff;
    color: #b42318;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.1);
}

body .smc-worker-checklist-view .smc-worker-choice input:focus-visible + span {
    outline: 2px solid var(--smc-ui-accent);
    outline-offset: 2px;
}

body .smc-worker-checklist-view .smc-worker-extras-add {
    display: flex;
    gap: 0.6rem;
    margin-bottom: 0.8rem;
}

body .smc-worker-checklist-view select.smc-worker-select {
    flex: 1 1 auto;
    min-height: 46px;
    border-radius: 12px;
    border-color: var(--smc-ui-border);
    font-size: 0.92rem;
}

body .smc-worker-checklist-view #smc-extra-add {
    min-height: 46px;
    padding-inline: 1.3rem;
}

body .smc-worker-checklist-view .smc-worker-extras-list > .smc-account-message {
    max-width: none;
    margin: 0;
}

body .smc-worker-checklist-view .smc-order-block-title {
    opacity: 1;
}

body .smc-worker-checklist-view .smc-worker-extra-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.7rem 0.9rem;
    border: 1px solid var(--smc-ui-border);
    border-radius: 12px;
    background: #ffffff;
}

body .smc-worker-checklist-view .smc-worker-extra-item + .smc-worker-extra-item {
    margin-top: 0.5rem;
}

body .smc-worker-checklist-view .smc-worker-extra-title {
    font-size: 0.92rem;
    color: var(--smc-ui-ink);
}

body .smc-worker-checklist-view .smc-worker-extra-key {
    font-size: 0.76rem;
    color: var(--smc-ui-muted);
}

body .smc-worker-checklist-view .smc-extra-remove {
    width: auto;
    min-height: 34px;
    padding: 0 0.9rem;
    font-size: 0.82rem;
}

body .smc-worker-checklist-view .smc-worker-textarea {
    width: 100%;
    min-height: 110px;
    padding: 0.8rem 0.95rem;
    border: 1px solid var(--smc-ui-border);
    border-radius: 12px;
    font: inherit;
    font-size: 0.92rem;
    color: var(--smc-ui-ink);
    resize: vertical;
}

body .smc-worker-checklist-view .smc-worker-textarea:focus {
    outline: none;
    border-color: var(--smc-ui-accent);
    box-shadow: 0 0 0 3px rgba(45, 182, 255, 0.18);
}

body .smc-worker-checklist-view .smc-task-time-block {
    box-shadow: var(--smc-ui-shadow);
}

body .smc-worker-checklist-view .smc-worker-actions {
    flex-direction: row;
}

body .smc-worker-checklist-view .smc-worker-actions .smc-btn {
    width: auto;
    min-height: 50px;
    padding-inline: 2rem;
    font-size: 0.95rem;
}

@media (max-width: 640px) {
    body .smc-worker-checklist-view .smc-worker-planned-row {
        flex-direction: column;
        align-items: stretch;
        gap: 0.55rem;
    }

    body .smc-worker-checklist-view .smc-worker-planned-right {
        display: flex;
    }

    body .smc-worker-checklist-view .smc-worker-choice {
        flex: 1 1 0;
    }

    body .smc-worker-checklist-view .smc-worker-choice span {
        min-height: 40px;
    }

    body .smc-worker-checklist-view .smc-worker-actions .smc-btn,
    body .smc-worker-checklist-view #smc-copy-prev-visit {
        width: 100%;
        justify-content: center;
    }
}

/* 12s. Sticker task checklist (/worker-sticker-task-checklist/) */
.smc-account-page .smc-cl-row {
    align-items: center;
    padding: 0.7rem 1rem;
}

.smc-account-page .smc-cl-item-text {
    font-size: 0.92rem;
    font-weight: 500;
    color: var(--smc-ui-ink);
}

.smc-account-page button.smc-cl-toggle {
    min-height: 32px;
    min-width: 76px;
    padding: 0.3rem 0.9rem;
    border-radius: 999px;
    border: 1px solid transparent;
    font-size: 0.8rem;
    font-weight: 700;
    box-shadow: none;
    transition: background-color 0.2s var(--smc-ui-ease), color 0.2s var(--smc-ui-ease), border-color 0.2s var(--smc-ui-ease);
}

.smc-account-page button.smc-cl-toggle.is-done {
    background: var(--smc-ui-accent-soft);
    border-color: var(--smc-ui-accent-line);
    color: #0a7cb8;
}

.smc-account-page button.smc-cl-toggle.is-skip {
    background: #f6f9fc;
    border-color: var(--smc-ui-border);
    color: var(--smc-ui-muted);
}

.smc-account-page .smc-cl-row.is-skip .smc-cl-item-text {
    color: var(--smc-ui-muted);
    text-decoration: line-through;
    text-decoration-color: #c5d0dc;
}

.smc-account-page .smc-extras-section {
    margin: 0 0 1rem;
    padding: 1.2rem 1.3rem;
    border: 1px solid var(--smc-ui-border);
    border-radius: 16px;
    background: #ffffff;
    box-shadow: var(--smc-ui-shadow);
}

.smc-account-page .smc-extras-section-label {
    margin: 0 0 0.3rem;
    font-size: 0.74rem;
    letter-spacing: 0.1em;
    color: var(--smc-ui-accent);
}

.smc-account-page .smc-extras-hint {
    margin: 0 0 0.8rem;
    font-size: 0.85rem;
    color: var(--smc-ui-text);
}

.smc-account-page .smc-extras-empty {
    font-size: 0.85rem;
    color: var(--smc-ui-muted);
}

.smc-account-page .smc-extras-add-row {
    margin: 0;
}

.smc-account-page .smc-extras-add-row select,
.smc-account-page .smc-extras-qty {
    min-height: 46px;
    border-color: var(--smc-ui-border);
    border-radius: 12px;
    font-size: 0.92rem;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-extras-add-row select:focus,
.smc-account-page .smc-extras-qty:focus {
    border-color: var(--smc-ui-accent);
    box-shadow: 0 0 0 3px rgba(45, 182, 255, 0.18);
}

.smc-account-page .smc-extras-add-row #smc-extra-add {
    flex-shrink: 0;
    min-height: 46px;
    white-space: nowrap;
}

.smc-account-page .smc-extra-item {
    background: #ffffff;
    border-color: var(--smc-ui-border);
    border-radius: 12px;
}

.smc-account-page .smc-extra-item-qty {
    background: var(--smc-ui-accent-soft);
    color: #0a7cb8;
}

.smc-account-page .smc-checklist-note {
    margin-bottom: 1rem;
    padding: 1.2rem 1.3rem;
    border: 1px solid var(--smc-ui-border);
    border-radius: 16px;
    background: #ffffff;
    box-shadow: var(--smc-ui-shadow);
}

.smc-account-page .smc-checklist-note label {
    margin-bottom: 0.5rem;
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--smc-ui-accent);
    opacity: 1;
}

.smc-account-page .smc-checklist-note textarea {
    width: 100%;
    min-height: 100px;
    padding: 0.8rem 0.95rem;
    border: 1px solid var(--smc-ui-border);
    border-radius: 12px;
    font-size: 0.92rem;
    color: var(--smc-ui-ink);
    resize: vertical;
}

.smc-account-page .smc-checklist-note textarea:focus {
    outline: none;
    border-color: var(--smc-ui-accent);
    box-shadow: 0 0 0 3px rgba(45, 182, 255, 0.18);
}

.smc-account-page .smc-task-time-block:has(.smc-tt-label) {
    border: 1px solid var(--smc-ui-border);
    border-radius: 16px;
    overflow: hidden;
    background: #ffffff;
    box-shadow: var(--smc-ui-shadow);
}

.smc-account-page .smc-task-time-block__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0.85rem 1.2rem;
    cursor: pointer;
}

.smc-account-page .smc-task-time-block__row:focus-within {
    background: var(--smc-ui-accent-soft);
}

.smc-account-page .smc-tt-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--smc-ui-text);
}

.smc-account-page .smc-tt-label svg {
    color: var(--smc-ui-accent);
}

.smc-account-page .smc-tt-val {
    display: flex;
    align-items: center;
    gap: 6px;
}

.smc-account-page .smc-tt-input {
    width: 120px;
    padding: 0;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--smc-ui-ink);
    text-align: right;
}

.smc-account-page .smc-tt-edit {
    color: var(--smc-ui-accent);
}

.smc-account-page .smc-tt-divider {
    height: 1px;
    margin: 0 1.2rem;
    background: var(--smc-ui-border);
}

.smc-account-page .smc-task-finish {
    margin-top: 1.2rem;
}

.smc-account-page .smc-task-finish .smc-order-action-btns {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.smc-account-page .smc-task-finish #smc-complete-btn {
    min-height: 50px;
    padding-inline: 2rem;
}

.smc-account-page .smc-complete-error {
    margin-top: 0.6rem;
    font-size: 0.86rem;
    font-weight: 600;
    color: #b42318;
}

@media (max-width: 640px) {
    .smc-account-page .smc-task-finish .smc-order-action-btns {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .smc-account-page .smc-task-finish #smc-complete-btn {
        width: 100%;
        justify-content: center;
    }

    .smc-account-page .smc-task-finish .smc-task-actions__back {
        justify-content: center;
    }
}

/* 12t. Workday (/workday/): site cards, brand accents, no blue top stripe */
body .smc-workday-page .smc-wd-card {
    padding: 1.4rem 1.5rem;
    margin-bottom: 1rem;
    border: 1px solid var(--smc-ui-border);
    border-radius: var(--smc-ui-radius);
    box-shadow: var(--smc-ui-shadow);
}

body .smc-workday-page .smc-wd-card::before {
    display: none;
}

body .smc-workday-page .smc-wd-card--toggle {
    padding: 1.05rem 1.5rem;
}

body .smc-workday-page .smc-wd-eyebrow,
body .smc-workday-page .smc-wd-rule-title {
    font-size: 0.72rem;
    letter-spacing: 0.1em;
    color: var(--smc-ui-accent);
}

body .smc-workday-page .smc-wd-rule-text,
body .smc-workday-page .smc-wd-desc {
    color: var(--smc-ui-text);
}

body .smc-workday-page .smc-wd-title {
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: -0.025em;
    color: var(--smc-ui-ink);
}

body .smc-workday-page .smc-wd-section-title,
body .smc-workday-page .smc-wd-panel-title,
body .smc-workday-page .smc-wd-period-title,
body .smc-workday-page .smc-wd-day-title {
    color: var(--smc-ui-ink);
}

body .smc-workday-page .smc-wd-stat {
    gap: 2px;
    padding: 0.8rem 1rem;
    border: none;
    border-radius: 14px;
    background: #f7fafd;
}

body .smc-workday-page .smc-wd-stat strong {
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    color: var(--smc-ui-muted);
}

body .smc-workday-page .smc-wd-stat span {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--smc-ui-ink);
    font-variant-numeric: tabular-nums;
}

body .smc-workday-page .smc-wd-pill--active,
body .smc-workday-page .smc-wd-pill--done {
    background: var(--smc-ui-accent-soft);
    border-color: var(--smc-ui-accent-line);
    color: #0a7cb8;
}

body .smc-workday-page .smc-wd-count {
    background: var(--smc-ui-accent-soft);
    color: #0a7cb8;
}

body .smc-workday-page .smc-wd-day-card {
    border-color: var(--smc-ui-border);
    border-radius: 14px;
}

body .smc-workday-page .smc-wd-day-card.is-done {
    background: #fbfdff;
    border-color: var(--smc-ui-accent-line);
}

body .smc-workday-page .smc-wd-day-open {
    color: #0a7cb8;
}

body .smc-workday-page .smc-wd-day-meta,
body .smc-workday-page .smc-wd-day-dur {
    color: var(--smc-ui-text);
}

body .smc-workday-page .smc-wd-tr-item,
body .smc-workday-page .smc-wd-history-cell {
    border-color: var(--smc-ui-border);
}

body .smc-workday-page .smc-wd-input:focus,
body .smc-workday-page .smc-wd-tp.is-focused {
    border-color: var(--smc-ui-accent);
    box-shadow: 0 0 0 3px rgba(45, 182, 255, 0.18);
}

body .smc-workday-page .smc-wd-tp-seg.is-active {
    background: var(--smc-ui-accent);
}

body .smc-workday-page .smc-wd-period-nav {
    min-height: 42px;
    border-radius: 999px;
    border: 1px solid var(--smc-ui-border);
    background: #ffffff;
    color: var(--smc-ui-ink);
    font-weight: 600;
    box-shadow: none;
}

@media (hover: hover) {
    body .smc-workday-page .smc-wd-period-nav:hover {
        border-color: var(--smc-ui-accent-line);
        background: var(--smc-ui-accent-soft);
        color: #0a7cb8;
    }
}

@media (max-width: 640px) {
    body .smc-workday-page .smc-wd-card {
        padding: 1.1rem 1.1rem;
        border-radius: 18px;
    }

    body .smc-workday-page .smc-wd-card--toggle {
        padding: 0.95rem 1.1rem;
    }

    body .smc-workday-page .smc-wd-card.smc-wd-period-bar {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.7rem;
    }

    body .smc-workday-page .smc-wd-period-bar .smc-wd-period-copy {
        grid-column: 1 / -1;
        order: -1;
    }

    body .smc-workday-page .smc-wd-period-nav {
        min-width: 0;
        width: 100%;
        padding-inline: 0.6rem;
        font-size: 0.88rem;
        white-space: nowrap;
    }
}

/* 12u. Paystubs list: number and period on one line, figures aligned */
.smc-account-page.smc-paystubs-page .smc-orders-table {
    min-width: 100%;
}

.smc-account-page.smc-paystubs-page .smc-orders-table td,
.smc-account-page.smc-paystubs-page .smc-orders-table th {
    white-space: nowrap;
}

.smc-account-page.smc-paystubs-page .smc-orders-table td:nth-child(n+3):not(.smc-orders-col-details),
.smc-account-page.smc-paystubs-page .smc-orders-table th:nth-child(n+3):not(.smc-orders-col-details) {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.smc-account-page.smc-paystubs-page .smc-orders-table td:nth-child(6) {
    font-weight: 700;
    color: var(--smc-ui-ink);
}

/* 12v. Sticker task history: Open reads as a button, short columns stay on one line */
.smc-account-page .smc-orders-table a.smc-link-open {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 1rem;
    border-radius: 999px;
    background: var(--smc-ui-gradient);
    color: #ffffff;
    font-size: 0.82rem;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 6px 14px rgba(45, 182, 255, 0.22);
    transition: filter 0.2s var(--smc-ui-ease), transform 0.2s var(--smc-ui-ease);
}

@media (hover: hover) {
    .smc-account-page .smc-orders-table a.smc-link-open:hover {
        filter: brightness(1.05);
        transform: translateY(-1px);
    }
}

.smc-account-page.smc-worker-sticker-history-page .smc-orders-table td:nth-child(1),
.smc-account-page.smc-worker-sticker-history-page .smc-orders-table td:nth-child(3),
.smc-account-page.smc-worker-sticker-history-page .smc-orders-table td:nth-child(5) {
    white-space: nowrap;
}

/* 12w. Workspace dashboard: title, icon tiles, counts on top and money below */
.smc-account-page .smc-ws-dash-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.2rem;
}

.smc-account-page .smc-ws-dash-title {
    margin: 0;
}

.smc-account-page .smc-ws-dash-period-nav {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 4px;
    border: 1px solid var(--smc-ui-border);
    border-radius: 999px;
    background: #ffffff;
}

.smc-account-page .smc-ws-dash-period {
    min-width: 120px;
    text-align: center;
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-ws-dash-nav-btn {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    color: var(--smc-ui-text);
}

.smc-account-page .smc-ws-dash-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.9rem;
}

.smc-account-page .smc-ws-dash-card {
    grid-column: span 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.15rem;
    padding: 1.1rem 1.2rem 1.15rem;
    border-radius: 16px;
    background: #ffffff;
    text-decoration: none;
    transition: border-color 0.25s var(--smc-ui-ease), box-shadow 0.25s var(--smc-ui-ease), transform 0.25s var(--smc-ui-ease);
}

.smc-account-page .smc-ws-dash-card--money {
    grid-column: span 3;
}

.smc-account-page .smc-ws-dash-ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    margin-bottom: 0.65rem;
    border-radius: 12px;
    background: var(--smc-ui-accent-soft);
    color: var(--smc-ui-accent);
}

.smc-account-page .smc-ws-dash-card--queue .smc-ws-dash-ico {
    background: #fff4e8;
    color: #d9730d;
}

.smc-account-page .smc-ws-dash-card--revenue .smc-ws-dash-ico {
    background: #ecfbf1;
    color: #16a34a;
}

.smc-account-page .smc-ws-dash-card--expenses .smc-ws-dash-ico {
    background: #fff1f1;
    color: #dc2626;
}

.smc-account-page .smc-ws-dash-card-value {
    font-size: 1.35rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1.1;
    color: var(--smc-ui-ink);
    font-variant-numeric: tabular-nums;
}

.smc-account-page .smc-ws-dash-card-label {
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--smc-ui-muted);
}

.smc-account-page .smc-ws-dash-card-unit {
    font-size: 0.74rem;
    color: var(--smc-ui-muted);
}

.smc-account-page .smc-ws-dash-card--alert {
    border-color: #ffd8b0;
}

@media (hover: hover) {
    .smc-account-page a.smc-ws-dash-card:hover {
        border-color: var(--smc-ui-accent-line);
        box-shadow: var(--smc-ui-shadow-hover);
        transform: translateY(-2px);
    }
}

@media (max-width: 640px) {
    .smc-account-page .smc-ws-dash-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.7rem;
    }

    .smc-account-page .smc-ws-dash-card,
    .smc-account-page .smc-ws-dash-card--money {
        grid-column: span 1;
        padding: 0.95rem 1rem;
    }

    .smc-account-page .smc-ws-dash-card--visits {
        grid-column: 1 / -1;
    }

    .smc-account-page .smc-ws-dash-card-value {
        font-size: 1.2rem;
    }
}

/* 12x. Clients table: name over email, one-line phone, date and actions */
.smc-account-page .smc-orders-table:has(.smc-clients-col-client) {
    table-layout: auto;
}

.smc-account-page .smc-orders-table:has(.smc-clients-col-client) th,
.smc-account-page .smc-orders-table:has(.smc-clients-col-client) td {
    width: auto;
    overflow: visible;
}

.smc-account-page .smc-orders-table:has(.smc-clients-col-client) th:nth-child(3) {
    text-align: center;
}

.smc-account-page .smc-orders-table td.smc-clients-col-phone,
.smc-account-page .smc-orders-table td.smc-clients-col-date {
    white-space: nowrap;
}

.smc-account-page .smc-orders-table td.smc-clients-col-actions > div {
    flex-wrap: nowrap;
    justify-content: flex-end;
}

.smc-account-page .smc-orders-table td a.smc-clients-email {
    color: var(--smc-ui-text) !important;
    font-size: 0.82rem;
    font-weight: 500;
}

.smc-account-page .smc-orders-table td.smc-clients-col-phone a {
    font-weight: 600;
}

/* 12y. All requests table: content columns get the width, actions sit in one row */
.smc-account-page .smc-orders-table:has(.smc-admin-requests-col-request) {
    table-layout: auto;
}

.smc-account-page .smc-orders-table:has(.smc-admin-requests-col-request) th,
.smc-account-page .smc-orders-table:has(.smc-admin-requests-col-request) td {
    width: auto;
}

.smc-account-page td.smc-admin-requests-col-request,
.smc-account-page td.smc-admin-requests-col-status,
.smc-account-page td.smc-admin-requests-col-actions {
    white-space: nowrap;
}

.smc-account-page td.smc-admin-requests-col-cleaning {
    min-width: 150px;
    max-width: 180px;
}

.smc-account-page td.smc-admin-requests-col-cleaning .smc-admin-request-address {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.smc-account-page .smc-orders-table:has(.smc-admin-requests-col-request) th,
.smc-account-page .smc-orders-table:has(.smc-admin-requests-col-request) td {
    padding-inline: 0.65rem;
}

.smc-account-page td.smc-admin-requests-col-client {
    max-width: 170px;
}

.smc-account-page td.smc-admin-requests-col-cleaning > div {
    max-width: 168px;
}

.smc-account-page td.smc-admin-requests-col-client > div {
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.smc-account-page td.smc-admin-requests-col-actions .smc-btn {
    padding-inline: 0.75rem;
}

.smc-account-page .smc-admin-request-date,
.smc-account-page .smc-admin-request-address,
.smc-account-page .smc-admin-request-address a {
    font-size: 0.8rem;
    color: var(--smc-ui-text) !important;
}

.smc-account-page .smc-admin-request-number {
    font-weight: 700;
    color: var(--smc-ui-ink);
}

/* 12z. Visits list: header button to the right, columns sized by content */
.smc-account-page .smc-orders-header > div:has(> .smc-btn):has(.smc-orders-title) {
    flex: 1 1 100%;
    width: 100%;
}

.smc-account-page .smc-orders-table:has(.smc-cv-td-when) {
    table-layout: auto;
}

.smc-account-page .smc-orders-table:has(.smc-cv-td-when) th,
.smc-account-page .smc-orders-table:has(.smc-cv-td-when) td {
    width: auto;
    padding-inline: 0.65rem;
}

.smc-account-page .smc-orders-table:has(.smc-cv-td-when) td {
    white-space: nowrap;
}

.smc-account-page .smc-cv-date,
.smc-account-page .smc-cv-visit-num {
    display: block;
    font-weight: 700;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-cv-time {
    display: block;
    font-size: 0.8rem;
    color: var(--smc-ui-text);
}

/* Referral balance: a figure, not a headline */
.smc-account-page .smc-ref-balance-big {
    font-size: 1.4rem;
    letter-spacing: -0.02em;
}

/* Order edit (/account-order-edit-v2/): same layout as /request/. On desktop the side menu steps
   aside (focus mode, back button in the header), the form is its own card and the live estimate sits on the right. */
@media (min-width: 1024px) {
    .page-template-templatesaccount-order-edit-v2-php .smc-account-inner > .smc-account-nav,
    .page-template-templatesaccount-order-edit-v2-php .smc-account-inner > nav,
    .page-template-templatesaccount-order-edit-v2-php .smc-account-inner > aside {
        display: none;
    }

    .page-template-templatesaccount-order-edit-v2-php .smc-account-inner {
        display: block;
    }

    .page-template-templatesaccount-order-edit-v2-php .smc-account-main {
        max-width: 1120px;
        margin: 0 auto;
    }

    body .smc-account-page .smc-request .smc-rq-summary {
        grid-column: 2;
        grid-row: 2 / span 4;
        position: sticky;
        top: 100px;
    }

    /* Everything before the summary (status line, pending panel, form) stays in the left column */
    body .smc-account-page .smc-request .smc-request-wrapper:has(.smc-rq-summary) > :not(.smc-rq-summary):not(.smc-request-header):not(.smc-rq-bar):not(script):not(.smc-confirm-modal) {
        grid-column: 1;
    }
}

.page-template-templatesaccount-order-edit-v2-php .smc-account-main > .smc-order-block {
    padding: 0;
    border: none;
    background: transparent;
    box-shadow: none;
}

.page-template-templatesaccount-order-edit-v2-php .smc-request .smc-request-header .smc-order-back {
    margin-bottom: 0.6rem;
}

@media (max-width: 1023px) {
    .page-template-templatesaccount-order-edit-v2-php .smc-request {
        padding-bottom: calc(110px + env(safe-area-inset-bottom)) !important;
    }
}

/* 12aa. Worker task screen: clear sections, team picker, one fixed main action */
.smc-account-page .smc-task-section {
    margin: 0 0 1rem;
    border: 1px solid var(--smc-ui-border);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: var(--smc-ui-shadow);
    overflow: hidden;
}

.smc-account-page .smc-task-section__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem 1rem;
    flex-wrap: wrap;
    padding: 0.95rem 1.1rem 0.6rem;
}

.smc-account-page .smc-task-section__title {
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--smc-ui-accent);
}

.smc-account-page .smc-task-section__meta {
    font-size: 0.78rem;
    color: var(--smc-ui-muted);
}

.smc-account-page .smc-task-list {
    margin: 0;
    padding: 0 0.4rem 0.4rem;
    list-style: none;
}

.smc-account-page .smc-task-list__item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.7rem 0.7rem;
    border-radius: 12px;
    font-size: 0.92rem;
    line-height: 1.4;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-task-list__item + .smc-task-list__item {
    border-top: 1px solid #f0f4f8;
}

.smc-account-page .smc-task-list__ico {
    flex: 0 0 26px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--smc-ui-accent-soft);
    color: var(--smc-ui-accent);
}

.smc-account-page .smc-task-list__ico--plus {
    background: #fff4e8;
    color: #d9730d;
}

.smc-account-page .smc-task-list__text {
    flex: 1 1 auto;
    min-width: 0;
}

.smc-account-page .smc-task-list__qty {
    flex: 0 0 auto;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    background: #fff4e8;
    color: #9a4d0b;
    font-size: 0.82rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

/* Teammates who helped */
.smc-account-page .smc-task-team {
    margin: 0 0 1rem;
    padding: 1.1rem;
    border: 1px solid var(--smc-ui-accent-line);
    border-radius: 18px;
    background: linear-gradient(180deg, #f7fbff 0%, #ffffff 100%);
}

.smc-account-page .smc-task-team__head {
    display: flex;
    align-items: flex-start;
    gap: 0.8rem;
    margin-bottom: 0.9rem;
}

.smc-account-page .smc-task-team__ico {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--smc-ui-gradient);
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(45, 182, 255, 0.25);
}

.smc-account-page .smc-task-team__title {
    font-size: 0.98rem;
    font-weight: 700;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-task-team__sub {
    margin-top: 2px;
    font-size: 0.84rem;
    line-height: 1.45;
    color: var(--smc-ui-text);
}

.smc-account-page .smc-task-team__list {
    display: grid;
    gap: 0.5rem;
    margin-bottom: 0.9rem;
}

.smc-account-page .smc-team-option {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 56px;
    padding: 0.55rem 0.8rem;
    border: 1px solid var(--smc-ui-border);
    border-radius: 14px;
    background: #ffffff;
    cursor: pointer;
    transition: border-color 0.2s var(--smc-ui-ease), background-color 0.2s var(--smc-ui-ease), box-shadow 0.2s var(--smc-ui-ease);
}

.smc-account-page .smc-team-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.smc-account-page .smc-team-option__avatar {
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #eef3f8;
    color: var(--smc-ui-text);
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.smc-account-page .smc-team-option__name {
    flex: 1 1 auto;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-team-option__check {
    flex: 0 0 26px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1.5px solid #cfd9e4;
    color: transparent;
    transition: background-color 0.2s var(--smc-ui-ease), border-color 0.2s var(--smc-ui-ease), color 0.2s var(--smc-ui-ease), transform 0.2s var(--smc-ui-ease);
}

.smc-account-page .smc-team-option:has(input:checked) {
    border-color: var(--smc-ui-accent);
    background: var(--smc-ui-accent-soft);
    box-shadow: 0 0 0 3px rgba(45, 182, 255, 0.14);
}

.smc-account-page .smc-team-option:has(input:checked) .smc-team-option__avatar {
    background: var(--smc-ui-gradient);
    color: #ffffff;
}

.smc-account-page .smc-team-option:has(input:checked) .smc-team-option__check {
    border-color: transparent;
    background: var(--smc-ui-accent);
    color: #ffffff;
    transform: scale(1.06);
}

.smc-account-page .smc-team-option:has(input:focus-visible) {
    outline: 2px solid var(--smc-ui-accent);
    outline-offset: 2px;
}

.smc-account-page .smc-task-team__add {
    width: 100%;
    min-height: 46px;
    justify-content: center;
}

.smc-account-page .smc-task-team__add:disabled {
    opacity: 0.5;
    cursor: default;
}

/* Main action: stays reachable at the bottom while the page scrolls */
.smc-account-page .smc-task-cta {
    position: sticky;
    bottom: calc(12px + env(safe-area-inset-bottom));
    z-index: 5;
    margin-top: 0.5rem;
    padding: 0.5rem 0 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 40%);
}

.smc-account-page .smc-task-cta__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    min-height: 54px;
    border-radius: 16px;
    font-size: 1rem;
    font-weight: 700;
    box-shadow: 0 12px 26px rgba(45, 182, 255, 0.32);
}

@media (hover: hover) {
    .smc-account-page .smc-task-cta__btn:hover svg {
        transform: translateX(3px);
    }
}

.smc-account-page .smc-task-cta__btn svg {
    transition: transform 0.25s var(--smc-ui-ease);
}

/* Unable to complete */
.smc-account-page .smc-task-unable {
    margin-top: 0.9rem;
    text-align: center;
}

.smc-account-page .smc-task-unable__toggle {
    padding: 0.5rem 0.75rem;
    border: none;
    background: none;
    font: inherit;
    font-size: 0.86rem;
    font-weight: 600;
    color: var(--smc-ui-muted);
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.smc-account-page .smc-task-unable__toggle[hidden] {
    display: none;
}

.smc-account-page .smc-task-unable__form {
    margin-top: 0.4rem;
    padding: 1rem;
    border: 1px solid #f3d0cc;
    border-radius: 16px;
    background: #fffaf9;
    text-align: left;
    animation: smc-ui-rise 0.3s var(--smc-ui-ease);
}

.smc-account-page .smc-task-unable__form[hidden] {
    display: none;
}

.smc-account-page .smc-task-unable__label {
    display: block;
    margin-bottom: 0.45rem;
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-task-unable__form textarea {
    width: 100%;
    min-height: 90px;
    padding: 0.75rem 0.9rem;
    border: 1px solid var(--smc-ui-border);
    border-radius: 12px;
    font: inherit;
    font-size: 0.95rem;
    resize: vertical;
}

.smc-account-page .smc-task-unable__form textarea:focus {
    outline: none;
    border-color: var(--smc-ui-accent);
    box-shadow: 0 0 0 3px rgba(45, 182, 255, 0.16);
}

.smc-account-page .smc-task-unable__form textarea.is-invalid {
    border-color: #d92d20;
    box-shadow: 0 0 0 3px rgba(217, 45, 32, 0.12);
}

.smc-account-page .smc-task-unable__hint {
    margin: 0.45rem 0 0.8rem;
    font-size: 0.8rem;
    color: var(--smc-ui-muted);
}

.smc-account-page .smc-task-unable__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.6rem;
}

.smc-account-page .smc-task-unable__actions .smc-btn {
    min-height: 46px;
    justify-content: center;
}

/* Active progress step breathes gently so the current stage is obvious */
@media (prefers-reduced-motion: no-preference) {
    .smc-account-page .smc-task-progress__step.is-active span {
        animation: smc-task-pulse 2.4s var(--smc-ui-ease) infinite;
    }
}

@keyframes smc-task-pulse {
    0%, 100% { box-shadow: 0 6px 14px rgba(45, 182, 255, 0.28), 0 0 0 0 rgba(45, 182, 255, 0.35); }
    50%      { box-shadow: 0 6px 14px rgba(45, 182, 255, 0.28), 0 0 0 7px rgba(45, 182, 255, 0); }
}

@keyframes smc-ui-rise {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: none; }
}

/* Button loading state */
.smc-btn.is-loading {
    pointer-events: none;
    opacity: 0.85;
}

.smc-btn-spinner {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 0.5rem;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    vertical-align: -3px;
    animation: smc-spin 0.7s linear infinite;
}

@keyframes smc-spin {
    to { transform: rotate(360deg); }
}

/* Our confirm / alert window: site card, soft entrance, red button for risky actions */
.smc-dialog-backdrop {
    animation: smc-dlg-fade 0.2s ease;
}

.smc-dialog-card {
    max-width: 380px;
    border: 1px solid var(--smc-ui-border, #e6edf5);
    border-top: 1px solid var(--smc-ui-border, #e6edf5);
    border-radius: 22px;
    box-shadow: 0 28px 70px rgba(15, 35, 60, 0.24);
    animation: smc-dlg-in 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}

.smc-dialog-body {
    padding: 1.5rem 1.4rem 1.1rem;
}

.smc-dialog-title {
    font-size: 1.08rem;
    color: #0b1220;
}

.smc-dialog-text {
    font-size: 0.92rem;
    color: #556070;
}

/* Lines under the dialog text (smc_confirm opts.list), e.g. overlapping visits */
.smc-dialog-list {
    margin: 0.75rem 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 6px;
    max-height: 40vh;
    overflow-y: auto;
}
.smc-dialog-note {
    margin: 0.75rem 0 0;
    padding: 10px 12px;
    border-radius: 12px;
    background: #f0f9ff;
    border: 1px solid #bae6fd;
    color: #0c4a6e;
    font-size: 0.86rem;
    line-height: 1.45;
}
.smc-dialog-actions-stack {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}
.smc-dialog-actions-stack .smc-btn { width: 100%; white-space: normal; }
.smc-dialog-list li {
    padding: 8px 10px;
    border-radius: 10px;
    background: #fff7ed;
    color: #7c2d12;
    font-size: 0.85rem;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.smc-dialog-actions {
    padding: 0 1.4rem calc(1.3rem + env(safe-area-inset-bottom));
    border-top: none;
    background: #ffffff;
}

.smc-dialog-actions .smc-btn {
    min-height: 46px;
    padding-inline: 0.8rem;
    border-radius: 14px;
    font-size: 0.95rem;
    white-space: nowrap;
}

.smc-dialog-actions .smc-btn-danger-solid {
    background: #d92d20;
    border: none;
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(217, 45, 32, 0.22);
}

@keyframes smc-dlg-fade {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes smc-dlg-in {
    from { opacity: 0; transform: translateY(14px) scale(0.97); }
    to   { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    .smc-dialog-backdrop,
    .smc-dialog-card,
    .smc-account-page .smc-task-unable__form {
        animation: none;
    }
}

/* 12ab. Workday status card: live dot per state, calm buttons */
body .smc-workday-page .smc-wd-card--status .smc-wd-title {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

body .smc-workday-page .smc-wd-card--status .smc-wd-title::before {
    content: "";
    flex: 0 0 12px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #c5d0dc;
}

body .smc-workday-page .smc-wd-card--status.is-working {
    border-color: #bfe8cf;
    background: linear-gradient(180deg, #f3fcf6 0%, #ffffff 55%);
}

body .smc-workday-page .smc-wd-card--status.is-working .smc-wd-title::before {
    background: #16a34a;
    box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.45);
}

body .smc-workday-page .smc-wd-card--status.is-paused {
    border-color: #f6d7a8;
    background: linear-gradient(180deg, #fffaf2 0%, #ffffff 55%);
}

body .smc-workday-page .smc-wd-card--status.is-paused .smc-wd-title::before {
    background: #f59e0b;
}

@media (prefers-reduced-motion: no-preference) {
    body .smc-workday-page .smc-wd-card--status.is-working .smc-wd-title::before {
        animation: smc-live-dot 1.8s ease-out infinite;
    }
}

@keyframes smc-live-dot {
    0%   { box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.45); }
    70%  { box-shadow: 0 0 0 10px rgba(22, 163, 74, 0); }
    100% { box-shadow: 0 0 0 0 rgba(22, 163, 74, 0); }
}

body .smc-workday-page .smc-wd-card--status.is-working .smc-wd-stat span[data-wd-stat="worked"] {
    color: #15803d;
}

body .smc-workday-page .smc-wd-note {
    margin: 0;
    padding: 0.7rem 0.9rem;
    border-radius: 12px;
    background: #fff7e6;
    color: #8a5a00;
    font-size: 0.86rem;
    font-weight: 600;
}

body .smc-workday-page [data-wd-actions] .smc-wd-btn {
    min-height: 52px;
    border-radius: 16px;
    font-size: 0.98rem;
    font-weight: 700;
}

body .smc-workday-page [data-wd-actions] .smc-btn-primary {
    background: var(--smc-ui-gradient);
    box-shadow: 0 12px 26px rgba(45, 182, 255, 0.3);
}

body .smc-workday-page [data-wd-actions] .smc-btn-neutral {
    background: #ffffff;
    border: 1px solid var(--smc-ui-border);
    color: var(--smc-ui-ink);
}

body .smc-workday-page [data-wd-actions] .smc-btn-danger {
    background: #ffffff;
    border: 1px solid #f1b8b2;
    color: #b42318;
    box-shadow: none;
}

body .smc-workday-page [data-wd-actions] .smc-btn-danger:disabled,
body .smc-workday-page [data-wd-actions] .smc-btn-danger[aria-disabled="true"] {
    opacity: 0.45;
}

@media (hover: hover) {
    body .smc-workday-page [data-wd-actions] .smc-btn-danger:not(:disabled):hover {
        background: #fff5f4;
        border-color: #d92d20;
    }
}

/* 12ac. Tasks Today: the visit in progress stands out, rows are easy to tap */
body .smc-account-page .stt-card {
    border-radius: 18px;
    transition: border-color 0.25s var(--smc-ui-ease), box-shadow 0.25s var(--smc-ui-ease), transform 0.25s var(--smc-ui-ease);
}

body .smc-account-page .smc-order-card.stt-card.stt-card--active {
    border-color: #9fd9ff !important;
    box-shadow: 0 0 0 3px rgba(45, 182, 255, 0.12), var(--smc-ui-shadow) !important;
    background: linear-gradient(180deg, #f5fbff 0%, #ffffff 45%);
}

body .smc-account-page .stt-card .smc-status--confirmed {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: var(--smc-ui-accent-soft);
    color: #0a7cb8;
}

body .smc-account-page .stt-card .smc-status--confirmed::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--smc-ui-accent);
}

@media (prefers-reduced-motion: no-preference) {
    body .smc-account-page .stt-card .smc-status--confirmed::before {
        animation: smc-live-dot-blue 1.8s ease-out infinite;
    }
}

@keyframes smc-live-dot-blue {
    0%   { box-shadow: 0 0 0 0 rgba(45, 182, 255, 0.5); }
    70%  { box-shadow: 0 0 0 7px rgba(45, 182, 255, 0); }
    100% { box-shadow: 0 0 0 0 rgba(45, 182, 255, 0); }
}

body .smc-account-page .stt-card .stt-time {
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: var(--smc-ui-ink);
}

body .smc-account-page .stt-card .stt-address {
    min-height: 34px;
    align-items: center;
    font-size: 0.9rem;
}

body .smc-account-page .stt-card .stt-address a {
    color: var(--smc-ui-ink);
    text-decoration: none;
}

body .smc-account-page .stt-card .stt-address a[href^="tel:"] {
    color: #0a7cb8;
    font-weight: 600;
}

body .smc-account-page .stt-card .stt-address svg {
    flex: 0 0 auto;
    color: var(--smc-ui-accent);
}

body .smc-account-page .stt-card .stt-action .smc-btn {
    min-height: 50px;
    border-radius: 14px;
    font-size: 0.98rem;
    font-weight: 700;
}

body .smc-account-page .stt-card--active .stt-action .smc-btn-primary {
    box-shadow: 0 10px 22px rgba(45, 182, 255, 0.3);
}

/* 12ad. Paystubs on phones: one tappable card, net pay on the right */
.smc-account-page .smc-ps-card {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 0.9rem 1rem 1.05rem;
    border: 1px solid var(--smc-ui-border);
    border-radius: 16px;
    background: #ffffff;
    box-shadow: var(--smc-ui-shadow);
    color: var(--smc-ui-ink);
    text-decoration: none;
    transition: border-color 0.2s var(--smc-ui-ease), box-shadow 0.2s var(--smc-ui-ease), transform 0.15s var(--smc-ui-ease);
}

.smc-account-page .smc-ps-card + .smc-ps-card {
    margin-top: 0.6rem;
}

.smc-account-page .smc-ps-card:active {
    transform: scale(0.99);
}

.smc-account-page .smc-ps-card__main {
    display: flex;
    flex-direction: column;
    gap: 3px;
    flex: 1 1 auto;
    min-width: 0;
}

.smc-account-page .smc-ps-card__period {
    font-size: 0.98rem;
    font-weight: 700;
    color: var(--smc-ui-ink);
}

.smc-account-page .smc-ps-card__meta {
    font-size: 0.8rem;
    color: var(--smc-ui-muted);
    font-variant-numeric: tabular-nums;
}

.smc-account-page .smc-ps-card__money {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 3px;
    flex: 0 0 auto;
}

.smc-account-page .smc-ps-card__net {
    font-size: 1.08rem;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: var(--smc-ui-ink);
    font-variant-numeric: tabular-nums;
}

.smc-account-page .smc-ps-card__gross {
    font-size: 0.76rem;
    color: var(--smc-ui-muted);
    font-variant-numeric: tabular-nums;
}

.smc-account-page .smc-ps-card__chev {
    flex: 0 0 auto;
    color: var(--smc-ui-accent);
}

@media (hover: hover) {
    .smc-account-page .smc-ps-card:hover {
        border-color: var(--smc-ui-accent-line);
        box-shadow: var(--smc-ui-shadow-hover);
    }
}

/* Calm type on phones: titles and sums never shout */
@media (max-width: 640px) {
    .smc-account-page .smc-orders-title,
    .smc-account-page .smc-profile-title,
    .smc-account-page .smc-account-title,
    .smc-account-page .smc-dashboard-title,
    .smc-account-page .smc-order-view .smc-order-details-title,
    .smc-account-page .smc-task-hero__title,
    body .smc-workday-page .smc-wd-title {
        font-size: 1.2rem;
    }

    .smc-inv-summary-amount strong {
        font-size: 1.3rem;
    }
}

/* Content appears with a soft fade (opacity only: cards may hold fixed dialogs) */
@media (prefers-reduced-motion: no-preference) {
    .smc-account-main > * {
        animation: smc-acc-fade 0.5s ease both;
    }

    .smc-account-main > :nth-child(2) { animation-delay: 0.05s; }
    .smc-account-main > :nth-child(3) { animation-delay: 0.1s; }
    .smc-account-main > :nth-child(n+4) { animation-delay: 0.15s; }
}

@keyframes smc-acc-fade {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* ============================================================
   13. SIGN IN, REGISTER, PASSWORD (main.smc-auth)
   ============================================================ */

.smc-auth .smc-auth-title {
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: -0.025em;
    color: var(--smc-ui-ink);
}

.smc-auth .smc-auth-subtitle {
    color: var(--smc-ui-text);
}

/* ============================================================
   14. 404 PAGE
   ============================================================ */

.smc-404 .smc-404-title {
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: -0.025em;
    color: var(--smc-ui-ink);
}

.smc-404 .smc-404-text {
    color: var(--smc-ui-text);
}

/* Phones: the menu becomes tiles, so the active tile gets a full outline instead of a side bar */
@media (max-width: 900px) {
    .smc-account-nav a {
        background-color: #f6f9fc;
    }

    .smc-account-nav .active,
    .smc-account-nav a.active {
        background: var(--smc-ui-accent-soft);
        box-shadow: inset 0 0 0 1.5px var(--smc-ui-accent);
    }

    .smc-account-nav a.smc-account-logout {
        background-color: #fff5f5;
    }
}

@media (max-width: 640px) {
    .smc-account-page,
    .smc-auth,
    .smc-404 {
        padding-top: 1.6rem;
    }
}

/* ============================================================
   11. RESPONSIVE
   ============================================================ */

@media (max-width: 960px) {
    .smc-ui .smc-section-accent {
        padding: 2.2rem 1.6rem;
        border-radius: 22px;
    }
}

@media (max-width: 640px) {
    :root {
        --smc-ui-gutter: 20px;
    }

    .smc-ui .smc-services-hero,
    .smc-ui .smc-about-hero,
    .smc-ui .smc-faq-hero,
    .smc-ui .smc-contact-hero,
    .smc-ui .smc-area-hero,
    .smc-ui .smc-founders-hero {
        padding-top: 2.4rem;
        padding-bottom: 1.4rem;
    }

    .smc-ui .smc-services-hero .smc-section-title,
    .smc-ui .smc-about-title,
    .smc-ui .smc-faq-title,
    .smc-ui .smc-contact-title,
    .smc-ui .smc-area-title,
    .smc-ui .smc-careers-title,
    .smc-ui .smc-founders-title,
    .smc-ui .smc-legal-title {
        font-size: 1.3rem;
        line-height: 1.2;
    }

    .smc-ui .smc-service-title,
    .smc-ui .smc-services-addons-title,
    .smc-ui .smc-contact-card-title,
    .smc-ui .smc-area-card-title,
    .smc-ui .smc-careers-section-title,
    .smc-ui .smc-about-hero-title,
    .smc-ui .smc-about-values-header .smc-section-title,
    .smc-ui .smc-about-areas-text .smc-section-title,
    .smc-ui .smc-about-trust-text .smc-section-title,
    .smc-ui .smc-founders-section-head h2 {
        font-size: 1.08rem;
    }

    /* Mobile: text in blocks starts from the left edge, buttons span the width */
    .smc-ui .smc-section-accent {
        padding: 1.9rem 1.3rem;
    }

    .smc-ui .smc-section-accent,
    .smc-ui .smc-section-accent .smc-section-text,
    .smc-ui .smc-section-accent .smc-section-title,
    .smc-ui .smc-section-accent .smc-section-subtitle {
        text-align: left;
    }

    .smc-ui .smc-section-accent .smc-section-inner {
        flex-direction: column;
        align-items: stretch;
    }

    .smc-ui .smc-section-accent .smc-section-title {
        font-size: 1.2rem;
    }

    .smc-ui .smc-section-accent .smc-section-actions {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .smc-ui .smc-section-accent .smc-btn {
        width: 100%;
        justify-content: center;
        text-align: center;
        box-sizing: border-box;
    }
}

@media (prefers-reduced-motion: reduce) {
    .smc-ui *,
    .smc-ui *::after,
    .smc-mobile-menu * {
        animation: none !important;
        transition: none !important;
    }
}

/* 12ae. Cards turned into plain canvas sections never clip their content.
   These containers keep overflow:hidden and a radius from account.css while
   their padding is 0, so the rounded corner cut the first letters of the page
   title on phones (Safari font metrics put glyphs right on the corner). */
.smc-account-page .smc-profile-card,
.smc-account-page .smc-order-details:has(.smc-ref-page),
.smc-account-page .smc-order-view,
.page-template-templatesaccount-order-edit-v2-php .smc-account-main > .smc-order-block {
    overflow: visible;
    border-radius: 0;
}

@media (max-width: 640px) {
    .smc-account-page .smc-order-details:has(.smc-orders-mobile-list),
    .smc-account-page .smc-account-card:has(.smc-reports-list),
    .smc-account-page .smc-order-details:has(.stt-week-tabs) {
        overflow: visible;
        border-radius: 0;
    }
}

/* 12af. Search filters panel (.smc-sf): animated open/close, everywhere.
   JS (smc-search-filters.js) drives height; opacity + a small rise carry the feel. */
.smc-sf.is-animated .smc-sf-panel {
    opacity: 0;
    transform: translateY(-6px);
    transition: opacity .24s ease-out, transform .3s cubic-bezier(.2,.8,.2,1), height .3s cubic-bezier(.2,.8,.2,1);
}
.smc-sf.is-animated .smc-sf-panel.is-shown {
    opacity: 1;
    transform: none;
}
.smc-sf.is-animated .smc-sf-panel.is-animating {
    overflow: hidden;
}
.smc-sf.is-animated .smc-sf-panel:not(.is-open).is-animating {
    transition-duration: .2s, .22s, .24s;
}
@media (prefers-reduced-motion: reduce) {
    .smc-sf.is-animated .smc-sf-panel { transition: none; transform: none; }
}

/* 12ag. Shift bonuses on /workday/ (set by admin on Workers Time) */
.smc-workday-page .smc-wd-bonuses { margin-top:10px; padding:8px 12px; border:1px solid #eef2f7; border-radius:12px; background:#fff; text-align:left; }
.smc-workday-page .smc-wd-bonuses-head { display:flex; justify-content:space-between; align-items:baseline; font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; color:#64748b; }
.smc-workday-page .smc-wd-bonuses-head b { font-size:14px; font-weight:700; letter-spacing:0; text-transform:none; color:#0a7cb8; font-variant-numeric:tabular-nums; }
.smc-workday-page .smc-wd-bonus-list { list-style:none; margin:4px 0 0; padding:0; }
.smc-workday-page .smc-wd-bonus { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:6px 0; font-size:14px; color:#0f172a; }
.smc-workday-page .smc-wd-bonus + .smc-wd-bonus { border-top:1px solid #f1f5f9; }
.smc-workday-page .smc-wd-bonus-name { min-width:0; font-weight:600; overflow-wrap:anywhere; }
.smc-workday-page .smc-wd-bonus-name small { display:block; font-size:12px; font-weight:500; color:#64748b; font-variant-numeric:tabular-nums; }
.smc-workday-page .smc-wd-bonus-sum { flex:0 0 auto; font-weight:700; color:#0a7cb8; font-variant-numeric:tabular-nums; }

/* 12ah. iPhone / our iOS app: Safari and WKWebView zoom the page in when a
   field under 16px gets focus, and inside the app the user cannot pinch it
   back. 16px on iOS only (desktop and Android keep their own sizes). */
@supports (-webkit-touch-callout: none) {
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]),
    select,
    textarea {
        font-size: 16px !important;
    }
}

/* 12ai. Document viewer sheet (Open PDF on phones / app) */
.smc-docview { position:fixed; inset:0; z-index:9990; display:flex; align-items:flex-end; justify-content:center; }
.smc-docview[hidden] { display:none; }
.smc-docview-backdrop { position:absolute; inset:0; background:rgba(15,23,42,.42); opacity:0; transition:opacity .24s ease-out; }
.smc-docview-sheet { position:relative; width:100%; max-width:720px; height:94vh; height:94dvh; display:flex; flex-direction:column; background:#f5f8fb; border-radius:20px 20px 0 0; box-shadow:0 -20px 50px rgba(15,23,42,.18); transform:translateY(100%); transition:transform .36s cubic-bezier(.2,.8,.2,1); }
.smc-docview.is-open .smc-docview-backdrop { opacity:1; }
.smc-docview.is-open .smc-docview-sheet { transform:none; }
.smc-docview.is-closing .smc-docview-sheet { transition-duration:.24s; transition-timing-function:cubic-bezier(.4,0,1,1); }
.smc-docview.is-closing .smc-docview-backdrop { transition-duration:.2s; }
.smc-docview-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 16px 12px; border-bottom:1px solid #e2e8f0; background:#fff; border-radius:20px 20px 0 0; }
.smc-docview-title { margin:0; min-width:0; font-size:16px; font-weight:700; color:#0f172a; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.smc-docview-close { flex:0 0 auto; height:auto !important; padding:8px 16px !important; font-size:14px !important; }
.smc-docview-body { flex:1 1 auto; overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; padding:16px; }
.smc-docview-paper { background:#fff; border-radius:14px; box-shadow:0 1px 2px rgba(15,23,42,.06), 0 8px 24px rgba(15,23,42,.06); padding:16px; }
.smc-docview-paper .smc-order-details { margin:0; padding:0; border:0; box-shadow:none; background:transparent; overflow:visible; border-radius:0; }
.smc-docview-foot { padding:12px 16px calc(12px + env(safe-area-inset-bottom)); background:#fff; border-top:1px solid #e2e8f0; }
.smc-docview-foot .smc-btn { width:100%; justify-content:center; }
html.smc-docview-lock, html.smc-docview-lock body { overflow:hidden; }
@media (min-width:721px) { .smc-docview { align-items:center; } .smc-docview-sheet { height:88vh; border-radius:20px; transform:translateY(16px) scale(.98); opacity:0; transition:transform .32s cubic-bezier(.2,.8,.2,1), opacity .24s ease-out; } .smc-docview.is-open .smc-docview-sheet { opacity:1; } .smc-docview-head { border-radius:20px 20px 0 0; } .smc-docview-foot { border-radius:0 0 20px 20px; } }
@media (prefers-reduced-motion: reduce) { .smc-docview-sheet, .smc-docview-backdrop { transition:opacity .15s linear !important; transform:none !important; } }

/* 12aj. Invoice "How to pay" */
.smc-account-page .smc-inv-howpay-intro { margin:0 0 12px; font-size:14px; color:#475569; }
.smc-account-page .smc-inv-howpay-intro strong { color:#0f172a; white-space:nowrap; }
.smc-account-page .smc-inv-howpay-list { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.smc-account-page .smc-inv-howpay-item { display:grid; grid-template-columns:36px minmax(0,1fr) auto; gap:12px; align-items:center; padding:12px 14px; border:1px solid var(--smc-ui-border, #e6edf5); border-radius:14px; background:#fff; }
.smc-account-page .smc-inv-howpay-ico { width:36px; height:36px; border-radius:10px; display:grid; place-items:center; background:var(--smc-ui-accent-soft, #eaf7ff); color:#0a7cb8; }
.smc-account-page .smc-inv-howpay-name { font-size:14px; font-weight:700; color:#0f172a; }
.smc-account-page .smc-inv-howpay-text { margin-top:2px; font-size:13px; line-height:1.45; color:#64748b; overflow-wrap:anywhere; }
.smc-account-page .smc-inv-howpay-val { color:#0f172a; font-weight:600; }
.smc-account-page .smc-inv-howpay-btn { height:auto !important; padding:8px 14px !important; font-size:13px !important; white-space:nowrap; }
.smc-account-page .smc-inv-howpay-note { margin:10px 0 0; min-height:1.2em; font-size:13px; font-weight:600; color:#0a7cb8; opacity:0; transform:translateY(-2px); transition:opacity .2s ease-out, transform .2s ease-out; }
.smc-account-page .smc-inv-howpay-note.is-on { opacity:1; transform:none; }
@media (max-width:640px) {
    .smc-account-page .smc-inv-howpay-item { grid-template-columns:36px minmax(0,1fr); }
    .smc-account-page .smc-inv-howpay-btn { grid-column:2; justify-self:start; }
}

/* 12ak. Invited-by-a-friend note on /request/ */
.smc-rq-invite { display:flex; align-items:center; gap:12px; margin:16px auto 0; max-width:640px; padding:12px 16px; border:1px solid var(--smc-ui-accent-line, #bfe6fb); border-radius:14px; background:var(--smc-ui-accent-soft, #eaf7ff); text-align:left; animation:smcRqInviteIn .42s cubic-bezier(.2,.8,.2,1) .15s both; }
.smc-rq-invite-ico { flex:0 0 auto; width:34px; height:34px; border-radius:10px; display:grid; place-items:center; background:#fff; color:#0a7cb8; }
.smc-rq-invite-text { font-size:14px; line-height:1.45; color:#334155; }
.smc-rq-invite-text strong { display:block; color:#0f172a; }
@keyframes smcRqInviteIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce) { .smc-rq-invite { animation:none; } }

/* 12al. Refer & Earn (/referrals/) */
.smc-account-page .smc-ref { display:flex; flex-direction:column; gap:14px; }
.smc-account-page .smc-ref-card { background:#fff; border:1px solid var(--smc-ui-border, #e6edf5); border-radius:18px; padding:18px; }
.smc-account-page .smc-ref-h { margin:0 0 4px; font-size:15px; font-weight:700; color:#0f172a; display:flex; align-items:center; gap:8px; }
.smc-account-page .smc-ref-muted { margin:0; font-size:13px; color:#64748b; line-height:1.45; }
.smc-account-page .smc-ref-wallet-top { display:flex; align-items:flex-end; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.smc-account-page .smc-ref-balance { margin:4px 0 2px; font-size:1.4rem; font-weight:800; letter-spacing:-.02em; color:#0f172a; font-variant-numeric:tabular-nums; }
.smc-account-page .smc-ref-apply { height:auto !important; padding:10px 18px !important; font-size:14px !important; }
.smc-account-page .smc-ref-ready { list-style:none; margin:14px 0 0; padding:0; display:grid; gap:6px; }
.smc-account-page .smc-ref-ready li { display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:12px; background:var(--smc-ui-accent-soft, #eaf7ff); font-size:13px; color:#334155; }
.smc-account-page .smc-ref-ready strong { color:#0a7cb8; }
.smc-account-page .smc-ref-ready-dot { flex:0 0 auto; width:8px; height:8px; border-radius:50%; background:#22c55e; }
.smc-account-page .smc-ref-status { margin:0; max-height:0; opacity:0; overflow:hidden; font-size:13px; font-weight:600; color:#0a7cb8; transition:opacity .24s ease-out, max-height .3s cubic-bezier(.2,.8,.2,1), margin .3s; }
.smc-account-page .smc-ref-status.is-on { max-height:80px; opacity:1; margin-top:10px; }
.smc-account-page .smc-ref-history { margin-top:14px; border-top:1px solid #eef2f7; }
.smc-account-page .smc-ref-history summary { display:flex; justify-content:space-between; align-items:center; padding:12px 0 2px; cursor:pointer; list-style:none; font-size:13px; font-weight:600; color:#475569; }
.smc-account-page .smc-ref-history summary::-webkit-details-marker { display:none; }
.smc-account-page .smc-ref-chev { width:7px; height:7px; border-right:2px solid #94a3b8; border-bottom:2px solid #94a3b8; transform:translateY(-2px) rotate(45deg); transition:transform .24s cubic-bezier(.2,.8,.2,1); }
.smc-account-page .smc-ref-history[open] .smc-ref-chev { transform:translateY(2px) rotate(-135deg); }
.smc-account-page .smc-ref-history[open] .smc-ref-tx { animation:smcRefIn .3s cubic-bezier(.2,.8,.2,1); }
.smc-account-page .smc-ref-tx { list-style:none; margin:6px 0 0; padding:0; }
.smc-account-page .smc-ref-tx li { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:9px 0; border-top:1px solid #f1f5f9; font-size:13px; color:#0f172a; }
.smc-account-page .smc-ref-tx-main { min-width:0; overflow-wrap:anywhere; }
.smc-account-page .smc-ref-tx-main small { display:block; color:#94a3b8; font-size:12px; }
.smc-account-page .smc-ref-tx-amt { flex:0 0 auto; font-weight:700; font-variant-numeric:tabular-nums; }
.smc-account-page .smc-ref-tx-amt.is-plus { color:#16a34a; }
.smc-account-page .smc-ref-tx-amt.is-minus { color:#64748b; }
.smc-account-page .smc-ref-link { display:flex; gap:8px; margin-top:12px; }
.smc-account-page .smc-ref-link input { flex:1 1 auto; min-width:0; height:44px; padding:0 12px; border:1px solid #e2e8f0; border-radius:12px; background:#f8fafc; font-size:14px; color:#0f172a; }
.smc-account-page .smc-ref-link .smc-btn { flex:0 0 auto; height:44px !important; padding:0 18px !important; font-size:14px !important; }
.smc-account-page .smc-ref-link .smc-btn.is-done { color:#16a34a !important; border-color:#bbf7d0 !important; }
.smc-account-page .smc-ref-share { width:100%; justify-content:center; margin-top:10px; height:auto !important; padding:11px 18px !important; font-size:14px !important; }
.smc-account-page .smc-ref-share-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.smc-account-page .smc-ref-chip { display:inline-flex; align-items:center; height:34px; padding:0 14px; border-radius:999px; border:1px solid #e2e8f0; background:#fff; font-size:13px; font-weight:600; color:#334155 !important; text-decoration:none !important; transition:border-color .2s ease-out, background .2s ease-out; }
@media (hover:hover) { .smc-account-page .smc-ref-chip:hover { border-color:var(--smc-ui-accent, #2db6ff); background:var(--smc-ui-accent-soft, #eaf7ff); } }
.smc-account-page .smc-ref-code { margin:12px 0 0; font-size:13px; color:#64748b; }
.smc-account-page .smc-ref-code strong { color:#0f172a; letter-spacing:.04em; }
.smc-account-page .smc-ref-steps { list-style:none; counter-reset:refstep; margin:10px 0 0; padding:0; display:grid; gap:10px; }
.smc-account-page .smc-ref-steps li { counter-increment:refstep; display:grid; grid-template-columns:26px minmax(0,1fr); column-gap:10px; font-size:13px; color:#64748b; line-height:1.45; }
.smc-account-page .smc-ref-steps li::before { content:counter(refstep); grid-row:span 2; width:26px; height:26px; border-radius:50%; background:var(--smc-ui-accent-soft, #eaf7ff); color:#0a7cb8; font-size:12px; font-weight:700; display:grid; place-items:center; }
.smc-account-page .smc-ref-steps strong { color:#0f172a; font-size:14px; }
.smc-account-page .smc-ref-count { font-size:12px; font-weight:700; color:#0a7cb8; background:var(--smc-ui-accent-soft, #eaf7ff); border-radius:999px; padding:2px 8px; }
.smc-account-page .smc-ref-empty { margin:6px 0 0; font-size:13px; color:#94a3b8; }
.smc-account-page .smc-ref-friends { list-style:none; margin:8px 0 0; padding:0; }
.smc-account-page .smc-ref-friends li { display:flex; align-items:center; gap:12px; padding:10px 0; border-top:1px solid #f1f5f9; }
.smc-account-page .smc-ref-friends li:first-child { border-top:0; }
.smc-account-page .smc-ref-avatar { flex:0 0 auto; width:36px; height:36px; border-radius:50%; display:grid; place-items:center; background:#f1f5f9; color:#475569; font-weight:700; font-size:14px; }
.smc-account-page .smc-ref-friend-main { flex:1 1 auto; min-width:0; }
.smc-account-page .smc-ref-friend-main strong { display:block; font-size:14px; color:#0f172a; }
.smc-account-page .smc-ref-friend-main small { display:block; font-size:12px; color:#64748b; }
.smc-account-page .smc-ref-pill { flex:0 0 auto; padding:4px 10px; border-radius:999px; font-size:12px; font-weight:700; }
.smc-account-page .smc-ref-pill.is-earned { background:#dcfce7; color:#166534; }
.smc-account-page .smc-ref-pill.is-wait { background:#fef3c7; color:#92400e; }
.smc-account-page .smc-ref-terms { margin:0; padding:0 4px; font-size:12px; color:#94a3b8; line-height:1.5; }
@keyframes smcRefIn { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:none; } }
@media (max-width:640px) {
    .smc-account-page .smc-ref-card { padding:16px; }
    .smc-account-page .smc-ref-apply { width:100%; justify-content:center; }
}
@media (prefers-reduced-motion: reduce) { .smc-account-page .smc-ref-status, .smc-account-page .smc-ref-chev { transition:none; } .smc-account-page .smc-ref-history[open] .smc-ref-tx { animation:none; } }
.smc-account-page .smc-order-details.smc-ref { padding:0; border:0; background:transparent; box-shadow:none; overflow:visible; border-radius:0; }
.smc-account-page .smc-order-details.smc-ref::before { display:none; }
.smc-account-page .smc-ref > .smc-orders-header { order:-2; margin-bottom:0; }

/* 12am. Invoice totals: discounts and payments read at a glance */
.smc-account-page .smc-inv-totals .is-discount dt, .smc-account-page .smc-inv-totals .is-discount dd { color:#0a7cb8; }
.smc-account-page .smc-inv-totals .is-subtotal dt, .smc-account-page .smc-inv-totals .is-subtotal dd { font-weight:600; color:#0f172a; }
.smc-account-page .smc-inv-totals .is-paid dd { color:#16a34a; }
.smc-account-page .smc-inv-totals dd { font-variant-numeric:tabular-nums; }
.smc-account-page .smc-ref-ready li { flex-wrap:wrap; }
.smc-account-page .smc-ref-ready-text { flex:1 1 200px; min-width:0; }
.smc-account-page .smc-ref-keep { border:0; background:transparent; padding:4px 0; font:inherit; font-size:13px; font-weight:600; color:#0a7cb8; cursor:pointer; text-decoration:underline; text-underline-offset:2px; }
.smc-account-page .smc-ref-keep:disabled { opacity:.6; cursor:default; }

/* 12an. Pay an invoice from the referral wallet */
.smc-account-page .smc-inv-wallet { border-color:var(--smc-ui-accent-line, #bfe6fb); background:linear-gradient(180deg, #f5fbff, #fff); }
.smc-account-page .smc-inv-wallet-pick { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:10px; }
.smc-account-page .smc-inv-wallet-chip { height:36px; padding:0 14px; border-radius:999px; border:1px solid #cbd5e1; background:#fff; font:inherit; font-size:13px; font-weight:600; color:#334155; cursor:pointer; transition:background .2s ease-out, border-color .2s ease-out, color .2s ease-out; }
.smc-account-page .smc-inv-wallet-chip.is-on { border-color:var(--smc-ui-accent, #2db6ff); background:var(--smc-ui-accent-soft, #eaf7ff); color:#0a7cb8; }
.smc-account-page .smc-inv-wallet-or { font-size:12px; color:#94a3b8; }
.smc-account-page .smc-inv-wallet-amt { position:relative; display:inline-flex; align-items:center; }
.smc-account-page .smc-inv-wallet-amt > span { position:absolute; left:11px; color:#94a3b8; font-size:14px; pointer-events:none; }
.smc-account-page .smc-inv-wallet-amt input { width:140px; height:36px; padding:0 10px 0 22px; border:1px solid #cbd5e1; border-radius:999px; font-size:14px; color:#0f172a; background:#fff; }
.smc-account-page .smc-inv-wallet-amt input:focus { outline:none; border-color:var(--smc-ui-accent, #2db6ff); box-shadow:0 0 0 3px rgba(45,182,255,.15); }
.smc-account-page .smc-inv-wallet-err { margin:6px 0 0; font-size:12px; font-weight:600; color:#b91c1c; }
.smc-account-page .smc-inv-howpay-btn:disabled { opacity:.55; cursor:default; }

/* 12ao. Refer & Earn v3: offer first, calm wallet, soft entrance */
.smc-account-page .smc-ref-hero { position:relative; overflow:hidden; padding:22px; border-radius:20px; border:1px solid var(--smc-ui-accent-line, #bfe6fb); background:linear-gradient(135deg, #eaf7ff 0%, #f7fcff 55%, #ffffff 100%); }
.smc-account-page .smc-ref-eyebrow { margin:0 0 6px; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#0a7cb8; }
.smc-account-page .smc-ref-hero-title { margin:0; font-size:1.3rem; font-weight:800; letter-spacing:-.02em; color:#0f172a; }
.smc-account-page .smc-ref-hero-text { margin:6px 0 0; max-width:52ch; font-size:14px; line-height:1.5; color:#475569; }
.smc-account-page .smc-ref-hero .smc-ref-link { margin-top:16px; }
.smc-account-page .smc-ref-hero .smc-ref-link input { background:#fff; }
.smc-account-page .smc-ref-hero .smc-ref-chip { background:rgba(255,255,255,.8); }
.smc-account-page .smc-ref-wallet.is-empty { padding:14px 18px; }
.smc-account-page .smc-ref-wallet.is-empty .smc-ref-h { margin-bottom:2px; }
.smc-account-page .smc-ref-terms a { color:#0a7cb8; }
.smc-account-page .smc-ref-in { animation:smcRefRise .5s cubic-bezier(.2,.8,.2,1) both; }
.smc-account-page .smc-ref > .smc-ref-in:nth-of-type(2) { animation-delay:.06s; }
.smc-account-page .smc-ref > .smc-ref-in:nth-of-type(3) { animation-delay:.12s; }
.smc-account-page .smc-ref > .smc-ref-in:nth-of-type(4) { animation-delay:.18s; }
@keyframes smcRefRise { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
@media (max-width:640px) { .smc-account-page .smc-ref-hero { padding:18px; } .smc-account-page .smc-ref-link { flex-wrap:wrap; } .smc-account-page .smc-ref-link input { flex-basis:100%; } .smc-account-page .smc-ref-link .smc-btn { flex:1 1 auto; justify-content:center; } }
@media (prefers-reduced-motion: reduce) { .smc-account-page .smc-ref-in { animation:none; } }

/* 12ap. Paid invoice: quiet Refer & Earn line */
.smc-account-page .smc-inv-refer { margin:4px 2px 0; font-size:13px; line-height:1.5; color:#64748b; }
.smc-account-page .smc-inv-refer a { color:#0a7cb8; font-weight:600; white-space:nowrap; }

/* 12aq. Invoice totals: the final amount is the strongest line */
.smc-account-page .smc-inv-totals .is-subtotal dt, .smc-account-page .smc-inv-totals .is-subtotal dd { font-weight:500; color:#334155; }
.smc-account-page .smc-inv-totals .is-total dt, .smc-account-page .smc-inv-totals .is-total dd,
.smc-account-page .smc-inv-totals .is-total dt strong, .smc-account-page .smc-inv-totals .is-total dd strong { font-weight:800; color:#0f172a; }

/* 12ar. The chat button never covers an open window (payment, document, edit time) */
body:has(.smc-pay-overlay--visible) #smc-cw-btn,
body:has(.smc-docview:not([hidden])) #smc-cw-btn,
body:has(.smc-wt-modal:not([hidden])) #smc-cw-btn { opacity:0; pointer-events:none; transition:opacity .2s ease-out; }

/* 12as. Invoice: each selected service with its result, standard checklist collapsible */
.smc-account-page .smc-inv-svc-list { display:grid; gap:6px; }
.smc-account-page .smc-inv-svc { display:grid; grid-template-columns:10px minmax(0,1fr) auto; align-items:center; gap:10px; padding:9px 12px; border:1px solid #e5e7eb; border-radius:10px; background:#f8fafc; }
.smc-account-page .smc-inv-svc-dot { width:8px; height:8px; border-radius:50%; background:#94a3b8; }
.smc-account-page .smc-inv-svc-label { min-width:0; font-size:14px; font-weight:600; color:#0f172a; overflow-wrap:anywhere; }
.smc-account-page .smc-inv-svc-qty { font-weight:500; color:#64748b; }
.smc-account-page .smc-inv-svc-badge { font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:3px 8px; border-radius:6px; white-space:nowrap; background:#f1f5f9; color:#64748b; }
.smc-account-page .smc-inv-svc.is-done { border-color:#bbf7d0; background:#f0fdf4; }
.smc-account-page .smc-inv-svc.is-done .smc-inv-svc-dot { background:#16a34a; }
.smc-account-page .smc-inv-svc.is-done .smc-inv-svc-badge { background:#dcfce7; color:#15803d; }
.smc-account-page .smc-inv-svc.is-notdone { border-color:#fecaca; background:#fef2f2; }
.smc-account-page .smc-inv-svc.is-notdone .smc-inv-svc-dot { background:#dc2626; }
.smc-account-page .smc-inv-svc.is-notdone .smc-inv-svc-badge { background:#fee2e2; color:#b91c1c; }
.smc-account-page .smc-inv-svc.is-part { border-color:#fde68a; background:#fffbeb; }
.smc-account-page .smc-inv-svc.is-part .smc-inv-svc-dot { background:#d97706; }
.smc-account-page .smc-inv-svc.is-part .smc-inv-svc-badge { background:#fef3c7; color:#92400e; }
.smc-account-page .smc-inv-check summary { display:flex; align-items:center; gap:10px; cursor:pointer; list-style:none; }
.smc-account-page .smc-inv-check summary::-webkit-details-marker { display:none; }
.smc-account-page .smc-inv-check-title { font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#0a7cb8; }
.smc-account-page .smc-inv-check-sum { margin-left:auto; font-size:13px; font-weight:600; color:#64748b; }
.smc-account-page .smc-inv-check-sum.is-done { color:#15803d; }
.smc-account-page .smc-inv-check-chev { width:7px; height:7px; border-right:2px solid #94a3b8; border-bottom:2px solid #94a3b8; transform:translateY(-2px) rotate(45deg); transition:transform .24s cubic-bezier(.2,.8,.2,1); }
.smc-account-page .smc-inv-check[open] .smc-inv-check-chev { transform:translateY(2px) rotate(-135deg); }
.smc-account-page .smc-inv-check-body { padding-top:12px; }
.smc-account-page .smc-inv-check-body.is-anim { overflow:hidden; transition:height .3s cubic-bezier(.2,.8,.2,1), opacity .24s ease-out; }
@media (prefers-reduced-motion: reduce) { .smc-account-page .smc-inv-check-chev, .smc-account-page .smc-inv-check-body.is-anim { transition:none; } }

/* 12at. Document viewer: cloned invoice keeps account-page styles, without page padding/background */
.smc-docview-paper .smc-docview-scope { padding:0 !important; margin:0 !important; background:none !important; min-height:0 !important; }

/* 12au. Logos behave like buttons, not photos: no iOS image menu or highlight on press, no drag, no selection */
.smc-logo-link, .smc-footer-logo-full { -webkit-tap-highlight-color:transparent; -webkit-touch-callout:none; -webkit-user-select:none; user-select:none; }
.smc-logo-link img, .smc-logo-link svg, .smc-footer-logo-full img, .smc-footer-logo-full svg { -webkit-touch-callout:none; -webkit-user-drag:none; user-drag:none; -webkit-user-select:none; user-select:none; pointer-events:none; }

/* 12av. Brand photos (the cleaner on the home page, the owners) cannot be saved: no iOS image menu, no drag, no selection */
.smc-hero-card img, .smc-hr-owners-faces img, .smc-founders-photo-shell img, .smc-founders-photo-trigger img { -webkit-touch-callout:none; -webkit-user-drag:none; user-drag:none; -webkit-user-select:none; user-select:none; pointer-events:none; }
.smc-hero-card, .smc-hr-owners-faces, .smc-founders-photo-shell, .smc-founders-photo-trigger { -webkit-touch-callout:none; -webkit-user-select:none; user-select:none; -webkit-tap-highlight-color:transparent; }
.page-template-meet-the-owners .smc-pv-img, .page-template-meet-the-owners .smc-pv-thumb img { -webkit-touch-callout:none; -webkit-user-drag:none; user-drag:none; -webkit-user-select:none; user-select:none; }

/* 12aw. Promo code on an open invoice (client adds a code before paying) */
.smc-account-page .smc-inv-promo { margin:0 0 12px; border:1px solid #e6edf5; border-radius:14px; background:#fff; }
.smc-account-page .smc-inv-promo-toggle { display:flex; align-items:center; gap:10px; width:100%; padding:12px 14px; border:0; background:transparent; font:inherit; font-size:14px; font-weight:600; color:#0f172a; text-align:left; cursor:pointer; border-radius:14px; }
.smc-account-page .smc-inv-promo .smc-inv-promo-toggle, .smc-account-page .smc-inv-promo .smc-inv-promo-toggle:hover, .smc-account-page .smc-inv-promo .smc-inv-promo-toggle:active { height:auto !important; min-height:0 !important; border:0 !important; border-radius:14px !important; background:transparent !important; box-shadow:none !important; color:#0f172a !important; transform:none !important; justify-content:flex-start; }
.smc-account-page .smc-inv-promo-toggle svg { flex:0 0 auto; color:#0a7cb8; }
.smc-account-page .smc-inv-promo-toggle:focus-visible { outline:2px solid #2db6ff; outline-offset:2px; }
.smc-account-page .smc-inv-promo-chev { margin-left:auto; width:7px; height:7px; border-right:2px solid #94a3b8; border-bottom:2px solid #94a3b8; transform:translateY(-2px) rotate(45deg); transition:transform .28s cubic-bezier(.2,.8,.2,1); }
.smc-account-page .smc-inv-promo.is-open .smc-inv-promo-chev { transform:translateY(2px) rotate(-135deg); }
.smc-account-page .smc-inv-promo-panel { display:grid; grid-template-rows:0fr; opacity:0; transition:grid-template-rows .32s cubic-bezier(.2,.8,.2,1), opacity .24s ease-out; }
.smc-account-page .smc-inv-promo.is-open .smc-inv-promo-panel { grid-template-rows:1fr; opacity:1; }
.smc-account-page .smc-inv-promo-inner { min-height:0; overflow:hidden; padding:0 14px; }
.smc-account-page .smc-inv-promo.is-open .smc-inv-promo-inner { padding-bottom:14px; }
.smc-account-page .smc-inv-promo-form { display:flex; gap:8px; padding-top:2px; }
.smc-account-page .smc-inv-promo-form input { flex:1 1 auto; min-width:0; height:44px; padding:0 14px; border:1px solid #cbd5e1; border-radius:12px; background:#fff; font-size:16px; letter-spacing:.04em; text-transform:uppercase; color:#0f172a; }
.smc-account-page .smc-inv-promo-form input::placeholder { text-transform:none; letter-spacing:0; color:#94a3b8; }
.smc-account-page .smc-inv-promo-form input:focus { outline:none; border-color:#2db6ff; box-shadow:0 0 0 3px rgba(45,182,255,.15); }
.smc-account-page .smc-inv-promo-form input:disabled { background:#f8fafc; color:#64748b; }
.smc-account-page .smc-inv-promo-apply { flex:0 0 auto; height:44px !important; padding:0 18px !important; font-size:14px !important; }
.smc-account-page .smc-inv-promo-apply:disabled { opacity:.6; cursor:default; }
.smc-account-page .smc-inv-promo-msg { margin:0; max-height:0; opacity:0; overflow:hidden; font-size:13px; font-weight:600; line-height:1.45; color:#b91c1c; transition:opacity .22s ease-out, max-height .3s cubic-bezier(.2,.8,.2,1), margin .3s; }
.smc-account-page .smc-inv-promo-msg.is-on { max-height:90px; opacity:1; margin-top:8px; }
.smc-account-page .smc-inv-promo-msg.is-ok { color:#15803d; }
.smc-account-page .smc-inv-promo-hint { margin:8px 0 0; font-size:12px; line-height:1.45; color:#94a3b8; }
@media (prefers-reduced-motion: reduce) { .smc-account-page .smc-inv-promo-panel, .smc-account-page .smc-inv-promo-chev, .smc-account-page .smc-inv-promo-msg { transition:none; } }

/* 12ax. Call Queue: panels and menus open smoothly, saved state fades, error state */
.smc-account-page .smc-cq-collapse { display:grid; grid-template-rows:0fr; opacity:0; visibility:hidden; transition:grid-template-rows .34s cubic-bezier(.2,.8,.2,1), opacity .24s ease-out, visibility 0s linear .34s; }
.smc-account-page .smc-cq-collapse.is-open { grid-template-rows:1fr; opacity:1; visibility:visible; transition:grid-template-rows .34s cubic-bezier(.2,.8,.2,1), opacity .24s ease-out, visibility 0s; }
.smc-account-page .smc-cq-collapse-inner { min-height:0; overflow:hidden; }
.smc-account-page .smc-cq-collapse.is-open .smc-cq-collapse-inner { overflow:visible; }
.smc-account-page .smc-cq-pop { display:block; opacity:0; visibility:hidden; transform:translateY(-4px) scale(.98); transform-origin:top center; pointer-events:none; transition:opacity .18s ease-out, transform .2s cubic-bezier(.2,.8,.2,1), visibility 0s linear .2s; }
.smc-account-page .smc-cq-pop.is-open { opacity:1; visibility:visible; transform:none; pointer-events:auto; transition:opacity .18s ease-out, transform .2s cubic-bezier(.2,.8,.2,1), visibility 0s; }
.smc-account-page .smc-cq-saved { display:inline-block; font-size:12px; font-weight:600; color:#16a34a; opacity:0; transform:translateY(2px); transition:opacity .22s ease-out, transform .22s ease-out; }
.smc-account-page .smc-cq-saved.is-on { opacity:1; transform:none; }
.smc-account-page .smc-cq-saved.is-error { color:#b91c1c; }
@media (prefers-reduced-motion: reduce) {
    .smc-account-page .smc-cq-collapse, .smc-account-page .smc-cq-collapse.is-open, .smc-account-page .smc-cq-pop, .smc-account-page .smc-cq-pop.is-open, .smc-account-page .smc-cq-saved { transition:none; transform:none; }
}

/* 12ay. Touch screens: every text field at 16px so iOS never zooms in while typing */
@media (pointer: coarse) {
    .smc-account-page input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
    .smc-account-page select,
    .smc-account-page textarea { font-size:16px !important; }
}

/* 12az. Call Queue cards: iOS-style status control, soft sections, calm entrance */
.smc-account-page .smc-cq-card { animation:smcCqIn .38s cubic-bezier(.2,.8,.2,1) both; }
@keyframes smcCqIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
.smc-account-page .smc-cq-status { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.smc-account-page .smc-cq-seg { display:inline-flex; flex-wrap:wrap; gap:2px; padding:3px; border-radius:12px; background:#f1f5f9; max-width:100%; }
.smc-account-page .smc-cq-seg::-webkit-scrollbar { display:none; }
.smc-account-page .smc-cq-seg .smc-cq-seg-btn { flex:0 0 auto; height:32px !important; min-height:0 !important; padding:0 12px !important; border:0 !important; border-radius:9px !important; background:transparent !important; box-shadow:none !important; font:inherit; font-size:13px !important; font-weight:600; color:#475569 !important; cursor:pointer; white-space:nowrap; transform:none !important; transition:background-color .22s ease-out, color .22s ease-out, box-shadow .22s ease-out; }
.smc-account-page .smc-cq-seg .smc-cq-seg-btn:focus-visible { outline:2px solid #2db6ff; outline-offset:1px; }
.smc-account-page .smc-cq-seg .smc-cq-seg-btn.is-on { background:#fff !important; box-shadow:0 1px 3px rgba(15,23,42,.10), 0 0 0 .5px rgba(15,23,42,.06) !important; }
.smc-account-page .smc-cq-seg .smc-cq-seg-btn.is-on.is-new { color:#2563eb !important; }
.smc-account-page .smc-cq-seg .smc-cq-seg-btn.is-on.is-no_answer { color:#b45309 !important; }
.smc-account-page .smc-cq-seg .smc-cq-seg-btn.is-on.is-callback { color:#7c3aed !important; }
.smc-account-page .smc-cq-seg .smc-cq-seg-btn.is-on.is-done { color:#15803d !important; }
@media (hover:hover) { .smc-account-page .smc-cq-seg .smc-cq-seg-btn:not(.is-on):hover { color:#0f172a !important; background:rgba(255,255,255,.55) !important; } }
.smc-account-page .smc-cq-in { animation:smcCqFade .28s ease-out both; }
@keyframes smcCqFade { from { opacity:0; transform:translateY(-3px); } to { opacity:1; transform:none; } }
.smc-account-page .smc-cq-block { margin-top:14px; }
.smc-account-page .smc-cq-block-title { margin-bottom:6px; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#64748b; }
.smc-account-page .smc-cq-block textarea { border-radius:12px; transition:border-color .2s ease-out, box-shadow .2s ease-out; }
.smc-account-page .smc-cq-block textarea:focus { border-color:#2db6ff; box-shadow:0 0 0 3px rgba(45,182,255,.15); outline:none; }
.smc-account-page .smc-cq-save-row { display:flex; align-items:center; gap:10px; margin-top:8px; }
.smc-account-page .smc-cq-save { height:auto !important; padding:6px 16px !important; font-size:13px !important; }
.smc-account-page .smc-cq-task-text { padding:10px 12px; border-radius:12px; background:#f8fafc; border:1px solid #e6edf5; font-size:14px; line-height:1.5; color:#0f172a; white-space:pre-wrap; overflow-wrap:anywhere; }
.smc-account-page .smc-cq-task-empty { font-size:13px; color:#94a3b8; }
.smc-account-page .smc-cq-foot { display:flex; justify-content:flex-end; margin-top:14px; padding-top:12px; border-top:1px solid #f1f5f9; }
.smc-account-page .smc-cq-delete { height:auto !important; padding:6px 16px !important; font-size:13px !important; color:#b91c1c !important; background:#fff5f5 !important; border:1px solid #fecaca !important; box-shadow:none !important; }
@media (hover:hover) { .smc-account-page .smc-cq-delete:hover { background:#fee2e2 !important; } }
@media (prefers-reduced-motion: reduce) {
    .smc-account-page .smc-cq-card, .smc-account-page .smc-cq-in { animation:none; }
    .smc-account-page .smc-cq-seg .smc-cq-seg-btn { transition:none; }
}

/* 12ba. Call Queue: one status truth (header pill follows the control), error line, menu focus */
.smc-account-page .smc-cq-pill { display:inline-block; padding:3px 10px; border-radius:999px; border:1px solid #bfdbfe; background:#eff6ff; color:#2563eb; font-size:11px; font-weight:700; line-height:1.4; transition:background-color .25s ease-out, color .25s ease-out, border-color .25s ease-out; }
.smc-account-page .smc-cq-pill.is-no_answer { background:#fffbeb; color:#b45309; border-color:#fde68a; }
.smc-account-page .smc-cq-pill.is-callback { background:#faf5ff; color:#7c3aed; border-color:#e9d5ff; }
.smc-account-page .smc-cq-pill.is-done { background:#f0fdf4; color:#15803d; border-color:#bbf7d0; }
.smc-account-page .smc-cq-pill.is-pulse { animation:smcCqPulse .42s cubic-bezier(.2,.8,.2,1); }
@keyframes smcCqPulse { 0% { transform:scale(1); } 40% { transform:scale(1.08); } 100% { transform:scale(1); } }
.smc-account-page .smc-cq-status-err { flex-basis:100%; margin:0; max-height:0; opacity:0; overflow:hidden; font-size:13px; font-weight:600; color:#b91c1c; transition:opacity .22s ease-out, max-height .28s cubic-bezier(.2,.8,.2,1); }
.smc-account-page .smc-cq-status-err.is-on { max-height:40px; opacity:1; }
.smc-account-page .smccr-src-opt:hover, .smc-account-page .smccr-src-opt:focus-visible, .smc-account-page #smccr-suggest button:focus-visible { background:#f0f9ff !important; outline:none; }
@media (prefers-reduced-motion: reduce) { .smc-account-page .smc-cq-pill.is-pulse { animation:none; } .smc-account-page .smc-cq-status-err { transition:none; } }

/* 12bb. Call Queue: source badge filters the list, active filter chip */
.smc-account-page a.smc-cq-src { display:inline-block; padding:2px 8px; border-radius:999px; border:1px solid #bae6fd; background:#f0f9ff; color:#0369a1 !important; font-size:10px; font-weight:700; line-height:1.5; white-space:nowrap; text-decoration:none !important; transition:background-color .2s ease-out, border-color .2s ease-out, color .2s ease-out; }
@media (hover:hover) { .smc-account-page a.smc-cq-src:hover { background:#e0f2fe; border-color:#7dd3fc; } }
.smc-account-page a.smc-cq-src:focus-visible { outline:2px solid #2db6ff; outline-offset:2px; }
.smc-account-page a.smc-cq-src.is-on { background:#0369a1; border-color:#0369a1; color:#fff !important; }
.smc-account-page .smc-cq-filter { display:inline-flex; align-items:center; gap:8px; margin:0 0 12px; padding:5px 6px 5px 12px; border-radius:999px; border:1px solid #bae6fd; background:#f0f9ff; font-size:13px; color:#0369a1; animation:smcCqFade .28s ease-out both; }
.smc-account-page .smc-cq-filter strong { color:#0f172a; }
.smc-account-page .smc-cq-filter-clear { display:inline-grid; place-items:center; width:24px; height:24px; border-radius:50%; color:#0369a1 !important; background:#fff; transition:background-color .2s ease-out; }
@media (hover:hover) { .smc-account-page .smc-cq-filter-clear:hover { background:#e0f2fe; } }
@media (prefers-reduced-motion: reduce) { .smc-account-page .smc-cq-filter { animation:none; } }

/* 12bc. Workspace dashboard: today first, what needs attention, the week ahead, then the month in one row */
.smc-account-page .smc-ws-head { margin-bottom:18px; }
.smc-account-page .smc-ws-sub { margin:4px 0 0; font-size:14px; color:#64748b; }
.smc-account-page .smc-ws-h { margin:0; font-size:15px; font-weight:700; letter-spacing:-.01em; color:#0f172a; }
.smc-account-page .smc-ws-panel-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:8px; min-height:34px; }
.smc-account-page .smc-ws-more { font-size:13px; font-weight:600; color:#0a7cb8 !important; text-decoration:none !important; }
@media (hover:hover) { .smc-account-page .smc-ws-more:hover { text-decoration:underline !important; text-underline-offset:3px; } }
.smc-account-page .smc-ws-now { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(0,1fr); gap:14px; align-items:start; }
.smc-account-page .smc-ws-panel { padding:14px 16px 10px; border-radius:16px; background:#f8fafc; border:1px solid #eef2f7; animation:smcWsIn .4s cubic-bezier(.2,.8,.2,1) both; }
.smc-account-page .smc-ws-attn { animation-delay:.06s; }
@keyframes smcWsIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
.smc-account-page .smc-ws-list { list-style:none; margin:0; padding:0; }
.smc-account-page .smc-ws-list li + li { border-top:1px solid #e8eef5; }
.smc-account-page .smc-ws-visit, .smc-account-page .smc-ws-attn-row { display:flex; align-items:center; gap:12px; margin:0 -8px; padding:10px 8px; border-radius:10px; color:inherit !important; text-decoration:none !important; transition:background-color .2s ease-out; }
@media (hover:hover) { .smc-account-page .smc-ws-visit:hover, .smc-account-page .smc-ws-attn-row:hover { background:#fff; } }
.smc-account-page .smc-ws-visit:focus-visible, .smc-account-page .smc-ws-attn-row:focus-visible, .smc-account-page .smc-ws-day:focus-visible { outline:2px solid #2db6ff; outline-offset:1px; }
.smc-account-page .smc-ws-time { flex:0 0 96px; font-size:13px; font-weight:700; color:#0f172a; font-variant-numeric:tabular-nums; }
.smc-account-page .smc-ws-who { flex:1 1 auto; min-width:0; display:grid; }
.smc-account-page .smc-ws-who strong { font-size:14px; font-weight:600; color:#0f172a; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.smc-account-page .smc-ws-who small { font-size:12px; color:#64748b; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.smc-account-page .smc-ws-state { flex:0 0 auto; padding:3px 9px; border-radius:999px; font-size:11px; font-weight:700; background:#eff6ff; color:#2563eb; }
.smc-account-page .smc-ws-state.is-accepted { background:#ecfeff; color:#0e7490; }
.smc-account-page .smc-ws-state.is-progress { background:#fff7ed; color:#c2410c; }
.smc-account-page .smc-ws-state.is-done { background:#f0fdf4; color:#15803d; }
.smc-account-page .smc-ws-attn-n { flex:0 0 auto; min-width:30px; height:30px; padding:0 8px; border-radius:10px; display:inline-grid; place-items:center; font-size:14px; font-weight:800; font-variant-numeric:tabular-nums; background:#eaf7ff; color:#0a7cb8; }
.smc-account-page .smc-ws-attn-n.is-warm { background:#fff4e8; color:#c2410c; }
.smc-account-page .smc-ws-attn-n.is-violet { background:#f5f3ff; color:#6d28d9; }
.smc-account-page .smc-ws-attn-n.is-red { background:#fef2f2; color:#b91c1c; }
.smc-account-page .smc-ws-attn-n.is-green { background:#f0fdf4; color:#15803d; }
.smc-account-page .smc-ws-attn-label { flex:1 1 auto; min-width:0; font-size:14px; color:#0f172a; }
.smc-account-page .smc-ws-chev { flex:0 0 auto; color:#94a3b8; transition:transform .2s ease-out, color .2s ease-out; }
@media (hover:hover) { .smc-account-page .smc-ws-attn-row:hover .smc-ws-chev { transform:translateX(2px); color:#0a7cb8; } }
.smc-account-page .smc-ws-empty { margin:4px 0 8px; font-size:14px; color:#64748b; }
.smc-account-page .smc-ws-clear { display:flex; align-items:center; gap:8px; color:#15803d; font-weight:600; }
.smc-account-page .smc-ws-week { margin-top:22px; animation:smcWsIn .4s cubic-bezier(.2,.8,.2,1) .12s both; }
.smc-account-page .smc-ws-days { list-style:none; margin:10px 0 0; padding:0; display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:8px; }
.smc-account-page .smc-ws-day { display:grid; justify-items:center; gap:2px; padding:10px 4px; border-radius:14px; background:#f8fafc; border:1px solid #eef2f7; text-decoration:none !important; transition:background-color .2s ease-out, border-color .2s ease-out, transform .2s ease-out; }
@media (hover:hover) { .smc-account-page .smc-ws-day:hover { background:#fff; border-color:#bfe6fb; transform:translateY(-1px); } }
.smc-account-page .smc-ws-dow { font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:#64748b; }
.smc-account-page .smc-ws-date { font-size:1.2rem; font-weight:700; color:#0f172a; font-variant-numeric:tabular-nums; line-height:1.2; }
.smc-account-page .smc-ws-count { font-size:12px; font-weight:600; color:#0a7cb8; white-space:nowrap; }
.smc-account-page .smc-ws-day.is-empty .smc-ws-count { color:#94a3b8; font-weight:500; }
.smc-account-page .smc-ws-day.is-today { background:#2db6ff; border-color:#2db6ff; }
.smc-account-page .smc-ws-day.is-today .smc-ws-dow, .smc-account-page .smc-ws-day.is-today .smc-ws-date, .smc-account-page .smc-ws-day.is-today .smc-ws-count { color:#fff; }
.smc-account-page .smc-ws-month { margin-top:22px; padding-top:18px; border-top:1px solid #eef2f7; animation:smcWsIn .4s cubic-bezier(.2,.8,.2,1) .18s both; }
.smc-account-page .smc-ws-month .smc-ws-dash-grid { grid-template-columns:repeat(5, minmax(0,1fr)); gap:10px; margin-top:6px; }
.smc-account-page .smc-ws-month .smc-ws-dash-card { grid-column:auto; padding:12px 14px; border-radius:14px; gap:2px; }
.smc-account-page .smc-ws-month .smc-ws-dash-ico { width:30px; height:30px; margin-bottom:6px; border-radius:9px; }
.smc-account-page .smc-ws-month .smc-ws-dash-ico svg { width:15px; height:15px; }
.smc-account-page .smc-ws-month .smc-ws-dash-card-value { font-size:1.2rem; }
.smc-account-page .smc-ws-month .smc-ws-dash-card-label { font-size:.68rem; }
@media (max-width:960px) {
    .smc-account-page .smc-ws-now { grid-template-columns:minmax(0,1fr); }
    .smc-account-page .smc-ws-month .smc-ws-dash-grid { grid-template-columns:repeat(3, minmax(0,1fr)); }
}
@media (max-width:640px) {
    .smc-account-page .smc-ws-panel { padding:12px 12px 6px; }
    .smc-account-page .smc-ws-time { flex-basis:78px; font-size:12px; }
    .smc-account-page .smc-ws-days { gap:4px; }
    .smc-account-page .smc-ws-day { padding:8px 0; border-radius:12px; }
    .smc-account-page .smc-ws-dow { font-size:10px; letter-spacing:.02em; }
    .smc-account-page .smc-ws-date { font-size:1.05rem; }
    .smc-account-page .smc-ws-count { font-size:12px; font-weight:700; }
    .smc-account-page .smc-ws-month .smc-ws-dash-grid { grid-template-columns:repeat(2, minmax(0,1fr)); }
    .smc-account-page .smc-ws-month .smc-ws-dash-card:nth-child(3) { grid-column:auto; }
    .smc-account-page .smc-ws-month .smc-ws-dash-card:nth-child(5) { grid-column:1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
    .smc-account-page .smc-ws-panel, .smc-account-page .smc-ws-week, .smc-account-page .smc-ws-month { animation:none; }
    .smc-account-page .smc-ws-day, .smc-account-page .smc-ws-chev { transition:none; }
}

/* 12bd. Dashboard: next busy day when today is free; compact month numbers on phones */
.smc-account-page .smc-ws-next { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 -8px 6px; padding:10px 8px; border-radius:10px; font-size:14px; color:#0f172a !important; text-decoration:none !important; transition:background-color .2s ease-out; }
.smc-account-page .smc-ws-next svg { flex:0 0 auto; color:#94a3b8; }
@media (hover:hover) { .smc-account-page .smc-ws-next:hover { background:#fff; } }
@media (max-width:640px) {
    .smc-account-page .smc-ws-month .smc-ws-dash-grid { gap:8px; }
    .smc-account-page .smc-ws-month .smc-ws-dash-card { padding:10px 12px; }
    .smc-account-page .smc-ws-month .smc-ws-dash-ico { display:none; }
    .smc-account-page .smc-ws-month .smc-ws-dash-card-value { font-size:1.1rem; }
}

/* 12be. No sideways scrolling on phones: the week is a 7-column grid with short labels */
.smc-account-page .smc-ws-narrow { display:none; }
@media (max-width:640px) {
    .smc-account-page .smc-ws-day .smc-ws-wide { display:none; }
    .smc-account-page .smc-ws-day .smc-ws-narrow { display:inline; }
}

/* 12bf. Order page: the promo code used at checkout */
.smc-account-page .smc-order-row-promo dd { display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; }
.smc-account-page .smc-order-promo-code { display:inline-block; padding:2px 10px; border-radius:999px; background:#f0fdf4; border:1px solid #bbf7d0; color:#15803d; font-size:12px; font-weight:700; letter-spacing:.04em; }
.smc-account-page .smc-order-promo-offer { font-size:14px; color:#0f172a; }
.smc-account-page .smc-order-promo-note { flex-basis:100%; font-size:12px; color:#64748b; }

/* 12bg. No giant type (owner rule): home section titles calmer next to the hero, card payment amount at the sums limit */
@media (min-width:641px) {
    .smc-hr .smc-section-title,
    body.home .smc-hr .smc-home-welcome .smc-section-title { font-size:1.6rem; line-height:1.25; }
}
.smc-pay-modal .smc-pay-modal-amount, .smc-pay-modal-amount { font-size:1.4rem; }

/* 12bh. Stickers: who created / last edited the sticker, quiet secondary line */
.smc-stk-audit { margin-top:6px; font-size:12px; line-height:1.4; color:#6b7280; overflow-wrap:anywhere; }
.smc-stk-audit-page { margin:-6px 0 14px; }

/* ============================================================
   9c. REGISTER (/register/): create an account, or finish a Google, Apple or
   Facebook sign-up. Same fields, errors and agreements as /request/ (owner 2026-10-21).
   ============================================================ */

.smc-ui .smc-reg-page .smc-auth-wrapper {
    display: flex;
    justify-content: center;
    padding: 3rem 0 4rem;
}

.smc-ui .smc-reg-box {
    width: 100%;
    max-width: 720px;
    padding: 2rem 2rem 1.75rem;
    border-radius: 20px;
    border: 1px solid #e6edf5;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03), 0 10px 26px rgba(15, 50, 90, 0.05);
}

.smc-ui .smc-reg-box .smc-auth-title {
    margin: 0 0 0.35rem;
    font-size: 1.3rem;
    line-height: 1.25;
    color: #0b1220;
    text-wrap: balance;
}

.smc-ui .smc-reg-box .smc-auth-subtitle {
    margin: 0 0 1.5rem;
    color: #556070;
    line-height: 1.55;
}

.smc-ui .smc-reg-form.smc-request {
    display: block;
    padding: 0;
    margin: 0;
    background: none;
    min-height: 0;
}

.smc-ui .smc-reg-form .smc-form-row,
.smc-ui .smc-reg-form .smc-grid {
    margin: 0;
}

.smc-ui .smc-reg-form.smc-request > * + * {
    margin-top: 1rem;
}

.smc-ui .smc-reg-form.smc-request > .smc-reg-type {
    margin-top: 0;
}

.smc-ui .smc-reg-form .smc-grid-2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.smc-ui .smc-reg-form .smc-input {
    width: 100%;
    min-height: 46px;
    box-sizing: border-box;
}

.smc-ui .smc-reg-form .smc-plan-small-help {
    margin: 0.35rem 0 0;
    font-size: 0.82rem;
    color: #6b7686;
}

.smc-ui .smc-reg-optional {
    font-weight: 400;
    color: #6b7686;
}

.smc-ui .smc-reg-addr {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.3fr) minmax(0, 0.9fr);
    gap: 1rem;
}

/* Account type: a two way switch with a sliding thumb */
.smc-ui .smc-reg-type {
    border: 0;
    padding: 0;
    min-width: 0;
}

.smc-ui .smc-reg-type legend {
    padding: 0;
    margin-bottom: 0.45rem;
}

.smc-ui .smc-reg-seg {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 4px;
    border-radius: 14px;
    border: 1px solid #d6e0eb;
    background: #f4f8fc;
}

.smc-ui .smc-reg-seg-opt {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 0.65rem 0.75rem;
    border-radius: 11px;
    text-align: center;
    cursor: pointer;
}

.smc-ui .smc-reg-seg-opt input {
    position: absolute;
    inset: 0;
    opacity: 0;
    margin: 0;
    cursor: pointer;
}

.smc-ui .smc-reg-seg-title {
    font-weight: 700;
    font-size: 0.95rem;
    color: #6b7686;
    transition: color 0.3s ease;
}

.smc-ui .smc-reg-seg-sub {
    font-size: 0.78rem;
    color: #6b7686;
}

.smc-ui .smc-reg-seg-opt:has(input:checked) .smc-reg-seg-title {
    color: #0b1220;
}

.smc-ui .smc-reg-seg-opt:has(input:focus-visible) {
    box-shadow: 0 0 0 3px rgba(45, 182, 255, 0.35);
}

.smc-ui .smc-reg-seg-thumb {
    position: absolute;
    top: 4px;
    bottom: 4px;
    left: 4px;
    width: calc(50% - 4px);
    border-radius: 11px;
    background: #ffffff;
    border: 1px solid #dcecff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05), 0 6px 16px rgba(15, 50, 90, 0.08);
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.smc-ui .smc-reg-seg.is-commercial .smc-reg-seg-thumb {
    transform: translateX(100%);
}

/* Commercial fields open and close smoothly */
.smc-ui .smc-reg-reveal {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transform: translateY(-4px);
    transition: grid-template-rows 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease, transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), margin-top 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.smc-ui .smc-reg-form.smc-request > .smc-reg-reveal:not(.is-open) {
    margin-top: 0;
}

.smc-ui .smc-reg-reveal.is-open {
    grid-template-rows: 1fr;
    opacity: 1;
    transform: none;
}

.smc-ui .smc-reg-reveal-inner {
    min-height: 0;
    overflow: hidden;
    padding: 4px;
    margin: -4px;
}

/* Errors: the same look as the request form */
.smc-ui .smc-reg-form .smc-form-row.is-error .smc-input {
    border-color: #f87171;
    box-shadow: 0 0 0 3px rgba(248, 113, 113, 0.15);
}

.smc-ui .smc-reg-type.is-error .smc-reg-seg {
    border-color: #f87171;
    box-shadow: 0 0 0 3px rgba(248, 113, 113, 0.15);
}

.smc-ui .smc-reg-consent .smc-check {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 0.35rem;
    margin: 0 -0.35rem;
    line-height: 1.5;
    color: #556070;
    cursor: pointer;
}

.smc-ui .smc-reg-consent .smc-check input {
    margin-top: 3px;
    flex-shrink: 0;
    width: 18px;
    height: 18px;
}

.smc-ui .smc-reg-form .smc-form-actions {
    margin-top: 0.25rem;
}

.smc-ui .smc-reg-form .smc-auth-submit {
    min-height: 50px;
}

.smc-ui .smc-reg-form .smc-auth-footer {
    display: flex;
    justify-content: center;
    gap: 0.4rem;
    color: #556070;
}

@media (max-width: 640px) {
    .smc-ui .smc-reg-page .smc-auth-wrapper {
        padding: 1.25rem 16px 2.5rem;
        box-sizing: border-box;
    }

    .smc-ui .smc-reg-box {
        padding: 1.4rem 1.1rem 1.25rem;
        border-radius: 18px;
    }

    .smc-ui .smc-reg-form .smc-grid-2,
    .smc-ui .smc-reg-addr {
        grid-template-columns: minmax(0, 1fr);
    }

    .smc-ui .smc-reg-box .smc-auth-title {
        font-size: 1.2rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .smc-ui .smc-reg-seg-thumb,
    .smc-ui .smc-reg-reveal {
        transition: none;
    }
}