/*
 * Plants Manager authenticated UI foundation.
 * Loaded after CSS isolation so shared controls remain visually consistent.
 * Public shopping and authentication views are intentionally excluded.
 */

.layout-container {
    --pm-app-bg: #f5f7f8;
    --pm-app-surface: #ffffff;
    --pm-app-surface-muted: #f8fafb;
    --pm-app-surface-selected: #eef6f2;
    --pm-app-text: #18212b;
    --pm-app-text-muted: #66727f;
    --pm-app-border: #e1e7ea;
    --pm-app-border-strong: #cdd6db;
    --pm-app-primary: #1d2939;
    --pm-app-primary-hover: #101828;
    --pm-app-accent: #2d7651;
    --pm-app-accent-hover: #235f41;
    --pm-app-accent-soft: #eaf5ee;
    --pm-app-danger: #c33b43;
    --pm-app-danger-soft: #fff1f2;
    --pm-app-warning: #a96216;
    --pm-app-warning-soft: #fff8eb;
    --pm-app-radius: 8px;
    --pm-app-radius-control: 8px;
    --pm-app-shadow: 0 1px 2px rgba(16, 24, 40, .035), 0 8px 24px rgba(16, 24, 40, .045);
    --pm-app-focus: 0 0 0 3px rgba(45, 118, 81, .14);
    color: var(--pm-app-text);
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.layout-container .page-content {
    background: var(--pm-app-bg);
}

.layout-container .page-content > :where(.app-container, .pm-app-page),
.layout-container .page-content > :where(.page-wrapper, .dashboard-wrapper) > .app-container {
    width: min(1320px, 100%);
    min-width: 0;
    min-height: 100%;
    margin: 0 auto;
    padding: 26px clamp(18px, 2.5vw, 34px) 52px;
    background: transparent;
    color: var(--pm-app-text);
}

.layout-container .page-content > :where(.page-wrapper, .dashboard-wrapper) {
    width: 100%;
    min-width: 0;
    min-height: 100%;
    margin: 0;
    padding: 0;
    background: transparent;
}

/* Page headers */
.layout-container .app-container > :where(.top-bar, header.top-bar, .pm-page-header),
.layout-container .app-container :where(.page-header, .details-header, .dashboard-header, .invoices-header, .product-editor-header) {
    width: 100%;
    min-width: 0;
    min-height: 58px;
    margin: 0 0 24px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.layout-container .app-container > :where(.top-bar, header.top-bar, .pm-page-header) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.layout-container .app-container .top-bar :where(.bar-left, .header-left, .title-group, .header-content),
.layout-container .app-container .pm-page-header :where(.bar-left, .header-left, .title-group, .header-content) {
    min-width: 0;
}

.layout-container .app-container .top-bar :where(.bar-left, .header-left),
.layout-container .app-container .pm-page-header :where(.bar-left, .header-left) {
    flex: 1 1 auto;
}

.layout-container .app-container .top-bar :where(h1, .page-title),
.layout-container .app-container .pm-page-header :where(h1, .page-title),
.layout-container .app-container :where(.page-header, .details-header, .dashboard-header, .invoices-header, .product-editor-header) :where(h1, .page-title) {
    margin: 0;
    color: var(--pm-app-text);
    font-size: clamp(22px, 2.2vw, 28px);
    font-weight: 780;
    line-height: 1.2;
    letter-spacing: 0;
    overflow-wrap: anywhere;
}

.layout-container .app-container .top-bar :where(p, .subtitle),
.layout-container .app-container .pm-page-header :where(p, .subtitle),
.layout-container .app-container :where(.page-header, .details-header, .dashboard-header, .invoices-header, .product-editor-header) :where(p, .subtitle) {
    max-width: 760px;
    margin: 6px 0 0;
    color: var(--pm-app-text-muted);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.55;
    letter-spacing: 0;
}

.layout-container .app-container .top-bar :where(.eyebrow, .pm-eyebrow, .settings-eyebrow),
.layout-container .app-container .pm-page-header :where(.eyebrow, .pm-eyebrow, .settings-eyebrow) {
    display: block;
    margin: 0 0 4px;
    color: var(--pm-app-text-muted);
    font-size: 10px;
    font-weight: 800;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.layout-container .app-container :where(.bar-right, .header-actions, .actions, .action-buttons-group) {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

/* Buttons */
.layout-container :where(.action-btn, .pm-primary-button, .pm-secondary-button, .pm-save-button,
    .btn-primary, .btn-secondary, .btn-save, .btn-save-primary, .btn-action, .btn-confirm,
    .btn-cancel, .btn-refresh, .btn-soft, .btn-full-primary, .btn-generate, .primary-account-btn,
    .customer-save-button, .api-create-button, .btn-create-shipment) {
    min-height: 42px;
    max-width: 100%;
    padding: 9px 15px;
    border-radius: var(--pm-app-radius-control);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease, opacity .16s ease;
}

.layout-container :where(.action-btn.primary, .pm-primary-button, .pm-save-button,
    .btn-primary, .btn-save, .btn-save-primary, .btn-action.primary, .btn-confirm,
    .btn-full-primary, .btn-generate, .primary-account-btn, .customer-save-button,
    .api-create-button, .btn-create-shipment) {
    border: 1px solid var(--pm-app-primary);
    background: var(--pm-app-primary);
    color: #fff;
    box-shadow: 0 5px 14px rgba(29, 41, 57, .12);
}

.layout-container :where(.action-btn.secondary, .pm-secondary-button, .btn-secondary,
    .btn-action.secondary, .btn-cancel, .btn-refresh, .btn-soft) {
    border: 1px solid var(--pm-app-border);
    background: var(--pm-app-surface);
    color: var(--pm-app-text);
    box-shadow: none;
}

.layout-container :where(.btn-danger, .btn-delete, .btn-remove, .btn-danger-soft, .btn-icon-danger,
    .action-btn.danger, .tool-btn.danger) {
    border-color: #f1c6c9;
    background: var(--pm-app-danger-soft);
    color: var(--pm-app-danger);
}

@media (hover: hover) and (pointer: fine) {
    .layout-container :where(.action-btn, .pm-primary-button, .pm-secondary-button, .pm-save-button,
        .btn-primary, .btn-secondary, .btn-save, .btn-save-primary, .btn-action, .btn-confirm,
        .btn-cancel, .btn-refresh, .btn-soft, .primary-account-btn):hover:not(:disabled) {
        transform: translateY(-1px);
    }

    .layout-container :where(.action-btn.primary, .pm-primary-button, .pm-save-button,
        .btn-primary, .btn-save, .btn-save-primary, .btn-action.primary, .btn-confirm,
        .primary-account-btn):hover:not(:disabled) {
        border-color: var(--pm-app-primary-hover);
        background: var(--pm-app-primary-hover);
    }

    .layout-container :where(.action-btn.secondary, .pm-secondary-button, .btn-secondary,
        .btn-action.secondary, .btn-cancel, .btn-refresh, .btn-soft):hover:not(:disabled) {
        border-color: var(--pm-app-border-strong);
        background: var(--pm-app-surface-muted);
    }
}

.layout-container button:focus-visible,
.layout-container a:focus-visible,
.layout-container [role="button"]:focus-visible {
    outline: 0;
    box-shadow: var(--pm-app-focus);
}

.layout-container button:disabled,
.layout-container :where(.action-btn, .btn-primary, .btn-secondary, .btn-action):disabled {
    opacity: .5;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.layout-container .top-bar :where(.btn-back, .back-btn, .pm-back-button, .btn-icon-back, .settings-back-button),
.layout-container :where(.pm-icon-button, .icon-btn, .btn-icon, .btn-icon-sm, .btn-icon-small, .tool-btn) {
    width: 40px;
    min-width: 40px;
    height: 40px;
    min-height: 40px;
    padding: 0;
    border: 1px solid var(--pm-app-border);
    border-radius: var(--pm-app-radius-control);
    background: var(--pm-app-surface);
    color: var(--pm-app-text);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: none;
}

/* Forms */
.layout-container :where(.app-container, .sheet-panel, .modal-content)
    :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]), textarea, select, .form-control, .app-input, .main-input) {
    min-height: 44px;
    max-width: 100%;
    border: 1px solid var(--pm-app-border-strong);
    border-radius: var(--pm-app-radius-control);
    background-color: var(--pm-app-surface);
    color: var(--pm-app-text);
    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    letter-spacing: 0;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .025);
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.layout-container :where(.app-container, .sheet-panel, .modal-content)
    :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]), textarea, select, .form-control, .app-input, .main-input):focus {
    outline: 0;
    border-color: #7ea891;
    box-shadow: var(--pm-app-focus);
}

