@font-face { font-family: 'IRANSans'; src: url('../fonts/IRANSansWeb_UltraLight.otf') format('opentype'); font-weight: 200; font-style: normal; font-display: swap; } @font-face { font-family: 'IRANSans'; src: url('../fonts/IRANSansWeb_Light.otf') format('opentype'); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: 'IRANSans'; src: url('../fonts/IRANSansWeb.otf') format('opentype'); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: 'IRANSans'; src: url('../fonts/IRANSansWeb_Medium.otf') format('opentype'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'IRANSans'; src: url('../fonts/IRANSansWeb_Bold.otf') format('opentype'); font-weight: 700; font-style: normal; font-display: swap; } :root, [data-theme-color="blue"] { --theme-primary: #2563EB; --theme-primary-dark: #1D4ED8; --theme-primary-light: #60A5FA; --theme-secondary: #38BDF8; --theme-appbar-bg: #1E40AF; --theme-appbar-text: #FFFFFF; --theme-drawer-bg: #1E3A8A; --theme-drawer-text: #FFFFFF; --theme-background: #EEF2F8; --theme-surface: #FFFFFF; --theme-text-primary: #0F172A; --theme-text-secondary: rgba(15, 23, 42, 0.65); --theme-primary-rgb: 37, 99, 235; --theme-primary-dark-rgb: 29, 78, 216; --theme-gradient-primary: linear-gradient(135deg, #3B82F6 0%, #2563EB 45%, #1D4ED8 100%); --theme-gradient-light: linear-gradient(180deg, #FFFFFF 0%, #F1F5F9 100%); --theme-gradient-card: linear-gradient(145deg, rgba(255,255,255,0.95), rgba(241,245,249,0.9)); } [data-theme="dark"], [data-theme-color="blue"][data-theme="dark"] { --theme-primary: #3B82F6; --theme-primary-dark: #2563EB; --theme-primary-light: #93C5FD; --theme-secondary: #67E8F9; --theme-appbar-bg: #1E3A8A; --theme-drawer-bg: #172554; --theme-background: #0f1419; --theme-surface: #1a2332; --theme-text-primary: #FFFFFF; --theme-text-secondary: rgba(255, 255, 255, 0.78); --theme-primary-rgb: 59, 130, 246; --theme-gradient-primary: linear-gradient(135deg, #2563EB 0%, #1D4ED8 50%, #1E3A8A 100%); } [data-theme="light"] { --theme-border-subtle: rgba(0, 0, 0, 0.08); } [data-theme="dark"] { --theme-border-subtle: rgba(255, 255, 255, 0.12); } [data-theme-color="green"] { --theme-primary: #388E3C; --theme-primary-dark: #2E7D32; --theme-primary-light: #66BB6A; --theme-secondary: #66BB6A; --theme-appbar-bg: #2E7D32; --theme-drawer-bg: #1B5E20; --theme-background: #ECFDF5; --theme-surface: #FFFFFF; --theme-primary-rgb: 56, 142, 60; --theme-primary-dark-rgb: 46, 125, 50; --theme-gradient-primary: linear-gradient(135deg, #81C784 0%, #43A047 45%, #2E7D32 100%); --theme-gradient-light: linear-gradient(180deg, #FFFFFF 0%, #E8F5E9 100%); } [data-theme-color="green"][data-theme="dark"] { --theme-primary: #4CAF50; --theme-primary-dark: #388E3C; --theme-primary-light: #81C784; --theme-appbar-bg: #2E7D32; --theme-drawer-bg: #1B5E20; --theme-background: #0F1A12; --theme-surface: #1E2E22; --theme-primary-rgb: 76, 175, 80; --theme-gradient-primary: linear-gradient(135deg, #A5D6A7 0%, #66BB6A 50%, #43A047 100%); } [data-theme-color="purple"] { --theme-primary: #7B1FA2; --theme-primary-dark: #6A1B9A; --theme-primary-light: #AB47BC; --theme-secondary: #AB47BC; --theme-appbar-bg: #6A1B9A; --theme-drawer-bg: #4A148C; --theme-background: #F5F3FF; --theme-surface: #FFFFFF; --theme-primary-rgb: 123, 31, 162; --theme-primary-dark-rgb: 106, 27, 154; --theme-gradient-primary: linear-gradient(135deg, #BA68C8 0%, #8E24AA 45%, #6A1B9A 100%); --theme-gradient-light: linear-gradient(180deg, #FFFFFF 0%, #F3E5F5 100%); } [data-theme-color="purple"][data-theme="dark"] { --theme-primary: #9C27B0; --theme-primary-dark: #7B1FA2; --theme-primary-light: #BA68C8; --theme-appbar-bg: #7B1FA2; --theme-drawer-bg: #4A148C; --theme-background: #1A0F24; --theme-surface: #2A1A33; --theme-primary-rgb: 156, 39, 176; --theme-gradient-primary: linear-gradient(135deg, #CE93D8 0%, #AB47BC 50%, #8E24AA 100%); } [data-theme-color="orange"] { --theme-primary: #F57C00; --theme-primary-dark: #E65100; --theme-primary-light: #FF9800; --theme-secondary: #FF9800; --theme-appbar-bg: #E65100; --theme-drawer-bg: #BF360C; --theme-background: #FFF7ED; --theme-surface: #FFFFFF; --theme-primary-rgb: 245, 124, 0; --theme-primary-dark-rgb: 230, 81, 0; --theme-gradient-primary: linear-gradient(135deg, #FFB74D 0%, #FB8C00 45%, #E65100 100%); --theme-gradient-light: linear-gradient(180deg, #FFFFFF 0%, #FFF3E0 100%); } [data-theme-color="orange"][data-theme="dark"] { --theme-primary: #FF9800; --theme-primary-dark: #F57C00; --theme-primary-light: #FFB74D; --theme-appbar-bg: #F57C00; --theme-drawer-bg: #E65100; --theme-background: #1F1408; --theme-surface: #2E2218; --theme-primary-rgb: 255, 152, 0; --theme-gradient-primary: linear-gradient(135deg, #FFCC80 0%, #FFA726 50%, #FB8C00 100%); } [data-theme-color="teal"] { --theme-primary: #00796B; --theme-primary-dark: #00695C; --theme-primary-light: #26A69A; --theme-secondary: #26A69A; --theme-appbar-bg: #00695C; --theme-drawer-bg: #004D40; --theme-background: #F0FDFA; --theme-surface: #FFFFFF; --theme-primary-rgb: 0, 121, 107; --theme-primary-dark-rgb: 0, 105, 92; --theme-gradient-primary: linear-gradient(135deg, #4DB6AC 0%, #00897B 45%, #00695C 100%); --theme-gradient-light: linear-gradient(180deg, #FFFFFF 0%, #E0F2F1 100%); } [data-theme-color="teal"][data-theme="dark"] { --theme-primary: #009688; --theme-primary-dark: #00796B; --theme-primary-light: #4DB6AC; --theme-appbar-bg: #00695C; --theme-drawer-bg: #004D40; --theme-background: #0C1F1C; --theme-surface: #1A2E2B; --theme-primary-rgb: 0, 150, 136; --theme-gradient-primary: linear-gradient(135deg, #80CBC4 0%, #26A69A 50%, #00897B 100%); } .theme-card-header { background: var(--theme-gradient-primary) !important; background-color: var(--theme-primary) !important; color: var(--theme-appbar-text) !important; } .mud-menu-item.theme-active { background-color: rgba(var(--theme-primary-rgb, 37, 99, 235), 0.12) !important; border-inline-start: 3px solid var(--theme-primary) !important; } .mud-dialog .mud-dialog-title-container { background: var(--theme-gradient-primary) !important; color: var(--theme-appbar-text) !important; } .mud-dialog .mud-dialog-title-container .mud-typography, .mud-dialog .mud-dialog-title-container .mud-icon { color: var(--theme-appbar-text) !important; } body { background-color: var(--theme-background) !important; color: var(--theme-text-primary) !important; } .app-theme-swatch { display: inline-block; width: 20px; height: 20px; border-radius: 50%; border: 2px solid transparent; flex-shrink: 0; } .app-theme-menu-popover .mud-menu-item.theme-active .app-theme-swatch { box-shadow: 0 0 0 2px var(--theme-surface), 0 0 0 3px var(--theme-primary); } :root { --ps-bg: #eef2f8; --ps-surface: #ffffff; --ps-surface-2: #f8fafc; --ps-border: rgba(15, 23, 42, 0.08); --ps-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04); --ps-shadow-md: 0 4px 16px rgba(15, 23, 42, 0.08), 0 2px 6px rgba(15, 23, 42, 0.04); --ps-shadow-lg: 0 12px 32px rgba(15, 23, 42, 0.12), 0 4px 12px rgba(15, 23, 42, 0.06); --ps-radius: 12px; --ps-radius-lg: 16px; --ps-table-head-radius: var(--ps-radius); --ps-nav-active: rgba(255, 255, 255, 0.24); --ps-nav-hover: rgba(255, 255, 255, 0.12); } [data-theme="dark"] { --ps-bg: #0f1419; --ps-surface: #1a2332; --ps-surface-2: #243044; --ps-border: rgba(255, 255, 255, 0.1); --ps-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3); --ps-shadow-md: 0 4px 20px rgba(0, 0, 0, 0.4); --ps-shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.5); --ps-nav-active: rgba(255, 255, 255, 0.14); --ps-nav-hover: rgba(255, 255, 255, 0.08); } html, body { background: var(--ps-bg) !important; margin: 0; min-height: 100%; } .ps-app { --ps-appbar-height: 64px; } .ps-app.mud-layout, .mud-layout.ps-app { position: fixed; inset: 0; width: 100%; height: 100%; height: 100dvh; max-height: 100dvh; max-height: -webkit-fill-available; display: flex; flex-direction: column; overflow: hidden; overscroll-behavior: none; } .ps-app .app-bar-root.mud-appbar, .ps-app .mud-appbar { position: fixed !important; top: 0; inset-inline: 0; z-index: var(--mud-zindex-appbar, 1100) !important; } .ps-app .mud-main-content, .ps-app .ps-main-content, .ps-app .ps-main-content.ps-main-content--full { background: var(--ps-bg) !important; box-sizing: border-box; padding-top: var(--mud-appbar-height, var(--ps-appbar-height, 64px)) !important; padding-inline: clamp(0.35rem, 1.2vw, 1.25rem); padding-bottom: max(0.75rem, env(safe-area-inset-bottom)); flex: 1 1 auto; min-height: 0; height: auto; max-height: 100%; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior-y: contain; touch-action: pan-y pinch-zoom; position: relative; z-index: 0; } .ps-page { animation: psFadeIn 0.35s ease; } @keyframes psFadeIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } } .ps-app .mud-appbar { background: var(--theme-gradient-primary) !important; box-shadow: var(--ps-shadow-md) !important; border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important; } .ps-app .mud-appbar .mud-typography { font-weight: 700 !important; } .ps-app .mud-appbar .app-bar-farm-chip { border-color: rgba(255, 255, 255, 0.45) !important; color: #fff !important; max-width: 220px; } .ps-app .mud-appbar .app-bar-farm-chip .mud-chip-content { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } @media (max-width: 959px) { .ps-app .mud-appbar .app-bar-title { display: none !important; } .ps-app .mud-appbar .app-bar-farm-chip { max-width: 140px; } } .ps-app .mud-drawer, .ps-app .mud-drawer.mud-drawer-temporary, .ps-app .mud-drawer .mud-drawer-content, .ps-app .mud-drawer .mud-drawer-header, .ps-app .mud-drawer.ps-nav-drawer { background: var(--theme-drawer-bg, #1e3a8a) !important; background-image: none !important; opacity: 1 !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; } .ps-app .mud-drawer .drawer-header, .ps-app .mud-drawer .mud-drawer-header.drawer-header { background: var(--theme-drawer-bg, #1e3a8a) !important; color: var(--theme-drawer-text, #fff) !important; } .ps-app .mud-drawer .mud-drawer-header .mud-typography, .ps-app .mud-drawer .mud-drawer-header .mud-icon-button, .ps-app .mud-drawer .mud-drawer-header .mud-icon-root { color: var(--theme-drawer-text, #fff) !important; } .ps-app .mud-drawer { border-inline-start: 1px solid rgba(255, 255, 255, 0.12) !important; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35) !important; } .ps-app .mud-drawer.mud-drawer-temporary.mud-drawer--open { z-index: 1300 !important; } .ps-app .mud-overlay { z-index: 1299 !important; } .ps-app .mud-paper:not(.home-hero):not(.home-kpi-bar):not(.home-shortcuts-bar):not(.no-shadow) { border-radius: var(--ps-radius) !important; border: 1px solid var(--ps-border) !important; box-shadow: var(--ps-shadow-sm) !important; background: var(--ps-surface) !important; } .ps-app .mud-table { border-radius: var(--ps-radius) !important; overflow: visible; border: 1px solid var(--ps-border) !important; } .ps-app .mud-table .mud-table-head .mud-table-cell, .ps-app .mud-table thead .mud-th { background: var(--theme-gradient-primary) !important; color: #fff !important; font-weight: 700 !important; } .ps-app .mud-table .mud-table-head .mud-table-row .mud-table-cell { border-top-left-radius: 0 !important; border-top-right-radius: 0 !important; } [dir="ltr"] .ps-app .mud-table .mud-table-head .mud-table-row .mud-table-cell:first-child { border-top-left-radius: var(--ps-table-head-radius) !important; } [dir="ltr"] .ps-app .mud-table .mud-table-head .mud-table-row .mud-table-cell:last-child { border-top-right-radius: var(--ps-table-head-radius) !important; } [dir="rtl"] .ps-app .mud-table .mud-table-head .mud-table-row .mud-table-cell:first-child { border-top-right-radius: var(--ps-table-head-radius) !important; } [dir="rtl"] .ps-app .mud-table .mud-table-head .mud-table-row .mud-table-cell:last-child { border-top-left-radius: var(--ps-table-head-radius) !important; } .theme-card-header { background: var(--theme-gradient-primary); color: #fff; padding: 0.75rem 1rem; border-radius: var(--ps-radius-lg) var(--ps-radius-lg) 0 0; } .theme-card-header .mud-typography, .theme-card-header .mud-icon-root { color: #fff !important; } .theme-surface { background: var(--ps-surface) !important; border-radius: 0 0 var(--ps-radius-lg) var(--ps-radius-lg); } .drawer-header { padding: 1rem; border-bottom: 1px solid rgba(255, 255, 255, 0.12); } .drawer-header-inner { width: 100%; min-width: 0; } .drawer-header-logo { width: 36px; height: 36px; border-radius: 8px; object-fit: cover; flex-shrink: 0; } .drawer-header-home-btn.mud-icon-button { flex-shrink: 0; margin: 0 !important; color: #fff !important; } .drawer-header-home-btn .mud-icon-root { font-size: 1.35rem !important; } .drawer-header-brand { min-width: 0; flex: 1 1 auto; } .lang-switcher .mud-button-root { min-width: 42px; font-weight: 700; } .lang-switcher .lang-switcher-active { background: rgba(255, 255, 255, 0.22) !important; color: #fff !important; } .login-page .lang-switcher .mud-button-root { color: var(--theme-text-primary, #0f172a); border-color: #e2e8f0 !important; } .login-page .lang-switcher .lang-switcher-active { background: rgba(37, 99, 235, 0.12) !important; color: #2563eb !important; border-color: #2563eb !important; } .user-menu-btn { text-transform: none !important; font-weight: 600 !important; max-width: 220px; } .user-menu-btn .mud-button-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .app-user-menu-popover, .app-user-menu-popover .mud-list { background: var(--theme-surface, #fff) !important; color: var(--theme-text-primary, #1e293b) !important; min-width: 260px; } .app-user-menu-info { cursor: default; background: var(--theme-surface, #fff); border-bottom: 1px solid var(--ps-border, rgba(0, 0, 0, 0.08)); } .app-user-menu-popover .app-user-menu-name, .app-user-menu-popover .app-user-menu-email, .app-user-menu-popover .app-user-menu-roles, .app-user-menu-popover .app-user-menu-info .mud-typography { color: var(--theme-text-primary, #1e293b) !important; opacity: 1 !important; } .app-user-menu-popover .app-user-menu-email, .app-user-menu-popover .app-user-menu-roles { color: var(--theme-text-secondary, #64748b) !important; } .app-user-menu-popover .app-user-menu-avatar { font-family: 'IRANSans', sans-serif !important; font-weight: 700; background: rgba(255, 255, 255, 0.2) !important; color: inherit !important; } .app-user-menu-popover .mud-menu-item .mud-typography, .app-user-menu-popover .mud-menu-item .mud-icon-root { color: var(--theme-text-primary, #1e293b) !important; } .app-user-menu-logout .mud-typography, .app-user-menu-logout .mud-icon-root { color: var(--theme-error, #d32f2f) !important; } [data-theme="dark"] .app-user-menu-popover, [data-theme="dark"] .app-user-menu-popover .mud-list, [data-theme="dark"] .app-user-menu-info { background: var(--theme-surface, #1e293b) !important; } [data-theme="dark"] .app-user-menu-popover .app-user-menu-name, [data-theme="dark"] .app-user-menu-popover .app-user-menu-info .mud-typography, [data-theme="dark"] .app-user-menu-popover .mud-menu-item .mud-typography, [data-theme="dark"] .app-user-menu-popover .mud-menu-item .mud-icon-root { color: var(--theme-text-primary, #f1f5f9) !important; } [data-theme="dark"] .app-user-menu-popover .app-user-menu-email, [data-theme="dark"] .app-user-menu-popover .app-user-menu-roles { color: var(--theme-text-secondary, #94a3b8) !important; } .app-bar-logo { width: 36px; height: 36px; border-radius: 8px; object-fit: cover; } .app-bar-brand { display: inline-flex; align-items: center; gap: 0.5rem; margin-inline-start: 0.5rem; min-width: 0; text-decoration: none; color: inherit; cursor: pointer; border-radius: 8px; outline: none; } .app-bar-brand:hover, .app-bar-brand:focus-visible { opacity: 0.92; } .app-bar-brand .app-bar-title { color: inherit !important; } [data-theme="dark"] .ps-app .mud-table .mud-table-body .mud-table-cell, .mud-theme-dark .ps-app .mud-table .mud-table-body .mud-table-cell { color: var(--theme-text-primary) !important; background-color: var(--ps-surface) !important; } [data-theme="dark"] .ps-app .mud-table.mud-table-striped .mud-table-body .mud-table-row:nth-of-type(odd) .mud-table-cell, .mud-theme-dark .ps-app .mud-table.mud-table-striped .mud-table-body .mud-table-row:nth-of-type(odd) .mud-table-cell { background-color: var(--ps-surface-2) !important; } [data-theme="dark"] .ps-app .mud-table.mud-table-hover .mud-table-body .mud-table-row:hover .mud-table-cell, .mud-theme-dark .ps-app .mud-table.mud-table-hover .mud-table-body .mud-table-row:hover .mud-table-cell { background-color: rgba(var(--theme-primary-rgb, 59, 130, 246), 0.14) !important; } .ps-app .ps-btn-primary.mud-button-root, .login-page .login-submit-btn.mud-button-root { background: var(--theme-gradient-primary) !important; color: #fff !important; font-weight: 700 !important; border-radius: 10px !important; min-height: 42px; box-shadow: 0 3px 10px rgba(var(--theme-primary-rgb, 37, 99, 235), 0.35) !important; text-transform: none !important; } .ps-app .ps-btn-primary.mud-button-root:hover, .login-page .login-submit-btn.mud-button-root:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 5px 16px rgba(var(--theme-primary-rgb, 37, 99, 235), 0.45) !important; } .ps-app .ps-btn-outline.mud-button-root { border-width: 2px !important; font-weight: 600 !important; border-radius: 10px !important; min-height: 40px; text-transform: none !important; } .ps-app .ps-form-section { border: 1px solid var(--ps-border); border-radius: var(--ps-radius, 12px); padding: 0.85rem 1rem; background: color-mix(in srgb, var(--ps-surface) 96%, var(--theme-primary) 4%); margin-bottom: 0.75rem; } .ps-app .ps-form-section-title { display: flex; align-items: center; gap: 0.4rem; font-weight: 700; font-size: 0.88rem; color: var(--theme-primary); margin-bottom: 0.65rem; padding-bottom: 0.4rem; border-bottom: 1px solid var(--ps-border); } .ps-app .mud-form .mud-grid-item { padding-top: 6px !important; padding-bottom: 6px !important; } .ps-app .mud-input-outlined .mud-input-outlined-border { border-radius: 10px !important; } .ps-app .mud-input-control { margin-top: 0.15rem !important; } .ps-app .mud-form .mud-button-root[type="submit"], .ps-app .mud-form-actions .mud-button-root.mud-button-filled-primary { min-height: 42px; border-radius: 10px !important; font-weight: 700 !important; text-transform: none !important; } .ps-app .report-filter-panel, .ps-app .catalog-toolbar, .ps-app .inv-toolbar, .ps-app .dm-toolbar, .ps-app .qr-toolbar { background: var(--ps-surface) !important; } [data-theme="dark"] .ps-app .ps-form-section, .mud-theme-dark .ps-app .ps-form-section { background: rgba(var(--theme-primary-rgb, 59, 130, 246), 0.06) !important; border-color: var(--ps-border) !important; } [data-theme="dark"] .ps-app .ps-form-section-title, .mud-theme-dark .ps-app .ps-form-section-title { color: var(--theme-primary-light) !important; } [data-theme="dark"] .ps-app .mud-file-upload, .mud-theme-dark .ps-app .mud-file-upload { border-color: var(--ps-border) !important; background: var(--ps-surface-2) !important; } [data-theme="dark"] .login-page .lang-switcher .mud-button-root, .mud-theme-dark .login-page .lang-switcher .mud-button-root { color: var(--theme-text-primary) !important; border-color: var(--ps-border) !important; } @media (max-width: 768px) { .ps-app .mud-form .mud-grid-item[class*="mud-grid-item-sm-"], .ps-app .mud-form .mud-grid-item[class*="mud-grid-item-md-"] { flex-basis: 100% !important; max-width: 100% !important; } .ps-app .ps-form-section { padding: 0.65rem 0.75rem; } .ps-app .mud-form .mud-input > input.mud-input-root, .ps-app .mud-form .mud-select .mud-select-input { font-size: 0.92rem !important; } .ps-app .report-filter-panel .mud-grid-item, .ps-app .catalog-toolbar .mud-stack-row { width: 100%; } .ps-app .mud-form-actions { flex-wrap: wrap !important; gap: 0.5rem; } .ps-app .mud-form-actions .mud-button-root { flex: 1 1 calc(50% - 0.5rem); min-width: 120px; } } @media (max-width: 480px) { .ps-app .mud-form-actions .mud-button-root { flex: 1 1 100%; } } :root { --bs-bg: #eef2f8; --bs-text: #0f172a; --bs-text-muted: #64748b; } [data-theme="dark"] { --bs-bg: #0f1419; --bs-text: #f8fafc; --bs-text-muted: #94a3b8; } html, body { margin: 0; color: var(--bs-text); background: linear-gradient(145deg, #0a0f1a 0%, #0f2347 40%, #1e3a8a 100%); min-height: 100%; min-height: 100dvh; } #app { min-height: 100%; min-height: 100dvh; } .iransans, .app-font { } .text-muted { color: var(--bs-text-muted) !important; } .ps-main-content--full { width: 100%; max-width: 100%; margin-inline: 0 !important; } body.broiler-styles-pending .ps-main-content, body.broiler-styles-pending .login-page, body.broiler-styles-pending .not-found-container, body.broiler-styles-pending .sorry-layout, body.broiler-styles-pending .auth-loading { visibility: hidden; } body.broiler-styles-pending .ps-main-content, body.broiler-styles-pending .login-page { transition: visibility 0s linear 80ms; } body.broiler-page-ready .ps-main-content, body.broiler-page-ready .login-page, body.broiler-page-ready .not-found-container, body.broiler-page-ready .sorry-layout, body.broiler-page-ready .auth-loading { visibility: visible; } .app-initial-loading { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; background: #0b2239; z-index: 10000; } .app-initial-loading::after { content: ""; width: 48px; height: 48px; border-radius: 50%; border: 4px solid rgba(255,255,255,0.2); border-top-color: #ffffff; animation: appSpin 0.8s linear infinite; } @keyframes appSpin { to { transform: rotate(360deg); } } .auth-loading { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; background: linear-gradient(145deg, #0a0f1a 0%, #0f2347 40%, #1e3a8a 100%); color: #ffffff; } .boot-screen { position: fixed; inset: 0; z-index: 10000; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.75rem; background: linear-gradient(145deg, #0a0f1a 0%, #0f2347 40%, #1e3a8a 100%); color: #ffffff; text-align: center; padding: 1.5rem; } .boot-logo { border-radius: 18px; object-fit: contain; margin-bottom: 0.25rem; } .boot-loading-text { margin: 0; font-size: 1.05rem; font-weight: 600; } .boot-loading-subtext { margin: 0; opacity: 0.82; font-size: 0.92rem; } .boot-spinner { width: 42px; height: 42px; margin-top: 0.5rem; border-radius: 50%; border: 4px solid rgba(255, 255, 255, 0.22); border-top-color: #ffffff; animation: appSpin 0.8s linear infinite; } .boot-retry-actions { display: flex; flex-wrap: wrap; gap: 0.65rem; justify-content: center; margin-top: 1rem; max-width: 26rem; } .boot-retry-btn { margin: 0; padding: 0.55rem 1.1rem; border: 0; border-radius: 10px; background: #ffffff; color: #0f2347; font: inherit; font-weight: 600; cursor: pointer; } .boot-retry-btn--ghost { background: transparent; color: #ffffff; border: 1px solid rgba(255, 255, 255, 0.45); } .boot-reload-btn { margin-top: 0.75rem; padding: 0.55rem 1.25rem; border: none; border-radius: 10px; background: #ffffff; color: #0f2347; font-weight: 600; cursor: pointer; } .boot-reload-btn:hover { background: #e3f2fd; } .tenant-unavailable-screen { position: fixed; inset: 0; z-index: 10000; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.75rem; background: linear-gradient(145deg, #0a0f1a 0%, #0f2347 40%, #1e3a8a 100%); color: #ffffff; text-align: center; padding: 1.5rem; } .tenant-unavailable-title { margin: 0.25rem 0 0; font-size: 1.35rem; font-weight: 700; } .tenant-unavailable-message { margin: 0; max-width: 32rem; font-size: 1rem; line-height: 1.7; opacity: 0.95; } .tenant-unavailable-subdomain, .tenant-unavailable-hint { margin: 0; max-width: 32rem; font-size: 0.9rem; opacity: 0.8; line-height: 1.6; } .drawer-header { padding: 1rem; border-bottom: 1px solid rgba(255,255,255,0.12); } .users-page { padding-bottom: 2rem; } .users-hero { background: linear-gradient(135deg, rgba(37,99,235,0.92) 0%, rgba(30,64,175,0.92) 100%); color: #fff; border-radius: 16px; } .users-hero-sub { opacity: 0.85; } .not-found-container { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1rem; } .not-found-card { max-width: 480px; width: 100%; text-align: center; border-radius: 16px; } .sorry-layout { min-height: 100vh; background: var(--bs-bg); } #blazor-error-ui { background: lightyellow; bottom: 0; box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2); display: none; left: 0; padding: 0.6rem 1.25rem 0.7rem 1.25rem; position: fixed; width: 100%; z-index: 20000; } #blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: 0.75rem; top: 0.5rem; } .loading-progress { position: relative; display: block; width: 8rem; height: 8rem; margin: 20vh auto 1rem auto; } .loading-progress circle { fill: none; stroke: #e0e0e0; stroke-width: 0.6rem; transform-origin: 50% 50%; transform: rotate(-90deg); } .loading-progress circle:last-child { stroke: #1b6ec2; stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%; transition: stroke-dasharray 0.05s ease-in-out; } .loading-progress-text { position: absolute; text-align: center; font-weight: bold; inset: calc(20vh + 3.25rem) 0 auto 0.2rem; } .loading-progress-text:after { content: var(--blazor-load-percentage-text, "Loading"); } .app-bar-ai-btn { background: rgba(255, 255, 255, 0.18) !important; border-radius: 10px !important; margin-inline: 0; } .app-bar-ai-btn:hover { background: rgba(255, 255, 255, 0.32) !important; transform: scale(1.05); transition: transform 0.15s ease, background 0.15s ease; } html[lang="fa"] body, html[lang="fa"] .app-font, html[lang="fa"] .iransans, html[lang="fa"] .mud-typography, html[lang="fa"] .mud-input-root, html[lang="fa"] .mud-input-label, html[lang="fa"] .mud-button-root, html[lang="fa"] .mud-table-cell, html[lang="fa"] .mud-nav-link, html[lang="fa"] .mud-list-item, html[lang="fa"] .mud-chip, html[lang="fa"] .mud-alert, html[lang="fa"] .mud-menu-item, html[lang="fa"] .mud-select, html[lang="fa"] .login-page { font-family: 'IRANSans', Tahoma, sans-serif !important; } html[lang="en"] body, html[lang="en"] .app-font, html[lang="en"] .iransans, html[lang="en"] .mud-typography, html[lang="en"] .mud-input-root, html[lang="en"] .mud-input-label, html[lang="en"] .mud-button-root, html[lang="en"] .mud-table-cell, html[lang="en"] .mud-nav-link, html[lang="en"] .mud-list-item, html[lang="en"] .mud-chip, html[lang="en"] .mud-alert, html[lang="en"] .mud-menu-item, html[lang="en"] .mud-select, html[lang="en"] .login-page { font-family: Tahoma, 'Segoe UI', sans-serif !important; } html[lang="fa"] .login-page .login-field .mud-input-root input, html[lang="fa"] .login-page .login-field .mud-input-slot { text-align: right !important; } html[lang="en"] .login-page .login-field .mud-input-root input, html[lang="en"] .login-page .login-field .mud-input-slot { text-align: left !important; } html[lang="en"] .ps-nav-menu .mud-nav-link:hover { transform: translateX(2px); } html[lang="fa"] .home-kpi-bar .home-kpi-value { direction: ltr; text-align: right; } html[lang="en"] .home-kpi-bar .home-kpi-value { direction: ltr; text-align: left; } html[dir="ltr"] .app-bar-start, html[dir="ltr"] .app-bar-actions { flex-direction: row; } html[dir="ltr"] .login-page .welcome-content, html[dir="ltr"] .login-page .login-header.mud-stack { text-align: start; } html[dir="rtl"] .ps-nav-menu .mud-nav-link:hover { transform: translateX(-2px); } .mud-switch-base.mud-checked + .mud-switch-track.mud-default { background-color: var(--mud-palette-primary) !important; opacity: 0.55; } .mud-switch-base.mud-checked.mud-default-text { color: var(--mud-palette-primary) !important; --mud-ripple-color: var(--mud-palette-primary) !important; } @media (hover: hover) and (pointer: fine) { .mud-switch-base.mud-checked.mud-default-text:hover { background-color: color-mix(in srgb, var(--mud-palette-primary) 14%, transparent) !important; } } .ps-app .mud-drawer .mud-drawer-content { display: flex; flex-direction: column; overflow: hidden; padding: 0 !important; } .ps-nav-shell { display: flex; flex-direction: column; height: 100%; min-height: 0; overflow: hidden; } .nav-lang-wrap { flex-shrink: 0; padding: 0.4rem 0.65rem 0.3rem; background: var(--theme-drawer-bg, #0f2347) !important; border-bottom: 1px solid rgba(255, 255, 255, 0.08); } .nav-lang-wrap .lang-switcher { width: 100%; } .nav-lang-wrap .lang-switcher .mud-button-group-root { width: 100%; display: flex; } .nav-lang-wrap .lang-switcher .mud-button-root { flex: 1 1 50%; min-height: 30px; color: #fff !important; border-color: rgba(255, 255, 255, 0.28) !important; font-size: 0.76rem; font-weight: 700; } .nav-lang-wrap .lang-switcher .lang-switcher-active { background: rgba(255, 255, 255, 0.2) !important; color: #fff !important; } .nav-lang-wrap .lang-switcher-short { display: none; } .nav-lang-wrap .lang-switcher-full { display: inline; } .nav-search-wrap { position: sticky; top: 0; z-index: 4; padding: 0.45rem 0.65rem 0.35rem; background: var(--theme-drawer-bg, #0f2347) !important; border-bottom: 1px solid rgba(255, 255, 255, 0.1); flex-shrink: 0; } .nav-search-field { width: 100%; } .nav-search-field .mud-input-outlined .mud-input-outlined-border { border-color: rgba(255, 255, 255, 0.28) !important; border-radius: 10px !important; background: rgba(0, 0, 0, 0.18); } .nav-search-field .mud-input-root input { font-size: 0.82rem !important; min-height: 32px; padding-top: 6px !important; padding-bottom: 6px !important; } .nav-search-field .mud-input-root, .nav-search-field .mud-input-slot, .nav-search-field .mud-input-label { color: #fff !important; } .nav-search-field .mud-input-adornment .mud-icon-root { color: rgba(255, 255, 255, 0.85) !important; font-size: 1.1rem !important; } .nav-search-hint { display: block; margin-top: 0.25rem; padding-inline: 0.1rem; font-size: 0.68rem !important; color: rgba(255, 255, 255, 0.65) !important; } .ps-nav-menu.mud-navmenu { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding: 0.2rem 0.32rem 0.55rem; border: none !important; background: var(--theme-drawer-bg, #0f2347) !important; } .nav-link-label { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; width: 100%; } .nav-unread-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 1.35rem; height: 1.35rem; padding: 0 0.35rem; border: 1px solid rgba(255, 255, 255, 0.85); border-radius: 999px; color: #fff; background: linear-gradient(135deg, #ff6b6b, #e11d48); box-shadow: 0 2px 8px rgba(225, 29, 72, 0.42); font-size: 0.65rem; font-weight: 900; line-height: 1; animation: nav-unread-pop 220ms ease-out; } @keyframes nav-unread-pop { from { opacity: 0; transform: scale(0.65); } to { opacity: 1; transform: scale(1); } } .nav-section-block { margin-bottom: 0.18rem; padding: 0.04rem 0 0.12rem; border-radius: 9px; background: rgba(0, 0, 0, 0.14); border: 1px solid rgba(255, 255, 255, 0.1); box-shadow: none; } .nav-section-block + .nav-section-block { margin-top: 0.15rem; } .ps-nav-menu .nav-section-title { display: flex; align-items: center; gap: 0.25rem; padding: 0.28rem 0.5rem 0.12rem; font-size: 0.6rem; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; opacity: 0.78; color: rgba(255, 255, 255, 0.9) !important; } .nav-section-block:not(:first-child) .nav-section-title { margin-top: 0; padding-top: 0.38rem; border-top: none; } .nav-section-items { padding: 0 0.2rem 0.06rem; } .nav-section-items .mud-nav-link:not(.mud-nav-link-disabled) { background: rgba(255, 255, 255, 0.06) !important; border: 1px solid rgba(255, 255, 255, 0.07) !important; } .nav-section-items .mud-nav-link:not(.mud-nav-link-disabled):hover { background: rgba(255, 255, 255, 0.12) !important; } .nav-section-groups { display: flex; flex-direction: column; gap: 0.18rem; padding: 0.04rem 0.2rem 0.1rem; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-group.nav-menu-group { margin: 0; border-radius: 9px; background: rgba(0, 0, 0, 0.12); border: 1px solid rgba(255, 255, 255, 0.1); overflow: hidden; box-shadow: none; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-group.nav-menu-group > .mud-nav-link { border-radius: 0 !important; margin: 0 !important; min-height: 30px; padding: 2px 7px !important; font-size: 0.76rem; font-weight: 600; background: rgba(255, 255, 255, 0.05) !important; border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-group.nav-menu-group > .mud-nav-link:hover { background: rgba(255, 255, 255, 0.11) !important; transform: none !important; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-group .mud-nav-link { margin: 0 3px !important; min-height: 28px; padding: 2px 7px 2px 5px !important; font-size: 0.74rem; border-radius: 6px !important; background: transparent !important; border: 1px solid transparent !important; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-group .mud-nav-link:not(.mud-nav-link-disabled):hover { background: rgba(255, 255, 255, 0.1) !important; border-color: rgba(255, 255, 255, 0.08) !important; transform: none !important; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-group .mud-collapse-container, .ps-app .mud-drawer .ps-nav-menu .mud-nav-group .mud-nav-group-items { background: rgba(0, 0, 0, 0.14); border-top: 1px solid rgba(255, 255, 255, 0.06); padding: 0.06rem 0 0.1rem; margin-inline-start: 2px; border-inline-start: 2px solid rgba(255, 255, 255, 0.11); } .ps-app .mud-drawer .ps-nav-menu .mud-nav-group.nav-menu-group.mud-nav-group-expanded > .mud-nav-link { background: rgba(255, 255, 255, 0.1) !important; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-link:not(.mud-nav-link-disabled) { border-radius: 7px !important; margin: 0 4px !important; min-height: 30px; padding: 2px 7px !important; line-height: 1.2 !important; color: var(--theme-drawer-text, #fff) !important; transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease !important; --mud-ripple-color: var(--theme-drawer-text, #fff) !important; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-link:not(.mud-nav-link-disabled) .mud-nav-link-text { font-size: 0.76rem; font-weight: 500; line-height: 1.2; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-group.nav-menu-group > .mud-nav-link .mud-nav-link-text { font-size: 0.76rem; font-weight: 600; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-link:not(.mud-nav-link-disabled) .mud-nav-link-icon, .ps-app .mud-drawer .ps-nav-menu .mud-nav-link:not(.mud-nav-link-disabled) .mud-icon-root { font-size: 1rem !important; width: 1rem !important; height: 1rem !important; color: var(--theme-drawer-text, #fff) !important; opacity: 0.88; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-group .mud-nav-link .mud-icon-root { font-size: 0.92rem !important; width: 0.92rem !important; height: 0.92rem !important; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-link:not(.mud-nav-link-disabled):hover { background: var(--ps-nav-hover) !important; color: #fff !important; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-group .mud-nav-link:not(.mud-nav-link-disabled):hover { transform: none !important; } .ps-app .mud-drawer .ps-nav-menu .nav-section-items .mud-nav-link:not(.mud-nav-link-disabled):hover { transform: translateX(-2px); } [dir="ltr"] .ps-app .mud-drawer .ps-nav-menu .nav-section-items .mud-nav-link:not(.mud-nav-link-disabled):hover { transform: translateX(2px); } .ps-app .mud-drawer .ps-nav-menu.mud-navmenu .mud-nav-link.active:not(.mud-nav-link-disabled) { background: var(--ps-nav-active) !important; color: #fff !important; border-inline-end: 2px solid var(--theme-primary-light, #93c5fd) !important; font-weight: 600 !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15); } .ps-app .mud-drawer .ps-nav-menu.mud-navmenu .mud-nav-link.active:not(.mud-nav-link-disabled):hover, .ps-app .mud-drawer .ps-nav-menu.mud-navmenu .mud-nav-link.active:not(.mud-nav-link-disabled):focus-visible { background: rgba(255, 255, 255, 0.28) !important; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-group .mud-nav-link-expand-icon { fill: rgba(255, 255, 255, 0.9) !important; width: 1rem !important; height: 1rem !important; } .nav-search-empty { display: flex; flex-direction: column; align-items: center; gap: 0.4rem; padding: 1rem 0.75rem; margin: 0.25rem 0.4rem; border-radius: 11px; background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.75); text-align: center; } .nav-search-results { display: flex; flex-direction: column; gap: 0.12rem; margin: 0.25rem 0.4rem; padding: 0.25rem; border-radius: 11px; background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.09); } .nav-search-results .mud-nav-link:not(.mud-nav-link-disabled) { background: rgba(255, 255, 255, 0.06) !important; border: 1px solid rgba(255, 255, 255, 0.07) !important; margin: 0 !important; } .nav-search-results .mud-nav-link:not(.mud-nav-link-disabled):hover { background: rgba(255, 255, 255, 0.12) !important; transform: none !important; } .nav-search-empty__icon { font-size: 1.6rem !important; opacity: 0.55; } .nav-search-result-link .mud-nav-link-text { width: 100%; } .nav-search-result { display: flex; flex-direction: column; align-items: flex-start; gap: 0.08rem; min-width: 0; width: 100%; } .nav-search-result__title { font-weight: 600; font-size: 0.78rem; line-height: 1.25; } .nav-search-result__crumb { font-size: 0.62rem; opacity: 0.72; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; } .nav-account-block { margin: 0.35rem 0.4rem 0; padding: 0.25rem 0.28rem 0.1rem; border-radius: 11px; background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.09); } .nav-account-divider { margin: 0 0 0.25rem !important; border-color: rgba(255, 255, 255, 0.1) !important; display: none; } .ps-app .mud-drawer .ps-nav-menu .nav-account-link.mud-nav-link:not(.mud-nav-link-disabled) { background: rgba(255, 255, 255, 0.06) !important; border: 1px solid rgba(255, 255, 255, 0.07) !important; margin: 0.15rem 0 !important; } .ps-app .mud-drawer .ps-nav-menu .nav-account-link.mud-nav-link:not(.mud-nav-link-disabled):hover { background: rgba(255, 255, 255, 0.12) !important; transform: none !important; } .ps-nav-menu-footer { margin-top: 0.35rem; padding: 10px 10px 0.4rem; border-top: 1px solid rgba(255, 255, 255, 0.12); text-align: center; color: rgba(255, 255, 255, 0.85); } .ps-nav-menu-footer .mud-typography, .ps-nav-menu-footer .mud-link { color: rgba(255, 255, 255, 0.85) !important; } .ps-nav-menu-footer .mud-typography { font-size: 0.68rem !important; line-height: 1.35 !important; } .ps-nav-menu-footer .nav-footer-logo { width: 36px; height: 36px; border-radius: 10px; object-fit: contain; margin-bottom: 0.25rem; } @media (max-width: 959px) { .nav-search-wrap { padding: 0.4rem 0.55rem 0.3rem; } .nav-search-field .mud-input-root input { font-size: 0.88rem !important; min-height: 36px; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-link:not(.mud-nav-link-disabled) { min-height: 32px; padding: 3px 8px !important; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-group .mud-nav-link { min-height: 30px; } .ps-app .mud-drawer .ps-nav-menu .mud-nav-group.nav-menu-group > .mud-nav-link { min-height: 32px; } } @media (max-width: 400px) { .nav-search-result__crumb { white-space: normal; } } .mobile-page-container, .ps-app .ps-main-content > .mud-container, .ps-app .ps-main-content .mud-container-fluid { max-width: 100% !important; box-sizing: border-box; } .mobile-page-container { padding: 8px; } @media (min-width: 960px) { .mobile-page-container { padding: 16px; } } @media (max-width: 768px) { .ps-app .ps-main-content, .ps-app .ps-main-content.ps-main-content--full { padding-inline: max(0.35rem, env(safe-area-inset-left)) max(0.35rem, env(safe-area-inset-right)); padding-bottom: max(0.75rem, env(safe-area-inset-bottom)); } .mobile-page-container { padding: 8px 4px; } } @media (max-width: 400px) { .mobile-page-container { padding: 4px 2px; } } @media (max-width: 768px) { .ps-app .ps-main-content .mud-container { padding-left: max(4px, env(safe-area-inset-left)) !important; padding-right: max(4px, env(safe-area-inset-right)) !important; } .ps-app .catalog-table-paper, .ps-app .mud-paper.rounded-lg { overflow-x: auto; -webkit-overflow-scrolling: touch; } } .ps-app .mud-table-root .mud-table-container, .ps-app .mud-data-grid .mud-table-container { overflow-x: auto !important; overflow-y: clip; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; touch-action: pan-x pan-y pinch-zoom; max-width: 100%; } .ps-app .mud-table-root .mud-table-container[style*="height"], .ps-app .mud-table-root .mud-table-container[style*="max-height"], .ps-app .mud-data-grid .mud-table-container[style*="height"], .ps-app .mud-data-grid .mud-table-container[style*="max-height"], .ps-app .dm-table-scroll .mud-table-container, .ps-app .fc-table-scroll .mud-table-container, .ps-app .mort-table-scroll .mud-table-container, .ps-app .icr-table-scroll .mud-table-container, .ps-app .dfc-table-scroll .mud-table-container, .ps-app .inv-table-scroll .mud-table-container, .ps-app .fe-grid-shell .mud-table-container, .ps-app .fst-grid-shell .mud-table-container, .ps-app .wwrs-table-scroll-host .mud-table-container { overflow-y: auto !important; overscroll-behavior: contain; touch-action: pan-x pan-y pinch-zoom; } .ps-app .mud-table-root .mud-table-container, .ps-app .mud-data-grid .mud-table-container, .mobile-optimized-table, .ps-table-scroll-wrap, .inv-table-scroll, .dm-table-scroll, .mort-table-scroll, .icr-table-scroll, .fe-grid-shell, .fst-grid-shell, .chain-table-wrap, .home-salon-table-wrap { scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--theme-primary, #2563eb) 55%, #64748b) rgba(15, 23, 42, 0.06); } .ps-app .mud-table-root .mud-table-container::-webkit-scrollbar, .ps-app .mud-data-grid .mud-table-container::-webkit-scrollbar, .mobile-optimized-table::-webkit-scrollbar, .ps-table-scroll-wrap::-webkit-scrollbar, .inv-table-scroll::-webkit-scrollbar, .dm-table-scroll::-webkit-scrollbar, .mort-table-scroll::-webkit-scrollbar, .icr-table-scroll::-webkit-scrollbar { height: 12px; width: 12px; } .ps-app .mud-table-root .mud-table-container::-webkit-scrollbar-track, .ps-app .mud-data-grid .mud-table-container::-webkit-scrollbar-track, .mobile-optimized-table::-webkit-scrollbar-track, .ps-table-scroll-wrap::-webkit-scrollbar-track, .inv-table-scroll::-webkit-scrollbar-track, .dm-table-scroll::-webkit-scrollbar-track, .mort-table-scroll::-webkit-scrollbar-track, .icr-table-scroll::-webkit-scrollbar-track { background: rgba(15, 23, 42, 0.06); border-radius: 4px; } .ps-app .mud-table-root .mud-table-container::-webkit-scrollbar-thumb, .ps-app .mud-data-grid .mud-table-container::-webkit-scrollbar-thumb, .mobile-optimized-table::-webkit-scrollbar-thumb, .ps-table-scroll-wrap::-webkit-scrollbar-thumb, .inv-table-scroll::-webkit-scrollbar-thumb, .dm-table-scroll::-webkit-scrollbar-thumb, .mort-table-scroll::-webkit-scrollbar-thumb, .icr-table-scroll::-webkit-scrollbar-thumb { background: linear-gradient(90deg, var(--theme-primary, #2563eb) 0%, color-mix(in srgb, var(--theme-primary, #2563eb) 70%, #fff) 100%); border-radius: 4px; min-height: 40px; } [data-theme="dark"] .ps-app .mud-table-root .mud-table-container::-webkit-scrollbar-track, [data-theme="dark"] .ps-app .mud-data-grid .mud-table-container::-webkit-scrollbar-track, .mud-theme-dark .mobile-optimized-table::-webkit-scrollbar-track { background: #2d3748; } @media (max-width: 960px) { .ps-app .mud-table .mud-table-head, .ps-app .mud-table thead, .mobile-optimized-table .mud-table-head, .mobile-optimized-table thead { display: table-header-group !important; } .ps-app .mud-table .mud-table-body, .ps-app .mud-table tbody, .mobile-optimized-table .mud-table-body, .mobile-optimized-table tbody { display: table-row-group !important; } .ps-app .mud-table .mud-table-row, .ps-app .mud-table tr, .mobile-optimized-table .mud-table-row, .mobile-optimized-table tr { display: table-row !important; width: auto !important; max-width: none !important; border: none !important; margin: 0 !important; padding: 0 !important; box-shadow: none !important; } .ps-app .mud-table .mud-table-cell, .ps-app .mud-table th, .ps-app .mud-table td, .mobile-optimized-table .mud-table-cell, .mobile-optimized-table th, .mobile-optimized-table td { display: table-cell !important; width: auto !important; max-width: none !important; text-align: inherit !important; vertical-align: middle !important; } .ps-app .mud-table .mud-table-cell::before, .mobile-optimized-table .mud-table-cell::before { content: none !important; display: none !important; } .ps-app .mud-table .mud-table-cell .mud-table-cell-label, .mobile-optimized-table .mud-table-cell .mud-table-cell-label { display: none !important; } .ps-app .mud-table .mud-table, .ps-app .mud-table table, .mobile-optimized-table .mud-table, .mobile-optimized-table table { display: table !important; width: 100% !important; min-width: max(640px, 100%) !important; table-layout: auto !important; } .ps-app .mud-table-root, .ps-app .mud-table { overflow: visible !important; } .ps-app .mud-table .mud-table-head .mud-table-cell { position: sticky; top: 0; z-index: 2; } } .ps-app .mud-table-root, .ps-app .mud-table { overflow: visible !important; } .mobile-optimized-table, .ps-table-scroll-wrap { overflow-x: auto !important; overflow-y: clip !important; display: block !important; width: 100% !important; max-width: 100% !important; -webkit-overflow-scrolling: touch !important; touch-action: pan-x pan-y pinch-zoom; } .mobile-optimized-table .mud-table-container { overflow-x: auto !important; overflow-y: clip !important; touch-action: pan-x pan-y pinch-zoom; } .inv-table-scroll, .dm-table-scroll, .mort-table-scroll, .mort-subrow-scroll, .icr-table-scroll, .fpr-table-scroll, .dfc-table-scroll, .fm-dialog-table-scroll, .home-salon-table-wrap, .chain-table-wrap, .chain-fp-table-wrap, .chain-fp-subtable-wrap, .chain-rpt-subtable-wrap, .account-tree-paper, .account-hierarchy-table-paper, .fe-grid-shell, .fst-grid-shell, .fst-calendar-shell, .wwrs-table-scroll-host, .perf-std-grid-wrap, .catalog-table-paper { -webkit-overflow-scrolling: touch !important; touch-action: pan-x pan-y pinch-zoom; overscroll-behavior: contain; } .catalog-table-paper { overflow-x: auto !important; overflow-y: clip !important; } @media (max-width: 768px) { .ps-app .mud-table .mud-table-cell, .ps-app .mud-data-grid .mud-table-cell { font-size: 0.875rem !important; padding: 6px 8px !important; white-space: nowrap; } .ps-app .mud-table .mud-button-root { padding: 4px 8px !important; font-size: 0.8rem !important; } .ps-app .mud-table .mud-icon-button { width: 32px !important; height: 32px !important; } } @media (max-width: 600px) { .ps-app .mud-table .mud-table-cell, .ps-app .mud-data-grid .mud-table-cell { font-size: 0.82rem !important; padding: 5px 6px !important; } .ps-app .mud-table .mud-icon-button { width: 28px !important; height: 28px !important; } } .fe-grid-shell, .fst-grid-shell, .chain-table-wrap, .chain-rpt-subtable-wrap { overflow-x: auto !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch; touch-action: pan-x pan-y pinch-zoom; max-width: 100%; } .fe-events-grid, .fst-tasks-grid { min-width: 900px; } @media (max-width: 768px) { .fe-grid-shell, .fst-grid-shell { max-height: none; margin-inline: -2px; width: calc(100% + 4px); } } @media (max-width: 768px) { .mobile-page-container .mud-input-root, .ps-app .ps-main-content .mud-input-root { font-size: 0.9rem !important; } .mobile-page-container .mud-input-label, .ps-app .ps-main-content .mud-input-label { font-size: 0.85rem !important; } .catalog-page-header, .report-page-header, .fe-hero, .dm-toolbar { padding: 0.75rem !important; } .catalog-page-header-actions, .report-page-header-actions { width: 100%; justify-content: stretch !important; } .catalog-page-header-actions .mud-button-root, .report-page-header-actions .mud-button-root { flex: 1 1 auto; min-width: 0; } .catalog-toolbar .mud-stack-row, .fe-filter-panel .mud-stack-row, .fst-filter-panel .mud-stack-row { flex-wrap: wrap !important; gap: 0.5rem; } .mobile-page-container .mud-typography-h5, .ps-app .catalog-page-header .mud-typography-h5 { font-size: 1.2rem !important; } .mobile-page-container .mud-typography-h6 { font-size: 1.05rem !important; } } @media (max-width: 600px) { .mobile-page-container .mud-grid-item[class*="mud-grid-item-xs-"], .ps-app .ps-main-content .mud-grid-item:not([class*="mud-grid-item-md-"]):not([class*="mud-grid-item-lg-"]) { flex-basis: 100% !important; max-width: 100% !important; } .mobile-page-container .mud-button-root, .ps-app .ps-main-content .mud-button-root { font-size: 0.82rem !important; } .mobile-page-container .mud-chip { font-size: 0.75rem !important; } } @media (max-width: 600px) { .catalog-page-header > .mud-stack-row, .report-page-header > .mud-stack-row, .users-hero .mud-stack-row { flex-direction: column !important; align-items: stretch !important; gap: 0.65rem; } } @media (max-width: 768px) { .mud-dialog-container { padding: 4px !important; align-items: flex-end !important; } .mud-dialog { width: 100% !important; max-width: 100% !important; margin: 0 !important; max-height: calc(100dvh - 8px) !important; } .mud-dialog-title { font-size: 1.05rem !important; padding: 0.75rem 1rem !important; } .mud-dialog-content { padding: 0.65rem 0.85rem !important; max-height: calc(100dvh - 140px) !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch; } .mud-dialog-actions { padding: 0.5rem 0.75rem !important; flex-wrap: wrap !important; gap: 0.35rem; } .mud-dialog-actions .mud-button-root { flex: 1 1 calc(50% - 0.35rem); min-width: 120px; } } @media (max-width: 480px) { .mud-dialog-container { padding: 0 !important; } .mud-dialog { border-radius: 12px 12px 0 0 !important; max-height: 100dvh !important; } .mud-dialog-actions .mud-button-root { flex: 1 1 100%; } } @media (max-width: 768px) { .mud-dialog.catalog-edit-dialog, .mud-dialog.salon-edit-dialog, .mud-dialog.farm-edit-dialog { width: 100% !important; max-width: 100% !important; } .catalog-edit-dialog .mud-dialog-content, .salon-edit-dialog .mud-dialog-content, .farm-edit-dialog .mud-dialog-content { max-height: calc(100dvh - 130px) !important; padding: 0.65rem 0.75rem !important; } .catalog-edit-tabs .mud-tab, .salon-edit-tabs .mud-tab, .farm-edit-tabs .mud-tab { min-height: 40px !important; padding: 0 0.55rem !important; font-size: 0.82rem !important; } .catalog-edit-tabs .mud-tabs-toolbar, .salon-edit-tabs .mud-tabs-toolbar, .farm-edit-tabs .mud-tabs-toolbar { overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; } .catalog-edit-dialog .mud-dialog-content .mud-table-container, .salon-edit-dialog .mud-dialog-content .mud-table-container, .farm-edit-dialog .mud-dialog-content .mud-table-container { max-width: 100%; overflow-x: auto !important; } } @media (max-width: 768px) { .perf-std-grid-wrap { max-height: 50vh; } .perf-std-grid { min-width: 720px; } } @media (max-width: 768px) { .home-page-container { padding-left: 4px !important; padding-right: 4px !important; } .home-hero { padding: 0.65rem 0.7rem !important; border-radius: 12px !important; } .home-kpi-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); } .home-report-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } .home-salon-table-wrap { overflow-x: auto !important; overflow-y: clip !important; -webkit-overflow-scrolling: touch; } .home-salon-table .mud-table { min-width: 680px; } .home-filter-bar { padding: 0.75rem !important; } } @media (max-width: 480px) { .home-kpi-strip { grid-template-columns: 1fr; } .home-report-grid { grid-template-columns: 1fr !important; } } @media (max-width: 768px) { .report-full-page, .chain-fp-page, .mort-report-page, .fpr-report-page, .pcr-report-page { padding-inline: 2px !important; } .report-page .report-toolbar, .swr-page .report-toolbar { flex-wrap: wrap !important; gap: 0.5rem; } } @media (max-width: 600px) { .login-page .mud-paper:not(.login-card) { margin: 0.5rem !important; padding: 1.25rem !important; } } @media (max-width: 600px) { .mud-table-pagination, .mud-tablepager { flex-wrap: wrap !important; justify-content: center !important; gap: 0.35rem; } } @media (max-width: 768px) { .fst-calendar-shell { overflow-x: auto; -webkit-overflow-scrolling: touch; touch-action: pan-x pan-y pinch-zoom; } } .ps-app.mud-layout, .mud-layout.ps-app { touch-action: manipulation; } .ps-app .ps-main-content, .ps-app .mud-main-content { touch-action: pan-y pinch-zoom; overscroll-behavior-y: contain; -webkit-overflow-scrolling: touch; } .ps-app .mud-table-root .mud-table-container, .ps-app .mud-data-grid .mud-table-container, .ps-table-scroll-wrap, .inv-table-scroll, .dm-table-scroll, .mort-table-scroll, .icr-table-scroll, .fe-grid-shell, .fst-grid-shell, .chain-table-wrap, .home-salon-table-wrap, .catalog-table-paper, .wwrs-table-scroll-host { overscroll-behavior-y: auto; } @media (max-width: 960px) { .ps-app .mud-table-root .mud-table-container::-webkit-scrollbar, .ps-app .mud-data-grid .mud-table-container::-webkit-scrollbar, .inv-table-scroll::-webkit-scrollbar, .dm-table-scroll .mud-table-container::-webkit-scrollbar, .mort-table-scroll .mud-table-container::-webkit-scrollbar, .icr-table-scroll::-webkit-scrollbar, .chain-table-wrap::-webkit-scrollbar, .fe-grid-shell::-webkit-scrollbar, .fst-grid-shell::-webkit-scrollbar, .home-salon-table-wrap::-webkit-scrollbar, .accounting-pl-table-wrap::-webkit-scrollbar, .bs-table-scroll::-webkit-scrollbar, .ps-table-scroll-wrap::-webkit-scrollbar { height: 14px; width: 14px; } .ps-app .mud-table-root .mud-table-container, .ps-app .mud-data-grid .mud-table-container, .inv-table-scroll, .dm-table-scroll .mud-table-container, .mort-table-scroll .mud-table-container, .mort-subrow-scroll, .icr-table-scroll, .fpr-table-scroll, .dfc-table-scroll, .fe-grid-shell, .fst-grid-shell, .chain-table-wrap, .chain-fp-table-wrap, .chain-fp-subtable-wrap, .chain-rpt-subtable-wrap, .home-salon-table-wrap, .account-tree-paper, .account-hierarchy-table-paper, .accounting-pl-table-wrap, .wwrs-table-scroll-host .mud-table-container, .catalog-table-paper, .fm-dialog-table-scroll, .perf-std-grid-wrap { -webkit-overflow-scrolling: touch !important; touch-action: pan-x pan-y pinch-zoom !important; } .inv-page, .inv-table-scroll { max-width: 100%; } .inv-table-scroll { max-height: min(65dvh, calc(100dvh - 280px)); margin-inline: 0; } .inv-kpi-grid { gap: 0.5rem; } .dm-table-scroll .mud-table-container, .sw-page .dm-table-scroll .mud-table-container { max-height: min(62dvh, calc(100dvh - 300px)); } .dm-table.mud-table-root, .sw-page .dm-table.mud-table-root { min-width: 640px; } .mort-table-scroll, .icr-table-scroll, .fpr-table-scroll, .dfc-table-scroll, .mrt-report-page .mort-table-scroll { margin-inline: -2px; width: calc(100% + 4px); max-width: calc(100% + 4px); } .chain-table-wrap, .chain-fp-table-wrap, .chain-rpt-subtable-wrap { -webkit-overflow-scrolling: touch; max-width: 100%; } .chain-fp-table-wrap { max-height: none !important; } .accounting-pl-table-wrap, .account-tree-paper, .account-hierarchy-table-paper { -webkit-overflow-scrolling: touch; max-width: 100%; } .account-tree-paper, .account-hierarchy-table-paper { max-height: calc(100dvh - 220px); } .bs-table-scroll, .bird-sale-page .mud-table-container, .manure-sale-page .mud-table-container, .ic-page .mud-table-container, .feed-consumption-page .mud-table-container { overflow-x: auto !important; -webkit-overflow-scrolling: touch; touch-action: pan-x pan-y pinch-zoom; } .fe-grid-shell, .fst-grid-shell { max-height: min(70dvh, calc(100dvh - 260px)); border-radius: 10px; } .fe-events-grid, .fst-tasks-grid { min-width: 780px; } .msg-thread-list, .msg-conversation { -webkit-overflow-scrolling: touch; touch-action: pan-y pinch-zoom; } .mud-list, .mud-popover .mud-list { -webkit-overflow-scrolling: touch; overscroll-behavior: contain; touch-action: pan-y; } .mud-tabs-toolbar, .mud-tabs-toolbar-wrapper { overflow-x: auto !important; -webkit-overflow-scrolling: touch; touch-action: pan-x; scrollbar-width: none; } .mud-tabs-toolbar::-webkit-scrollbar { height: 0; display: none; } .catalog-toolbar, .inv-toolbar, .report-toolbar, .fe-filter-panel, .fst-filter-panel, .dm-toolbar { max-width: 100%; } .ps-app .catalog-table-paper, .ps-app .inv-table-card, .ps-app .dm-table-card, .ps-app .mud-paper.rounded-lg { overflow-x: auto !important; overflow-y: clip !important; -webkit-overflow-scrolling: touch; touch-action: pan-x pan-y pinch-zoom; max-width: 100%; } .wwrs-page .wwrs-table-scroll-host, .wwrs-page .mud-table-container { -webkit-overflow-scrolling: touch !important; touch-action: pan-x pan-y pinch-zoom !important; } .period-expenses-page .mud-table-container, .period-daily-full-cost-page .mud-table-container { overflow-x: auto !important; -webkit-overflow-scrolling: touch; touch-action: pan-x pan-y pinch-zoom; } .qr-page .mud-table-container, .quality-reports-page .mud-table-container { overflow-x: auto !important; -webkit-overflow-scrolling: touch; touch-action: pan-x pan-y pinch-zoom; } } @media (max-width: 600px) { .ps-app .mud-table .mud-table-cell, .ps-app .mud-data-grid .mud-table-cell { font-size: 0.8rem !important; padding: 6px 7px !important; } .inv-table-scroll, .dm-table-scroll .mud-table-container, .mort-table-scroll .mud-table-container { max-height: min(58dvh, calc(100dvh - 240px)); } .fe-hero, .fst-hero { padding: 0.85rem !important; border-radius: 12px !important; } .fe-hero-title, .fst-hero-title { font-size: 1.05rem !important; } .ps-app .mud-table .mud-icon-button, .ps-app .mud-data-grid .mud-icon-button { min-width: 36px !important; min-height: 36px !important; } .ps-app .mud-table .mud-button-root { min-height: 36px; } } @media (max-width: 400px) { .ps-app .mud-table .mud-table-cell, .ps-app .mud-data-grid .mud-table-cell { font-size: 0.75rem !important; padding: 4px 5px !important; } .home-salon-table .mud-table, .dm-table.mud-table-root { min-width: 560px; } } @media (prefers-reduced-motion: reduce) { .ps-page { animation: none !important; } } .ps-chart-dialog { --ps-chart-h: min(48dvh, calc(100dvh - 280px)); --ps-chart-h-filtered: min(40dvh, calc(100dvh - 340px)); --ps-chart-h-metrics: min(42dvh, calc(100dvh - 360px)); --ps-chart-h-tile: min(28dvh, 300px); --ps-chart-dialog-max-h: calc(100dvh - 16px); --ps-chart-content-max-h: calc(100dvh - 160px); } .ps-chart-dialog.mud-dialog { max-height: var(--ps-chart-dialog-max-h) !important; display: flex !important; flex-direction: column !important; } .ps-chart-dialog .mud-dialog-content { flex: 1 1 auto !important; min-height: 0 !important; max-height: var(--ps-chart-content-max-h) !important; overflow-y: auto !important; overflow-x: hidden !important; -webkit-overflow-scrolling: touch; } .ps-chart-dialog .mud-dialog-actions { flex-shrink: 0 !important; } .ps-chart-dialog .mort-chart-dialog-canvas, .ps-chart-dialog .fcr-chart-dialog-canvas, .ps-chart-dialog .ps-chart-canvas { width: 100%; min-width: 0; min-height: 0; overflow: visible; } .ps-chart-dialog .mort-chart-dialog-canvas, .ps-chart-dialog .fcr-chart-dialog-canvas { min-height: var(--ps-chart-h); } .ps-chart-dialog .chain-fp-compare__chart-panel { min-height: var(--ps-chart-h-metrics); } .ps-chart-dialog .mud-chart, .ps-chart-dialog .mud-chart svg, .ps-chart-dialog .mort-chart-dialog-chart, .ps-chart-dialog .swr-chart-tile-chart, .ps-chart-dialog .chain-fp-compare__chart { max-width: 100% !important; } @media (max-height: 800px) { .ps-chart-dialog { --ps-chart-h: min(42dvh, calc(100dvh - 260px)); --ps-chart-h-filtered: min(36dvh, calc(100dvh - 320px)); --ps-chart-h-metrics: min(38dvh, calc(100dvh - 340px)); --ps-chart-h-tile: min(24dvh, 260px); --ps-chart-content-max-h: calc(100dvh - 140px); } .ps-chart-dialog .mort-chart-print-meta, .ps-chart-dialog .fcr-chart-print-meta { padding: 0.4rem 0.55rem; margin-bottom: 0.5rem; font-size: 0.78rem; } .ps-chart-dialog .mort-chart-mode-toolbar, .ps-chart-dialog .fcr-chart-mode-toolbar, .ps-chart-dialog .swr-chart-mode-toolbar { margin-bottom: 0.35rem !important; padding-bottom: 0.35rem; } .ps-chart-dialog .chain-fp-compare__metrics { margin-bottom: 0.35rem; padding: 0.3rem 0.45rem; } } @media (max-height: 640px) { .ps-chart-dialog { --ps-chart-h: min(36dvh, calc(100dvh - 220px)); --ps-chart-h-filtered: min(32dvh, calc(100dvh - 280px)); --ps-chart-h-metrics: min(34dvh, calc(100dvh - 300px)); --ps-chart-h-tile: min(22dvh, 220px); --ps-chart-content-max-h: calc(100dvh - 120px); } .ps-chart-dialog .mud-dialog-title { padding: 0.5rem 0.75rem !important; } .ps-chart-dialog .mud-dialog-content { padding: 0.45rem 0.65rem !important; } .ps-chart-dialog .mud-dialog-actions { padding: 0.35rem 0.55rem !important; } } @media (max-width: 768px) { .ps-chart-dialog { --ps-chart-content-max-h: calc(100dvh - 140px); } } [data-theme="dark"] .ps-app .mud-table .mud-table-body .mud-table-cell, .mud-theme-dark .ps-app .mud-table .mud-table-body .mud-table-cell, [data-theme="dark"] .ps-app .mud-data-grid .mud-table-body .mud-table-cell, .mud-theme-dark .ps-app .mud-data-grid .mud-table-body .mud-table-cell { color: var(--theme-text-primary, #f1f5f9) !important; background-color: var(--ps-surface, #1a2332) !important; border-color: var(--ps-border, rgba(255, 255, 255, 0.1)) !important; } [data-theme="dark"] .ps-app .mud-table.mud-table-striped .mud-table-body .mud-table-row:nth-of-type(odd) .mud-table-cell, .mud-theme-dark .ps-app .mud-table.mud-table-striped .mud-table-body .mud-table-row:nth-of-type(odd) .mud-table-cell, [data-theme="dark"] .ps-app .mud-data-grid.mud-table-striped .mud-table-body .mud-table-row:nth-of-type(odd) .mud-table-cell, .mud-theme-dark .ps-app .mud-data-grid.mud-table-striped .mud-table-body .mud-table-row:nth-of-type(odd) .mud-table-cell { background-color: var(--ps-surface-2, #243044) !important; } [data-theme="dark"] .ps-app .mud-table.mud-table-hover .mud-table-body .mud-table-row:hover .mud-table-cell, .mud-theme-dark .ps-app .mud-table.mud-table-hover .mud-table-body .mud-table-row:hover .mud-table-cell, [data-theme="dark"] .ps-app .mud-data-grid.mud-table-hover .mud-table-body .mud-table-row:hover .mud-table-cell, .mud-theme-dark .ps-app .mud-data-grid.mud-table-hover .mud-table-body .mud-table-row:hover .mud-table-cell { background-color: rgba(var(--theme-primary-rgb, 59, 130, 246), 0.14) !important; } [data-theme="dark"] .ps-app .mud-table .mud-table-foot .mud-table-cell, .mud-theme-dark .ps-app .mud-table .mud-table-foot .mud-table-cell, [data-theme="dark"] .ps-app .mud-data-grid .mud-table-foot .mud-table-cell, .mud-theme-dark .ps-app .mud-data-grid .mud-table-foot .mud-table-cell { background-color: var(--ps-surface-2, #243044) !important; color: var(--theme-text-primary, #f1f5f9) !important; font-weight: 700; border-color: var(--ps-border) !important; } [data-theme="dark"] .ps-app .mud-table .mud-table-head .mud-table-cell, .mud-theme-dark .ps-app .mud-table .mud-table-head .mud-table-cell { color: #fff !important; } [data-theme="dark"] .ps-app .mud-table .mud-table-pagination, .mud-theme-dark .ps-app .mud-table .mud-table-pagination, [data-theme="dark"] .ps-app .mud-tablepager, .mud-theme-dark .ps-app .mud-tablepager { background: var(--ps-surface) !important; color: var(--theme-text-primary) !important; border-top: 1px solid var(--ps-border) !important; } [data-theme="dark"] .ps-app .mud-table-empty-row .mud-table-cell, .mud-theme-dark .ps-app .mud-table-empty-row .mud-table-cell { color: var(--theme-text-secondary) !important; } [data-theme="dark"] .ps-app .mud-table .mud-table-head .mud-table-cell[style*="sticky"], .mud-theme-dark .ps-app .mud-table .mud-table-head .mud-table-cell { background: var(--theme-gradient-primary) !important; } [data-theme="dark"] .ps-app .mud-input-control .mud-input, .mud-theme-dark .ps-app .mud-input-control .mud-input { color: var(--theme-text-primary) !important; } [data-theme="dark"] .ps-app .mud-input-label, .mud-theme-dark .ps-app .mud-input-label, [data-theme="dark"] .ps-app .mud-input-label-inputcontrol, .mud-theme-dark .ps-app .mud-input-label-inputcontrol { color: var(--theme-text-secondary) !important; } [data-theme="dark"] .ps-app .mud-input-outlined .mud-input-outlined-border, .mud-theme-dark .ps-app .mud-input-outlined .mud-input-outlined-border { border-color: var(--ps-border) !important; } [data-theme="dark"] .ps-app .mud-input-outlined:hover .mud-input-outlined-border, .mud-theme-dark .ps-app .mud-input-outlined:hover .mud-input-outlined-border { border-color: rgba(var(--theme-primary-rgb, 59, 130, 246), 0.55) !important; } [data-theme="dark"] .ps-app .mud-input-outlined.mud-input-focused .mud-input-outlined-border, .mud-theme-dark .ps-app .mud-input-outlined.mud-input-focused .mud-input-outlined-border { border-color: var(--theme-primary) !important; } [data-theme="dark"] .ps-app .mud-input-slot, .mud-theme-dark .ps-app .mud-input-slot, [data-theme="dark"] .ps-app .mud-select .mud-select-input, .mud-theme-dark .ps-app .mud-select .mud-select-input { color: var(--theme-text-primary) !important; } [data-theme="dark"] .ps-app .mud-input-helper-text, .mud-theme-dark .ps-app .mud-input-helper-text { color: var(--theme-text-secondary) !important; } [data-theme="dark"] .ps-app .mud-checkbox .mud-typography, .mud-theme-dark .ps-app .mud-checkbox .mud-typography, [data-theme="dark"] .ps-app .mud-switch .mud-typography, .mud-theme-dark .ps-app .mud-switch .mud-typography, [data-theme="dark"] .ps-app .mud-radio .mud-typography, .mud-theme-dark .ps-app .mud-radio .mud-typography { color: var(--theme-text-primary) !important; } [data-theme="dark"] .ps-app .mud-picker-toolbar, .mud-theme-dark .ps-app .mud-picker-toolbar { background: var(--theme-gradient-primary) !important; } [data-theme="dark"] .ps-app .mud-picker-calendar-header, .mud-theme-dark .ps-app .mud-picker-calendar-header { color: var(--theme-text-primary) !important; } [data-theme="dark"] .ps-app .mud-tabs-toolbar, .mud-theme-dark .ps-app .mud-tabs-toolbar { background: var(--ps-surface-2) !important; border-bottom: 1px solid var(--ps-border) !important; } [data-theme="dark"] .ps-app .mud-tab:not(.mud-tab-active), .mud-theme-dark .ps-app .mud-tab:not(.mud-tab-active) { color: var(--theme-text-secondary) !important; } [data-theme="dark"] .ps-app .mud-tab.mud-tab-active, .mud-theme-dark .ps-app .mud-tab.mud-tab-active { color: var(--theme-primary-light) !important; } [data-theme="dark"] .ps-app .mud-expansion-panel, .mud-theme-dark .ps-app .mud-expansion-panel { background: var(--ps-surface) !important; border-color: var(--ps-border) !important; } [data-theme="dark"] .ps-app .mud-expansion-panel-header, .mud-theme-dark .ps-app .mud-expansion-panel-header { color: var(--theme-text-primary) !important; } [data-theme="dark"] .ps-app .text-muted, .mud-theme-dark .ps-app .text-muted, [data-theme="dark"] .ps-app .mud-text-secondary, .mud-theme-dark .ps-app .mud-text-secondary { color: var(--theme-text-secondary) !important; } [data-theme="dark"] .mud-dialog .mud-dialog-content, .mud-theme-dark .mud-dialog .mud-dialog-content { background: var(--ps-surface, #1a2332) !important; color: var(--theme-text-primary) !important; } [data-theme="dark"] .mud-dialog .mud-dialog-actions, .mud-theme-dark .mud-dialog .mud-dialog-actions { background: var(--ps-surface, #1a2332) !important; border-top-color: var(--ps-border) !important; } [data-theme="dark"] .catalog-edit-dialog .mud-dialog-content, .mud-theme-dark .catalog-edit-dialog .mud-dialog-content, [data-theme="dark"] .salon-edit-dialog .mud-dialog-content, .mud-theme-dark .salon-edit-dialog .mud-dialog-content, [data-theme="dark"] .farm-edit-dialog .mud-dialog-content, .mud-theme-dark .farm-edit-dialog .mud-dialog-content { background: var(--ps-surface) !important; } [data-theme="dark"] .catalog-form-section, .mud-theme-dark .catalog-form-section { background: rgba(var(--theme-primary-rgb, 59, 130, 246), 0.06) !important; border-color: var(--ps-border) !important; } [data-theme="dark"] .catalog-ingredients-panel, .mud-theme-dark .catalog-ingredients-panel { background: rgba(var(--theme-primary-rgb, 59, 130, 246), 0.05) !important; border-color: var(--ps-border) !important; } [data-theme="dark"] .perf-std-grid-wrap, .mud-theme-dark .perf-std-grid-wrap { background: var(--ps-surface) !important; border-color: var(--ps-border) !important; } [data-theme="dark"] .perf-std-grid thead th, .mud-theme-dark .perf-std-grid thead th { background: rgba(var(--theme-primary-rgb, 59, 130, 246), 0.2) !important; color: var(--theme-text-primary) !important; } [data-theme="dark"] .perf-std-grid input.perf-std-cell-input:focus, .mud-theme-dark .perf-std-grid input.perf-std-cell-input:focus { background: var(--ps-surface-2) !important; } [data-theme="dark"] .catalog-page-header, .mud-theme-dark .catalog-page-header { background: linear-gradient(135deg, rgba(var(--theme-primary-rgb, 59, 130, 246), 0.18) 0%, rgba(var(--theme-primary-rgb, 59, 130, 246), 0.06) 100%) !important; } [data-theme="dark"] .catalog-toolbar, .mud-theme-dark .catalog-toolbar { background: var(--ps-surface) !important; } [data-theme="dark"] .account-tree-paper, .mud-theme-dark .account-tree-paper, [data-theme="dark"] .account-hierarchy-table-paper, .mud-theme-dark .account-hierarchy-table-paper { background: var(--ps-surface) !important; } [data-theme="dark"] .account-hierarchy-table tr.account-table-row-group, .mud-theme-dark .account-hierarchy-table tr.account-table-row-group { background: rgba(var(--theme-primary-rgb, 59, 130, 246), 0.12) !important; } [data-theme="dark"] .account-hierarchy-table tr.account-table-row-kol, .mud-theme-dark .account-hierarchy-table tr.account-table-row-kol { background: rgba(46, 125, 50, 0.1) !important; } [data-theme="dark"] .inv-subrow-table .mud-table-body .mud-table-cell, .mud-theme-dark .inv-subrow-table .mud-table-body .mud-table-cell { background: var(--ps-surface-2) !important; color: var(--theme-text-primary) !important; } [data-theme="dark"] .inv-subrow-table .mud-table-head .mud-table-cell, .mud-theme-dark .inv-subrow-table .mud-table-head .mud-table-cell { background: rgba(55, 71, 79, 0.35) !important; color: var(--theme-text-primary) !important; } [data-theme="dark"] .inv-qty-col, .mud-theme-dark .inv-qty-col { background: rgba(0, 137, 123, 0.12) !important; } [data-theme="dark"] .inv-money-col, .mud-theme-dark .inv-money-col { background: rgba(106, 27, 154, 0.12) !important; } [data-theme="dark"] .inv-weigh-panel, .mud-theme-dark .inv-weigh-panel { background: rgba(21, 101, 192, 0.1) !important; } [data-theme="dark"] .inv-weigh-panel--dest, .mud-theme-dark .inv-weigh-panel--dest { background: rgba(0, 137, 123, 0.12) !important; } [data-theme="dark"] .qr-main-tabs .mud-tabs-toolbar, .mud-theme-dark .qr-main-tabs .mud-tabs-toolbar { background: linear-gradient(180deg, rgba(37, 99, 235, 0.22) 0%, rgba(37, 99, 235, 0.08) 100%) !important; } [data-theme="dark"] .qr-section-title, .mud-theme-dark .qr-section-title { color: var(--theme-primary-light) !important; border-bottom-color: rgba(var(--theme-primary-rgb, 59, 130, 246), 0.25) !important; } [data-theme="dark"] .qr-weather-form-card, .mud-theme-dark .qr-weather-form-card { background: var(--ps-surface) !important; border-color: rgba(59, 130, 246, 0.35) !important; } [data-theme="dark"] .qr-weather-form-header, .mud-theme-dark .qr-weather-form-header { border-bottom-color: var(--ps-border) !important; } [data-theme="dark"] .qr-weather-farm, .mud-theme-dark .qr-weather-farm { color: var(--theme-primary-light) !important; } [data-theme="dark"] .qr-weather-metric, .mud-theme-dark .qr-weather-metric { background: var(--ps-surface-2) !important; } [data-theme="dark"] .qr-shift-col, .mud-theme-dark .qr-shift-col { background: var(--ps-surface) !important; border-color: var(--ps-border) !important; } [data-theme="dark"] .dm-kpi, .mud-theme-dark .dm-kpi { background: var(--ps-surface) !important; } [data-theme="dark"] .dm-table .mud-table-body .mud-table-cell.dm-sticky-salon, .mud-theme-dark .dm-table .mud-table-body .mud-table-cell.dm-sticky-salon { background: var(--ps-surface) !important; } [data-theme="dark"] .dm-table .mud-table-body tr:nth-child(even) .mud-table-cell.dm-sticky-salon, .mud-theme-dark .dm-table .mud-table-body tr:nth-child(even) .mud-table-cell.dm-sticky-salon { background: var(--ps-surface-2) !important; } [data-theme="dark"] .fe-filter-panel, .mud-theme-dark .fe-filter-panel, [data-theme="dark"] .fst-filter-panel, .mud-theme-dark .fst-filter-panel { background: var(--ps-surface) !important; } [data-theme="dark"] .fe-grid-shell, .mud-theme-dark .fe-grid-shell, [data-theme="dark"] .fst-grid-shell, .mud-theme-dark .fst-grid-shell { background: var(--ps-surface) !important; border-color: var(--ps-border) !important; } [data-theme="dark"] .fe-stat-card, .mud-theme-dark .fe-stat-card, [data-theme="dark"] .fst-stat-card, .mud-theme-dark .fst-stat-card { background: var(--ps-surface) !important; } [data-theme="dark"] .chain-chip--fallback, .mud-theme-dark .chain-chip--fallback { background: rgba(180, 83, 9, 0.2) !important; color: #fbbf24 !important; border-color: rgba(251, 191, 36, 0.35) !important; } [data-theme="dark"] .chain-chip--hidden, .mud-theme-dark .chain-chip--hidden, [data-theme="dark"] .chain-chip--stale, .mud-theme-dark .chain-chip--stale { background: var(--ps-surface-2) !important; color: var(--theme-text-secondary) !important; border-color: var(--ps-border) !important; } [data-theme="dark"] .fpr-section, .mud-theme-dark .fpr-section { background: var(--ps-surface) !important; border-color: var(--ps-border) !important; } [data-theme="dark"] .fpr-section__header, .mud-theme-dark .fpr-section__header { color: var(--theme-text-primary) !important; } [data-theme="dark"] .fpr-kpi-card, .mud-theme-dark .fpr-kpi-card, [data-theme="dark"] .fpr-index-card, .mud-theme-dark .fpr-index-card { background: var(--ps-surface-2) !important; border-color: var(--ps-border) !important; } [data-theme="dark"] .fpr-salon-card, .mud-theme-dark .fpr-salon-card { background: var(--ps-surface) !important; border-color: var(--ps-border) !important; } [data-theme="dark"] .ic-toolbar, .mud-theme-dark .ic-toolbar, [data-theme="dark"] .bt-toolbar, .mud-theme-dark .bt-toolbar, [data-theme="dark"] .fc-toolbar, .mud-theme-dark .fc-toolbar, [data-theme="dark"] .bs-toolbar, .mud-theme-dark .bs-toolbar { background: var(--ps-surface) !important; } [data-theme="dark"] .ic-kpi, .mud-theme-dark .ic-kpi, [data-theme="dark"] .bt-kpi, .mud-theme-dark .bt-kpi, [data-theme="dark"] .fc-kpi, .mud-theme-dark .fc-kpi { background: var(--ps-surface) !important; } [data-theme="dark"] .dcr-filter-bar, .mud-theme-dark .dcr-filter-bar { background: var(--ps-surface) !important; } [data-theme="dark"] .mud-popover .mud-list, .mud-theme-dark .mud-popover .mud-list, [data-theme="dark"] .mud-picker-content, .mud-theme-dark .mud-picker-content { background: var(--ps-surface) !important; color: var(--theme-text-primary) !important; } [data-theme="dark"] .mud-list-item, .mud-theme-dark .mud-list-item { color: var(--theme-text-primary) !important; } [data-theme="dark"] .mud-list-item:hover, .mud-theme-dark .mud-list-item:hover { background: rgba(var(--theme-primary-rgb, 59, 130, 246), 0.12) !important; } [data-theme="dark"] .ps-app .mud-alert-text, .mud-theme-dark .ps-app .mud-alert-text { color: inherit; } @media (max-width: 959px) { html.pwa-standalone .ps-app .app-bar-root .mud-toolbar-appbar, html.pwa-standalone .ps-app .app-bar-root.mud-appbar { padding-top: env(safe-area-inset-top, 0px); } } .ps-app .app-bar-root .mud-toolbar-appbar { display: flex; flex-wrap: nowrap; align-items: center; gap: 0; min-height: 56px; padding-inline: 2px 6px; overflow: visible; } .ps-app .app-bar-start { display: flex; flex-direction: row; align-items: center; flex: 0 1 auto; min-width: 0; overflow: hidden; } .ps-app .app-bar-root .mud-toolbar-appbar > .mud-spacer { flex: 1 1 8px; min-width: 4px; max-width: 24px; } .ps-app .app-bar-actions { display: flex; flex-direction: row; align-items: center; flex: 0 0 auto; flex-shrink: 0; gap: 1px; max-width: 100%; } .ps-app .app-bar-action-btn.mud-icon-button { margin: 0 !important; } .ps-app .app-bar-badge { margin: 0 !important; line-height: 0; } .ps-app .app-bar-badge .mud-badge-wrapper { line-height: 0; } .ps-app .app-bar-badge .mud-badge.mud-badge-top { font-size: 0.62rem !important; font-weight: 800 !important; min-width: 1.05rem; height: 1.05rem; padding: 0 0.28rem; line-height: 1.05rem !important; box-shadow: 0 0 0 1.5px rgba(255, 255, 255, 0.9); } .ps-app .app-bar-support-btn.mud-icon-button { position: relative; } .ps-app .app-bar-badge--support .mud-badge.mud-badge-top { background: linear-gradient(135deg, #ff6b6b, #e11d48) !important; } .lang-switcher-short { display: none; font-weight: 700; font-size: 0.72rem; letter-spacing: 0.02em; } .lang-switcher-full { display: inline; } @media (max-width: 959px) { .ps-app .app-bar-root .mud-toolbar-appbar { min-height: 52px; padding-inline: 0 2px; } .ps-app .app-bar-start { flex: 0 0 auto; } .ps-app .app-bar-root .mud-toolbar-appbar > .mud-spacer { flex: 1 1 2px; min-width: 2px; max-width: 8px; } .ps-app .app-bar-actions { flex-wrap: nowrap; justify-content: flex-end; gap: 0; } .ps-app .app-bar-action-secondary { display: none !important; } .ps-app .app-bar-root .app-bar-title, .ps-app .app-bar-root .app-bar-farm-chip { display: none !important; } .ps-app .app-bar-logo { width: 28px; height: 28px; margin-inline: 2px !important; } .ps-app .app-bar-menu-btn.mud-icon-button, .ps-app .app-bar-action-btn.mud-icon-button, .ps-app .app-bar-user-btn.mud-icon-button { width: 34px !important; height: 34px !important; min-width: 34px !important; padding: 5px !important; } .ps-app .app-bar-action-btn .mud-icon-root, .ps-app .app-bar-menu-btn .mud-icon-root, .ps-app .app-bar-user-btn .mud-icon-root { font-size: 1.28rem !important; color: inherit !important; opacity: 1 !important; } .ps-app .app-bar-ai-btn { margin: 0 !important; border-radius: 8px !important; width: 34px !important; height: 34px !important; } .lang-switcher-short { display: inline; } .lang-switcher-full { display: none; } .ps-app .app-bar-actions .lang-switcher { margin-inline: 1px; } .ps-app .app-bar-actions .lang-switcher .mud-button-root { min-width: 28px !important; max-width: 32px !important; height: 32px !important; min-height: 32px !important; padding: 0 2px !important; font-size: 0.7rem !important; line-height: 1 !important; } .ps-app .app-bar-actions .lang-switcher .mud-button-group-root { height: 32px; } .ps-app .app-bar-badge .mud-badge.mud-badge-top { transform: scale(0.88); transform-origin: top right; } [dir="rtl"] .ps-app .app-bar-badge .mud-badge.mud-badge-top { transform-origin: top left; } } @media (max-width: 400px) { .ps-app .app-bar-logo { width: 24px; height: 24px; } .ps-app .app-bar-menu-btn.mud-icon-button, .ps-app .app-bar-action-btn.mud-icon-button, .ps-app .app-bar-user-btn.mud-icon-button { width: 32px !important; height: 32px !important; min-width: 32px !important; padding: 4px !important; } .ps-app .app-bar-action-btn .mud-icon-root, .ps-app .app-bar-menu-btn .mud-icon-root, .ps-app .app-bar-user-btn .mud-icon-root { font-size: 1.18rem !important; } .ps-app .app-bar-ai-btn { width: 32px !important; height: 32px !important; } .ps-app .app-bar-actions .lang-switcher .mud-button-root { min-width: 26px !important; max-width: 30px !important; height: 30px !important; min-height: 30px !important; } .lang-switcher-short { font-size: 0.65rem; } } @media (max-width: 959px) { .ps-app .app-bar-user-btn.mud-icon-button { flex-shrink: 0; color: inherit !important; } } @media (min-width: 960px) { .ps-app .app-bar-action-btn.mud-icon-button { width: 40px !important; height: 40px !important; min-width: 40px !important; padding: 8px !important; } .ps-app .app-bar-action-btn .mud-icon-root { font-size: 1.35rem !important; } .ps-app .app-bar-user-btn.mud-icon-button { width: 40px !important; height: 40px !important; min-width: 40px !important; padding: 8px !important; flex-shrink: 0; } .ps-app .app-bar-user-btn .mud-icon-root { font-size: 1.5rem !important; } .ps-app .app-bar-actions { gap: 2px; } } .broiler-update-banner { position: fixed; inset-inline: 0; top: 0; z-index: 20000; background: linear-gradient(90deg, #0f2744 0%, #1d4ed8 100%); color: #fff; box-shadow: 0 8px 24px rgba(15, 39, 68, 0.28); padding: 0.75rem 1rem; animation: broiler-update-slide-in 0.25s ease-out; } .broiler-update-banner__content { max-width: 1100px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; } .broiler-update-banner__text { display: flex; flex-direction: column; gap: 0.15rem; min-width: 220px; } .broiler-update-banner__text strong { font-size: 0.95rem; font-weight: 700; } .broiler-update-banner__text span { font-size: 0.85rem; opacity: 0.92; } .broiler-update-banner__text small { font-size: 0.75rem; opacity: 0.75; } .broiler-update-banner__actions { display: flex; gap: 0.5rem; flex-wrap: wrap; } .broiler-update-banner__btn { border: none; border-radius: 10px; padding: 0.45rem 0.9rem; font-family: inherit; font-size: 0.85rem; cursor: pointer; } .broiler-update-banner__btn--primary { background: #fff; color: #1d4ed8; font-weight: 700; } .broiler-update-banner__btn--ghost { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, 0.45); } @keyframes broiler-update-slide-in { from { transform: translateY(-100%); opacity: 0; } to { transform: translateY(0); opacity: 1; } } @media (max-width: 600px) { .broiler-update-banner__content { flex-direction: column; align-items: stretch; } .broiler-update-banner__actions { justify-content: stretch; } .broiler-update-banner__btn { flex: 1; } } html.pwa-standalone, html.pwa-standalone body { overscroll-behavior-y: none; -webkit-tap-highlight-color: transparent; } html.pwa-standalone body { min-height: 100dvh; min-height: -webkit-fill-available; } html.pwa-standalone .ps-app.mud-layout, html.pwa-standalone .mud-layout.ps-app { height: 100dvh; height: -webkit-fill-available; max-height: 100dvh; max-height: -webkit-fill-available; } @media (display-mode: standalone), (display-mode: fullscreen) { html { min-height: 100dvh; min-height: -webkit-fill-available; } .ps-app.mud-layout, .mud-layout.ps-app { height: 100dvh; height: -webkit-fill-available; max-height: 100dvh; max-height: -webkit-fill-available; } html.pwa-standalone .ps-app .app-bar-root.mud-appbar, html .ps-app .app-bar-root.mud-appbar { padding-top: env(safe-area-inset-top, 0px); } html.pwa-standalone .ps-app .mud-main-content, html.pwa-standalone .ps-app .ps-main-content, html.pwa-standalone .ps-app .ps-main-content.ps-main-content--full, html .ps-app .mud-main-content, html .ps-app .ps-main-content, html .ps-app .ps-main-content.ps-main-content--full { padding-top: calc(var(--mud-appbar-height, var(--ps-appbar-height, 64px)) + env(safe-area-inset-top, 0px)) !important; padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px)); } html.pwa-standalone .login-page, html .login-page { padding-top: max(0.75rem, env(safe-area-inset-top, 0px)); padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px)); } html.pwa-standalone #broiler-pwa-install-banner, html #broiler-pwa-install-banner { display: none !important; } } .broiler-pwa-install-banner { position: fixed; inset-inline: max(10px, env(safe-area-inset-left)) max(10px, env(safe-area-inset-right)); bottom: max(12px, env(safe-area-inset-bottom)); z-index: 10050; animation: broilerPwaSlideUp 0.35s ease; } .broiler-pwa-install-banner__inner { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; gap: 8px 12px; align-items: start; padding: 12px 14px; border-radius: 16px; background: linear-gradient(145deg, #0f2347 0%, #1565c0 55%, #1e88e5 100%); color: #fff; box-shadow: 0 14px 40px rgba(15, 35, 71, 0.45); border: 1px solid rgba(255, 255, 255, 0.18); } .broiler-pwa-install-banner__icon { grid-row: 1 / span 2; width: 44px; height: 44px; border-radius: 12px; object-fit: cover; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2); } .broiler-pwa-install-banner__text { display: flex; flex-direction: column; gap: 4px; min-width: 0; } .broiler-pwa-install-banner__text strong { font-size: 0.92rem; font-weight: 800; line-height: 1.25; } .broiler-pwa-install-banner__text span { font-size: 0.78rem; line-height: 1.45; opacity: 0.92; } .broiler-pwa-install-banner__actions { grid-column: 2; display: flex; flex-wrap: wrap; gap: 8px; } .broiler-pwa-install-banner__btn { border: none; border-radius: 10px; padding: 8px 14px; font-family: inherit; font-size: 0.8rem; font-weight: 700; cursor: pointer; } .broiler-pwa-install-banner__btn--primary { background: #fff; color: #0f2347; } .broiler-pwa-install-banner__btn--ghost { background: rgba(255, 255, 255, 0.14); color: #fff; } @keyframes broilerPwaSlideUp { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } } @media (max-width: 400px) { .broiler-pwa-install-banner__inner { padding: 10px 12px; } .broiler-pwa-install-banner__text strong { font-size: 0.86rem; } .broiler-pwa-install-banner__text span { font-size: 0.74rem; } } .home-page-wrapper { display: flex; flex-direction: column; gap: 1rem; } .home-page-container { padding-bottom: 2rem; overflow: visible; } .home-hero { background: var(--theme-gradient-primary); border-radius: var(--ps-radius-lg, 16px); padding: 1.35rem 1.5rem; color: #fff; box-shadow: var(--ps-shadow-lg); position: relative; overflow: hidden; border: none !important; } .home-hero::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 10% 20%, rgba(255,255,255,0.15), transparent 50%); pointer-events: none; } .home-hero-content { position: relative; z-index: 1; } .home-hero .mud-typography, .home-hero .mud-icon-root { color: #fff !important; } .home-hero-subtitle { opacity: 0.92; font-size: 0.92rem; } .home-hero-meta { opacity: 0.85; font-size: 0.78rem; margin-top: 0.2rem; } .home-hero-pills { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.5rem; align-items: stretch; position: relative; z-index: 1; } .home-hero-pill { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 0.2rem; min-height: 4.6rem; padding: 0.5rem 0.45rem; border-radius: 12px; background: rgba(255, 255, 255, 0.14); border: 1px solid rgba(255, 255, 255, 0.22); backdrop-filter: blur(4px); } .home-hero-pill--dates { padding: 0.5rem 0.45rem; background: rgba(255, 255, 255, 0.17); border-color: rgba(255, 255, 255, 0.28); gap: 0; } .home-hero-pill__dates-head { display: flex; align-items: center; justify-content: center; gap: 0.3rem; width: 100%; margin-bottom: 0.35rem; font-size: 0.58rem; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; opacity: 0.82; } .home-hero-pill__dates-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.35rem 0.55rem; width: 100%; } .home-hero-pill__date-cell { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0.1rem; min-width: 0; } .home-hero-pill__date-cell + .home-hero-pill__date-cell { padding-inline-start: 0.55rem; border-inline-start: 1px solid rgba(255, 255, 255, 0.22); } .home-hero-pill__value--date { font-size: 0.86rem; font-weight: 800; line-height: 1.2; white-space: nowrap; } .home-hero-pill--flock { padding: 0.5rem 0.45rem; background: rgba(255, 255, 255, 0.16); border-color: rgba(255, 255, 255, 0.26); gap: 0; } .home-hero-pill__flock-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.35rem 0.55rem; width: 100%; align-items: center; } .home-hero-pill__flock-cell { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0.1rem; min-width: 0; } .home-hero-pill__flock-cell + .home-hero-pill__flock-cell { padding-inline-start: 0.55rem; border-inline-start: 1px solid rgba(255, 255, 255, 0.22); } .home-hero-pill--flock .home-hero-pill__value--primary, .home-hero-pill--flock .home-hero-pill__value--secondary { font-size: 0.95rem; font-weight: 800; line-height: 1.15; margin-top: 0; } .home-hero-pill--flock .home-hero-pill__label { font-size: 0.58rem; opacity: 0.82; line-height: 1.2; } .home-hero-pill__value--primary { font-size: 1.22rem; font-weight: 800; line-height: 1.15; margin-top: 0.1rem; } .home-hero-pill__sub { display: flex; flex-direction: column; align-items: flex-start; gap: 0.08rem; width: 100%; margin-top: 0.45rem; padding-top: 0.45rem; border-top: 1px solid rgba(255, 255, 255, 0.22); } .home-hero-pill__value--secondary { font-size: 0.95rem; font-weight: 700; line-height: 1.2; opacity: 0.95; } .home-hero-pill__value--negative { color: #fecaca !important; } .home-hero-pill__value--deficit { color: #fde68a !important; } .home-hero-pill__value--surplus { color: #a7f3d0 !important; } .home-hero-pill .mud-icon-root { opacity: 0.9; font-size: 1rem !important; } .home-hero-pill__value, .home-hero-pill__label { text-align: center; } .home-hero-pill__value { font-size: 0.95rem; font-weight: 800; line-height: 1.15; font-variant-numeric: tabular-nums; } .home-hero-pill__label { font-size: 0.58rem; opacity: 0.88; line-height: 1.2; } .home-hero-pill--loss .home-hero-pill__label, .home-hero-pill--age .home-hero-pill__label { max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .home-hero-pill--dates .home-hero-pill__label { font-size: 0.56rem; opacity: 0.8; line-height: 1.15; } .home-filter-bar { background: var(--ps-surface, #fff); border: 1px solid var(--ps-border); border-radius: var(--ps-radius-lg, 16px); padding: 1rem; box-shadow: var(--ps-shadow-sm); } [data-theme="dark"] .home-filter-bar { background: var(--ps-surface, #1a2332); } .home-selection-grid .mud-select, .home-selection-grid .mud-autocomplete { width: 100%; } .home-hero-greeting { font-weight: 800 !important; } .home-status-chip { font-weight: 700 !important; background: rgba(255, 255, 255, 0.18) !important; color: #fff !important; border: 1px solid rgba(255, 255, 255, 0.35) !important; } .home-hero-actions { flex-shrink: 0; } .home-hero-readonly { display: flex; align-items: flex-start; gap: 0.55rem; width: 100%; margin-top: 0.15rem; padding: 0.55rem 0.75rem; border-radius: 12px; background: rgba(255, 196, 0, 0.22); border: 1px solid rgba(255, 236, 179, 0.55); backdrop-filter: blur(6px); box-sizing: border-box; } .home-hero-readonly__icon { flex-shrink: 0; margin-top: 0.12rem; color: #fff8e1 !important; } .home-hero-readonly__desc { flex: 1 1 auto; min-width: 0; font-weight: 650; font-size: 0.8rem; line-height: 1.45; color: rgba(255, 255, 255, 0.95); overflow-wrap: anywhere; word-break: break-word; } .dashboard-switch-btn { font-weight: 700 !important; white-space: nowrap; } .home-hero .dashboard-switch-btn--chain { background: linear-gradient(135deg, #7c3aed 0%, #4f46e5 38%, #2563eb 72%, #0891b2 100%) !important; border: 1px solid rgba(255, 255, 255, 0.55) !important; color: #fff !important; font-weight: 800 !important; letter-spacing: 0.01em; padding: 0.5rem 1.15rem !important; border-radius: 12px !important; box-shadow: 0 4px 16px rgba(79, 70, 229, 0.45), 0 2px 6px rgba(37, 99, 235, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.38); text-shadow: 0 1px 2px rgba(15, 23, 42, 0.2); transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease; } .home-hero .dashboard-switch-btn--chain:hover { background: linear-gradient(135deg, #8b5cf6 0%, #6366f1 38%, #3b82f6 72%, #06b6d4 100%) !important; box-shadow: 0 8px 24px rgba(79, 70, 229, 0.55), 0 4px 10px rgba(37, 99, 235, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.45); transform: translateY(-1px); filter: brightness(1.05); } .home-hero .dashboard-switch-btn--chain:active { transform: translateY(0); box-shadow: 0 2px 10px rgba(79, 70, 229, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.3); } .home-hero .dashboard-switch-btn--chain .mud-icon-root { color: #fff !important; filter: drop-shadow(0 1px 2px rgba(15, 23, 42, 0.25)); } .home-kpi-bar { padding: 0.75rem; border: 1px solid var(--ps-border); border-radius: var(--ps-radius-lg, 16px); background: var(--ps-surface); box-shadow: var(--ps-shadow-sm); } .home-kpi-strip { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 0.65rem; } .home-kpi-strip--compact { grid-template-columns: repeat(6, minmax(0, 1fr)); } .home-kpi-tile--feed { border-inline-end: 3px solid #7c3aed; } .home-kpi-tile--feed .mud-icon-root { color: #7c3aed !important; } .home-glance-bar { padding: 1rem 1.1rem; border: 1px solid var(--ps-border); border-radius: var(--ps-radius-lg, 16px); background: linear-gradient(145deg, rgba(5, 150, 105, 0.06) 0%, rgba(37, 99, 235, 0.04) 50%, var(--ps-surface) 100%); box-shadow: var(--ps-shadow-sm); } [data-theme="dark"] .home-glance-bar { background: linear-gradient(145deg, rgba(16, 185, 129, 0.1) 0%, rgba(59, 130, 246, 0.08) 50%, var(--ps-surface, #1a2332) 100%); } .home-glance-header { display: flex; align-items: center; gap: 0.45rem; margin-bottom: 0.75rem; color: var(--theme-primary); } .home-glance-title { font-size: 0.88rem !important; font-weight: 800 !important; color: var(--theme-text-primary) !important; } .home-glance-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0.6rem; } .home-glance-item { --pct-h1: 120; --pct-h2: 140; --pct-sat: 72%; --pct-light: 48%; padding: 0.65rem 0.75rem; border-radius: 12px; border: 1px solid var(--ps-border); background: var(--ps-surface); display: flex; flex-direction: column; gap: 0.2rem; } .home-glance-label { font-size: 0.7rem; color: var(--theme-text-secondary); } .home-glance-value { font-size: 1.05rem; font-weight: 800; color: var(--theme-text-primary); } .home-glance-item--survival, .home-glance-item--remaining { border-inline-end-width: 3px; border-inline-end-style: solid; border-inline-end-color: hsl(var(--pct-h2), var(--pct-sat), var(--pct-light)); } .home-glance-item--survival .home-glance-value, .home-glance-item--remaining .home-glance-value { color: hsl(var(--pct-h2), var(--pct-sat), calc(var(--pct-light) - 6%)); } .home-glance-item--placed { border-inline-end: 3px solid #ea580c; } .home-glance-item--feed { border-inline-end: 3px solid #7c3aed; } .home-glance-item--sold { border-inline-end: 3px solid #0d9488; } .home-progress-stack { display: flex; flex-direction: column; gap: 1rem; margin-top: 0.85rem; padding-top: 0.85rem; border-top: 1px dashed var(--ps-border); } .home-progress-row { --pct-h1: 120; --pct-h2: 140; --pct-sat: 72%; --pct-light: 48%; --pct-glow: 0.35; } .home-pct-bar-wrap { position: relative; padding: 2px; border-radius: 999px; background: linear-gradient( 180deg, color-mix(in srgb, var(--ps-border) 40%, transparent), color-mix(in srgb, var(--ps-surface-2, #f1f5f9) 85%, transparent) ); box-shadow: inset 0 2px 5px rgba(15, 23, 42, 0.1), 0 1px 0 rgba(255, 255, 255, 0.65); } [data-theme="dark"] .home-pct-bar-wrap { background: linear-gradient(180deg, rgba(0, 0, 0, 0.35), rgba(255, 255, 255, 0.05)); box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.45); } .home-pct-widget ::deep .home-pct-mud.mud-progress-linear { height: 16px !important; border-radius: 999px !important; background: transparent !important; overflow: hidden; } .home-pct-widget ::deep .home-pct-mud .mud-progress-linear-bar { border-radius: 999px !important; background-color: transparent !important; background-image: linear-gradient( -45deg, rgba(255, 255, 255, 0.22) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.22) 50%, transparent 50%, transparent 75%, rgba(255, 255, 255, 0.22) 75%, transparent 75%, transparent ), linear-gradient( 90deg, hsl(var(--pct-h1), var(--pct-sat), calc(var(--pct-light) - 6%)) 0%, hsl(var(--pct-h2), calc(var(--pct-sat) + 6%), var(--pct-light)) 52%, hsl(calc(var(--pct-h2) + 10), var(--pct-sat), calc(var(--pct-light) + 8%)) 100% ) !important; background-size: 1.1rem 1.1rem, 100% 100% !important; animation: home-pct-stripes 1.1s linear infinite !important; box-shadow: 0 0 16px hsla(var(--pct-h2), var(--pct-sat), var(--pct-light), var(--pct-glow)), inset 0 1px 0 rgba(255, 255, 255, 0.55), inset 0 -1px 0 rgba(0, 0, 0, 0.12) !important; transition: width 0.7s cubic-bezier(0.22, 1, 0.36, 1) !important; } .home-pct-widget ::deep .home-pct-mud .mud-progress-linear-bar::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient( 180deg, rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0.06) 45%, rgba(0, 0, 0, 0.08) 100% ); pointer-events: none; } @keyframes home-pct-stripes { from { background-position: 0 0, 0 0; } to { background-position: 1.1rem 0, 0 0; } } .home-progress-row__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.45rem; font-size: 0.74rem; } .home-progress-row__label { color: var(--theme-text-secondary); font-weight: 600; } .home-progress-row__value, .home-pct-value { font-weight: 800; font-variant-numeric: tabular-nums; color: hsl(var(--pct-h2), var(--pct-sat), calc(var(--pct-light) - 6%)); text-shadow: 0 0 18px hsla(var(--pct-h2), var(--pct-sat), var(--pct-light), 0.25); } .home-survival-caption { display: flex; justify-content: space-between; margin-top: 0.35rem; font-size: 0.72rem; color: var(--theme-text-secondary); } .home-weight-alert { border-radius: var(--ps-radius-lg, 16px) !important; border: 1px solid rgba(245, 158, 11, 0.35) !important; } .home-actions-panel { background: linear-gradient(145deg, rgba(37, 99, 235, 0.05) 0%, rgba(124, 58, 237, 0.04) 48%, var(--ps-surface) 100%); border: 1px solid rgba(37, 99, 235, 0.14); border-radius: var(--ps-radius-lg, 16px); padding: 1rem 1.15rem 1.15rem; box-shadow: var(--ps-shadow-sm); } [data-theme="dark"] .home-actions-panel { background: linear-gradient(145deg, rgba(59, 130, 246, 0.12) 0%, rgba(139, 92, 246, 0.08) 45%, var(--ps-surface, #1a2332) 100%); border-color: rgba(100, 181, 246, 0.22); } .home-actions-panel__header { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.85rem; } .home-actions-divider { height: 1px; background: var(--ps-border); margin: 1rem 0 0.85rem; } .home-reports-header--inline { margin-bottom: 0.65rem; } .home-reports-header__icon--sm { width: 34px; height: 34px; } .home-shortcuts-grid--featured { display: flex; flex-wrap: wrap; gap: 0.4rem; justify-content: flex-start; align-items: flex-start; } .home-shortcuts-grid--featured .home-shortcut-item { flex: 0 0 auto; width: 5.85rem; height: 5.85rem; max-width: 5.85rem; max-height: 5.85rem; aspect-ratio: 1 / 1; min-height: 0; padding: 0.4rem 0.2rem; border-radius: 12px; gap: 0.28rem; } .home-shortcuts-grid--featured .home-shortcut-icon-wrap { width: 2.15rem; height: 2.15rem; border-radius: 10px; flex-shrink: 0; box-shadow: 0 2px 7px var(--shortcut-shadow, rgba(37, 99, 235, 0.16)); } .home-shortcuts-grid--featured .home-shortcut-icon.mud-icon-root { font-size: 1.2rem !important; } .home-shortcuts-grid--featured .home-shortcut-label { font-size: 0.64rem; line-height: 1.2; font-weight: 700; padding: 0 2px; -webkit-line-clamp: 2; } @media (min-width: 1200px) { .home-shortcuts-grid--featured { flex-wrap: nowrap; } } @media (min-width: 1500px) { .home-shortcuts-grid--featured { gap: 0.45rem; } .home-shortcuts-grid--featured .home-shortcut-item { width: 6.25rem; height: 6.25rem; max-width: 6.25rem; max-height: 6.25rem; padding: 0.42rem 0.22rem; } .home-shortcuts-grid--featured .home-shortcut-icon-wrap { width: 2.3rem; height: 2.3rem; } .home-shortcuts-grid--featured .home-shortcut-icon.mud-icon-root { font-size: 1.28rem !important; } .home-shortcuts-grid--featured .home-shortcut-label { font-size: 0.66rem; } } .home-reports-grid--compact { grid-template-columns: repeat(5, minmax(0, 1fr)); } .home-report-card--daily-comprehensive { --report-accent: #0d9488; --report-icon-bg: linear-gradient(145deg, #5eead4, #f0fdfa); --report-shadow: rgba(13, 148, 136, 0.28); } [data-theme="dark"] .home-report-card--daily-comprehensive { --report-icon-bg: linear-gradient(145deg, rgba(13, 148, 136, 0.42), rgba(13, 148, 136, 0.12)); } .home-card-header--sales { background: linear-gradient(135deg, #2563eb, #3b82f6); } .home-salon-section-header { padding: 0.35rem 0.15rem; } .home-salon-cards { display: none; flex-direction: column; gap: 0.65rem; } .home-salon-card { border: 1px solid var(--ps-border); border-radius: 14px; background: var(--ps-surface); padding: 0.75rem 0.85rem; box-shadow: var(--ps-shadow-sm); } .home-salon-card__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 0.5rem; margin-bottom: 0.6rem; } .home-salon-card__name { font-weight: 800; font-size: 0.9rem; color: var(--theme-text-primary); } .home-salon-card__breed { font-size: 0.72rem; color: var(--theme-text-secondary); margin-top: 0.1rem; } .home-salon-card__metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.45rem; } .home-salon-card__metrics--extended { grid-template-columns: repeat(3, minmax(0, 1fr)); } .home-salon-density { font-variant-numeric: tabular-nums; font-weight: 600; } .home-salon-th-density { min-width: 88px; white-space: normal; line-height: 1.25; font-size: 0.72rem; } .home-salon-card__metric { padding: 0.45rem 0.55rem; border-radius: 10px; background: color-mix(in srgb, var(--ps-border) 35%, transparent); } .home-salon-card__metric-label { display: block; font-size: 0.65rem; color: var(--theme-text-secondary); margin-bottom: 0.1rem; } .home-salon-card__metric-value { font-size: 0.88rem; font-weight: 700; } .home-salon-card__weight { display: flex; align-items: center; gap: 0.35rem; margin-top: 0.55rem; padding-top: 0.5rem; border-top: 1px dashed var(--ps-border); font-size: 0.78rem; color: var(--theme-text-secondary); } .home-kpi-tile { display: flex; flex-direction: row; align-items: center; gap: 0.65rem; padding: 0.75rem 0.85rem; border-radius: 12px; border: 1px solid var(--ps-border); background: var(--ps-surface); min-height: 78px; transition: transform 0.15s ease, box-shadow 0.15s ease; } .home-kpi-tile:hover { transform: translateY(-2px); box-shadow: var(--ps-shadow-md); } .home-kpi-tile__icon { width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .home-kpi-tile__body { min-width: 0; flex: 1; } .home-kpi-label { font-size: 0.74rem; color: var(--theme-text-secondary); line-height: 1.3; } .home-kpi-value { font-size: 1rem; font-weight: 800; color: var(--theme-text-primary); line-height: 1.25; } .home-kpi-caption { font-size: 0.72rem; color: var(--theme-text-secondary); margin-top: 0.1rem; } .home-kpi-tile--user { border-inline-end: 3px solid #2563eb; } .home-kpi-tile--user .home-kpi-tile__icon { background: rgba(37, 99, 235, 0.12); color: #2563eb; } .home-kpi-tile--farm { border-inline-end: 3px solid #7c3aed; } .home-kpi-tile--farm .home-kpi-tile__icon { background: rgba(124, 58, 237, 0.12); color: #7c3aed; } .home-kpi-tile--role { border-inline-end: 3px solid #16a34a; } .home-kpi-tile--role .home-kpi-tile__icon { background: rgba(22, 163, 74, 0.12); color: #16a34a; } .home-kpi-tile--version { border-inline-end: 3px solid #d97706; } .home-kpi-tile--version .home-kpi-tile__icon { background: rgba(217, 119, 6, 0.14); color: #d97706; } .home-info-alert { border-radius: var(--ps-radius-lg, 16px) !important; border: 1px solid rgba(37, 99, 235, 0.2) !important; } .home-shortcuts-bar { background: linear-gradient(145deg, rgba(37, 99, 235, 0.05) 0%, rgba(124, 58, 237, 0.04) 48%, var(--ps-surface) 100%); border: 1px solid rgba(37, 99, 235, 0.14); border-radius: var(--ps-radius-lg, 16px); padding: 1rem 1.15rem; box-shadow: var(--ps-shadow-sm); } [data-theme="dark"] .home-shortcuts-bar { background: linear-gradient(145deg, rgba(59, 130, 246, 0.12) 0%, rgba(139, 92, 246, 0.08) 45%, var(--ps-surface, #1a2332) 100%); border-color: rgba(100, 181, 246, 0.22); } .home-shortcuts-header { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.85rem; } .home-shortcuts-header__icon { width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: var(--theme-gradient-primary); color: #fff; flex-shrink: 0; box-shadow: 0 4px 14px rgba(37, 99, 235, 0.32); } .home-shortcuts-header__icon .mud-icon-root { font-size: 1.3rem !important; } .home-shortcuts-title { font-size: 0.95rem !important; font-weight: 800 !important; color: var(--theme-text-primary) !important; } .home-shortcuts-hint { font-size: 0.72rem !important; color: var(--theme-text-secondary) !important; } .home-shortcuts-grid { display: flex; flex-wrap: wrap; gap: 0.4rem; justify-content: flex-start; } .home-shortcuts-grid .home-shortcut-item { flex: 0 0 auto; width: 5.85rem; height: 5.85rem; max-width: 5.85rem; max-height: 5.85rem; } .home-shortcut-item { --shortcut-accent: var(--theme-primary, #2563eb); position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.18rem; padding: 0.3rem 0.15rem; min-height: 0; aspect-ratio: 1 / 1; border-radius: 10px; border: 1px solid color-mix(in srgb, var(--shortcut-accent) 22%, var(--ps-border)); background: linear-gradient( 165deg, color-mix(in srgb, var(--shortcut-accent) 11%, var(--ps-surface)) 0%, var(--ps-surface) 58% ); text-decoration: none; color: inherit; font: inherit; width: 100%; cursor: pointer; overflow: hidden; box-sizing: border-box; transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease; -webkit-tap-highlight-color: transparent; } button.home-shortcut-item, button.home-report-card { appearance: none; text-align: inherit; } .home-shortcut-item::after { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, var(--shortcut-accent), color-mix(in srgb, var(--shortcut-accent) 55%, #fff)); opacity: 0.85; border-radius: 11px 11px 0 0; } .home-shortcut-item:hover, .home-shortcut-item:focus-visible { transform: translateY(-3px); box-shadow: 0 10px 22px color-mix(in srgb, var(--shortcut-accent) 28%, transparent); outline: none; border-color: color-mix(in srgb, var(--shortcut-accent) 45%, transparent); } .home-shortcut-item:active { transform: translateY(-1px); } .home-shortcut-item--disabled { opacity: 0.55; cursor: not-allowed; pointer-events: none; } .home-shortcut-icon-wrap { position: relative; z-index: 1; width: 2.15rem; height: 2.15rem; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: var(--shortcut-icon-bg, linear-gradient(145deg, #e0e7ff, #f8fafc)); box-shadow: 0 2px 7px var(--shortcut-shadow, rgba(37, 99, 235, 0.16)); transition: transform 0.2s ease, box-shadow 0.2s ease; } .home-shortcut-item:hover .home-shortcut-icon-wrap { transform: scale(1.05); } .home-shortcut-icon.mud-icon-root { font-size: 1.2rem !important; color: var(--shortcut-accent) !important; } .home-shortcut-label { position: relative; z-index: 1; font-size: 0.64rem; font-weight: 700; text-align: center; line-height: 1.2; color: var(--theme-text-primary); padding: 0 2px; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } [data-theme="dark"] .home-shortcut-item { background: linear-gradient( 165deg, color-mix(in srgb, var(--shortcut-accent) 18%, var(--ps-surface, #1a2332)) 0%, var(--ps-surface, #1a2332) 62% ); } .home-shortcut--password { --shortcut-accent: #2563eb; } .home-shortcut--users { --shortcut-accent: #7c3aed; } .home-shortcut--farm { --shortcut-accent: #16a34a; } .home-shortcut--reports { --shortcut-accent: #ea580c; } .home-shortcut--warehouse { --shortcut-accent: #0d9488; --shortcut-icon-bg: linear-gradient(145deg, #5eead4, #f0fdfa); --shortcut-shadow: rgba(13, 148, 136, 0.28); } .home-shortcut--feedmill { --shortcut-accent: #ea580c; --shortcut-icon-bg: linear-gradient(145deg, #fed7aa, #fff7ed); --shortcut-shadow: rgba(234, 88, 12, 0.28); } .home-shortcut--mort { --shortcut-accent: #dc2626; --shortcut-icon-bg: linear-gradient(145deg, #fecaca, #fff1f2); --shortcut-shadow: rgba(220, 38, 38, 0.28); } .home-shortcut--feed { --shortcut-accent: #7c3aed; --shortcut-icon-bg: linear-gradient(145deg, #ddd6fe, #f5f3ff); --shortcut-shadow: rgba(124, 58, 237, 0.28); } .home-shortcut--weight { --shortcut-accent: #2563eb; --shortcut-icon-bg: linear-gradient(145deg, #bfdbfe, #eff6ff); --shortcut-shadow: rgba(37, 99, 235, 0.28); } .home-shortcut--sale { --shortcut-accent: #059669; --shortcut-icon-bg: linear-gradient(145deg, #a7f3d0, #ecfdf5); --shortcut-shadow: rgba(5, 150, 105, 0.28); } .home-shortcut--placement { --shortcut-accent: #ea580c; --shortcut-icon-bg: linear-gradient(145deg, #fed7aa, #fff7ed); --shortcut-shadow: rgba(234, 88, 12, 0.28); } .home-shortcut--purchase { --shortcut-accent: #0891b2; --shortcut-icon-bg: linear-gradient(145deg, #a5f3fc, #ecfeff); --shortcut-shadow: rgba(8, 145, 178, 0.28); } .home-shortcut--vaccine { --shortcut-accent: #0891b2; --shortcut-icon-bg: linear-gradient(145deg, #a5f3fc, #ecfeff); --shortcut-shadow: rgba(8, 145, 178, 0.28); } .home-shortcut--drug { --shortcut-accent: #db2777; --shortcut-icon-bg: linear-gradient(145deg, #fbcfe8, #fdf2f8); --shortcut-shadow: rgba(219, 39, 119, 0.28); } .home-shortcut--vitamin { --shortcut-accent: #65a30d; --shortcut-icon-bg: linear-gradient(145deg, #bef264, #f7fee7); --shortcut-shadow: rgba(101, 163, 13, 0.28); } .home-shortcut--sanitizer { --shortcut-accent: #0d9488; --shortcut-icon-bg: linear-gradient(145deg, #5eead4, #f0fdfa); --shortcut-shadow: rgba(13, 148, 136, 0.28); } .home-shortcut--other { --shortcut-accent: #4f46e5; --shortcut-icon-bg: linear-gradient(145deg, #c7d2fe, #eef2ff); --shortcut-shadow: rgba(79, 70, 229, 0.28); } .home-shortcut--inventory { --shortcut-accent: #1565c0; --shortcut-icon-bg: linear-gradient(145deg, #93c5fd, #eff6ff); --shortcut-shadow: rgba(21, 101, 192, 0.28); } .home-shortcut--events { --shortcut-accent: #9333ea; --shortcut-icon-bg: linear-gradient(145deg, #e9d5ff, #faf5ff); --shortcut-shadow: rgba(147, 51, 234, 0.28); } .home-shortcut--tasks { --shortcut-accent: #0284c7; --shortcut-icon-bg: linear-gradient(145deg, #7dd3fc, #f0f9ff); --shortcut-shadow: rgba(2, 132, 199, 0.28); } [data-theme="dark"] .home-shortcut--mort { --shortcut-icon-bg: linear-gradient(145deg, rgba(220, 38, 38, 0.42), rgba(220, 38, 38, 0.12)); } [data-theme="dark"] .home-shortcut--feed { --shortcut-icon-bg: linear-gradient(145deg, rgba(124, 58, 237, 0.42), rgba(124, 58, 237, 0.12)); } [data-theme="dark"] .home-shortcut--weight { --shortcut-icon-bg: linear-gradient(145deg, rgba(37, 99, 235, 0.42), rgba(37, 99, 235, 0.12)); } [data-theme="dark"] .home-shortcut--sale { --shortcut-icon-bg: linear-gradient(145deg, rgba(5, 150, 105, 0.42), rgba(5, 150, 105, 0.12)); } [data-theme="dark"] .home-shortcut--placement { --shortcut-icon-bg: linear-gradient(145deg, rgba(234, 88, 12, 0.42), rgba(234, 88, 12, 0.12)); } [data-theme="dark"] .home-shortcut--purchase { --shortcut-icon-bg: linear-gradient(145deg, rgba(8, 145, 178, 0.42), rgba(8, 145, 178, 0.12)); } [data-theme="dark"] .home-shortcut--vaccine { --shortcut-icon-bg: linear-gradient(145deg, rgba(8, 145, 178, 0.42), rgba(8, 145, 178, 0.12)); } [data-theme="dark"] .home-shortcut--drug { --shortcut-icon-bg: linear-gradient(145deg, rgba(219, 39, 119, 0.42), rgba(219, 39, 119, 0.12)); } [data-theme="dark"] .home-shortcut--vitamin { --shortcut-icon-bg: linear-gradient(145deg, rgba(101, 163, 13, 0.42), rgba(101, 163, 13, 0.12)); } [data-theme="dark"] .home-shortcut--sanitizer { --shortcut-icon-bg: linear-gradient(145deg, rgba(13, 148, 136, 0.42), rgba(13, 148, 136, 0.12)); } [data-theme="dark"] .home-shortcut--other { --shortcut-icon-bg: linear-gradient(145deg, rgba(79, 70, 229, 0.42), rgba(79, 70, 229, 0.12)); } [data-theme="dark"] .home-shortcut--inventory { --shortcut-icon-bg: linear-gradient(145deg, rgba(21, 101, 192, 0.42), rgba(21, 101, 192, 0.12)); } [data-theme="dark"] .home-shortcut--warehouse { --shortcut-icon-bg: linear-gradient(145deg, rgba(13, 148, 136, 0.42), rgba(13, 148, 136, 0.12)); } [data-theme="dark"] .home-shortcut--feedmill { --shortcut-icon-bg: linear-gradient(145deg, rgba(234, 88, 12, 0.42), rgba(234, 88, 12, 0.12)); } [data-theme="dark"] .home-shortcut--events { --shortcut-icon-bg: linear-gradient(145deg, rgba(147, 51, 234, 0.42), rgba(147, 51, 234, 0.12)); } [data-theme="dark"] .home-shortcut--tasks { --shortcut-icon-bg: linear-gradient(145deg, rgba(2, 132, 199, 0.42), rgba(2, 132, 199, 0.12)); } .home-module-card { border-radius: var(--ps-radius-lg, 16px) !important; overflow: hidden; padding: 0 !important; border: 1px solid var(--ps-border) !important; } .home-module-body { padding: 0.85rem 1rem 1rem; } .home-module-list .mud-list-item { border-radius: 10px; margin-bottom: 0.25rem; } .home-module-list .mud-list-item-icon { color: var(--theme-primary) !important; } @media (max-width: 960px) { .home-kpi-strip--compact { grid-template-columns: repeat(3, minmax(0, 1fr)); } .home-shortcuts-grid--featured { flex-wrap: wrap; gap: 0.3rem; } .home-shortcuts-grid--featured .home-shortcut-item { flex: 0 0 auto; width: 5.4rem; height: 5.4rem; max-width: 5.4rem; max-height: 5.4rem; aspect-ratio: 1 / 1; min-height: 0; } .home-reports-grid--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); } .home-hero-pills { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.4rem; } .home-hero-readonly { padding: 0.5rem 0.65rem; gap: 0.45rem; } .home-hero-readonly__desc { font-size: 0.74rem; } .home-hero-pill--dates, .home-hero-pill--flock { grid-column: span 1; } .home-hero-pill { min-height: 0; padding: 0.4rem 0.35rem; border-radius: 10px; } .home-glance-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 600px) { .home-kpi-strip, .home-kpi-strip--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); } .home-shortcuts-grid, .home-shortcuts-grid--featured { display: flex; flex-wrap: wrap; gap: 0.3rem; justify-content: flex-start; } .home-shortcuts-grid--featured .home-shortcut-item { flex: 0 0 auto; width: 5.05rem; height: 5.05rem; max-width: 5.05rem; max-height: 5.05rem; aspect-ratio: 1 / 1; min-height: 0; padding: 0.36rem 0.16rem; gap: 0.22rem; } .home-shortcuts-grid--featured .home-shortcut-icon-wrap { width: 1.95rem; height: 1.95rem; border-radius: 9px; } .home-shortcuts-grid--featured .home-shortcut-icon.mud-icon-root { font-size: 1.1rem !important; } .home-shortcuts-grid--featured .home-shortcut-label { font-size: 0.58rem; line-height: 1.15; } .home-shortcut-item { padding: 0.36rem 0.16rem; } .home-shortcut-icon-wrap { width: 1.95rem; height: 1.95rem; } .home-shortcut-icon.mud-icon-root { font-size: 1.1rem !important; } .home-shortcut-label { font-size: 0.58rem; } .home-shortcuts-header__icon { width: 32px; height: 32px; } .home-reports-grid, .home-reports-grid--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.4rem; } .home-report-card { min-height: 0; padding: 0.45rem 0.4rem 0.45rem 0.4rem; gap: 0.4rem; border-radius: 11px; align-items: flex-start; } .home-report-card::before { width: 3px; border-radius: 0 11px 11px 0; } .home-report-card__icon-wrap { width: 1.85rem; height: 1.85rem; border-radius: 9px; margin-top: 0.1rem; } .home-report-card__icon.mud-icon-root { font-size: 1.05rem !important; } .home-report-card__body { gap: 0.15rem; } .home-report-card__title { font-size: 0.68rem; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .home-report-card__badge { font-size: 0.52rem; padding: 0.12rem 0.35rem; border-radius: 999px; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .home-report-card__arrow { display: none !important; } .home-hero { padding: 0.65rem 0.7rem; border-radius: 12px; } .home-hero-content.mud-stack, .home-hero .home-hero-content { gap: 0.45rem !important; } .home-hero-content > .mud-stack { gap: 0.4rem !important; } .home-hero-content > .mud-stack > .mud-stack:first-child > .mud-icon-root { font-size: 1.25rem !important; width: 1.25rem !important; height: 1.25rem !important; } .home-hero-greeting { font-size: 1rem !important; line-height: 1.2 !important; } .home-hero-subtitle { font-size: 0.78rem; line-height: 1.3; } .home-hero-meta { font-size: 0.68rem; margin-top: 0.1rem; line-height: 1.35; } .home-hero-actions { width: 100%; gap: 0.35rem !important; margin-top: 0.15rem; } .home-hero-actions .mud-chip, .home-hero-actions .mud-button-root { min-height: 30px !important; height: auto !important; font-size: 0.72rem !important; padding: 0 0.55rem !important; } .home-hero-actions .mud-chip .mud-chip-content { padding: 0 0.15rem !important; } .home-hero-actions .mud-button-root { flex: 1 1 auto; min-width: 0; } .home-hero-actions .mud-icon-root { font-size: 1rem !important; } .home-hero-pills { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.35rem; } .home-hero-readonly { padding: 0.45rem 0.55rem; border-radius: 10px; } .home-hero-readonly__title { font-size: 0.74rem; } .home-hero-readonly__desc { font-size: 0.68rem; line-height: 1.4; } .home-hero-pill--dates, .home-hero-pill--flock { grid-column: auto; } .home-hero-pill { min-height: 0; padding: 0.35rem 0.3rem; border-radius: 9px; gap: 0.1rem; } .home-hero-pill--dates, .home-hero-pill--flock { padding: 0.35rem 0.3rem; } .home-hero-pill__dates-head { margin-bottom: 0.2rem; font-size: 0.52rem; gap: 0.2rem; } .home-hero-pill__dates-head .mud-icon-root { font-size: 0.85rem !important; } .home-hero-pill__dates-grid, .home-hero-pill__flock-grid { grid-template-columns: 1fr 1fr; gap: 0.2rem 0.35rem; } .home-hero-pill__date-cell + .home-hero-pill__date-cell, .home-hero-pill__flock-cell + .home-hero-pill__flock-cell { padding-inline-start: 0.35rem; border-inline-start: 1px solid rgba(255, 255, 255, 0.22); padding-top: 0; border-top: none; } .home-hero-pill__value--date { font-size: 0.72rem; } .home-hero-pill--flock .home-hero-pill__value--primary, .home-hero-pill--flock .home-hero-pill__value--secondary { font-size: 0.82rem; } .home-hero-pill--flock .home-hero-pill__label, .home-hero-pill--dates .home-hero-pill__label { font-size: 0.5rem; } .home-hero-pill__value { font-size: 0.88rem; } .home-hero-pill__label { font-size: 0.52rem; } .home-hero-pill--loss .home-hero-pill__label, .home-hero-pill--age .home-hero-pill__label { white-space: normal; } .home-status-chip.mud-chip { font-size: 0.7rem !important; } .home-glance-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .home-salon-cards { display: flex; } .home-salon-table-wrap--desktop { display: none !important; } } .home-kpi-tile .mud-icon-root { flex-shrink: 0; } .home-kpi-value--pct { font-size: 0.95rem !important; } .home-kpi-tile--placed { border-inline-end: 3px solid #ea580c; } .home-kpi-tile--placed .mud-icon-root { color: #ea580c !important; } .home-kpi-tile--stock { border-inline-end: 3px solid #059669; } .home-kpi-tile--stock .mud-icon-root { color: #059669 !important; } .home-kpi-tile--mort { border-inline-end: 3px solid #dc2626; } .home-kpi-tile--mort .mud-icon-root { color: #dc2626 !important; } .home-kpi-tile--cull { border-inline-end: 3px solid #f97316; } .home-kpi-tile--cull .mud-icon-root { color: #f97316 !important; } .home-kpi-tile--sold { border-inline-end: 3px solid #2563eb; } .home-kpi-tile--sold .mud-icon-root { color: #2563eb !important; } .home-kpi-tile--weight { border-inline-end: 3px solid #7c3aed; } .home-kpi-tile--weight .mud-icon-root { color: #7c3aed !important; } .home-kpi-tile--loss { border-inline-end: 3px solid #b91c1c; } .home-kpi-tile--loss .mud-icon-root { color: #b91c1c !important; } .home-kpi-tile--salons { border-inline-end: 3px solid #0d9488; } .home-kpi-tile--salons .mud-icon-root { color: #0d9488 !important; } .home-kpi-tile--period { border-inline-end: 3px solid #d97706; } .home-kpi-tile--period .home-kpi-tile__icon { background: rgba(217, 119, 6, 0.14); color: #d97706; } .home-reports-bar { margin-top: 0.85rem; background: linear-gradient(145deg, rgba(21, 101, 192, 0.07) 0%, rgba(46, 125, 50, 0.05) 55%, var(--ps-surface) 100%); border: 1px solid rgba(21, 101, 192, 0.16); border-radius: var(--ps-radius-lg, 16px); padding: 1.05rem 1.1rem 1.15rem; box-shadow: var(--ps-shadow-sm); } [data-theme="dark"] .home-reports-bar { background: linear-gradient(145deg, rgba(100, 181, 246, 0.1) 0%, rgba(129, 199, 132, 0.06) 50%, var(--ps-surface, #1a2332) 100%); border-color: rgba(100, 181, 246, 0.22); } .home-reports-header { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.85rem; } .home-reports-header__icon { width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #1565c0, #2563eb); color: #fff; flex-shrink: 0; box-shadow: 0 4px 14px rgba(21, 101, 192, 0.32); } .home-reports-header__icon .mud-icon-root { font-size: 1.3rem !important; } .home-reports-title { font-size: 0.94rem !important; font-weight: 800 !important; color: var(--theme-text-primary) !important; } .home-reports-subtitle { font-size: 0.72rem !important; color: var(--theme-text-secondary) !important; } .home-reports-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(212px, 1fr)); gap: 0.6rem; } .home-report-card { --report-accent: var(--theme-primary, #2563eb); position: relative; display: flex; align-items: center; gap: 0.6rem; padding: 0.7rem 0.7rem 0.7rem 0.65rem; min-height: 72px; width: 100%; border: 1px solid color-mix(in srgb, var(--report-accent) 22%, var(--ps-border)); border-radius: 14px; background: linear-gradient( 118deg, color-mix(in srgb, var(--report-accent) 10%, var(--ps-surface)) 0%, var(--ps-surface) 52% ); cursor: pointer; overflow: hidden; transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease; -webkit-tap-highlight-color: transparent; } .home-report-card::before { content: ""; position: absolute; top: 0; bottom: 0; right: 0; width: 4px; background: linear-gradient(180deg, var(--report-accent), color-mix(in srgb, var(--report-accent) 50%, #fff)); border-radius: 0 14px 14px 0; } [data-theme="dark"] .home-report-card { background: linear-gradient( 118deg, color-mix(in srgb, var(--report-accent) 16%, var(--ps-surface, #1a2332)) 0%, var(--ps-surface, #1a2332) 55% ); } .home-report-card:hover, .home-report-card:focus-visible { transform: translateY(-3px); box-shadow: 0 10px 22px color-mix(in srgb, var(--report-accent) 26%, transparent); outline: none; border-color: color-mix(in srgb, var(--report-accent) 42%, transparent); } .home-report-card:active { transform: translateY(-1px); } .home-report-card__icon-wrap { position: relative; z-index: 1; width: 2.5rem; height: 2.5rem; border-radius: 14px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: var(--report-icon-bg, linear-gradient(145deg, #dbeafe, #eff6ff)); box-shadow: 0 4px 12px var(--report-shadow, rgba(37, 99, 235, 0.2)); transition: transform 0.2s ease; } .home-report-card:hover .home-report-card__icon-wrap { transform: scale(1.05); } .home-report-card__icon.mud-icon-root { font-size: 1.45rem !important; color: var(--report-accent) !important; } .home-report-card__body { position: relative; z-index: 1; flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0.3rem; } .home-report-card__title { font-size: 0.76rem; font-weight: 800; line-height: 1.3; color: var(--theme-text-primary); } .home-report-card__badge { display: inline-block; align-self: flex-start; font-size: 0.62rem; font-weight: 700; line-height: 1.2; padding: 0.2rem 0.45rem; border-radius: 6px; color: var(--report-accent); background: color-mix(in srgb, var(--report-accent) 14%, transparent); border: 1px solid color-mix(in srgb, var(--report-accent) 22%, transparent); } .home-report-card__arrow { position: relative; z-index: 1; flex-shrink: 0; opacity: 0.4; font-size: 1.15rem !important; color: var(--report-accent) !important; transition: opacity 0.2s ease, transform 0.2s ease; } .home-report-card:hover .home-report-card__arrow { opacity: 1; transform: translateX(-4px); } .home-report-card--mortality { --report-accent: #dc2626; --report-icon-bg: linear-gradient(145deg, #fecaca, #fff1f2); --report-shadow: rgba(220, 38, 38, 0.28); } .home-report-card--feed { --report-accent: #7c3aed; --report-icon-bg: linear-gradient(145deg, #ddd6fe, #f5f3ff); --report-shadow: rgba(124, 58, 237, 0.28); } .home-report-card--weight-fcr { --report-accent: #9333ea; --report-icon-bg: linear-gradient(145deg, #e9d5ff, #faf5ff); --report-shadow: rgba(147, 51, 234, 0.28); } .home-report-card--vitamin { --report-accent: #65a30d; --report-icon-bg: linear-gradient(145deg, #bef264, #f7fee7); --report-shadow: rgba(101, 163, 13, 0.28); } .home-report-card--drug { --report-accent: #db2777; --report-icon-bg: linear-gradient(145deg, #fbcfe8, #fdf2f8); --report-shadow: rgba(219, 39, 119, 0.28); } .home-report-card--vaccine { --report-accent: #0891b2; --report-icon-bg: linear-gradient(145deg, #a5f3fc, #ecfeff); --report-shadow: rgba(8, 145, 178, 0.28); } .home-report-card--sanitizer { --report-accent: #0d9488; --report-icon-bg: linear-gradient(145deg, #5eead4, #f0fdfa); --report-shadow: rgba(13, 148, 136, 0.28); } .home-report-card--other { --report-accent: #4f46e5; --report-icon-bg: linear-gradient(145deg, #c7d2fe, #eef2ff); --report-shadow: rgba(79, 70, 229, 0.28); } .home-report-card--performance-card { --report-accent: #3949ab; --report-icon-bg: linear-gradient(145deg, #c5cae9, #e8eaf6); --report-shadow: rgba(57, 73, 171, 0.28); } .home-report-card--inventory-transactions { --report-accent: #1565c0; --report-icon-bg: linear-gradient(145deg, #93c5fd, #eff6ff); --report-shadow: rgba(21, 101, 192, 0.28); } .home-report-card--item-stock { --report-accent: #0f766e; --report-icon-bg: linear-gradient(145deg, #5eead4, #ecfeff); --report-shadow: rgba(15, 118, 110, 0.28); } [data-theme="dark"] .home-report-card--mortality { --report-icon-bg: linear-gradient(145deg, rgba(220, 38, 38, 0.42), rgba(220, 38, 38, 0.12)); } [data-theme="dark"] .home-report-card--feed { --report-icon-bg: linear-gradient(145deg, rgba(124, 58, 237, 0.42), rgba(124, 58, 237, 0.12)); } [data-theme="dark"] .home-report-card--weight-fcr { --report-icon-bg: linear-gradient(145deg, rgba(147, 51, 234, 0.42), rgba(147, 51, 234, 0.12)); } [data-theme="dark"] .home-report-card--vitamin { --report-icon-bg: linear-gradient(145deg, rgba(101, 163, 13, 0.42), rgba(101, 163, 13, 0.12)); } [data-theme="dark"] .home-report-card--drug { --report-icon-bg: linear-gradient(145deg, rgba(219, 39, 119, 0.42), rgba(219, 39, 119, 0.12)); } [data-theme="dark"] .home-report-card--vaccine { --report-icon-bg: linear-gradient(145deg, rgba(8, 145, 178, 0.42), rgba(8, 145, 178, 0.12)); } [data-theme="dark"] .home-report-card--sanitizer { --report-icon-bg: linear-gradient(145deg, rgba(13, 148, 136, 0.42), rgba(13, 148, 136, 0.12)); } [data-theme="dark"] .home-report-card--other { --report-icon-bg: linear-gradient(145deg, rgba(79, 70, 229, 0.42), rgba(79, 70, 229, 0.12)); } [data-theme="dark"] .home-report-card--performance-card { --report-icon-bg: linear-gradient(145deg, rgba(57, 73, 171, 0.42), rgba(57, 73, 171, 0.12)); } [data-theme="dark"] .home-report-card--inventory-transactions { --report-icon-bg: linear-gradient(145deg, rgba(21, 101, 192, 0.42), rgba(21, 101, 192, 0.12)); } [data-theme="dark"] .home-report-card--item-stock { --report-icon-bg: linear-gradient(145deg, rgba(15, 118, 110, 0.42), rgba(15, 118, 110, 0.12)); } .home-charts-row { margin-top: 0.15rem; } .home-chart-card { border: 1px solid var(--ps-border); border-radius: 14px; overflow: hidden; background: var(--ps-surface); box-shadow: var(--ps-shadow-sm); height: 100%; } .home-chart-card__header { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; color: #fff; } .home-chart-card__header .mud-icon-root { font-size: 1.75rem !important; opacity: 0.95; } .home-chart-card__header--flock { background: linear-gradient(135deg, #047857, #10b981); } .home-chart-card__header--loss { background: linear-gradient(135deg, #b91c1c, #ef4444); } .home-chart-card__header--sales { background: linear-gradient(135deg, #1d4ed8, #3b82f6); } .home-chart-card__header--weight { background: linear-gradient(135deg, #6d28d9, #8b5cf6); } .home-chart-card__title { font-size: 0.95rem !important; font-weight: 800 !important; color: #fff !important; } .home-chart-card__subtitle { font-size: 0.72rem !important; color: rgba(255,255,255,0.88) !important; } .home-chart-card__body { padding: 0.75rem 1rem 1rem; } .home-donut-chart { max-width: 280px; margin: 0 auto; } .home-chart-legend { display: flex; flex-direction: column; gap: 0.35rem; margin-top: 0.65rem; padding-top: 0.5rem; border-top: 1px dashed var(--ps-border); } .home-chart-legend__row { display: grid; grid-template-columns: 12px 1fr auto auto; gap: 0.45rem; align-items: center; font-size: 0.74rem; } .home-chart-legend__swatch { width: 12px; height: 12px; border-radius: 3px; } .home-chart-legend__num { font-weight: 700; } .home-chart-legend__pct { color: var(--theme-text-secondary); font-size: 0.7rem; } .home-chart-empty { text-align: center; color: var(--theme-text-secondary); padding: 1.5rem 0.5rem; } .home-summary-card { border-radius: var(--ps-radius-lg) !important; border: 1px solid var(--ps-border) !important; overflow: hidden; padding: 0 !important; } .home-summary-header { background: var(--theme-gradient-primary); padding: 0.75rem 1rem; color: #fff; } .home-summary-header .mud-typography, .home-summary-header .mud-icon-root { color: #fff !important; font-weight: 700; } .home-summary-body { padding: 0.75rem; } .home-phase-card { border: 1px solid var(--ps-border); border-radius: 12px; overflow: hidden; height: 100%; } .home-card-header { padding: 0.65rem 0.85rem; color: #fff; } .home-card-header--period { background: linear-gradient(135deg, #2563eb, #3b82f6); } .home-card-header--flock { background: linear-gradient(135deg, #059669, #10b981); } .home-card-header--salon { background: linear-gradient(135deg, #7c3aed, #8b5cf6); } .home-card-content { padding: 0.75rem 0.85rem; display: flex; flex-direction: column; gap: 0.45rem; } .home-stat-row { display: flex; justify-content: space-between; gap: 0.5rem; align-items: baseline; font-size: 0.82rem; } .home-stat-row--sub { padding-inline-start: 0.65rem; font-size: 0.76rem; border-inline-start: 2px solid var(--ps-border); margin-inline-start: 0.15rem; } .home-stat-row--sub .home-stat-label { color: var(--theme-text-primary); } .home-stat-label { color: var(--theme-text-secondary); } .home-stat-num { font-weight: 700; color: var(--theme-text-primary); } .home-stat-num--positive { color: #059669; } .home-stat-num--negative { color: #dc2626; } .home-stat-num--info { color: #2563eb; } .home-salon-table-wrap { border: 1px solid var(--ps-border); border-radius: 12px; overflow-x: auto; overflow-y: clip; -webkit-overflow-scrolling: touch; touch-action: pan-x pan-y pinch-zoom; } .home-salon-table-wrap--desktop .home-salon-table { min-width: 1180px; } .home-salon-table .mud-table-root { background: transparent; } .home-loading-card { border: 1px solid var(--ps-border); border-radius: var(--ps-radius-lg); background: var(--ps-surface); box-shadow: var(--ps-shadow-sm); } .home-deviation--above { color: #059669 !important; } .home-deviation--below { color: #dc2626 !important; } .home-deviation--ok { color: var(--theme-text-secondary) !important; } .home-page-wrapper { gap: 1.1rem; } .home-hero { background: radial-gradient(ellipse 80% 70% at 100% 0%, rgba(255, 255, 255, 0.22), transparent 55%), radial-gradient(ellipse 60% 50% at 0% 100%, rgba(0, 0, 0, 0.12), transparent 50%), var(--theme-gradient-primary); box-shadow: 0 12px 36px color-mix(in srgb, var(--theme-primary, #2563eb) 32%, transparent), var(--ps-shadow-md); } [data-theme="dark"] .home-hero { box-shadow: 0 14px 40px rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(255, 255, 255, 0.06) inset; } .home-hero-greeting { font-weight: 800 !important; letter-spacing: -0.02em; } .home-filter-bar { border-radius: 16px !important; border: 1px solid color-mix(in srgb, var(--theme-primary, #2563eb) 14%, var(--ps-border)) !important; background: linear-gradient(135deg, color-mix(in srgb, var(--theme-primary, #2563eb) 6%, var(--ps-surface)) 0%, var(--ps-surface) 55%) !important; padding: 0.85rem 1rem !important; box-shadow: var(--ps-shadow-sm); } [data-theme="dark"] .home-filter-bar { background: linear-gradient(135deg, color-mix(in srgb, var(--theme-primary, #3b82f6) 12%, var(--ps-surface, #1a2332)) 0%, var(--ps-surface, #1a2332) 60%) !important; border-color: rgba(100, 181, 246, 0.2) !important; } .home-actions-panel { background: linear-gradient(155deg, color-mix(in srgb, #0ea5e9 8%, var(--ps-surface)) 0%, color-mix(in srgb, #8b5cf6 6%, var(--ps-surface)) 42%, var(--ps-surface) 100%); border: 1px solid color-mix(in srgb, #6366f1 18%, var(--ps-border)); border-radius: 18px; padding: 1.1rem 1.2rem 1.25rem; box-shadow: 0 8px 28px color-mix(in srgb, #6366f1 8%, transparent), var(--ps-shadow-sm); position: relative; overflow: hidden; } .home-actions-panel::before { content: ""; position: absolute; inset-inline-end: -40px; top: -40px; width: 140px; height: 140px; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, #8b5cf6 18%, transparent), transparent 70%); pointer-events: none; } [data-theme="dark"] .home-actions-panel { background: linear-gradient(155deg, rgba(14, 165, 233, 0.14) 0%, rgba(139, 92, 246, 0.1) 40%, var(--ps-surface, #1a2332) 100%); border-color: rgba(129, 140, 248, 0.28); box-shadow: 0 10px 32px rgba(0, 0, 0, 0.35); } .home-shortcuts-header__icon { width: 36px; height: 36px; border-radius: 11px; background: linear-gradient(145deg, #f59e0b, #ea580c); box-shadow: 0 4px 12px rgba(234, 88, 12, 0.32); } .home-reports-header__icon { background: linear-gradient(145deg, #0ea5e9, #2563eb) !important; box-shadow: 0 6px 18px rgba(37, 99, 235, 0.36) !important; } .home-actions-divider { height: 1px; margin: 1.15rem 0 1rem; background: linear-gradient( 90deg, transparent, color-mix(in srgb, var(--theme-primary, #2563eb) 35%, var(--ps-border)), transparent ); } .home-shortcuts-grid--featured { gap: 0.4rem; } .home-shortcut-item { border-radius: 12px; box-shadow: 0 1px 3px color-mix(in srgb, var(--shortcut-accent) 8%, transparent); aspect-ratio: 1 / 1; box-sizing: border-box; min-height: 0; } .home-shortcut-item:hover, .home-shortcut-item:focus-visible { transform: translateY(-2px); box-shadow: 0 8px 16px color-mix(in srgb, var(--shortcut-accent) 24%, transparent); } .home-shortcut-icon-wrap { width: 2.15rem; height: 2.15rem; border-radius: 10px; } .home-shortcut-label { font-size: 0.64rem; font-weight: 700; } .home-shortcut--expenses { --shortcut-accent: #ca8a04; --shortcut-icon-bg: linear-gradient(145deg, #fde68a, #fffbeb); --shortcut-shadow: rgba(202, 138, 4, 0.28); } .home-shortcut--quality { --shortcut-accent: #e11d48; --shortcut-icon-bg: linear-gradient(145deg, #fecdd3, #fff1f2); --shortcut-shadow: rgba(225, 29, 72, 0.28); } [data-theme="dark"] .home-shortcut--expenses { --shortcut-icon-bg: linear-gradient(145deg, rgba(202, 138, 4, 0.42), rgba(202, 138, 4, 0.12)); } [data-theme="dark"] .home-shortcut--quality { --shortcut-icon-bg: linear-gradient(145deg, rgba(225, 29, 72, 0.42), rgba(225, 29, 72, 0.12)); } .home-reports-grid--compact { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0.7rem; } .home-report-card { min-height: 78px; border-radius: 16px; padding: 0.75rem 0.75rem 0.75rem 0.7rem; box-shadow: 0 2px 10px color-mix(in srgb, var(--report-accent) 10%, transparent); } .home-report-card:hover, .home-report-card:focus-visible { transform: translateY(-4px); box-shadow: 0 14px 28px color-mix(in srgb, var(--report-accent) 28%, transparent); } .home-report-card__icon-wrap { width: 2.7rem; height: 2.7rem; border-radius: 15px; } .home-report-card__title { font-size: 0.78rem; } .home-report-card__badge { font-size: 0.6rem; border-radius: 999px; padding: 0.22rem 0.5rem; } .home-report-card--flock-performance { --report-accent: #0f766e; --report-icon-bg: linear-gradient(145deg, #5eead4, #f0fdfa); --report-shadow: rgba(15, 118, 110, 0.28); } .home-report-card--bird-sale { --report-accent: #059669; --report-icon-bg: linear-gradient(145deg, #a7f3d0, #ecfdf5); --report-shadow: rgba(5, 150, 105, 0.28); } .home-report-card--fcr-comparison { --report-accent: #7c3aed; --report-icon-bg: linear-gradient(145deg, #ddd6fe, #f5f3ff); --report-shadow: rgba(124, 58, 237, 0.28); } .home-report-card--mort-cull-comparison { --report-accent: #c2410c; --report-icon-bg: linear-gradient(145deg, #fdba74, #fff7ed); --report-shadow: rgba(194, 65, 12, 0.28); } .home-report-card--full-cost { --report-accent: #b45309; --report-icon-bg: linear-gradient(145deg, #fcd34d, #fffbeb); --report-shadow: rgba(180, 83, 9, 0.28); } .home-report-card--when-to-sell { --report-accent: #0369a1; --report-icon-bg: linear-gradient(145deg, #7dd3fc, #f0f9ff); --report-shadow: rgba(3, 105, 161, 0.28); } .home-report-card--chain { --report-accent: #1d4ed8; --report-icon-bg: linear-gradient(145deg, #93c5fd, #eff6ff); --report-shadow: rgba(29, 78, 216, 0.28); } [data-theme="dark"] .home-report-card--flock-performance { --report-icon-bg: linear-gradient(145deg, rgba(15, 118, 110, 0.42), rgba(15, 118, 110, 0.12)); } [data-theme="dark"] .home-report-card--bird-sale { --report-icon-bg: linear-gradient(145deg, rgba(5, 150, 105, 0.42), rgba(5, 150, 105, 0.12)); } [data-theme="dark"] .home-report-card--fcr-comparison { --report-icon-bg: linear-gradient(145deg, rgba(124, 58, 237, 0.42), rgba(124, 58, 237, 0.12)); } [data-theme="dark"] .home-report-card--mort-cull-comparison { --report-icon-bg: linear-gradient(145deg, rgba(194, 65, 12, 0.42), rgba(194, 65, 12, 0.12)); } [data-theme="dark"] .home-report-card--full-cost { --report-icon-bg: linear-gradient(145deg, rgba(180, 83, 9, 0.42), rgba(180, 83, 9, 0.12)); } [data-theme="dark"] .home-report-card--when-to-sell { --report-icon-bg: linear-gradient(145deg, rgba(3, 105, 161, 0.42), rgba(3, 105, 161, 0.12)); } [data-theme="dark"] .home-report-card--chain { --report-icon-bg: linear-gradient(145deg, rgba(29, 78, 216, 0.42), rgba(29, 78, 216, 0.12)); } .home-glance-bar { border-radius: 16px !important; border: 1px solid color-mix(in srgb, #10b981 18%, var(--ps-border)) !important; background: linear-gradient(145deg, color-mix(in srgb, #10b981 7%, var(--ps-surface)) 0%, var(--ps-surface) 60%) !important; padding: 0.9rem 1rem !important; } [data-theme="dark"] .home-glance-bar { background: linear-gradient(145deg, rgba(16, 185, 129, 0.12) 0%, var(--ps-surface, #1a2332) 60%) !important; border-color: rgba(52, 211, 153, 0.22) !important; } .home-kpi-bar { border-radius: 16px !important; padding: 0.75rem !important; border: 1px solid var(--ps-border) !important; background: var(--ps-surface) !important; } .home-kpi-tile { border-radius: 14px; background: color-mix(in srgb, var(--ps-surface-2, #f8fafc) 80%, transparent); transition: transform 0.18s ease, box-shadow 0.18s ease; } .home-kpi-tile:hover { transform: translateY(-2px); box-shadow: var(--ps-shadow-sm); } [data-theme="dark"] .home-kpi-tile { background: color-mix(in srgb, #243044 70%, transparent); } @media (max-width: 1199px) { .home-shortcuts-grid--featured { flex-wrap: wrap; gap: 0.3rem; } .home-shortcuts-grid--featured .home-shortcut-item { flex: 0 0 auto; width: 5.5rem; height: 5.5rem; max-width: 5.5rem; max-height: 5.5rem; aspect-ratio: 1 / 1; min-height: 0; } } @media (max-width: 960px) { .home-shortcuts-grid--featured .home-shortcut-item { width: 5.4rem; height: 5.4rem; max-width: 5.4rem; max-height: 5.4rem; } .home-reports-grid--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); } .home-actions-panel { padding: 0.9rem 0.85rem 1rem; border-radius: 16px; } } @media (max-width: 600px) { .home-page-wrapper { gap: 0.85rem; } .home-hero { padding: 0.65rem 0.7rem; border-radius: 12px; } .home-filter-bar { padding: 0.7rem 0.75rem !important; border-radius: 14px !important; } .home-actions-panel { margin-inline: 0; padding: 0.8rem 0.7rem 0.9rem; } .home-shortcuts-grid--featured { display: flex; flex-wrap: wrap; gap: 0.3rem; justify-content: flex-start; } .home-shortcuts-grid--featured .home-shortcut-item { flex: 0 0 auto; width: 5.05rem; height: 5.05rem; max-width: 5.05rem; max-height: 5.05rem; aspect-ratio: 1 / 1; min-height: 0; border-radius: 12px; padding: 0.36rem 0.16rem; } .home-shortcuts-grid--featured .home-shortcut-icon-wrap { width: 1.95rem; height: 1.95rem; border-radius: 9px; } .home-shortcuts-grid--featured .home-shortcut-icon.mud-icon-root { font-size: 1.1rem !important; } .home-shortcuts-grid--featured .home-shortcut-label { font-size: 0.58rem; line-height: 1.15; } .home-reports-grid--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.4rem; } .home-report-card { min-height: 0; padding: 0.45rem 0.4rem; border-radius: 11px; gap: 0.4rem; } .home-report-card__title { font-size: 0.68rem; } .home-report-card__icon-wrap { width: 1.85rem; height: 1.85rem; border-radius: 9px; } .home-report-card__arrow { display: none !important; } .home-actions-panel__header, .home-reports-header--inline { gap: 0.6rem; margin-bottom: 0.7rem; } .home-shortcuts-hint, .home-reports-subtitle { font-size: 0.68rem !important; } } @media (max-width: 380px) { .home-shortcuts-grid--featured .home-shortcut-item { width: 4.65rem; height: 4.65rem; max-width: 4.65rem; max-height: 4.65rem; } } @media (prefers-reduced-motion: reduce) { .home-shortcut-item, .home-report-card, .home-kpi-tile { transition: none; } .home-shortcut-item:hover, .home-report-card:hover, .home-kpi-tile:hover { transform: none; } }