/* ================================================================
   PERSONAL ERP D4.1 — GLOBAL RESPONSIVE FOUNDATION
   Desktop scale · Mobile density · Forms · FAB · Empty states
   ================================================================ */

:root {
    --d41-page-max: 1380px;
    --d41-mobile-pad: 16px;
    --d41-desktop-pad: 30px;

    --d41-text-xs: .75rem;
    --d41-text-sm: .82rem;
    --d41-text: .92rem;
    --d41-text-md: 1rem;
    --d41-title-sm: 1.05rem;
    --d41-title-md: 1.2rem;

    --d41-control-mobile: 48px;
    --d41-control-desktop: 44px;
    --d41-card-gap: 10px;
}

/* ---------------------------------------------------------------
   Real font scale bridge
   --------------------------------------------------------------- */

.erp-authenticated {
    font-size: 1rem;
    line-height: 1.45;
}

.erp-authenticated .eyebrow {
    font-size: var(--d41-text-xs) !important;
    font-weight: 850;
    letter-spacing: .075em;
    line-height: 1.25;
}

.erp-authenticated small {
    font-size: var(--d41-text-sm);
}

.erp-authenticated p {
    line-height: 1.55;
}

/* Secondary copy created in D2–D3 had many fixed 6–10px values.
   These overrides intentionally use rem so UserAppearance.font_scale
   finally affects the whole ERP. */

.workspace-page-heading p,
.workspace-builder-heading p,
.workspace-list-heading p,
.workspace-text-widget,
.workspace-empty,
.workspace-widget-footer,

.d31-page-hero p:not(.eyebrow),
.d31-metric > span,
.d31-metric > small,
.d31-filter-form label > span,
.d31-clear-filter,
.d31-segmented-links a,
.d31-create-panel > summary > span:nth-child(2) small,
.d31-form-section-title small,
.d31-form label > span,
.d31-task-card small,
.d31-event-card small,
.d31-calendar-empty small,

.d32-page-hero p:not(.eyebrow),
.d32-family-hero p:not(.eyebrow),
.d32-project-metrics small,
.d32-project-metrics span,
.d32-document-metrics small,
.d32-document-metrics span,
.d32-filter-grid label > span,
.d32-document-filter label > span,
.d32-clear-link,
.d32-create-panel > summary small,
.d32-form-block-title small,
.d32-form label > span,
.d32-document-form label > span,
.d32-family-form label > span,
.d32-project-card-main p,
.d32-project-card footer,
.d32-document-card footer,
.d32-family-card p,
.d32-family-card footer,

.d33-page-hero p:not(.eyebrow),
.d33-file-object-hero p:not(.eyebrow),
.d33-note-summary small,
.d33-note-summary span,
.d33-note-filter label > span,
.d33-clear-link,
.d33-create-panel summary small,
.d33-processed-details summary small,
.d33-form-title small,
.d33-note-form label > span,
.d33-note-card p,
.d33-note-card footer,
.d33-capture-options label > span,
.d33-inbox-card time,

.d34-page-hero p:not(.eyebrow),
.d34-focus-hero p:not(.eyebrow),
.d34-template-detail-hero p,
.d34-import-preview-hero p,
.d34-week-summary small,
.d34-week-summary span,
.d34-template-summary small,
.d34-template-summary span,
.d34-import-summary small,
.d34-import-summary span,
.d34-preview-summary small,
.d34-preview-summary span,
.d34-section-copy,
.d34-backlog-grid small,
.d34-focus-labels > *,
.d34-focus-queue small,
.d34-template-card p,
.d34-template-card section small,
.d34-import-template-grid small,
.d34-import-history-copy small,

.d35-settings-hero p:not(.eyebrow),
.d35-settings-page-hero p:not(.eyebrow),
.d35-more-hero p:not(.eyebrow),
.d35-system-hero p:not(.eyebrow),
.d35-profile-hero p,
.d35-settings-grid small,
.d35-more-grid small,
.d35-workspace-links small,
.d35-user-list small,
.d35-user-list em,
.d35-service-list small,
.d35-audit-card p,
.d35-recurrence-rule small,
.d35-backup-copy p,
.d35-backup-copy > small {
    font-size: var(--d41-text-sm) !important;
}

/* Core labels and card titles */

.workspace-widget-header h2,
.workspace-object-list strong,
.workspace-link-list strong,

.d31-create-panel > summary > span:nth-child(2) strong,
.d31-form-section-title strong,
.d31-section-heading h2,

.d32-create-panel > summary strong,
.d32-form-block-title strong,
.d32-project-card-main h2,
.d32-document-main h2,
.d32-family-card h2,