.layout-container :where(.app-container, .sheet-panel, .modal-content) textarea {
    min-height: 104px;
    padding: 11px 12px;
    resize: vertical;
}

.layout-container :where(.app-container, .sheet-panel, .modal-content) select:not([multiple]) {
    min-width: 0;
    padding: 0 40px 0 12px;
    appearance: none;
    -webkit-appearance: none;
    background-image: linear-gradient(45deg, transparent 50%, #66727f 50%), linear-gradient(135deg, #66727f 50%, transparent 50%);
    background-position: calc(100% - 17px) 19px, calc(100% - 12px) 19px;
    background-size: 5px 5px, 5px 5px;
    background-repeat: no-repeat;
    cursor: pointer;
}

.layout-container :where(.app-container, .sheet-panel, .modal-content) :where(label, .field-label, .form-label, .modern-label) {
    color: #485563;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 0;
}

.layout-container :where(.form-group, .input-group, .modern-input-group, .field-group, .settings-fields > label) {
    min-width: 0;
}

/* Bordered wrappers own the frame; nested controls do not create a second one. */
.layout-container :where(.search-box, .search-container, .search-wrapper, .pm-search-shell, .pm-search,
    .invoice-search, .customer-search, .picker-search, .input-with-icon, .input-wrapper,
    .currency-rate-input, .page-size-control, .customer-page-size) {
    min-width: 0;
    border: 1px solid var(--pm-app-border);
    border-radius: var(--pm-app-radius-control);
    background: var(--pm-app-surface);
    box-shadow: none;
}

.layout-container :where(.search-box, .search-container, .search-wrapper, .pm-search-shell, .pm-search,
    .invoice-search, .customer-search, .picker-search) {
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 0 12px;
}

.layout-container :where(.search-box, .search-container, .search-wrapper, .pm-search-shell, .pm-search,
    .invoice-search, .customer-search, .picker-search, .input-with-icon, .input-wrapper,
    .currency-rate-input, .page-size-control, .customer-page-size):focus-within {
    border-color: #7ea891;
    box-shadow: var(--pm-app-focus);
}

.layout-container :where(.search-box, .search-container, .search-wrapper, .pm-search-shell, .pm-search,
    .invoice-search, .customer-search, .picker-search, .input-with-icon, .input-wrapper,
    .currency-rate-input, .page-size-control, .customer-page-size)
    :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
    width: 100%;
    min-width: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    outline: 0;
}

