/* Shared Cell Campus theme. Screen-only: printed invoices retain their paper layout.
   The body ID makes the theme take precedence over legacy component skins. */
@media screen {
  body#cell-campus-ui {
    --neo-surface: #e9eef4;
    --neo-ink: #24374c;
    --neo-muted: #536579;
    --neo-line: #d1dae5;
    --neo-raised: 7px 7px 16px #cbd3de, -7px -7px 16px #ffffff;
    --neo-control: 4px 4px 9px #cbd3de, -4px -4px 9px #ffffff;
    --neo-inset: inset 4px 4px 9px #cbd3de, inset -4px -4px 9px #ffffff;
    --neo-accent: #075875;
    --neo-focus: #0875a0;
    background: var(--neo-surface) !important;
    color: var(--neo-ink);
    color-scheme: light;
  }
  body#cell-campus-ui :is(.shell, .mini-shell, .page, .store-page, .support-page, #app-shell) {
    --ent-canvas: var(--neo-surface);
    --ent-soft: var(--neo-surface);
    --ent-ink: var(--neo-ink);
    --ent-muted: var(--neo-muted);
    --ent-line: var(--neo-line);
    --ent-line-strong: #bac7d7;
    --ent-shadow: var(--neo-raised);
    --ent-shadow-sm: var(--neo-control);
    --muted: var(--neo-muted);
    --ink: var(--neo-ink);
    --line: var(--neo-line);
    --panel: var(--neo-surface);
    --wash: var(--neo-surface);
    --accent: var(--neo-accent);
    --store-ink: var(--neo-ink);
    --store-muted: var(--neo-muted);
    --store-line: var(--neo-line);
    background: var(--neo-surface) !important;
    color: var(--neo-ink);
  }
  /* Surfaces: one material and consistent light direction throughout the product. */
  body#cell-campus-ui :is(
    .panel, .card, .stat-card, .metric-card, .summary-card, .wallet-card,
    .quick-action, .chart-card, .dashboard-head, .dashboard-shortcut-editor,
    .dashboard-snapshot > article, .collection-summary > article, .summary-strip > div,
    .login-card, .login-panel, .login-brand-panel, .login-shopping-entry,
    .login-showcase, .login-shop-actions, .workspace-illustration,
    .illustration-modules > span, .reference-category-rail, .reference-rail-support,
    .store-category-card, .store-product-card, .store-brand-card, .smart-search-panel,
    .login-story, .login-brand, .login-visual, .store-login-dialog,
    .product-card, .category-card, .brand-card, .coupon-card, .supplier-card,
    .hero-panel, .account-panel, .auth-panel, .box, .sidebar-note,
    .lookup-card, .help-card, .library-panel, .portal-hero, .hero-document,
    .employee-card, .customer-card, .account-card, .inventory-card,
    .support-card, .request-card, .response-card, .inbox, .detail-card,
    .list-card, .filters, .filter-panel, .expense-filter-panel, .customer-box,
    .checkout-panel, .checkout-card, .order-card, .tracking-card,
    .customer-welcome, .customer-help, .welcome-art, .store-hero,
    .store-service, .service-card, .deal-card, .festival-deal,
    .godown .product-form, .godown article, .support-workspace, .responses,
    .response-editor, .response-detail, .response-filters, .submitted-details, .live-panel,
    .live-chat-panel, .conversation-list, .chat-panel, .push-status-panel,
    .rent-history-totals > div, .rent-history-list article,
    .collection-list article, .history-list > article,
    .customer-management-list > article, .customer-help form,
    .settings-card, .settings-section, .settings-group, .settings-nav,
    .form-builder-side, .form-builder-workspace, .field-config,
    .customer-modal, .modal-card, .collection-modal, .purchase-quick-modal,
    .order-confirmation, .dialog-card, .update-card, .update-prompt, .app-update-dialog,
    .notification-panel, .quick-create-menu, .row-more-actions
  ) {
    background: var(--neo-surface) !important;
    color: var(--neo-ink) !important;
    border: 1px solid #f7f9fc !important;
    border-radius: 18px !important;
    box-shadow: var(--neo-raised) !important;
  }
  body#cell-campus-ui :is(.dashboard, .workspace, .content, .view-grid, .login-wrap, .login-shell, .login-layout, .dashboard-stats, .stats, .support-columns, .app-shell) {
    background: transparent !important;
  }
  body#cell-campus-ui :is(.history-list, .customer-management-list) { gap: 16px; }
  body#cell-campus-ui :is(.dashboard-snapshot, .dashboard-actions, .dashboard-stats, .stats, .product-grid, .category-grid) { gap: 20px; }
  /* Navigation keeps its existing sizing, positioning and responsive behavior. */
  body#cell-campus-ui :is(.desktop-sidebar, .sidebar, .mobile-drawer) {
    background: var(--neo-surface) !important;
    color: var(--neo-ink) !important;
    border-color: #f7f9fc !important;
    box-shadow: 7px 0 18px #cbd3de, -4px 0 12px #ffffff !important;
  }
  body#cell-campus-ui :is(.topbar, .store-topbar, .store-header, .support-topbar, .portal-nav, .windows-titlebar, .mobile-bottom-nav, .mobile-shopping-nav, .mini-nav, .mobile-billing-bar, .settings-save-bar) {
    background: var(--neo-surface) !important;
    color: var(--neo-ink) !important;
    border-color: #f7f9fc !important;
    box-shadow: var(--neo-control) !important;
  }
  body#cell-campus-ui :is(.desktop-sidebar, .sidebar, .mobile-drawer) :is(h2, h3, strong, b, small, span, a),
  body#cell-campus-ui :is(.login-brand-panel, .login-story, .login-brand, .login-showcase, .workspace-illustration, .login-shopping-entry, .store-hero, .customer-welcome, .customer-help, .welcome-art, .wallet-card, .dashboard-head, .stat-card, .sidebar-note) :is(h1, h2, h3, p, strong, small, span) {
    color: var(--neo-ink) !important;
  }
  body#cell-campus-ui :is(.sidebar-brand-mark, .topbar-brand-mark, .showcase-mark, .store-mark, .stat-icon, .login-icon, .brand-mark:not(img), .logo:not(img)) {
    background: var(--neo-surface) !important;
    color: var(--neo-accent) !important;
    border-color: #f7f9fc !important;
    box-shadow: var(--neo-control) !important;
  }
  /* Raised controls; neutral secondary actions and tinted primary actions. */
  body#cell-campus-ui :is(button, a.button, a.btn, a.store-button, a.login-shop-link, .row-more-menu > summary) {
    background: var(--neo-surface) !important;
    color: var(--neo-ink) !important;
    border: 1px solid #f7f9fc !important;
    border-radius: 12px !important;
    box-shadow: var(--neo-control) !important;
    transition: box-shadow 140ms ease, background-color 140ms ease;
  }
  body#cell-campus-ui :is(button.primary, button[type='submit'], .btn-primary, .button.primary, .store-button, .login-submit, .login-form > button, .welcome-actions > button:first-child) {
    background: #dcebf2 !important;
    color: #075875 !important;
    border-color: #f4faff !important;
  }
  body#cell-campus-ui :is(button, a.button, a.btn, a.store-button, .row-more-menu > summary):hover:not(:disabled) {
    background: #dfe7f0 !important;
  }
  body#cell-campus-ui :is(button, a.button, a.btn, a.store-button):active:not(:disabled),
  body#cell-campus-ui :is(button.active, button.selected, button[aria-pressed='true'], a[aria-current='page'], .row-more-menu[open] > summary) {
    background: #e3eaf2 !important;
    color: var(--neo-accent) !important;
    border-color: #b6c8d9 !important;
    box-shadow: var(--neo-inset) !important;
  }
  body#cell-campus-ui :is(button.danger, button.delete, .button.danger, .btn-danger) {
    background: #f0e3e8 !important;
    color: #9b263d !important;
    border-color: #fdf4f7 !important;
  }
  body#cell-campus-ui :is(.whatsapp-action, .whatsapp-action > span) { color: #14633f !important; }
  body#cell-campus-ui :is(button, input, select, textarea):disabled {
    opacity: .55 !important;
    box-shadow: none !important;
    cursor: not-allowed;
  }
  body#cell-campus-ui :is(.link-button, .text-button, .password-toggle, .dialog-close, .modal-close, .clear-filters) {
    background: transparent !important;
    border-color: transparent !important;
    color: var(--neo-accent) !important;
    box-shadow: none !important;
  }
  /* Inputs are pressed into the material. Native toggles keep their affordance. */
  body#cell-campus-ui :is(input:not([type='checkbox']):not([type='radio']):not([type='range']):not([type='color']):not([type='hidden']), select, textarea) {
    background: var(--neo-surface) !important;
    color: var(--neo-ink) !important;
    border: 1px solid #d1dce8 !important;
    border-radius: 12px !important;
    box-shadow: var(--neo-inset) !important;
  }
  body#cell-campus-ui :is(input, textarea)::placeholder { color: #5b6c7f !important; opacity: 1; }
  body#cell-campus-ui :is(input[type='checkbox'], input[type='radio'], input[type='range']) { accent-color: var(--neo-accent); box-shadow: none !important; }
  body#cell-campus-ui :is(input[aria-invalid='true'], select[aria-invalid='true'], textarea[aria-invalid='true']) { border-color: #aa2942 !important; }
  body#cell-campus-ui :is(button, a, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid var(--neo-focus) !important;
    outline-offset: 3px;
  }
  body#cell-campus-ui :is(.tabs, .tab-bar, .section-navigation, .workspace-switch, .history-table-heading, .filter-bar, .filter-fields, .countdown-card, .user-pill, .user-chip, .connection-chip) {
    background: var(--neo-surface) !important;
    color: var(--neo-ink) !important;
    border-color: var(--neo-line) !important;
    border-radius: 12px;
  }
  body#cell-campus-ui :is(.tabs, .tab-bar, .workspace-switch, .section-navigation) { padding: 8px; gap: 10px; box-shadow: var(--neo-inset) !important; }
  body#cell-campus-ui :is(.sidebar, .desktop-sidebar, .mobile-drawer) :is(.nav-item.active, a.active) {
    background: #e3eaf2 !important; color: var(--neo-accent) !important;
    border-radius: 12px; box-shadow: var(--neo-inset) !important;
  }
  /* Keep dense data flat inside a softly recessed well. */
  body#cell-campus-ui :is(.table-scroll, .table-wrap, .table-wrapper, .response-table-wrap, .inventory-table-wrap) {
    background: var(--neo-surface) !important;
    border: 1px solid #d1dae5 !important;
    border-radius: 14px;
    box-shadow: inset 2px 2px 6px #cbd3de, inset -2px -2px 6px #fff !important;
  }
  body#cell-campus-ui table:not(.invoice-print-table) { background: transparent !important; color: var(--neo-ink) !important; }
  body#cell-campus-ui table:not(.invoice-print-table) :is(th, td) { border-color: var(--neo-line) !important; }
  body#cell-campus-ui table:not(.invoice-print-table) th { background: #dfe7f0 !important; color: #314b64 !important; }
  body#cell-campus-ui table:not(.invoice-print-table) td { background: transparent !important; color: var(--neo-ink) !important; }
  body#cell-campus-ui table:not(.invoice-print-table) tbody tr:nth-child(even) { background: #e4eaf2 !important; }
  body#cell-campus-ui table:not(.invoice-print-table) tbody tr:hover { background: #dce7f0 !important; }
  body#cell-campus-ui :is(.muted, .login-copy, .meta, .field-hint, .page-heading > div > p, .sync-time) { color: var(--neo-muted) !important; }
  body#cell-campus-ui :is(.eyebrow, .store-eyebrow) { color: #3d617c !important; }
  body#cell-campus-ui :is(.notice, .alert, .status:not(.status-badge), .empty-state, .empty-report, .invoice-history-notices) {
    background: var(--neo-surface) !important;
    color: #34536d !important;
    border-color: #b4c9d9 !important;
    border-radius: 12px;
    box-shadow: inset 2px 2px 5px #cbd3de, inset -2px -2px 5px #fff !important;
  }
  body#cell-campus-ui :is(.notice.error, .alert.error, .status.error, .error-message) { color: #9b263d !important; border-color: #bf7f8c !important; }
  body#cell-campus-ui :is(.notice.success, .alert.success, .status.success) { color: #14633f !important; border-color: #81b39a !important; }
  body#cell-campus-ui :is(.status-badge, .status-pill, .badge, .pill, .connection-chip) {
    border: 1px solid #c5d0df;
    box-shadow: 2px 2px 5px #cbd3de, -2px -2px 5px #fff;
  }
  body#cell-campus-ui :is(.status-badge.paid, .status-pill.paid, .payment-badge.paid, .status.Paid, .badge.resolved) { background: #deeee4 !important; color: #14633f !important; border-color: #a1c5b0 !important; }
  body#cell-campus-ui :is(.status-badge.pending, .status-badge.partial, .status-pill.warning, .payment-badge.pending, .status.Unpaid) { background: #efe6d5 !important; color: #795210 !important; border-color: #cebb95 !important; }
  body#cell-campus-ui :is(.status-badge.unpaid, .status-pill.danger, .payment-badge.unpaid) { background: #f0e3e8 !important; color: #9b263d !important; border-color: #cc9da8 !important; }
  body#cell-campus-ui :is(.store-footer, .customer-footer, .login-footer) { background: transparent !important; color: var(--neo-muted) !important; border-color: var(--neo-line) !important; }
  body#cell-campus-ui :is(dialog:not(.collection-backdrop), .modal-card, .customer-modal) { background: var(--neo-surface) !important; color: var(--neo-ink) !important; }
  body#cell-campus-ui dialog::backdrop { background: rgba(36, 55, 76, .38); backdrop-filter: blur(3px); }
  body#cell-campus-ui :is(.modal-backdrop, .customer-backdrop, .drawer-backdrop, .collection-backdrop) { background-color: rgba(36, 55, 76, .38) !important; }
  body#cell-campus-ui .collection-backdrop { box-shadow: none !important; }
  /* Native Android has a focused sign-in screen, without the web storefront. */
  body#cell-campus-ui .shell.studio-shell.android-login {
    display: block !important; min-height: 100dvh; padding: 0 !important;
    background: var(--neo-surface) !important;
  }
  body#cell-campus-ui .android-login #staff-login.login-wrap {
    display: flex !important; align-items: center; justify-content: center;
    min-height: 100dvh !important; height: auto !important; width: 100% !important;
    max-width: none !important; margin: 0 !important; border: 0 !important;
    padding: max(24px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left)) !important;
    background: var(--neo-surface) !important; box-shadow: none !important;
  }
  body#cell-campus-ui .android-login #staff-login > .login-panel {
    width: 100% !important; max-width: 430px !important; min-height: 0 !important;
    margin: 0 !important; padding: 28px 24px !important; border-radius: 24px !important;
  }
  body#cell-campus-ui .android-login .login-panel h1 { font-size: 28px !important; }
  body#cell-campus-ui .android-login .login-logo { width: 56px !important; height: 56px !important; object-fit: contain; }
  body#cell-campus-ui:has(.android-login) > cell-support { display: none !important; }
  body#cell-campus-ui :is(.library-welcome, .library-empty, .verified-profile, .mobile-input, .store-search) {
    background: var(--neo-surface) !important;
    color: var(--neo-ink) !important;
    border-color: var(--neo-line) !important;
    border-radius: 14px;
    box-shadow: var(--neo-inset) !important;
  }
  /* Match the existing compact navigation breakpoint; the legacy sidebar skin
     otherwise re-shows the rail while the tablet shell is still a block. */
  @media (min-width: 761px) and (max-width: 1399px) {
    body#cell-campus-ui .shell.studio-shell > .desktop-sidebar { display: none !important; }
  }
  /* Screens that preview printable documents retain a clean paper surface. */
  body#cell-campus-ui :is(.print-preview, .invoice-paper, .invoice-print, .invoice-print-page, .receipt-paper) { background: #fff !important; color: #17212b !important; }
  @media (max-width: 760px) {
    body#cell-campus-ui { --neo-raised: 5px 5px 12px #cbd3de, -5px -5px 12px #ffffff; }
    body#cell-campus-ui:has(.mobile-shopping-nav) { --chat-bottom-gap: 84px; }
    body#cell-campus-ui :is(button, .button, .row-more-menu > summary) { min-height: 44px; }
    body#cell-campus-ui :is(input:not([type='checkbox']):not([type='radio']):not([type='range']):not([type='color']):not([type='hidden']), select, textarea) { font-size: 16px; }
  }
  @media (prefers-reduced-motion: reduce) {
    body#cell-campus-ui :is(button, a.button, a.btn, a.store-button, .row-more-menu > summary) { transition: none; }
  }
}
body#cell-campus-ui:has(app-shop-opening) cell-support { display: none !important; }
body#cell-campus-ui main.shell:has(app-shop-opening) { padding: 0 !important; display: block; }
@media (min-width: 981px) {
  body#cell-campus-ui main.windows-app:has(app-shop-opening) { padding-top: 32px !important; }
  body#cell-campus-ui main.windows-app app-shop-opening .opening { min-height: calc(100svh - 32px); }
}
body#cell-campus-ui .shop-opening-loading { min-height: 100vh; display: grid; place-content: center; text-align: center; background: #f4f3ee; color: #234c43; }
body#cell-campus-ui app-shop-opening .opening button.opening-primary {
  background: linear-gradient(145deg, #234c43, #143b36) !important;
  color: #fff9e9 !important; border: 1px solid #254b43 !important;
  box-shadow: 6px 6px 15px #c6cec3, -5px -5px 14px #fff !important;
  border-radius: 10px !important;
}
body#cell-campus-ui app-shop-opening .opening button.opening-replay {
  background: transparent !important; color: #65776a !important;
  border: 0 !important; box-shadow: none !important;
}