.d33-create-panel summary strong,
.d33-processed-details summary strong,
.d33-form-title strong,
.d33-note-card h2,
.d33-section-heading h2,

.d34-section-heading h2,
.d34-template-card h2,
.d34-template-task-list h3,
.d34-import-history-copy strong,

.d35-section-heading h2,
.d35-settings-grid strong,
.d35-more-grid strong,
.d35-workspace-links strong,
.d35-user-list strong,
.d35-service-list strong {
    font-size: var(--d41-title-sm) !important;
}

/* ---------------------------------------------------------------
   Page headings
   --------------------------------------------------------------- */

.workspace-page-heading h1,
.workspace-builder-heading h1,
.workspace-list-heading h1,

.d31-page-hero h1,
.d31-home-heading h1,

.d32-page-hero h1,
.d32-family-hero h1,
.d32-project-detail-hero > h1,
.d32-document-detail-hero > h1,
.d32-family-detail-hero h1,

.d33-page-hero h1,
.d33-file-object-hero h1,
.d33-note-detail h1,

.d34-page-hero h1,
.d34-focus-hero h1,
.d34-template-detail-hero h1,
.d34-import-preview-hero h1,
.d34-focus-current h2,

.d35-settings-hero h1,
.d35-settings-page-hero h1,
.d35-more-hero h1,
.d35-system-hero h1,
.d35-profile-hero h1 {
    font-size: clamp(1.9rem, 7vw, 2.2rem) !important;
    line-height: 1.06 !important;
    letter-spacing: -.035em !important;
}

/* ---------------------------------------------------------------
   Global form controls
   --------------------------------------------------------------- */

.erp-authenticated input:not(
    [type="checkbox"]
):not(
    [type="radio"]
):not(
    [type="hidden"]
),
.erp-authenticated textarea,
.erp-authenticated select {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: var(--d41-control-mobile) !important;
    padding: 0 13px !important;
    border-radius: 12px !important;
    font-size: 1rem !important;
    line-height: 1.35;
}

.erp-authenticated textarea {
    min-height: 112px !important;
    padding-top: 11px !important;
    padding-bottom: 11px !important;
}

.erp-authenticated select[multiple] {
    min-height: 92px !important;
    padding-block: 8px !important;
}

.erp-authenticated label {
    min-width: 0;
}

.erp-authenticated .erp-form label > span,
.erp-authenticated .capture-form label > span {
    margin-bottom: 0 !important;
    font-size: var(--d41-text-sm) !important;
    line-height: 1.3;
}

.primary-button,
.secondary-button,
.danger-button,
.action-link-button {
    box-sizing: border-box;
    min-height: 46px !important;
    padding: 0 15px !important;
    border-radius: 12px !important;
    font-size: var(--d41-text) !important;
    font-weight: 850;
    line-height: 1.15;
}

/* Never allow native fields to overflow a card */
.d31-form,
.d32-form,
.d32-document-form,
.d32-family-form,
.d33-note-form,
.d33-capture-form,
.d34-apply-form,
.d34-template-save-form,
.d34-import-form,
.d35-profile-form,
.d35-workspace-form,
.d35-user-create-form,
.d35-recurrence-form,
.d33-capture-text,
.d33-capture-options {
    min-width: 0;
}

.d33-capture-text,
.d33-capture-text textarea {
    width: 100%;
    max-width: 100%;
}

/* ---------------------------------------------------------------
   Shared cards and empty states
   --------------------------------------------------------------- */

.content-card,
.workspace-widget,
.d31-metric,
.d32-project-metrics > a,
.d32-document-metrics > a,
.d33-note-summary > *,
.d34-week-summary article,
.d34-template-summary article,
.d34-import-summary article,
.d34-preview-summary article {
    border-radius: 15px !important;
}

.d31-empty-state,
.d32-empty-state,
.d33-empty-state,
.d34-empty-state,
.d34-focus-empty,
.d35-empty-state {
    grid-column: 1 / -1 !important;
    width: 100%;
    min-height: 0 !important;
    padding: 22px 16px !important;
}

.d31-empty-state > p,
.d32-empty-state > p,
.d33-empty-state > p,
.d34-empty-state > p,
.d34-focus-empty > p,
.d35-empty-state > p {
    font-size: var(--d41-text-sm) !important;
}

.workspace-empty {
    min-height: 0 !important;
    padding: 12px !important;
}

/* ---------------------------------------------------------------
   Metrics: less height, more readable copy
   --------------------------------------------------------------- */