.layout-container :where(.validation-message, .validation-msg, .field-error) {
    margin-top: 5px;
    color: var(--pm-app-danger);
    font-size: 11px;
    font-weight: 650;
    line-height: 1.4;
}

/* Cards and sections */
.layout-container .app-container :where(.card, .content-card, .modern-card, .data-container,
    .manager-section, .settings-card, .settings-panel, .form-card, .list-card, .account-panel,
    .invoice-card, .supplier-card, .production-card, .editor-card, .summary-card, .panel-card,
    .dashboard-hero, .trend-panel, .dashboard-stat-row, .earnings-panel, .quick-action-card,
    .connection-card, .catalog-card, .integration-card, .offer-card, .progress-card,
    .editor-panel, .details-section, .profile-card, .store-card) {
    border: 1px solid var(--pm-app-border);
    border-radius: var(--pm-app-radius);
    background: var(--pm-app-surface);
    box-shadow: var(--pm-app-shadow);
}

.layout-container .app-container :where(.card-header, .panel-header, .section-header, .sup-header) {
    min-width: 0;
    color: var(--pm-app-text);
    letter-spacing: 0;
}

.layout-container .app-container :where(.card-header, .panel-header, .section-header, .sup-header) :where(h2, h3, h4) {
    margin: 0;
    color: var(--pm-app-text);
    font-size: 15px;
    font-weight: 750;
    line-height: 1.35;
    letter-spacing: 0;
}

.layout-container .app-container :where(.card-header, .panel-header, .section-header, .sup-header) p {
    margin: 4px 0 0;
    color: var(--pm-app-text-muted);
    font-size: 12px;
    line-height: 1.5;
}