.d31-metric,
.d32-project-metrics > a,
.d32-document-metrics > a,
.d33-note-summary > *,
.d34-week-summary article,
.d34-template-summary article,
.d34-import-summary article,
.d34-preview-summary article {
    min-height: 86px !important;
    padding: 12px !important;
}

.d31-metric > strong,
.d32-project-metrics strong,
.d32-document-metrics strong,
.d33-note-summary strong,
.d34-week-summary strong,
.d34-template-summary strong,
.d34-import-summary strong,
.d34-preview-summary strong {
    font-size: 1.8rem !important;
}

/* ---------------------------------------------------------------
   Create/edit panels: same structure, saner density
   --------------------------------------------------------------- */

.d31-create-panel > summary,
.d32-create-panel > summary,
.d33-create-panel > summary,
.d33-processed-details > summary,
.d35-create-user-panel > summary {
    min-height: 56px !important;
    padding: 10px 12px !important;
}

.d31-form,
.d32-form,
.d33-note-form,
.d35-user-create-form {
    gap: 10px !important;
    padding: 0 12px 12px !important;
}

.d31-form-section,
.d32-form-block,
.d32-doc-form-section,
.d33-form-block,
.d34-template-save-form > section {
    gap: 10px !important;
    padding: 12px !important;
}

.d31-form-section-title,
.d32-form-block-title,
.d33-form-title,
.d34-form-title {
    padding-bottom: 8px !important;
}

.d31-form-grid,
.d32-form-grid,
.d33-form-grid,
.d34-form-grid {
    gap: 9px !important;
}

/* ---------------------------------------------------------------
   Workspace home
   --------------------------------------------------------------- */

.workspace-dashboard {
    gap: var(--d41-card-gap) !important;
}

.workspace-widget {
    padding: 14px !important;
}

.workspace-widget-header {
    margin-bottom: 9px !important;
}

.workspace-attention-item {
    min-height: 50px !important;
}

.workspace-quick-actions > a {
    min-height: 62px !important;
}

.d31-home-heading {
    padding: 15px !important;
}

.d31-home-heading .workspace-heading-actions {
    gap: 7px !important;
}

/* ---------------------------------------------------------------
   Mobile shell
   --------------------------------------------------------------- */