/* Toolbars, lists and tables */
.layout-container .app-container :where(.toolbar, .list-toolbar, .customer-toolbar, .invoice-toolbar,
    .products-toolbar, .integration-toolbar, .filters-toolbar, .filters-panel, .search-toolbar,
    .catalog-toolbar) {
    min-width: 0;
    margin: 0 0 16px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.layout-container .app-container :where(.table-shell, .list-shell, .customer-list-shell, .invoice-list) {
    min-width: 0;
}

.layout-container .app-container :where(table, .data-table) {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    color: var(--pm-app-text);
    font-size: 13px;
}

.layout-container .app-container :where(table, .data-table) th {
    padding: 11px 13px;
    border-bottom: 1px solid var(--pm-app-border);
    color: var(--pm-app-text-muted);
    font-size: 10px;
    font-weight: 750;
    line-height: 1.3;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.layout-container .app-container :where(table, .data-table) td {
    padding: 13px;
    border-bottom: 1px solid #edf0f2;
    vertical-align: middle;
}

.layout-container .app-container :where(.list-headers, .table-header) {
    color: var(--pm-app-text-muted);
    font-size: 10px;
    font-weight: 750;
    line-height: 1.3;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.layout-container .app-container :where(.list-item, .customer-row, .invoice-card, .supplier-card,
    .production-card, .complex-row) {
    transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}

@media (hover: hover) and (pointer: fine) {
    .layout-container .app-container :where(.list-item, .customer-row, .invoice-card, .supplier-card,
        .production-card, .complex-row):hover {
        border-color: var(--pm-app-border-strong);
        box-shadow: 0 8px 22px rgba(16, 24, 40, .065);
    }
}

.layout-container .app-container :where(.pagination, .customer-pagination, .pagination-controls, .pager) {
    min-width: 0;
    margin-top: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
}

.layout-container .app-container :where(.pagination, .customer-pagination, .pagination-controls, .pager) button {
    min-width: 38px;
    min-height: 38px;
    border: 1px solid var(--pm-app-border);
    border-radius: var(--pm-app-radius-control);
    background: var(--pm-app-surface);
    color: var(--pm-app-text);
}

/* View states and feedback */
.layout-container .app-container :where(.empty-state, .center-state, .loading-state, .error-state,
    .invoice-state, .customers-state, .settings-loading, .integration-loading) {
    width: 100%;
    min-height: 160px;
    margin: 0;
    padding: 28px 20px;
    border: 1px dashed var(--pm-app-border-strong);
    border-radius: var(--pm-app-radius);
    background: rgba(255, 255, 255, .72);
    color: var(--pm-app-text-muted);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 9px;
    text-align: center;
}

.layout-container .app-container :where(.empty-state, .center-state, .loading-state, .error-state,
    .invoice-state, .customers-state, .settings-loading, .integration-loading) :where(h2, h3, h4, strong) {
    margin: 0;
    color: var(--pm-app-text);
    font-size: 15px;
    font-weight: 750;
    letter-spacing: 0;
}

.layout-container .app-container :where(.empty-state, .center-state, .loading-state, .error-state,
    .invoice-state, .customers-state, .settings-loading, .integration-loading) p {
    max-width: 520px;
    margin: 0;
    color: var(--pm-app-text-muted);
    font-size: 13px;
    line-height: 1.55;
}

.layout-container .app-container :where(.error-state, .settings-message.error, .error-container, .company-error) {
    border-color: #f1c6c9;
    background: #fff8f8;
    color: var(--pm-app-danger);
}

.layout-container .app-container :where(.settings-message, .account-alert, .company-error, .error-container,
    .success-message, .error-message, .info-message) {
    min-width: 0;
    padding: 12px 14px;
    border: 1px solid var(--pm-app-border);
    border-radius: var(--pm-app-radius);
    font-size: 13px;
    line-height: 1.5;
}

.layout-container .app-container :where(.spinner, .spinner-small, .spinner-ring, .mini-spinner,
    .customer-spinner, .order-editor-spinner) {
    border-top-color: var(--pm-app-accent);
}

/* Bottom sheets and modal surfaces */
.layout-container .sheet-panel,
.layout-container :where(.modal-panel, .modal-content, .dialog-panel) {
    border: 1px solid var(--pm-app-border);
    border-radius: var(--pm-app-radius) var(--pm-app-radius) 0 0;
    background: var(--pm-app-surface);
    box-shadow: 0 -12px 36px rgba(16, 24, 40, .14);
}

.layout-container .sheet-panel :where(.sheet-wrapper, .partia-sheet-wrapper, .worker-sheet-wrapper,
    .action-sheet, .customer-sheet, .mapper-sheet, .invoice-passport-sheet, .product-picker-sheet,
    .edit-sheet-content, .production-confirm-sheet, .production-delete-sheet, .report-preview-sheet,
    .bulk-shipment-sheet) {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.layout-container .sheet-panel :where(.sheet-header, .customer-sheet-intro, .sheet-hero) {
    border-color: var(--pm-app-border);
    background: transparent;
}

.layout-container .sheet-panel :where(.sheet-footer, .sheet-actions, .customer-sheet-actions,
    .mapper-sheet-footer, .delete-sheet-actions) {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.layout-container .sheet-panel :where(.sheet-header, .sheet-footer),
.layout-container :where(.modal-panel, .modal-content, .dialog-panel) :where(header, footer) {
    border-color: var(--pm-app-border);
    background: var(--pm-app-surface);
}

.layout-container .sheet-panel .sheet-title,
.layout-container :where(.modal-panel, .modal-content, .dialog-panel) :where(h2, h3) {
    color: var(--pm-app-text);
    font-size: 17px;
    font-weight: 750;
    letter-spacing: 0;
}

.layout-container .sheet-panel .btn-close,
.layout-container :where(.modal-panel, .modal-content, .dialog-panel) :where(.btn-close, .close-button) {
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: var(--pm-app-radius-control);
    background: var(--pm-app-surface-muted);
    color: var(--pm-app-text-muted);
}

/* Accessibility and responsive behavior */
.layout-container :where(input, select, textarea, button, a):disabled {
    cursor: not-allowed;
}

.layout-container :where(input, select, textarea)::placeholder {
    color: #98a2ad;
    opacity: 1;
}

@media (min-width: 600px) {
    .layout-container .sheet-panel {
        margin-bottom: 16px;
        border-radius: var(--pm-app-radius);
    }
}

@media (max-width: 720px) {
    .layout-container .page-content > :where(.app-container, .pm-app-page),
    .layout-container .page-content > :where(.page-wrapper, .dashboard-wrapper) > .app-container {
        padding: 18px 14px max(36px, env(safe-area-inset-bottom));
    }

    .layout-container .app-container > :where(.top-bar, header.top-bar, .pm-page-header),
    .layout-container .app-container :where(.page-header, .details-header, .dashboard-header, .invoices-header, .product-editor-header) {
        min-height: 0;
        margin-bottom: 18px;
        align-items: stretch;
        flex-direction: column;
        gap: 12px;
    }

    .layout-container .app-container .top-bar :where(h1, .page-title),
    .layout-container .app-container .pm-page-header :where(h1, .page-title) {
        font-size: 23px;
    }

    .layout-container .app-container :where(.bar-right, .header-actions, .actions, .action-buttons-group) {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
        align-items: stretch;
        gap: 8px;
    }

    .layout-container .app-container :where(.bar-right, .header-actions, .actions, .action-buttons-group)
        :where(.action-btn, .pm-primary-button, .pm-secondary-button, .btn-primary, .btn-secondary) {
        width: 100%;
        min-width: 0;
        padding-inline: 10px;
        white-space: normal;
        text-align: center;
    }

    .layout-container .app-container :where(.toolbar, .list-toolbar, .customer-toolbar, .invoice-toolbar,
        .products-toolbar, .integration-toolbar, .filters-toolbar) {
        align-items: stretch;
        flex-direction: column;
    }

    .layout-container .app-container :where(.toolbar, .list-toolbar, .customer-toolbar, .invoice-toolbar,
        .products-toolbar, .integration-toolbar, .filters-toolbar) > * {
        width: 100%;
        max-width: none;
    }

    .layout-container .app-container :where(.table-shell, .data-table-wrapper) {
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        -webkit-overflow-scrolling: touch;
    }

    .layout-container .sheet-content {
        padding: 18px 14px max(22px, env(safe-area-inset-bottom));
    }

    .layout-container .sheet-panel :where(.sheet-body, .sheet-footer) {
        padding-inline: 14px;
    }

    .layout-container .sheet-panel :where(.sheet-footer, .sheet-actions, .customer-sheet-actions,
        .mapper-sheet-footer, .delete-sheet-actions) > :where(button, a) {
        flex: 1 1 140px;
        min-width: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .layout-container *,
    .layout-container *::before,
    .layout-container *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}