@media (max-width: 1039px) {
    .erp-main .page {
        width: 100% !important;
        max-width: 860px !important;
        padding:
            18px
            var(--d41-mobile-pad)
            calc(112px + env(safe-area-inset-bottom))
            !important;
    }

    .workspace-page-heading,
    .workspace-builder-heading,
    .workspace-list-heading,
    .d31-page-hero,
    .d32-page-hero,
    .d32-family-hero,
    .d33-page-hero,
    .d34-page-hero,
    .d34-focus-hero,
    .d35-settings-hero,
    .d35-settings-page-hero,
    .d35-more-hero,
    .d35-system-hero {
        gap: 10px !important;
        margin-bottom: 13px !important;
    }

    .workspace-page-heading p,
    .workspace-builder-heading p,
    .workspace-list-heading p,
    .d31-page-hero p:not(.eyebrow),
    .d32-page-hero p:not(.eyebrow),
    .d32-family-hero p:not(.eyebrow),
    .d33-page-hero p:not(.eyebrow),
    .d34-page-hero p:not(.eyebrow),
    .d34-focus-hero p:not(.eyebrow),
    .d35-settings-hero p:not(.eyebrow),
    .d35-settings-page-hero p:not(.eyebrow),
    .d35-more-hero p:not(.eyebrow),
    .d35-system-hero p:not(.eyebrow) {
        max-width: none !important;
        font-size: var(--d41-text) !important;
        line-height: 1.5 !important;
    }

    /* FAB is the primary create action on mobile.
       Remove duplicate hero CTA buttons. */
    .d31-page-hero > .d31-hero-action,
    .d32-page-hero > .primary-button,
    .d32-family-hero > .primary-button,
    .d33-page-hero > .primary-button,
    .d34-page-hero > .primary-button,
    .d34-focus-hero > .primary-button,
    .d31-home-heading
    .workspace-heading-actions
    .primary-button {
        display: none !important;
    }

    .workspace-heading-actions {
        gap: 7px !important;
    }

    .workspace-heading-actions .secondary-button {
        min-height: 44px !important;
    }

    .mobile-bottom-nav {
        min-height: 64px;
        padding:
            6px 4px
            calc(6px + env(safe-area-inset-bottom))
            !important;
    }

    .mobile-nav-item {
        min-height: 50px !important;
        gap: 3px !important;
        font-size: .8rem !important;
    }

    .mobile-nav-icon {
        font-size: 1.28rem !important;
    }

    .mobile-create-fab {
        right: 16px !important;
        bottom:
            calc(
                76px
                + env(safe-area-inset-bottom)
            )
            !important;
        width: 56px !important;
        height: 56px !important;
        border-width: 3px !important;
        font-size: 1.8rem !important;
    }

    body.d41-form-mode .mobile-create-fab {
        display: none !important;
    }

    /* More bottom clearance on forms with sticky controls */
    body.d41-form-mode .erp-main .page {
        padding-bottom:
            calc(
                118px
                + env(safe-area-inset-bottom)
            )
            !important;
    }

    /* Mobile save bars stay usable above the bottom nav */
    .d32-sticky-save,
    .d35-save-bar {
        bottom:
            calc(
                70px
                + env(safe-area-inset-bottom)
            )
            !important;
        padding: 7px !important;
        border-radius: 13px !important;
    }

    /* Settings/cards: slightly less vertical air */
    .d35-settings-group,
    .d35-more-group {
        margin-top: 17px !important;
    }

    .d35-settings-grid > a,
    .d35-more-grid > a,
    .d35-workspace-links > a {
        min-height: 62px !important;
        padding: 10px !important;
    }

    /* Calendar strip: all seven days fit on a normal phone.
       Very narrow devices may still scroll gracefully. */
    .d31-week-strip {
        grid-template-columns: repeat(7, minmax(42px, 1fr)) !important;
        grid-auto-flow: row !important;
        grid-auto-columns: auto !important;
        gap: 4px !important;
        overflow-x: auto;
    }

    .d31-week-strip > a {
        min-width: 0;
        min-height: 58px !important;
        border-radius: 11px !important;
    }

    .d31-week-strip > a small {
        font-size: .66rem !important;
    }

    .d31-week-strip > a strong {
        font-size: 1rem !important;
    }

    .d31-calendar-day > header {
        min-height: 54px !important;
        padding: 9px 10px !important;
    }

    .d31-calendar-day > header h2 {
        font-size: .95rem !important;
    }

    /* Empty mobile days should not consume a screen */
    .d31-calendar-day:has(.d31-calendar-empty)
    .d31-event-stack {
        min-height: 0 !important;
        padding: 6px !important;
    }

    .d31-calendar-empty {
        min-height: 46px !important;
    }

    /* Task/project/document filters and form cards keep full width */
    .d31-control-panel,
    .d32-filter-card,
    .d33-filter-card {
        min-width: 0;
    }

    /* Inbox overflow bug from screenshots */
    .d33-capture-card,
    .d33-capture-form,
    .d33-capture-text,
    .d33-capture-options,
    .d33-capture-options label {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .d33-capture-text textarea {
        display: block;
        width: 100% !important;
        max-width: 100% !important;
        min-height: 118px !important;
        resize: vertical;
    }

    .d33-capture-form > button {
        min-height: 48px !important;
    }
}

/* ---------------------------------------------------------------
   Very narrow phones
   --------------------------------------------------------------- */

@media (max-width: 380px) {
    :root {
        --d41-mobile-pad: 13px;
    }

    .mobile-nav-item {
        font-size: .74rem !important;
    }

    .mobile-nav-icon {
        font-size: 1.18rem !important;
    }

    .d31-week-strip {
        grid-template-columns: repeat(7, minmax(39px, 1fr)) !important;
    }

    .d31-week-strip > a {
        min-height: 54px !important;
    }
}

/* ---------------------------------------------------------------
   Desktop foundation
   --------------------------------------------------------------- */

@media (min-width: 1040px) {
    .erp-shell {
        grid-template-columns: 236px minmax(0, 1fr) !important;
    }

    .erp-shell[data-sidebar-collapsed="true"] {
        grid-template-columns: 76px minmax(0, 1fr) !important;
    }

    .sidebar-brand {
        min-height: 70px !important;
        padding: 11px 14px !important;
    }

    .sidebar-brand-mark {
        width: 38px !important;
        height: 38px !important;
        font-size: 1rem !important;
    }

    .sidebar-brand-copy strong {
        font-size: .95rem !important;
    }

    .sidebar-brand-copy small {
        font-size: .72rem !important;
    }

    .sidebar-nav {
        gap: 13px !important;
        padding: 13px !important;
    }

    .sidebar-link {
        min-height: 44px !important;
        gap: 10px !important;
        padding: 0 11px !important;
        font-size: .9rem !important;
    }

    .sidebar-icon {
        width: 24px !important;
        flex-basis: 24px !important;
        font-size: 1.12rem !important;
    }

    .sidebar-kbd,
    .sidebar-profile-copy small {
        font-size: .7rem !important;
    }

    .sidebar-profile-copy strong {
        font-size: .84rem !important;
    }

    .desktop-topbar {
        min-height: 70px !important;
        padding: 10px 28px !important;
    }

    .topbar-search {
        min-width: 300px !important;
        min-height: 42px !important;
        padding: 0 12px !important;
        font-size: .86rem !important;
    }

    .topbar-search kbd {
        font-size: .7rem !important;
    }

    .topbar-create-button {
        min-height: 42px !important;
        padding: 0 15px !important;
        font-size: .86rem !important;
    }

    .topbar-icon-button,
    .topbar-account-trigger {
        width: 42px !important;
        height: 42px !important;
    }

    .erp-main .page {
        width: 100% !important;
        max-width: var(--d41-page-max) !important;
        padding:
            30px
            var(--d41-desktop-pad)
            56px
            !important;
    }

    .workspace-page-heading h1,
    .workspace-builder-heading h1,
    .workspace-list-heading h1,
    .d31-page-hero h1,
    .d31-home-heading h1,
    .d32-page-hero h1,
    .d32-family-hero h1,
    .d32-project-detail-hero > h1,
    .d32-document-detail-hero > h1,
    .d32-family-detail-hero h1,
    .d33-page-hero h1,
    .d33-file-object-hero h1,
    .d33-note-detail h1,
    .d34-page-hero h1,
    .d34-focus-hero h1,
    .d34-template-detail-hero h1,
    .d34-import-preview-hero h1,
    .d35-settings-hero h1,
    .d35-settings-page-hero h1,
    .d35-more-hero h1,
    .d35-system-hero h1,
    .d35-profile-hero h1 {
        font-size: clamp(2.35rem, 2.65vw, 2.85rem) !important;
    }

    .workspace-page-heading p,
    .workspace-builder-heading p,
    .workspace-list-heading p,
    .d31-page-hero p:not(.eyebrow),
    .d32-page-hero p:not(.eyebrow),
    .d32-family-hero p:not(.eyebrow),
    .d33-page-hero p:not(.eyebrow),
    .d34-page-hero p:not(.eyebrow),
    .d34-focus-hero p:not(.eyebrow),
    .d35-settings-hero p:not(.eyebrow),
    .d35-settings-page-hero p:not(.eyebrow),
    .d35-more-hero p:not(.eyebrow),
    .d35-system-hero p:not(.eyebrow) {
        font-size: var(--d41-text) !important;
    }

    .erp-authenticated input:not(
        [type="checkbox"]
    ):not(
        [type="radio"]
    ):not(
        [type="hidden"]
    ),
    .erp-authenticated select {
        min-height: var(--d41-control-desktop) !important;
        font-size: .95rem !important;
    }

    .erp-authenticated textarea {
        min-height: 100px !important;
        font-size: .95rem !important;
    }

    .d31-metric,
    .d32-project-metrics > a,
    .d32-document-metrics > a,
    .d33-note-summary > *,
    .d34-week-summary article,
    .d34-template-summary article,
    .d34-import-summary article,
    .d34-preview-summary article {
        min-height: 82px !important;
    }

    .d31-form-section,
    .d32-form-block,
    .d32-doc-form-section,
    .d33-form-block,
    .d34-template-save-form > section {
        padding: 13px !important;
    }

    /* Desktop document save controls should never cover form fields */
    .d32-sticky-save {
        position: static !important;
        bottom: auto !important;
        justify-content: end !important;
        margin-top: 2px;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
    }

    .d32-sticky-save .primary-button {
        min-width: 180px;
    }

    .d35-save-bar {
        bottom: 14px !important;
    }

    /* Empty grid states occupy the whole available row */
    .d32-project-grid > .d32-empty-state,
    .d32-document-grid > .d32-empty-state,
    .d32-family-grid > .d32-empty-state,
    .d33-notes-grid > .d33-empty-state,
    .d34-template-grid > .d34-empty-state {
        grid-column: 1 / -1 !important;
    }
}

/* ---------------------------------------------------------------
   PWA prompt: useful once, not permanently floating over every page
   --------------------------------------------------------------- */

.d41-pwa-install-prompt {
    transition:
        opacity 180ms ease,
        transform 180ms ease !important;
}

.d41-pwa-install-prompt.is-hidden {
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateY(10px) !important;
}

/* ---------------------------------------------------------------
   Form mode / anchor protection
   --------------------------------------------------------------- */

[id^="new-"],
.d32-form-hero,
.d35-settings-page-hero {
    scroll-margin-top: 86px;
}
