:root{--bellife-green:#89ce80;--bellife-pale:#dfede6;--bellife-ink:#1e2928;font-family:Arial,system-ui,sans-serif;color:var(--bellife-ink);background:#f5f6f7}body{background:#f5f6f7;color:var(--bellife-ink)}header{background:#f5f6f7;border-bottom:0;position:relative;max-width:1160px;margin:auto;padding:24px 26px;gap:18px}header img{width:82px;height:82px}header h1{font-size:29px;color:#202a2c;font-weight:800}header small{font-size:15px;color:#617169}nav{background:#f5f6f7;border:0}nav button{border-radius:18px;padding:16px;font-weight:600}nav button.active{background:var(--bellife-green);color:#17271a}main{max-width:1000px;padding-top:12px}.card{border:0;border-radius:22px;box-shadow:none;padding:22px}.btn{background:var(--bellife-green);color:#17291d;border-radius:14px}.btn.secondary{background:#dfede6;color:#243c2b}.task-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;background:#dfede6;border-radius:22px;padding:8px;margin:4px 0 18px}.task-tabs button{border:1px solid #d0dfd5;background:#e0eee7;border-radius:20px;min-height:88px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font-weight:650;color:#202a2c;box-shadow:0 3px 5px #00000012}.task-tabs button.active{background:var(--bellife-green)}.task-tabs span{font-size:20px}.schedule-box{background:#fff;padding:22px;border-radius:26px;margin-bottom:15px}.schedule-box h2{font-size:27px;margin-bottom:12px}.datebar{display:flex;align-items:center;justify-content:space-between;background:#dfede6;border-radius:6px;min-height:64px;padding:0 12px}.datebar button{border:0;background:transparent;font-size:23px;padding:12px;color:#26332d}.datebar strong{font-size:17px}.task-count{font-weight:800;font-size:17px;margin:18px 0 12px}.timeline{padding:0 0 8px 12px}.timeline-row{display:grid;grid-template-columns:42px 1fr;gap:12px;align-items:stretch}.timeline-marker{border-left:4px solid #498e56;margin-left:16px;color:#83ca7b;font-size:26px;display:flex;align-items:center;justify-content:flex-start;padding-left:0}.timeline-card{border:1px solid #629b6b;border-radius:22px;background:#fff;padding:17px;margin-bottom:12px;min-height:118px}.task-title{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:18px}.task-title input{width:24px;height:24px;accent-color:#89ce80;flex-shrink:0}.note-action{display:block;width:100%;border:0;border-radius:5px;background:#dfede6;padding:16px;margin-top:12px;color:#374b40}.task-footer{margin:6px 0 20px}.report-whatsapp{width:100%;min-height:62px;font-size:16px;box-shadow:0 4px 6px #00000015}.shirt-landing{margin-bottom:22px}.shirt-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:4px 0 22px}.shirt-heading h1{font-size:30px;margin:0 0 8px}.shirt-heading p{color:#617169;margin:0;font-size:16px}.shirt-heading img{width:92px;height:92px;object-fit:contain}.shirt-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px}.shirt-tiles button{min-height:148px}.shirt-tiles button,.shirt-wide button{border:0;background:#fff;text-align:left;border-radius:22px;padding:20px;display:flex;flex-direction:column;gap:12px;color:#1d2b26}.shirt-tiles strong,.shirt-wide strong{font-size:21px}.shirt-tiles span,.shirt-wide span{font-size:15px;color:#617169;line-height:1.4}.shirt-wide{display:flex;flex-direction:column;gap:12px}.shirt-wide button{min-height:90px}.shirt-shortcuts{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px;margin-top:18px}.shirt-shortcuts button{border:0;border-radius:16px;min-height:58px;background:#89ce80;overflow-wrap:anywhere;padding:7px 3px}.shirt-shortcuts button:first-child{background:#c1dec6}.back-task{width:100%;margin-top:12px;border:0;border-radius:17px;background:#89ce80;min-height:62px;font-size:18px}.bottom{display:flex;position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,720px);justify-content:space-between;background:#dfede6;border:0;border-radius:22px 22px 0 0;padding:6px;z-index:8;box-shadow:0 -3px 14px #0000000b;gap:7px}.bottom button{border:0;border-radius:18px;min-height:65px;flex:1;background:#dfede6;color:#1d2b26;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;font-size:14px}.bottom button.active{background:#89ce80;font-weight:700}.navicon{font-size:20px}.shell{padding-bottom:84px}.view-home,.view-tasks{max-width:760px}.view-shirts{max-width:820px}@media(max-width:750px){header{padding:22px 17px 10px;gap:12px}header img{width:72px;height:72px}header h1{font-size:23px}header small{font-size:13px}.authbar{font-size:10px;max-width:100%;width:100%;justify-content:flex-end}main{padding:10px 15px 105px}.shell{padding-bottom:0}.task-tabs{gap:7px}.task-tabs button{min-height:82px}.schedule-box{padding:17px}.timeline{padding-left:0}.timeline-row{grid-template-columns:38px 1fr;gap:7px}.timeline-card{padding:15px}.shirt-heading h1{font-size:25px}.shirt-heading img{width:75px;height:75px}.shirt-tiles button{padding:17px;min-height:138px}.shirt-tiles strong,.shirt-wide strong{font-size:18px}.shirt-tiles span,.shirt-wide span{font-size:14px}.bottom{bottom:0;left:0;transform:none;width:100%;border-radius:18px 18px 0 0}.bottom button{min-height:66px;padding:7px 2px;font-size:13px}.shirt-shortcuts button{font-size:12px}} /* V4.3 Desktop Wide Layout: preserves the existing mobile design */ @media (min-width: 751px) { body { overflow-x: hidden; } header { max-width: 1740px; width: 100%; padding: 24px 36px; } .shell { grid-template-columns: 210px minmax(0, 1fr); max-width: 1840px; margin: 0 auto; } nav { padding: 24px 14px; } main { max-width: 1560px; width: 100%; padding: 24px 34px 110px; min-width: 0; } .view-home, .view-tasks, .view-shirts { max-width: none; width: 100%; } .card { padding: 26px; } .grid { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; } .fields { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 18px; } .shirt-landing { max-width: none; } .shirt-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; } .shirt-tiles button { min-height: 178px; } .shirt-wide { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; } .shirt-wide button { min-height: 122px; } .shirt-shortcuts { gap: 14px; } .shirt-shortcuts button { min-height: 65px; font-size: 15px; overflow-wrap: normal; } .task-tabs { max-width: 100%; gap: 18px; } .task-tabs button { min-height: 92px; } .schedule-box { padding: 28px 32px; } .timeline { max-width: 100%; } .timeline-card { min-height: 112px; } .bottom { display: flex; width: min(960px, calc(100% - 240px)); left: calc(50% + 105px); bottom: 12px; border-radius: 22px; } .tablewrap { width: 100%; } } @media (min-width: 751px) and (max-width: 1100px) { main { padding: 20px 22px 110px; } .shirt-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } .shirt-wide { grid-template-columns: 1fr; } .bottom { width: min(760px, calc(100% - 240px)); } } /* Four primary tabs: Tasks, Shirts, Calendar, Reports */ .task-tabs{grid-template-columns:repeat(4,minmax(0,1fr));} .task-tabs button{min-width:0;} @media(max-width:480px){.task-tabs{gap:5px;padding:5px}.task-tabs button{font-size:12px;min-height:70px;padding:7px 2px}.task-tabs span{font-size:18px}} /* V4.3 compact controls and purchase dashboard */ .task-tabs button{min-height:78px;font-size:.92em}.shirt-tiles button{min-height:132px}.shirt-wide button{min-height:80px}.bottom button{min-height:58px}.schedule-box{padding:18px}.timeline-card{min-height:100px;padding:14px}.note-action{padding:12px}.shirt-tiles strong,.shirt-wide strong{font-size:1.08rem} .purchase-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(290px,1fr);gap:16px;margin-top:18px}.purchase-grid .card{min-width:0}.vendor-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #c8d9cc}.vendor-row:last-child{border-bottom:0}.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:16px}.toggle-row input{width:23px;height:23px;accent-color:#79d66b} @media(max-width:850px){.purchase-grid{grid-template-columns:minmax(0,1fr)}} @media(max-width:750px){.task-tabs button{min-height:63px}.timeline-card{padding:12px;min-height:96px}.bottom button{min-height:59px}.schedule-box{padding:15px}.shirt-tiles button{min-height:122px}} /* Dark mode affects the whole authenticated application, including input controls */ html.bellife-dark{color-scheme:dark;background:#060c09;--bellife-ink:#d6e9d8;--bellife-pale:#102b1b}html.bellife-dark body,html.bellife-dark header,html.bellife-dark nav{background:#060c09;color:#b0dcb0}html.bellife-dark header h1,html.bellife-dark .shirt-heading h1{color:#9cde90}html.bellife-dark header small,html.bellife-dark .muted,html.bellife-dark .shirt-heading p{color:#a1bba4}html.bellife-dark .card,html.bellife-dark .schedule-box,html.bellife-dark .timeline-card,html.bellife-dark .shirt-tiles button,html.bellife-dark .shirt-wide button{background:#182c20;color:#d8e8da;border:1px solid #396b44}html.bellife-dark .shirt-tiles strong,html.bellife-dark .shirt-wide strong{color:#e1f0df}html.bellife-dark .shirt-tiles span,html.bellife-dark .shirt-wide span{color:#a3c2a8}html.bellife-dark .task-tabs,html.bellife-dark .bottom,html.bellife-dark .datebar,html.bellife-dark .note-action{background:#073719;color:#c5e5c4}html.bellife-dark .task-tabs button,html.bellife-dark .bottom button{background:#0c3b1d;color:#b6d7b6;border-color:#22532b}html.bellife-dark .task-tabs button.active,html.bellife-dark .bottom button.active{background:#89ce80;color:#102214}html.bellife-dark input,html.bellife-dark select,html.bellife-dark textarea{background:#11291a;color:#e2eee4;border-color:#487553}html.bellife-dark label,html.bellife-dark th,html.bellife-dark .datebar button{color:#c4ddc6}html.bellife-dark td,html.bellife-dark th,html.bellife-dark .vendor-row{border-color:#396344}html.bellife-dark .notice{background:#21321b;border-color:#607e43;color:#e4e9cc}html.bellife-dark .pill{background:#244a2d;color:#d9ead7}html.bellife-dark .btn.secondary{background:#224c2c;color:#d9eeda}html.bellife-dark .authscreen{background:#060c09}html.bellife-dark .authcard{background:#182c20;color:#d6e9d8} /* V4.4 desktop navigation and softer palette */ @media(min-width:751px){.bottom{display:none!important}.shell{grid-template-columns:235px minmax(0,1fr)}nav{min-width:235px;gap:5px}nav>button{font-size:13px;white-space:nowrap;padding:11px 12px}main{max-width:1400px;width:100%;padding:18px 22px}.sidebar-account{margin-top:auto;padding:16px 8px 10px;border-top:1px solid #536e59;font-size:12px;overflow-wrap:anywhere}.sidebar-account div{margin:6px 0}.sidebar-account button{width:100%;border:1px solid #799e7b;border-radius:10px;text-align:center}} @media(max-width:750px){.sidebar-account{display:none}.bottom{padding-bottom:max(5px,env(safe-area-inset-bottom))}main{padding-bottom:110px!important}} .operations-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:15px}.opmetric{border-radius:14px;padding:15px;border:1px solid #78937c;background:#17271e;display:flex;flex-direction:column;gap:5px}.opmetric small{color:#aebdb0}.opmetric strong{font-size:25px;color:#d6e4d5}.operations-columns{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(260px,1fr);gap:15px}.jobline{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid #5d745f}.jobline>div{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.jobline>div:first-child{display:flex;flex-direction:column;align-items:flex-start}.jobline small{font-size:12px;opacity:.75}.compact-select{display:flex;align-items:center;gap:7px;white-space:nowrap}.compact-select select{width:auto;min-width:92px}.alertline{padding:12px;border-bottom:1px solid #657368}.alertline b{color:#d3aa79}.alertline small{margin-left:8px;opacity:.75}.stage-track{display:flex;flex-wrap:wrap;gap:5px;margin:14px 0}.stage-track span{padding:8px 9px;border:1px solid #79917e;border-radius:8px;font-size:11px}.stage-track span.done{background:#345740}.quality-box{padding:15px;margin-top:16px;border:1px solid #69816e;border-radius:12px}.quality-line{display:flex;gap:8px;align-items:center;padding:6px 0}.quality-line input{width:auto}.vendor-rule{padding:14px 0;border-bottom:1px solid #647367}.vendor-rule label{display:inline-flex;align-items:center;margin-right:18px;gap:5px}.vendor-rule .check{width:auto} html.bellife-dark{--bellife-green:#8aaf81;--bellife-pale:#1b3124}html.bellife-dark body,html.bellife-dark header,html.bellife-dark nav{background:#0c1410!important}html.bellife-dark .card,html.bellife-dark .schedule-box{background:#15271c!important;border:1px solid #3a5942!important}html.bellife-dark .btn:not(.danger){background:#739c72!important;color:#0c190f!important}html.bellife-dark .btn.secondary{background:#294333!important;color:#d8e6d8!important}html.bellife-dark nav button.active{background:#739c72!important;color:#0b190e!important}html.bellife-dark .metric,html.bellife-dark header h1{color:#a9cba2!important}html.bellife-dark .opmetric{background:#17291e!important;border-color:#46614a!important} @media(max-width:950px){.operations-columns{grid-template-columns:1fr}.operations-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:450px){.jobline{align-items:flex-start}.jobline>div:last-child{justify-content:flex-end}.operations-metrics{gap:7px}.opmetric{padding:10px}.opmetric strong{font-size:21px}} /* V4.5 bundled inline SVG icons: no external font or icon CDN required */ .bellife-icon{width:20px;height:20px;display:inline-block;vertical-align:middle;flex:none;stroke:currentColor}.shell nav>button{display:flex;align-items:center;gap:12px;white-space:nowrap;font-size:14px}.shell nav>button .bellife-icon{width:20px;height:20px}.sidebar-account button .bellife-icon{width:17px;height:17px;margin-right:5px}.bottom .bellife-icon{width:22px;height:22px}.task-tabs .bellife-icon{width:25px;height:25px}.opmetric small{display:flex;align-items:center;gap:9px}.opmetric small .bellife-icon{width:23px;height:23px;color:#9cbd98}.operations-columns h3 .bellife-icon,.quality-box h3 .bellife-icon{margin-right:7px;color:#a6c49d}.actions button .bellife-icon{margin-right:5px;width:18px;height:18px}html.bellife-dark nav button:not(.active) .bellife-icon{color:#b1c8b1}@media(min-width:851px){.bottom{display:none!important}} /* V4.7: replace the former three rows of duplicate shirt navigation. */ .view-shirts{max-width:1120px;width:100%} .view-shirts .shirt-landing{margin-bottom:12px} .view-shirts .shirt-primary{display:flex;gap:12px;margin:0 0 15px} .view-shirts .shirt-primary .btn{min-height:54px;padding:13px 24px;font-weight:700} .view-shirts .shirt-primary .btn:first-child{flex:1;background:#477f54;color:#fff} .view-shirts .shirt-section-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:12px} .view-shirts .shirt-section-tabs button{background:#e2ece5;color:#284334;border:1px solid #cbdcd0;border-radius:14px;padding:17px 6px;font-weight:700;font-size:15px} .view-shirts .shirt-section-tabs button.active{background:#477f54;color:white;border-color:#477f54} .view-shirts .shirt-tools{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px} .view-shirts .shirt-tools button{border:1px solid #d2e2d6;background:white;color:#31503b;border-radius:10px;padding:10px 14px;font-size:13px} .view-shirts #ordersList{scroll-margin-top:18px} html.bellife-dark .view-shirts .shirt-section-tabs button{background:#243a2c;color:#d6e8d9;border-color:#3d5d46} html.bellife-dark .view-shirts .shirt-section-tabs button.active{background:#477f54;color:#fff} html.bellife-dark .view-shirts .shirt-tools button{background:#1c2c22;color:#d8e9dc;border-color:#385241} @media(max-width:650px){.view-shirts .shirt-primary{flex-direction:column}.view-shirts .shirt-section-tabs{gap:5px}.view-shirts .shirt-section-tabs button{font-size:12px;padding:12px 2px}.view-shirts .shirt-tools button{font-size:12px;padding:9px 11px}} /* V4.8: Home dashboard and compact shirt-order controls */ .home-redesign .home-widget{background:#fff;border:1px solid #e4ebe5;border-radius:20px;overflow:hidden;margin-bottom:15px;box-shadow:0 4px 12px #122e1a12;color:#193324} .home-redesign .widget-head{background:linear-gradient(100deg,#166d32,#07552b);color:white;padding:15px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px} .home-redesign .widget-head h3{color:white;margin:0;display:flex;align-items:center;gap:8px;font-size:19px} .home-redesign .widget-head .bellife-icon{color:white;width:24px;height:24px} .home-redesign .widget-head .compact-select{font-size:13px;color:white} .home-redesign .widget-head select{background:white;color:#1d3b29;border:1px solid #c7dcca;border-radius:11px;padding:9px} .home-redesign .widget-head .btn{background:#e4f6e6;color:#15472b} .home-redesign .widget-body{padding:16px} .home-redesign .upgraded-job{display:flex;align-items:center;background:#eef6ef;border:0;border-radius:15px;margin-bottom:10px;padding:14px;gap:13px} .home-redesign .job-avatar{width:52px;height:52px;border-radius:13px;background:#c5e5ce;display:grid;place-items:center;color:#276a3b;flex-shrink:0} .home-redesign .job-avatar .bellife-icon{width:30px;height:30px} .home-redesign .job-info{display:flex;flex-direction:column;gap:5px;flex:1;min-width:0} .home-redesign .job-info small{display:flex;align-items:center;gap:5px;color:#52685b;font-size:12px} .home-redesign .job-info small .bellife-icon{width:14px;height:14px} .home-redesign .job-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end} .home-redesign .job-actions .btn{background:#137335;color:#fff;border-radius:12px} .home-redesign .widget-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 2px} .home-redesign .deadline-item{display:flex;align-items:center;gap:10px;background:#f8e9e8;border-left:4px solid #c63220;border-radius:12px;padding:15px;margin-bottom:8px;flex-wrap:wrap} .home-redesign .deadline-item strong{color:#bd2d1c}.home-redesign .deadline-item.tomorrow{background:#fff6e1;border-color:#d8a22e}.home-redesign .deadline-item.tomorrow strong{color:#8c6515} .home-redesign .deadline-item small{color:#66716b;margin-left:auto} .home-redesign .quick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:12px} .home-redesign .quick-grid button{border:1px solid #b7dcc0;border-radius:14px;background:#e5f5e7;color:#174a2b;padding:15px 7px;display:flex;flex-direction:column;align-items:center;gap:8px;font-weight:700;cursor:pointer} .home-redesign .quick-grid .bellife-icon{width:26px;height:26px} .view-shirts .shirt-section-tabs{grid-template-columns:repeat(3,minmax(0,1fr))} .view-shirts .order-actions{display:flex;flex-wrap:nowrap;gap:5px;align-items:center;white-space:nowrap} .view-shirts .order-actions .btn{padding:7px 9px;font-size:12px;border-radius:9px;white-space:nowrap} html.bellife-dark .home-redesign .home-widget{background:#15271c;color:#e0eee2;border-color:#35553e} html.bellife-dark .home-redesign .upgraded-job{background:#233a2b} html.bellife-dark .home-redesign .job-info small{color:#b8cdbb} html.bellife-dark .home-redesign .deadline-item{background:#432821;color:#f5d9d5} html.bellife-dark .home-redesign .deadline-item.tomorrow{background:#443c23} html.bellife-dark .home-redesign .quick-grid button{background:#284b31;color:#e0eee2;border-color:#4a7452} @media(max-width:600px){.home-redesign .widget-head{flex-wrap:wrap}.home-redesign .upgraded-job{flex-wrap:wrap}.home-redesign .job-actions{width:100%;justify-content:flex-start}.home-redesign .quick-grid button{font-size:11px}.view-shirts .order-actions{flex-wrap:wrap}} /* V4.9 task layout: original restrained Bellife palette, existing navigation icons unchanged */ .task-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:14px 0 18px} .task-summary>div{background:#fff;border:1px solid #cbded0;border-radius:14px;padding:13px 16px;display:flex;align-items:center;gap:12px} .task-summary strong{font-size:25px;color:#26372d}.task-summary span{font-size:13px;color:#53665b;font-weight:600} .task-list-heading{display:flex;justify-content:space-between;align-items:center;margin:14px 0 10px;gap:10px} .task-list-heading>strong{font-size:17px}.task-list-heading>span{font-size:12px;color:#697970} .compact-timeline{padding:0;display:grid;gap:9px} .compact-timeline .timeline-row{display:block} .compact-task-card{min-height:66px;margin:0;padding:12px 15px;display:flex;align-items:center;gap:14px;border:1px solid #b4d2bd;border-left:4px solid #51845d;border-radius:13px} .compact-task-card>input{width:20px;height:20px;accent-color:#51845d;flex-shrink:0} .compact-task-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px} .compact-task-main>strong{font-size:15px;line-height:1.3;overflow-wrap:anywhere} .task-done{text-decoration:line-through;color:#79887e} .compact-task-meta{display:flex;align-items:center;gap:9px;flex-wrap:wrap} .compact-task-meta .pill{font-size:11px;padding:3px 9px} .task-state{font-size:11px;color:#58695f;background:#eef3ef;padding:3px 9px;border-radius:999px} .compact-note-action{border:1px solid #cdded2;background:#f0f5f1;color:#395745;border-radius:9px;padding:9px 12px;max-width:32%;min-width:100px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer} .compact-note-action:hover{background:#e2eee6} html.bellife-dark .task-summary>div,html.bellife-dark .compact-task-card{background:#182c20;border-color:#396b44} html.bellife-dark .task-summary strong,html.bellife-dark .compact-task-main>strong{color:#e0eee0} html.bellife-dark .task-summary span,html.bellife-dark .task-list-heading>span{color:#b3c7b6} html.bellife-dark .compact-note-action,html.bellife-dark .task-state{background:#24422c;color:#d7e8d9;border-color:#396b44} @media(max-width:650px){.task-summary{gap:6px}.task-summary>div{padding:10px 7px;flex-direction:column;gap:2px}.task-summary strong{font-size:21px}.task-summary span{font-size:11px}.compact-task-card{padding:11px;gap:9px;flex-wrap:wrap}.compact-note-action{min-width:0;max-width:none;width:100%;padding:8px}.compact-task-main>strong{font-size:14px}} .promo-actions{display:inline-flex;gap:6px;white-space:nowrap}.promo-actions .btn{display:inline-flex;align-items:center;justify-content:center;min-width:76px;min-height:36px;text-decoration:none;padding:8px 12px}.analytics-bars{display:grid;gap:12px;padding:12px 0}.analytics-bar-row{display:grid;grid-template-columns:minmax(100px,180px) 1fr 48px;align-items:center;gap:12px}.analytics-bar-label{overflow-wrap:anywhere}.analytics-track{height:18px;border-radius:12px;background:#e5eee7;overflow:hidden}.analytics-fill{height:100%;border-radius:12px;background:#86ca82}.analytics-bar-row strong{text-align:right}@media(max-width:600px){.analytics-bar-row{grid-template-columns:minmax(85px,110px) 1fr 36px;gap:6px}} /* V5.4 compact navigation, clickable metrics and calendar */ .sidebar-toggle{border:1px solid #d9e8d9;background:#fff;color:#246039;border-radius:8px;width:34px;height:34px;font-size:19px;display:grid;place-items:center;flex:none}#mainheader img[role="button"]{cursor:pointer}body.sidebar-collapsed #nav{display:none}body.sidebar-collapsed #mainshell{grid-template-columns:minmax(0,1fr)}.metric-link{cursor:pointer;text-align:left;font:inherit;color:inherit;border:0;width:100%}.metric-link:hover{outline:2px solid #87b88d;outline-offset:-2px}.calendar-toolbar{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap}.calendar-toolbar h3{margin:0 12px}.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;margin-top:16px}.calendar-weekday{text-align:center;font-size:12px;font-weight:700;color:#50745c}.calendar-cell{min-height:64px;border:1px solid #dce8dd;border-radius:8px;background:#f8fbf8;color:#193326;text-align:left;padding:8px;display:flex;flex-direction:column;gap:5px}.calendar-cell small{font-size:10px;color:#287444}.calendar-cell.selected{border:2px solid #3c8a4a;background:#e6f4e6}.calendar-cell.outside{border:0;background:transparent}.calendar-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid #e4eee4}.calendar-item small{display:block;color:#62756a;margin-top:4px}@media(max-width:650px){.calendar-cell{min-height:47px;padding:4px}.calendar-cell small{font-size:9px}.calendar-toolbar h3{font-size:16px}.operations-metrics{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px}.opmetric{padding:8px 5px!important}.opmetric small{font-size:9px!important}.opmetric strong{font-size:16px!important}} /* V5.5: five equal shortcut tiles, one row; horizontal scroll on narrow screens */ .task-tabs{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:10px!important}.task-tabs button{min-width:0!important;min-height:70px;overflow-wrap:anywhere}@media(max-width:650px){.task-tabs{display:flex!important;overflow-x:auto;scroll-snap-type:x proximity}.task-tabs button{flex:0 0 118px;scroll-snap-align:start}} #voiceAssistantLaunch{position:fixed;right:20px;bottom:22px;z-index:90;border:0;border-radius:50%;width:56px;height:56px;background:#89ce80;color:#17291d;box-shadow:0 3px 13px #0003;font-size:24px;cursor:pointer}#voiceAssistantPanel{position:fixed;right:18px;bottom:88px;z-index:91;width:min(400px,calc(100vw - 36px));max-height:calc(100vh - 110px);overflow:auto;background:#fff;color:#1e2928;border:1px solid #c9dfcd;border-radius:18px;box-shadow:0 10px 30px #0003;padding:18px}#voiceAssistantPanel[hidden],#assistantReview[hidden]{display:none!important}#voiceAssistantPanel .assistant-head{display:flex;justify-content:space-between;align-items:center}#voiceAssistantPanel .assistant-head button{background:transparent;border:0;font-size:20px;cursor:pointer}#voiceAssistantPanel textarea,#voiceAssistantPanel input,#voiceAssistantPanel select{width:100%;box-sizing:border-box;margin:5px 0 10px;padding:9px;border:1px solid #bcd6c1;border-radius:8px}#voiceAssistantPanel label{display:block;font-size:13px}#voiceAssistantPanel .assistant-actions{display:flex;gap:10px;flex-wrap:wrap}#voiceAssistantPanel p{font-size:12px;line-height:1.5}@media(max-width:750px){#voiceAssistantLaunch{bottom:88px;right:14px}#voiceAssistantPanel{bottom:151px;right:10px;width:calc(100vw - 20px);max-height:calc(100vh - 175px)}} /* V5.7 production readability and multi-stage workflow */ .production-meta{display:grid;grid-template-columns:minmax(180px,1.3fr) 1fr 1fr;gap:14px;align-items:end;margin:18px 0;padding-bottom:16px;border-bottom:1px solid #d8e6db} .production-meta label{margin:0}.production-meta strong{display:block;padding:11px 0;color:#183827}.production-meta small{display:block;color:#466c51} .production-stage-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:14px 0 20px} .production-stage{display:flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:9px 10px;border:1px solid #b7cbbd;border-radius:10px;background:#fff;color:#193b27;font-weight:600;cursor:pointer;text-align:center} .production-stage input{width:18px;height:18px;flex:none;accent-color:#248e2e;margin:0} .production-stage.is-complete{background:#e6f5e3;border-color:#84c878;color:#174123} .production-stage:has(input:checked){background:#e6f5e3;border-color:#84c878;color:#174123} .production-stage:focus-within{outline:2px solid #419b52;outline-offset:2px} @media(max-width:900px){.production-stage-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.production-meta{grid-template-columns:1fr 1fr}} @media(max-width:520px){.production-meta{grid-template-columns:1fr}.production-stage-grid{grid-template-columns:1fr 1fr}.production-stage{font-size:12px}} /* V5.8 financial reporting */ .fin-card{cursor:pointer;text-align:left;display:flex;flex-direction:column;align-items:flex-start;gap:6px;border:0;color:inherit}.fin-card:hover{outline:2px solid #9bd59d}.fin-stat-grid{margin:14px 0}.fin-stat{border:1px solid #d8e8d9;border-radius:12px;padding:14px;background:#f7fbf7}.fin-bars{display:grid;gap:12px;margin:18px 0}.fin-bar-row{display:grid;grid-template-columns:minmax(140px,190px) 1fr 110px;gap:12px;align-items:center}.fin-track{background:#e2eee4;height:20px;border-radius:12px;overflow:hidden}.fin-fill{background:#6cb96d;height:100%;border-radius:12px}.fin-bar-row b{text-align:right}@media(max-width:650px){.fin-bar-row{grid-template-columns:1fr;gap:3px}.fin-bar-row b{text-align:left}} /* V5.9 targeted refinements */ .analytics-two{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0}.analytics-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}.analytics-trend{height:180px;display:flex;gap:3px;align-items:end;border-bottom:1px solid #bed2c4;padding:8px 0}.analytics-trend-col{height:100%;flex:1;display:flex;align-items:end}.analytics-trend-col span{display:block;width:100%;background:#80c981;border-radius:4px 4px 0 0;min-height:2px}.quick-picks{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:8px 0 12px}.quick-picks .btn{padding:8px 12px}.analytics-two .card{margin:0}@media(max-width:850px){.analytics-two{grid-template-columns:1fr}.analytics-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}} /* V5.9.1: low-contrast trend visualization */ .analytics-trend{margin-top:16px}.analytics-trend-row{display:grid;grid-template-columns:85px minmax(80px,1fr) 140px;gap:12px;align-items:center;margin:9px 0;font-size:13px}.analytics-trend-row>div{display:grid;gap:3px}.analytics-trend-shirts,.analytics-trend-promos{height:7px;border-radius:4px;background:#559b67;min-width:2px}.analytics-trend-promos{background:#a8cbb0}@media(max-width:600px){.analytics-trend-row{grid-template-columns:60px 1fr 100px;font-size:11px}} /* V5.9.2 quick selections and orders */ .quick-buttons{display:flex;flex-wrap:wrap;gap:8px;margin:7px 0 15px}.quick-choice{background:#fff;color:#173c29;border:1px solid #c8dccc;border-radius:9px;padding:10px 15px;cursor:pointer;font-weight:600}.quick-choice.selected{background:#81ce7c;border-color:#81ce7c;color:#09270e}.quick-choice:hover{border-color:#55aa60}.quick-quantity{display:flex;align-items:center;gap:10px;margin:8px 0 17px}.quick-quantity input{width:95px;text-align:center}.quick-other{max-width:270px;margin-bottom:12px}.order-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.order-filter-panel{display:flex;flex-wrap:wrap;align-items:flex-end;gap:18px;padding:15px 0;border-bottom:1px solid #e7ede8;margin-bottom:15px}.order-filter-panel>div{min-width:120px}.order-filter-panel label{display:block;font-size:13px;font-weight:600}.order-filter-panel input:not([type=hidden]){max-width:240px}.order-number{display:inline-block;padding:6px 9px;border-radius:8px;background:#e4f6e3;color:#1c642a;font-weight:700}.order-actions{flex-wrap:nowrap}.order-actions .btn{white-space:nowrap}@media(max-width:850px){.order-filter-panel{display:block}.order-actions{flex-wrap:wrap}} /* V5.9.3: maintain original stage colors, one horizontal row */ .production-stage-grid{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto;gap:8px;max-width:100%;padding-bottom:10px;scrollbar-width:thin} .production-stage-grid .production-stage{flex:0 0 auto;white-space:nowrap;min-width:max-content} .bellife-table-filters{display:flex;flex-wrap:wrap;gap:12px;margin:12px 0 18px;align-items:center} .bellife-table-filters input{flex:2 1 240px}.bellife-table-filters select{flex:1 1 160px} .view-history .tablewrap table thead,.view-reports .tablewrap table thead{background:#378b4a;color:white} .view-history .tablewrap table th,.view-reports .tablewrap table th{color:inherit} /* V5.9.17: compact home navigation, unchanged original colors and icon assets. */ .task-tabs{gap:8px!important;padding:6px!important;margin:4px 0 10px!important;border-radius:14px!important} .task-tabs button{min-height:48px!important;height:48px!important;border-radius:12px!important;font-size:13px!important;gap:3px!important;padding:4px 6px!important;line-height:1.1!important} .task-tabs .bellife-icon{width:17px!important;height:17px!important} .task-tabs span{font-size:17px!important;line-height:1!important} .schedule-box{padding:12px 16px!important;margin-bottom:10px!important;border-radius:17px!important} .schedule-box h2{font-size:21px!important;margin-bottom:7px!important} .datebar{min-height:45px!important;padding:0 8px!important} .datebar button{font-size:18px!important;padding:6px 9px!important} .datebar .date-picker-toggle{font-size:16px!important} .datebar .date-today{font-size:13px!important} @media(max-width:650px){.task-tabs{gap:6px!important}.task-tabs button{flex:0 0 100px!important;min-height:48px!important}} /* Collapse only the widget body; preserve existing header controls. */ .widget-body[hidden],.quick-grid[hidden]{display:none!important} .bellife-widget-controls{display:flex;align-items:center;gap:8px;margin-left:auto} .bellife-collapse-btn{border:1px solid #b8ddc3;background:#e2efe6;color:#105f34;min-width:30px;height:29px;padding:0 6px;border-radius:8px;cursor:pointer;font-size:21px;line-height:1} .widget-head>.bellife-collapse-btn{margin-left:auto} .widget-head .compact-select+.bellife-collapse-btn{margin-left:8px} .provided-shirt-row{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:12px!important;margin:9px 0!important;padding:10px 12px!important;border:1px solid #d3e5d7;border-radius:9px;background:#f5faf6;max-width:100%;width:100%;box-sizing:border-box} .provided-shirt-row input{width:18px!important;height:18px!important;flex:0 0 18px!important;margin:0!important} .provided-shirt-row span{display:flex;flex-direction:column;gap:4px;min-width:0;overflow-wrap:anywhere} .provided-shirt-row small{font-weight:normal;color:#53695a} .calendar-export-preferences{display:flex;flex-wrap:wrap;gap:12px;margin:12px 0} .calendar-export-preferences label{display:flex;align-items:center;gap:7px;font-size:13px} .calendar-export-preferences input{width:17px;height:17px} .calendar-export-preferences p{flex-basis:100%;margin:0} /* V5.9.18: white, unboxed collapse chevrons on original green widget headers. */ .widget-head .bellife-collapse-btn,.widget-head .bellife-collapse-btn:hover,.widget-head .bellife-collapse-btn:focus-visible{background:transparent!important;color:#fff!important;border:0!important;box-shadow:none!important;border-radius:0!important;min-width:30px;height:30px;padding:0 5px!important;font-weight:700!important;} .widget-head .bellife-collapse-btn:focus-visible{outline:2px solid #fff!important;outline-offset:1px!important;} /* V5.9.19: readable Production Tracker metadata and compact fulfillment controls. */ .home-redesign .job-info small{color:#40574a} .home-redesign .job-tags{display:flex;gap:5px;flex-wrap:wrap;align-items:center} .fulfillment-badge,.job-deadline-badge,.job-today-badge{display:inline-flex;align-items:center;border-radius:999px;font-size:11px;font-weight:700;padding:3px 8px;white-space:nowrap} .fulfillment-badge.is-pickup{background:#e3efe5;color:#245c35} .fulfillment-badge.is-delivery{background:#e2ecf2;color:#285771} .job-deadline-badge{background:#f9e7e5;color:#9c2e25} .job-today-badge{background:#fff0cf;color:#835c12} .bellife-fulfillment{border:1px solid #d7e7d8;border-radius:12px;padding:12px 14px;margin:12px 0;background:#f7fbf7} .bellife-fulfillment h3{font-size:15px;margin:0 0 8px;color:#246039} .bellife-fulfillment .fulfillment-delivery-fields[hidden]{display:none} .bellife-fulfillment textarea{min-height:62px} html.bellife-dark .home-redesign .job-info small{color:#c5d9c8} html.bellife-dark .bellife-fulfillment{background:#1d3023;border-color:#365540} html.bellife-dark .fulfillment-badge.is-pickup{background:#294c34;color:#d2f1d8} html.bellife-dark .fulfillment-badge.is-delivery{background:#254358;color:#d3e9f8} /* V5.9.21 — Charcoal Green dark theme. Light mode styles above are untouched. */ html.bellife-dark { color-scheme:dark; --bellife-ink:#EDF4EF; --bellife-pale:#252E28; --bellife-green:#57AD6B; --dark-bg:#171D1A; --dark-surface:#252E28; --dark-text:#EDF4EF; --dark-muted:#BAC9C0; --dark-border:#405449; background:#171D1A; color:#EDF4EF; } html.bellife-dark body, html.bellife-dark header, html.bellife-dark nav, html.bellife-dark main, html.bellife-dark .shell {background:#171D1A;color:#EDF4EF} html.bellife-dark header h1, html.bellife-dark .shirt-heading h1, html.bellife-dark h1, html.bellife-dark h2, html.bellife-dark h3, html.bellife-dark h4, html.bellife-dark strong {color:#EDF4EF} html.bellife-dark header small, html.bellife-dark .muted, html.bellife-dark small, html.bellife-dark .shirt-heading p, html.bellife-dark .shirt-tiles span, html.bellife-dark .shirt-wide span, html.bellife-dark .home-redesign .job-info small, html.bellife-dark .task-list-heading>span, html.bellife-dark .task-summary span {color:#BAC9C0} html.bellife-dark .card, html.bellife-dark .schedule-box, html.bellife-dark .timeline-card, html.bellife-dark .shirt-tiles button, html.bellife-dark .shirt-wide button, html.bellife-dark .compact-task-card, html.bellife-dark .task-summary>div, html.bellife-dark .settings-menu-button, html.bellife-dark .datebar, html.bellife-dark .note-action, html.bellife-dark .task-state, html.bellife-dark .compact-note-action, html.bellife-dark .home-redesign .job-card, html.bellife-dark .bellife-fulfillment { background:#252E28; color:#EDF4EF; border-color:#405449; } html.bellife-dark .task-tabs, html.bellife-dark .bottom, html.bellife-dark .task-tabs button, html.bellife-dark .bottom button, html.bellife-dark .settings-menu-button:hover {background:#252E28;color:#EDF4EF;border-color:#405449} html.bellife-dark nav button, html.bellife-dark .datebar button, html.bellife-dark label, html.bellife-dark td, html.bellife-dark th {color:#EDF4EF} html.bellife-dark nav button.active, html.bellife-dark .task-tabs button.active, html.bellife-dark .bottom button.active, html.bellife-dark .btn:not(.secondary):not(.danger), html.bellife-dark .date-today { background:#57AD6B; color:#171D1A; border-color:#57AD6B; } html.bellife-dark .btn.secondary, html.bellife-dark .note-action, html.bellife-dark .date-picker-toggle { background:#304438; color:#EDF4EF; border-color:#496653; } html.bellife-dark input, html.bellife-dark select, html.bellife-dark textarea { background:#202923; color:#EDF4EF; border-color:#53685B; } html.bellife-dark input::placeholder, html.bellife-dark textarea::placeholder {color:#BAC9C0;opacity:.8} html.bellife-dark table, html.bellife-dark tbody, html.bellife-dark tr, html.bellife-dark td, html.bellife-dark .vendor-row {border-color:#405449} html.bellife-dark tbody tr {background:#252E28;color:#EDF4EF} html.bellife-dark tbody tr:nth-child(even) {background:#2B3730} html.bellife-dark thead th {background:#315A3C;color:#EDF4EF} html.bellife-dark a {color:#91D9A1} html.bellife-dark .fulfillment-badge.is-pickup {background:#304D39;color:#D9F0DF} html.bellife-dark .fulfillment-badge.is-delivery {background:#2A4751;color:#DAECF5} html.bellife-dark :focus-visible {outline:2px solid #8BD49A;outline-offset:2px} /* V5.9.22 — Home dashboard only: quieter charcoal dark mode. Light mode and all other app sections are intentionally unaffected. */ html.bellife-dark .home-redesign .home-widget { background:#222925; color:#EDF4EF; border-color:#405048; } html.bellife-dark .home-redesign .widget-head { background:#292F2C; color:#EDF4EF; border-bottom:1px solid #405048; } html.bellife-dark .home-redesign .widget-head h3, html.bellife-dark .home-redesign .widget-head .bellife-icon, html.bellife-dark .home-redesign .widget-head .compact-select { color:#EDF4EF; } html.bellife-dark .home-redesign .widget-head select { background:#343B37; color:#EDF4EF; border-color:#58635C; } html.bellife-dark .home-redesign .widget-head .btn { background:#343B37; color:#EDF4EF; border-color:#58635C; } html.bellife-dark .home-redesign .upgraded-job, html.bellife-dark .home-redesign .job-card { background:#343B37; color:#EDF4EF; border-color:#46534A; } html.bellife-dark .home-redesign .job-avatar { background:#3A4840; color:#A5D5B0; } html.bellife-dark .home-redesign .job-info small { color:#BAC9C0; } html.bellife-dark .home-redesign .job-actions .btn, html.bellife-dark .home-redesign .widget-foot .btn { background:#3B4941; color:#EDF4EF; border-color:#53665A; } html.bellife-dark .home-redesign .job-actions .btn:hover, html.bellife-dark .home-redesign .widget-foot .btn:hover { background:#466351; } html.bellife-dark .home-redesign .deadline-item, html.bellife-dark .home-redesign .deadline-item.tomorrow { background:#343B37; color:#EDF4EF; border-left-color:#E75C4B; } html.bellife-dark .home-redesign .deadline-item strong { color:#FF7667; } html.bellife-dark .home-redesign .deadline-item.tomorrow { border-left-color:#D6A84D; } html.bellife-dark .home-redesign .deadline-item.tomorrow strong { color:#F0CA7B; } html.bellife-dark .home-redesign .deadline-item small { color:#BAC9C0; } html.bellife-dark .home-redesign .quick-grid button { background:#343B37; color:#EDF4EF; border-color:#536058; } html.bellife-dark .home-redesign .quick-grid button:hover { background:#414B44; } html.bellife-dark .home-redesign .quick-grid .bellife-icon { color:#BAC9C0; } /* Preserve the approved unboxed white chevrons. */ html.bellife-dark .home-redesign .widget-head .bellife-collapse-btn, html.bellife-dark .home-redesign .widget-head .bellife-collapse-btn:hover { background:transparent!important; color:#FFF!important; border:0!important; } /* V5.9.23 — shared, always-visible header theme switcher. */ #mainheader .header-theme-control { display:flex; align-items:center; gap:3px; flex:0 0 auto; margin-left:auto; padding:3px; border:1px solid #cbdccd; border-radius:999px; background:#f4f8f4; } #mainheader .header-theme-control button { display:flex; align-items:center; justify-content:center; gap:6px; min-height:34px; padding:6px 13px; border:0; border-radius:999px; background:transparent; color:#31553d; font-size:13px; font-weight:600; white-space:nowrap; } #mainheader .header-theme-control button.selected { background:#57AD6B; color:#102319; } #mainheader .header-theme-control button:focus-visible { outline:2px solid #57AD6B; outline-offset:2px; } #mainheader .authbar {margin-left:0} html.bellife-dark #mainheader .header-theme-control { background:#222925; border-color:#536058; } html.bellife-dark #mainheader .header-theme-control button { color:#EDF4EF; } html.bellife-dark #mainheader .header-theme-control button.selected { background:#57AD6B; color:#171D1A; } @media(max-width:620px){ #mainheader {gap:8px;padding:9px 10px;flex-wrap:wrap} #mainheader img {width:40px;height:40px} #mainheader h1 {font-size:15px} #mainheader small {font-size:10px} #mainheader .header-theme-control {margin-left:auto} #mainheader .header-theme-control button {min-height:32px;padding:5px 9px} #mainheader .header-theme-control .theme-label {display:none} #mainheader .authbar {flex-basis:100%;justify-content:flex-end} } /* V5.9.24 accessibility and navigation */ .sidebar-toggle,.sidebar-toggle:hover,.sidebar-toggle:focus{background:transparent!important;border:0!important;box-shadow:none!important;color:#174B2B!important;font-weight:700} html.bellife-dark .sidebar-toggle,html.bellife-dark .sidebar-toggle:hover,html.bellife-dark .sidebar-toggle:focus{background:transparent!important;border:0!important;box-shadow:none!important;color:#FFFFFF!important} html.bellife-dark .workflow-home .workflow-metric{background:#343B37!important;border-color:#405048!important} html.bellife-dark .workflow-home .workflow-metric small{color:#BAC9C0!important;opacity:1!important} html.bellife-dark .workflow-home .workflow-metric strong{color:#EDF4EF!important;opacity:1!important} .review-calendar-check{display:flex;align-items:center;min-width:26px} .review-calendar-check input{width:18px;height:18px;accent-color:#39824B} .balance-hidden{display:inline-block;cursor:pointer;min-width:80px} .balance-hidden .balance-amount{display:none} .balance-hidden.revealed .balance-amount,.balance-hidden:hover .balance-amount,.balance-hidden:focus .balance-amount{display:inline} .balance-hidden.revealed .balance-mask,.balance-hidden:hover .balance-mask,.balance-hidden:focus .balance-mask{display:none} .home-redesign .quick-grid{grid-template-columns:repeat(4,minmax(0,1fr))} @media(max-width:650px){.home-redesign .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} /* V5.9.25 */ html.bellife-dark .sidebar-toggle,html.bellife-dark .sidebar-toggle:hover,html.bellife-dark .sidebar-toggle:focus{color:#8FD9A8!important} .pricing-summary{padding:12px 0} .pricing-summary .grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px} .pricing-summary .grid>div{display:flex;flex-direction:column;gap:5px} .pricing-summary strong{font-size:1.15rem} @media(max-width:600px){.pricing-summary .grid{grid-template-columns:1fr}} /* V5.9.26: compact grouped stock inventory */ .inventory-compact-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap} .inventory-compact-controls{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin:12px 0} .inventory-compact-controls>label{min-width:170px;flex:1} .inventory-compact-controls input[type=search],.inventory-compact-controls select{width:100%} .inventory-compact-controls .inventory-low-check{display:flex;align-items:center;gap:8px;min-width:auto;flex:0 0 auto;padding-bottom:10px} .inventory-low-check input{width:16px;height:16px;accent-color:#39824B} .inventory-compact-buttons{display:flex;gap:7px;flex-wrap:wrap} .inventory-compact-buttons .btn{padding:9px 12px} .inventory-compact-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:10px 0 16px} .inventory-compact-metrics>div{background:rgba(70,130,83,.09);border:1px solid rgba(70,130,83,.16);border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:4px} .inventory-compact-metrics small{opacity:.75} .inventory-compact-metrics strong{font-size:1.3rem} .inventory-stock-group{border:1px solid rgba(75,135,91,.28);border-radius:10px;overflow:hidden;margin:8px 0} .inventory-stock-heading{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;background:rgba(69,133,82,.10);color:inherit;border:0;padding:14px 16px;cursor:pointer;font:inherit} .inventory-stock-heading:hover{background:rgba(69,133,82,.16)} .inventory-stock-label{display:flex;align-items:center;gap:12px} .inventory-stock-label>span:last-child{display:flex;flex-direction:column;gap:3px} .inventory-stock-label small{opacity:.7;font-size:.77rem} .inventory-stock-chevron{font-size:1.15rem;width:14px} .inventory-stock-available{white-space:nowrap;font-size:.85rem;display:flex;gap:10px;align-items:center} .inventory-stock-detail{padding:10px 12px 12px} .inventory-stock-subtotals{font-size:.85rem;margin:3px 0 9px;opacity:.8} .inventory-page-controls{display:flex;justify-content:flex-end;align-items:center;gap:9px;margin-top:10px;font-size:.82rem} html.bellife-dark .inventory-stock-heading{background:#29352e;color:#edf4ef} html.bellife-dark .inventory-stock-heading:hover{background:#35463a} html.bellife-dark .inventory-compact-metrics>div{background:#252e28;border-color:#405048} @media(max-width:650px){ .inventory-compact-controls>label{flex:1 1 100%} .inventory-compact-controls .inventory-low-check{flex:1 1 auto} .inventory-stock-heading{padding:12px 10px} .inventory-stock-available{font-size:.77rem} .inventory-stock-detail{padding:8px} } /* V5.9.27 — Five Quick Actions, single horizontal row */ .home-redesign .quick-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;-webkit-overflow-scrolling:touch} .home-redesign .quick-grid button{min-width:0;min-height:92px;overflow-wrap:anywhere;line-height:1.2} @media(max-width:850px){.home-redesign .quick-grid{grid-template-columns:repeat(5,minmax(105px,1fr))}.home-redesign .quick-grid button{min-width:105px;padding:12px 5px}} @media(max-width:600px){.home-redesign .quick-grid{grid-template-columns:repeat(5,minmax(100px,1fr))}.home-redesign .quick-grid button{min-width:100px;font-size:11px}} /* V5.9.28: inline Home production stages (original stage names and multi-select behavior) */ .home-redesign .home-job-with-stages{display:grid!important;grid-template-columns:52px minmax(130px,1fr) minmax(320px,1.9fr) auto;align-items:center;gap:12px} .home-redesign .home-job-with-stages>.job-avatar{grid-column:1} .home-redesign .home-job-with-stages>.job-info{grid-column:2;display:flex;flex-direction:column;align-items:flex-start} .home-redesign .home-job-with-stages>.home-stage-panel{grid-column:3;min-width:0;display:block} .home-redesign .home-job-with-stages>.job-actions{grid-column:4;display:flex;flex-direction:column;align-items:stretch;gap:6px;min-width:88px} .home-stage-title{font-size:12px;font-weight:700;margin-bottom:9px} .home-production-stages{display:flex;gap:8px;align-items:start;overflow-x:auto;padding:2px 1px 8px;scrollbar-width:thin} .home-stage-item{flex:1 0 52px;min-width:52px;display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer;position:relative;font-size:10px;line-height:1.2;text-align:center} .home-stage-item input{position:absolute;opacity:0;width:1px;height:1px} .home-stage-circle{width:17px;height:17px;border-radius:50%;border:3px solid var(--stage-color);background:transparent;display:block;box-sizing:border-box} .home-stage-red{--stage-color:#ee4141}.home-stage-yellow{--stage-color:#f3c536}.home-stage-green{--stage-color:#36c66b} .home-stage-item.selected .home-stage-circle{background:var(--stage-color);box-shadow:inset 0 0 0 3px #fff} .home-stage-item input:focus-visible+.home-stage-circle{outline:2px solid #7baeff;outline-offset:3px} .home-stage-name{white-space:normal;overflow-wrap:break-word;max-width:70px} .home-redesign .home-stage-update{padding:7px 11px;font-size:12px} .home-stage-legend{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;margin:6px 0 10px;font-size:11px;opacity:.85} .home-stage-legend span{display:flex;align-items:center;gap:5px} .home-stage-legend i{display:inline-block;width:11px;height:11px;border-radius:50%} .legend-red{background:#ee4141}.legend-yellow{background:#f3c536}.legend-green{background:#36c66b} @media(max-width:1100px){ .home-redesign .home-job-with-stages{grid-template-columns:48px minmax(110px,1fr) minmax(260px,2fr)} .home-redesign .home-job-with-stages>.job-actions{grid-column:3;grid-row:2;flex-direction:row;justify-content:flex-end} .home-redesign .home-job-with-stages>.home-stage-panel{grid-column:3;grid-row:1} } @media(max-width:720px){ .home-redesign .home-job-with-stages{grid-template-columns:44px minmax(0,1fr) auto;gap:8px} .home-redesign .home-job-with-stages>.job-avatar{grid-column:1;grid-row:1} .home-redesign .home-job-with-stages>.job-info{grid-column:2;grid-row:1} .home-redesign .home-job-with-stages>.home-stage-panel{grid-column:1 / -1;grid-row:2;width:100%} .home-redesign .home-job-with-stages>.job-actions{grid-column:1 / -1;grid-row:3;flex-direction:row;justify-content:flex-end} .home-production-stages{gap:4px} .home-stage-item{flex:0 0 64px} } /* Compact Quick Actions requested after V5.9.27 */ .home-redesign .quick-grid{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto;gap:7px;padding:9px 10px} .home-redesign .quick-grid button{flex:1 0 0;min-width:95px;min-height:68px;padding:8px 5px!important;gap:4px!important;border-radius:11px;font-size:12px;line-height:1.15} .home-redesign .quick-grid button .bellife-icon{width:17px;height:17px} /* V5.9.29: seven stages, subtle four-color palette, no stage-area scrollbar */ .home-stage-red{--stage-color:#D85A5A} .home-stage-orange{--stage-color:#DE7849} .home-stage-yellow{--stage-color:#E3BE50} .home-stage-green{--stage-color:#49A65B} .home-production-stages{overflow-x:visible!important;overflow-y:visible!important;scrollbar-width:none!important;display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:4px!important;padding:2px 0 5px!important} .home-stage-item{flex:none!important;min-width:0!important;width:100%;font-size:10px} .home-stage-circle{flex:none} .home-stage-name{max-width:100%;overflow-wrap:normal;white-space:nowrap;font-size:10px} .home-redesign .home-job-with-stages{grid-template-columns:52px minmax(130px,1fr) minmax(390px,2.25fr) auto!important} .home-stage-legend .legend-red{background:#D85A5A} .home-stage-legend .legend-orange{background:#DE7849} .home-stage-legend .legend-yellow{background:#E3BE50} .home-stage-legend .legend-green{background:#49A65B} @media(max-width:1100px){ .home-redesign .home-job-with-stages{grid-template-columns:48px minmax(120px,1fr) minmax(390px,2fr)!important} } @media(max-width:720px){ .home-redesign .home-job-with-stages{grid-template-columns:44px minmax(0,1fr) auto!important} .home-stage-name{font-size:9px} .home-production-stages{gap:1px!important} } @media(max-width:400px){.home-stage-name{font-size:8px;letter-spacing:-.2px}.home-stage-circle{width:15px;height:15px}} /* V5.9.31: consistent charcoal dark surfaces and readable production controls */ html.bellife-dark{background:#171D1A!important;color:#EDF4EF!important;--bellife-ink:#EDF4EF;--bellife-pale:#252A28} html.bellife-dark body,html.bellife-dark header,html.bellife-dark nav,html.bellife-dark main{background:#171D1A!important;color:#EDF4EF!important} html.bellife-dark header h1,html.bellife-dark .shirt-heading h1{color:#EDF4EF!important} html.bellife-dark .card,html.bellife-dark .schedule-box,html.bellife-dark .timeline-card,html.bellife-dark .home-redesign .home-widget,html.bellife-dark .quality-box{background:#252A28!important;color:#EDF4EF!important;border-color:#454D48!important} html.bellife-dark .home-redesign .upgraded-job,html.bellife-dark .inventory-stock-heading{background:#2B302E!important;color:#EDF4EF!important} html.bellife-dark .home-redesign .quick-grid button,html.bellife-dark .btn.secondary,html.bellife-dark .task-tabs button:not(.active),html.bellife-dark .bottom button:not(.active){background:#343B37!important;color:#EDF4EF!important;border-color:#454D48!important} html.bellife-dark .muted,html.bellife-dark .home-redesign .job-info small{color:#BAC9C0!important} html.bellife-dark input,html.bellife-dark select,html.bellife-dark textarea{background:#2B302E!important;color:#EDF4EF!important;border-color:#58665D!important} html.bellife-dark th{background:#343B37!important;color:#EDF4EF!important} html.bellife-dark td{color:#EDF4EF!important;border-color:#454D48!important} html.bellife-dark tbody tr:nth-child(odd){background:#202624!important} html.bellife-dark tbody tr:nth-child(even){background:#2B302E!important} html.bellife-dark .pill{background:#343B37!important;color:#EDF4EF!important} html.bellife-dark .production-stage-grid{display:flex!important;flex-wrap:nowrap!important;gap:8px!important;overflow-x:auto!important;padding:8px 1px 12px!important} html.bellife-dark .production-stage-grid .production-stage{background:#303735!important;color:#EDF4EF!important;border:1px solid #58665D!important;min-height:44px!important;border-radius:10px!important;padding:9px 12px!important;opacity:1!important;white-space:nowrap!important} html.bellife-dark .production-stage-grid .production-stage span{color:#EDF4EF!important;opacity:1!important;font-weight:650!important} html.bellife-dark .production-stage-grid .production-stage input{accent-color:#8FD9A8!important;filter:none!important;opacity:1!important} html.bellife-dark .production-stage-grid .production-stage.is-complete,html.bellife-dark .production-stage-grid .production-stage:has(input:checked){background:#BFEED0!important;color:#173325!important;border-color:#8FD9A8!important} html.bellife-dark .production-stage-grid .production-stage.is-complete span,html.bellife-dark .production-stage-grid .production-stage:has(input:checked) span{color:#173325!important} html.bellife-dark .production-stage-grid .production-stage:has(input:checked) input{accent-color:#258B4D!important} html.bellife-dark .home-stage-red,html.bellife-dark .home-stage-orange,html.bellife-dark .home-stage-yellow,html.bellife-dark .home-stage-green{--stage-color:#8FD9A8!important} html.bellife-dark .home-stage-name{color:#EDF4EF!important} html.bellife-dark .home-stage-item.selected .home-stage-circle{box-shadow:inset 0 0 0 3px #EDF4EF!important} html.bellife-dark .production-stage:focus-within{outline-color:#8FD9A8!important} /* V5.9.32: Option 1 — flat charcoal Jobs to show dropdown (Dark Mode only) */ html.bellife-dark .home-redesign .widget-head .compact-select select, html.bellife-dark .widget-head .compact-select select { background:#303735!important; color:#EDF4EF!important; border:0!important; outline:0!important; box-shadow:none!important; border-radius:10px!important; padding:7px 10px!important; min-width:92px; font:inherit; cursor:pointer; } html.bellife-dark .widget-head .compact-select select:focus-visible { outline:2px solid #8FD9A8!important; outline-offset:2px!important; } /* V5.9.33 calendar review alignment */ .review-calendar-row{display:grid!important;grid-template-columns:28px minmax(0,1fr) auto!important;align-items:center!important;justify-content:stretch!important;gap:12px!important;flex-wrap:nowrap!important;padding:11px 5px!important;min-height:49px} .review-calendar-row .review-calendar-check{width:26px;min-width:26px;margin:0!important} .review-calendar-row .review-calendar-title{min-width:0!important;width:auto!important;text-align:left!important;justify-self:stretch!important} .review-calendar-row .review-calendar-title strong{display:block;text-align:left!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .review-calendar-row .review-calendar-actions{display:flex!important;align-items:center!important;justify-content:flex-end!important;flex-wrap:nowrap!important;gap:7px!important;min-width:0} .review-calendar-source{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;border-radius:18px;padding:6px 10px;background:#343B37;color:#EDF4EF;font-size:12px;font-weight:600} .review-calendar-source .bellife-icon{width:15px;height:15px;color:#8FD9A8} html.bellife-dark .review-calendar-row{border-top:1px solid #454D48!important} html.bellife-dark .review-calendar-row .review-calendar-convert{background:#256B38!important;color:white!important;border-color:#256B38!important} html.bellife-dark .review-calendar-source{background:#343B37;color:#EDF4EF} @media(max-width:760px){ .review-calendar-row{grid-template-columns:25px minmax(0,1fr)!important;gap:8px!important} .review-calendar-row .review-calendar-actions{grid-column:2;justify-content:flex-start!important;overflow-x:auto;max-width:100%;padding-bottom:2px} .review-calendar-row .review-calendar-title strong{white-space:normal;overflow-wrap:anywhere} .review-calendar-source{font-size:11px} } /* V5.9.34 Stock summary cards open an itemized, filter-aware breakdown */ .inventory-metric-buttons{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px} .inventory-metric-buttons .inventory-metric-button{position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:left;min-width:0;cursor:pointer;border:1px solid #454D48;border-radius:10px;background:#252E28;color:inherit;padding:12px 15px;min-height:69px} .inventory-metric-buttons .inventory-metric-button small{opacity:.8} .inventory-metric-buttons .inventory-metric-button strong{font-size:20px} .inventory-metric-chevron{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:23px} .inventory-metric-buttons .inventory-metric-button:hover,.inventory-metric-buttons .inventory-metric-selected{border-color:#8FD9A8;background:#2E4136} .inventory-metric-buttons .inventory-metric-button:focus-visible{outline:2px solid #8FD9A8;outline-offset:2px} .inventory-metric-detail{border:1px solid #454D48;border-radius:12px;margin:12px 0 16px;overflow:hidden} .inventory-metric-detail-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;background:#252A28} .inventory-metric-detail-head h4{margin:0} .inventory-metric-detail table{width:100%} .inventory-metric-detail th,.inventory-metric-detail td{text-align:left;padding:9px 12px} @media(max-width:520px){.inventory-metric-buttons{gap:5px}.inventory-metric-buttons .inventory-metric-button{padding:10px 8px;min-height:64px}.inventory-metric-chevron{right:7px}.inventory-metric-detail th,.inventory-metric-detail td{padding:7px}} /* V5.9.35: imported-order customer-provided shirt review — dark mode only */ html.bellife-dark .provided-shirt-row{ background:#2B302E!important; border:1px solid #454D48!important; color:#EDF4EF!important; box-shadow:none!important; padding:11px 13px!important; } html.bellife-dark .provided-shirt-row span, html.bellife-dark .provided-shirt-row b, html.bellife-dark .provided-shirt-row strong{ color:#EDF4EF!important; opacity:1!important; } html.bellife-dark .provided-shirt-row small{ display:block!important; color:#BAC9C0!important; opacity:1!important; font-weight:500!important; line-height:1.45!important; } html.bellife-dark .provided-shirt-row input[type="checkbox"]{ accent-color:#8FD9A8!important; width:18px!important; height:18px!important; opacity:1!important; flex-shrink:0!important; } html.bellife-dark .provided-shirt-row:has(input:checked){ background:#293D32!important; border-color:#8FD9A8!important; } html.bellife-dark .provided-shirt-row:focus-within{ outline:2px solid #8FD9A8!important; outline-offset:2px; } /* V5.9.36 — Home Quick Actions: five compact shortcuts, including Export Backup */ .home-redesign .quick-grid{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:7px!important;overflow-x:auto!important;overflow-y:hidden!important;padding:8px!important} .home-redesign .quick-grid button{width:100%!important;min-width:0!important;min-height:66px!important;padding:7px 4px!important;gap:4px!important;font-size:12px!important;line-height:1.15!important;white-space:normal!important} .home-redesign .quick-grid button .bellife-icon{width:18px!important;height:18px!important} @media(max-width:620px){ .home-redesign .quick-grid{grid-template-columns:repeat(5,minmax(82px,1fr))!important} .home-redesign .quick-grid button{font-size:10px!important} } /* V5.9.37 imported-order type switcher */ .import-promo-fields[hidden],.import-printing-fields[hidden],.import-print-price[hidden],.import-promo-price[hidden]{display:none!important} .import-promo-fields{border:1px solid #454D48;border-radius:10px;padding:12px;margin:12px 0} /* V5.9.38 promotional import line pricing */ #importPromoPriceRows{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;margin-top:12px} .import-promo-price-line{display:flex;flex-direction:column;gap:6px} .import-promo-price-line input{width:100%} /* V5.9.39 — recognizable WhatsApp logo for the manual importer shortcut */ .home-redesign .quick-grid .bellife-whatsapp-logo{color:#25D366!important;width:18px!important;height:18px!important;flex-shrink:0} /* V5.9.40: readable calendar date cards in Dark Mode only */ html.bellife-dark .calendar-grid .calendar-cell:not(.outside){ background:#303735!important; color:#EDF4EF!important; border:1px solid #46534C!important; box-shadow:none!important; } html.bellife-dark .calendar-grid .calendar-cell:not(.outside) strong{color:#EDF4EF!important;opacity:1!important} html.bellife-dark .calendar-grid .calendar-cell:not(.outside) small{color:#BAC9C0!important;opacity:1!important} html.bellife-dark .calendar-grid .calendar-cell:not(.outside).selected{ background:#294134!important; border:2px solid #8FD9A8!important; } html.bellife-dark .calendar-grid .calendar-cell.outside{background:transparent!important;border:0!important} html.bellife-dark .calendar-grid .calendar-cell:not(.outside):hover{background:#39463F!important} html.bellife-dark .calendar-grid .calendar-cell:not(.outside):focus-visible{outline:2px solid #8FD9A8!important;outline-offset:2px} html.bellife-dark .calendar-weekday{color:#8FD9A8!important} /* V5.9.41: readable order breakdown beside production quality checklist */ .production-qc-layout{display:grid;grid-template-columns:minmax(220px,0.85fr) minmax(0,1.15fr);gap:18px;align-items:start;margin-top:12px} .production-qc-checks{min-width:0} .production-order-details{min-width:0;border:1px solid #52645a;border-radius:10px;overflow:hidden;background:rgba(120,140,126,.06)} .production-order-details h4{margin:0;padding:11px 13px;background:rgba(95,148,108,.16);font-size:15px} .production-order-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:12px} .production-order-facts div{min-width:0;display:flex;flex-direction:column;gap:3px} .production-order-facts small,.production-order-notes small{opacity:.75;font-size:11px} .production-order-facts b{overflow-wrap:anywhere} .production-order-lines{overflow-x:auto;padding:0 10px} .production-order-lines table{width:100%;border-collapse:collapse;font-size:12px} .production-order-lines th,.production-order-lines td{padding:8px 6px;text-align:left;border-bottom:1px solid rgba(125,145,130,.28);vertical-align:top} .production-order-lines td small{display:block;font-size:11px;opacity:.8;margin-top:3px} .production-order-qty{padding:4px 12px;margin:7px 0} .production-order-notes{padding:9px 12px;border-top:1px solid rgba(125,145,130,.28)} .production-order-notes p{margin:4px 0;white-space:pre-wrap;overflow-wrap:anywhere} @media(max-width:760px){.production-qc-layout{grid-template-columns:minmax(0,1fr)}.production-order-details{grid-row:1}} /* V5.9.42 — uniform mint stage toggles in Light Mode (same shade as Dark Mode) */ html:not(.bellife-dark) .home-stage-red, html:not(.bellife-dark) .home-stage-orange, html:not(.bellife-dark) .home-stage-yellow, html:not(.bellife-dark) .home-stage-green{--stage-color:#8FD9A8!important} html:not(.bellife-dark) .home-stage-item.selected .home-stage-circle{box-shadow:inset 0 0 0 3px #EDF5EF!important} html:not(.bellife-dark) .home-stage-legend .legend-red, html:not(.bellife-dark) .home-stage-legend .legend-orange, html:not(.bellife-dark) .home-stage-legend .legend-yellow, html:not(.bellife-dark) .home-stage-legend .legend-green{background:#8FD9A8!important} /* V5.9.43 manual ordering controls for Home Production Tracker */ .home-redesign .production-order-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 14px;font-size:12px;color:var(--bellife-ink,#23372d)} .home-redesign .production-order-toolbar .btn{padding:6px 11px!important;min-height:30px!important;font-size:12px!important} .home-redesign .production-order-toolbar button:disabled{opacity:.5;cursor:default} .home-redesign .home-job-with-stages{position:relative;padding-left:35px!important} .home-redesign .production-drag-controls{position:absolute;left:5px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:2px;z-index:1} .home-redesign .production-drag-handle{cursor:grab;user-select:none;touch-action:none;font-size:22px;line-height:23px;color:#438c69} .home-redesign .production-drag-handle:active{cursor:grabbing} .home-redesign .production-drag-controls button{border:0;background:transparent;color:#438c69;cursor:pointer;font-size:10px;line-height:15px;padding:0 5px} .home-redesign .production-drag-controls button:focus-visible,.home-redesign .production-drag-handle:focus-visible{outline:2px solid #8FD9A8} html.bellife-dark .home-redesign .production-order-toolbar{color:#BAC9C0} html.bellife-dark .home-redesign .production-drag-controls button,html.bellife-dark .home-redesign .production-drag-handle{color:#8FD9A8} @media(max-width:720px){.home-redesign .production-order-toolbar{align-items:flex-start;flex-direction:column}.home-redesign .home-job-with-stages{padding-left:33px!important}} /* V5.9.47: Deadline Alerts distinguish overdue, today and tomorrow. */ .home-redesign .deadline-item.today{background:#fff1da;border-color:#d49a28} .home-redesign .deadline-item.today strong{color:#8a5d0d} html.bellife-dark .home-redesign .deadline-item.today{background:#443c23;color:#f1e5cb} html.bellife-dark .home-redesign .deadline-item.today strong{color:#f0cf85} /* V5.9.48: compact indicator only; existing cards/layouts unchanged. */ .bellife-rush-indicator{display:inline-block;margin-inline-start:6px;color:#b42318;font-size:.76em;font-weight:700;white-space:nowrap;vertical-align:baseline} /* V1.18: white rush indicator in charcoal dark mode, no badge background. */ .rush-dark-icon{display:none;vertical-align:-2px} .bellife-dark .bellife-rush-indicator{color:#fff!important;background:transparent!important;border:0!important;font-weight:700} .bellife-dark .bellife-rush-indicator .rush-light-icon{display:none} .bellife-dark .bellife-rush-indicator .rush-dark-icon{display:inline-block;color:#fff;stroke:#fff} /* V5.9.49: compact controls; retain original Production Tracker card styling. */ .production-order-toolbar{flex-wrap:wrap;gap:8px} .production-duplicate-group{padding:12px;margin:10px 0;border:1px solid #cdded2;border-radius:10px} .production-duplicate-row{display:flex;align-items:center;gap:10px;padding:7px 2px;font-size:13px} #productionDuplicateReview:not([hidden]){padding:12px;margin:8px 0;border:1px solid #d1e2d6;border-radius:10px} /* V5.9.54: compact Production Tracker action buttons, retaining existing card layout. */ .home-redesign .home-job-with-stages>.job-actions{min-width:92px;gap:4px} .home-redesign .home-job-with-stages>.job-actions .btn{font-size:11px;line-height:1.2;padding:6px 9px;border-radius:9px;min-height:27px;white-space:nowrap} .home-redesign .home-job-with-stages>.job-actions .pill{font-size:11px;padding:3px 7px} @media(max-width:600px){.home-redesign .home-job-with-stages>.job-actions{gap:5px;justify-content:flex-start}.home-redesign .home-job-with-stages>.job-actions .btn{width:auto;flex:0 1 auto}} /* V5.9.57 compact order tables, accessible click/hover product details. */ .bellife-compact-orders{overflow-x:auto;overflow-y:visible} .bellife-compact-orders>table{width:100%;min-width:830px;table-layout:auto} .bellife-compact-orders>table>tbody>tr>td{vertical-align:middle;overflow:visible;white-space:nowrap;padding:10px 8px} .bellife-compact-orders>table>tbody>tr>td:nth-child(2){white-space:normal;min-width:125px} .bellife-compact-orders>table>thead>tr>th{white-space:nowrap} .bellife-compact-orders .btn{font-size:12px!important;min-height:30px!important;padding:5px 10px!important} .bellife-product-details,.bellife-action-menu{position:relative;display:inline-block} .bellife-product-details>summary,.bellife-action-menu>summary{list-style:none;cursor:pointer;white-space:nowrap} .bellife-product-details>summary::-webkit-details-marker,.bellife-action-menu>summary::-webkit-details-marker{display:none} .bellife-product-panel,.bellife-action-panel{position:absolute;z-index:1000;top:calc(100% + 6px);left:0;background:var(--card,#fff);color:var(--text,#24332b);border:1px solid var(--border,#b5c9bc);border-radius:12px;box-shadow:0 12px 30px #0003;padding:14px} .bellife-product-panel{width:max-content;min-width:440px;max-width:min(780px,calc(100vw - 45px));white-space:normal} .bellife-product-title{display:flex;justify-content:space-between;gap:24px;margin-bottom:10px} .bellife-product-scroll{max-height:min(65vh,560px);overflow:auto} .bellife-product-panel table{width:100%;border-collapse:collapse;font-size:13px} .bellife-product-panel td,.bellife-product-panel th{padding:7px 10px;text-align:left;white-space:nowrap;border-bottom:1px solid #899b9040} .bellife-action-panel{right:0;left:auto;width:210px;display:grid;gap:5px;max-height:65vh;overflow:auto} .bellife-action-panel .btn{width:100%;text-align:left} .bellife-product-details:not([open]):hover>.bellife-product-panel{display:block} html.bellife-dark .bellife-product-panel,html.bellife-dark .bellife-action-panel{background:#252e28;color:#edf4ef;border-color:#56685c} @media(max-width:900px){.bellife-product-panel{position:fixed;top:20vh;left:4vw;right:4vw;max-width:92vw;min-width:0}.bellife-action-panel{right:0}} /* V5.9.57: compact quality-control modal, responsive in both themes */ .bellife-qc-overlay{position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.62);display:flex;align-items:center;justify-content:center;padding:16px} .bellife-qc-modal{box-sizing:border-box;width:min(540px,100%);max-height:calc(100dvh - 32px);overflow:auto;background:var(--card-bg,var(--surface,#fff));color:inherit;border:1px solid var(--border-color,#82988b);border-radius:16px;padding:20px;box-shadow:0 16px 48px rgba(0,0,0,.25)} .bellife-qc-head{display:flex;align-items:start;justify-content:space-between;gap:12px}.bellife-qc-head h3{margin:0 0 5px}.bellife-qc-head small{opacity:.8} .bellife-qc-body{display:grid;gap:10px;margin:18px 0}.bellife-qc-body .quality-line{display:flex;align-items:center;gap:10px;padding:9px 0} .bellife-qc-footer{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap} @media(max-width:520px){.bellife-qc-modal{padding:15px}.bellife-qc-footer .btn{flex:1}} /* V5.9.59: QC popup uses explicit theme colors; avoid inherited pale text on white. */ .bellife-qc-modal{background:#fff;color:#203128;border-color:#cbded0} .bellife-qc-modal .bellife-qc-head h3,.bellife-qc-modal .quality-line{color:#203128} .bellife-qc-modal .bellife-qc-head small{color:#526b5b} .bellife-dark .bellife-qc-modal{background:#252e28!important;color:#edf4ef!important;border-color:#536b59!important} .bellife-dark .bellife-qc-modal .bellife-qc-head h3,.bellife-dark .bellife-qc-modal .quality-line{color:#edf4ef!important} .bellife-dark .bellife-qc-modal .bellife-qc-head small{color:#bac9c0!important} .bellife-dark .bellife-qc-modal input[type=checkbox]{accent-color:#57ad6b} /* DTF tracker modal: adaptive height and mobile-friendly rows. */ .bellife-dtf-modal{box-sizing:border-box;width:min(790px,100%);max-height:calc(100dvh - 32px);overflow:auto;background:#fff;color:#203128;border:1px solid #cbded0;border-radius:16px;padding:20px;box-shadow:0 16px 48px rgba(0,0,0,.25)} .bellife-dark .bellife-dtf-modal{background:#252e28;color:#edf4ef;border-color:#536b59} .bellife-dtf-modal .bellife-qc-head small{color:#617568}.bellife-dark .bellife-dtf-modal .bellife-qc-head small{color:#bac9c0} .bellife-dtf-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:13px 0;border-bottom:1px solid #9caea3;margin-bottom:12px} .bellife-dtf-row label{display:flex;flex-direction:column;gap:5px;min-width:0;font-size:13px;font-weight:600} .bellife-dtf-row label:first-child{grid-column:1/-1} .bellife-dtf-row input,.bellife-dtf-row select{box-sizing:border-box;width:100%;min-width:0} .bellife-dtf-row-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;grid-column:1/-1} .bellife-dtf-total{padding:14px 0;font-weight:600} @media(max-width:520px){.bellife-dtf-modal{padding:14px}.bellife-dtf-row{grid-template-columns:1fr}} /* V5.9.60: Deadline Alert cards are keyboard/touch-accessible priority actions. */ .deadline-priority-action{font:inherit;color:inherit;text-align:left;cursor:pointer;width:100%;border-top:0;border-right:0;border-bottom:0} .deadline-priority-action:focus-visible{outline:2px solid #57ad6b;outline-offset:2px} /* V5.9.62: all production stage circles, including Collected, on one row. Keep the stage controls within their existing panel; scroll horizontally on narrow viewports instead of wrapping the last stage to another line. */ .home-redesign .home-production-stages{ display:grid!important; grid-template-columns:repeat(8,minmax(58px,1fr))!important; grid-template-rows:1fr!important; grid-auto-flow:column!important; gap:3px!important; overflow-x:auto!important; overflow-y:hidden!important; max-width:100%!important; min-width:0!important; padding:2px 0 7px!important; scrollbar-width:thin!important; } .home-redesign .home-production-stages>.home-stage-item{ grid-row:1!important; min-width:0!important; width:100%!important; white-space:nowrap!important; } .home-redesign .home-production-stages .home-stage-name{ white-space:nowrap!important; overflow-wrap:normal!important; font-size:9px!important; } .home-redesign .home-job-with-stages>.home-stage-panel{min-width:0!important} /* V5.9.63: eight stages always fit on one row without a scrollbar. */ .home-redesign .home-production-stages{ grid-template-columns:repeat(8,minmax(0,1fr))!important; grid-auto-flow:row!important; gap:1px!important; overflow:visible!important; scrollbar-width:none!important; padding:2px 0 5px!important; } .home-redesign .home-production-stages::-webkit-scrollbar{display:none!important} .home-redesign .home-production-stages>.home-stage-item{ min-width:0!important; width:100%!important; overflow:visible!important; } .home-redesign .home-production-stages .home-stage-name{ font-size:clamp(7px,.68vw,9px)!important; letter-spacing:-.15px!important; white-space:nowrap!important; } @media(max-width:720px){ .home-redesign .home-production-stages .home-stage-name{font-size:8px!important;letter-spacing:-.25px!important} .home-redesign .home-production-stages .home-stage-circle{width:15px!important;height:15px!important} } /* V5.9.65: nonintrusive production sticker controls and preview */ .bellife-sticker-check{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:10px;color:var(--muted,#a8bcb0);cursor:pointer;min-width:36px} .bellife-sticker-check input{accent-color:#57ad6b;width:17px;height:17px;cursor:pointer} .bellife-sticker-overlay{position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;padding:18px;overflow:auto} .bellife-sticker-dialog{background:#252e28;color:#edf4ef;border:1px solid #4c6353;border-radius:14px;padding:20px;max-width:490px;width:100%;max-height:95vh;overflow:auto} .bellife-sticker-dialog h3{margin:0 0 8px}.bellife-sticker-dialog p,.bellife-sticker-dialog small{color:#bac9c0} .bellife-sticker-preview{background:#fff;border-radius:8px;padding:12px;display:flex;flex-direction:column;gap:9px;margin:12px auto;max-width:320px} .bellife-sticker-preview-label{background:#fff;color:#111;border:2px solid #13803b;border-radius:8px;min-height:125px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:10px;text-align:center} .bellife-sticker-preview-label img{max-width:75%;max-height:58px;object-fit:contain}.bellife-sticker-preview-label strong{font-size:19px}.bellife-sticker-preview-label b{font-size:22px} .bellife-sticker-buttons{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-bottom:10px} /* V5.9.66: compact sticker selection within Printing Orders tables. */ .bellife-orders-sticker-tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0 16px}.bellife-compact-orders td .bellife-sticker-check{min-width:48px}.bellife-compact-orders td .bellife-sticker-check span{font-size:10px} /* Bellife V1.0: QC order summary; no financial fields shown. */ .bellife-qc-modal{width:min(850px,100%)} .bellife-qc-order-card{margin-top:16px;border:1px solid #a3bda8;border-radius:12px;overflow:hidden;background:#f0f6f1;color:#203128} .bellife-qc-customer{padding:12px 15px;display:flex;flex-direction:column;gap:3px;background:#e1ede4} .bellife-qc-customer strong{font-size:18px}.bellife-qc-customer span{font-size:13px} .bellife-qc-order-heading{padding:9px 15px;font-weight:700;background:#d2e8d8;color:#1c6330} .bellife-qc-order-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:16px;padding:13px 15px} .bellife-qc-facts{display:grid;gap:10px}.bellife-qc-facts>div{display:grid;grid-template-columns:105px minmax(0,1fr);gap:8px;font-size:13px;overflow-wrap:anywhere} .bellife-qc-facts span{color:#4a6454}.bellife-qc-breakdown{border-left:1px solid #a3bda8;padding-left:15px;min-width:0} .bellife-qc-breakdown>b{display:block;color:#246c37;margin-bottom:9px}.bellife-qc-item{display:flex;justify-content:space-between;gap:12px;padding:7px 9px;border-radius:7px;background:#e1ede4;margin-top:6px;font-size:13px;overflow-wrap:anywhere} .bellife-qc-item em{font-size:11px}.bellife-qc-item strong{white-space:nowrap} .bellife-qc-checks-title{color:#246c37;margin:18px 0 2px} .bellife-dark .bellife-qc-order-card{background:#202a24;color:#edf4ef;border-color:#536b59} .bellife-dark .bellife-qc-customer,.bellife-dark .bellife-qc-item{background:#303e34;color:#edf4ef} .bellife-dark .bellife-qc-order-heading{background:#344f3d;color:#a6e5b0} .bellife-dark .bellife-qc-facts span{color:#bac9c0} .bellife-dark .bellife-qc-breakdown{border-color:#536b59} .bellife-dark .bellife-qc-breakdown>b,.bellife-dark .bellife-qc-checks-title{color:#a6e5b0} @media(max-width:590px){.bellife-qc-order-grid{grid-template-columns:1fr;gap:12px}.bellife-qc-breakdown{border-left:0;border-top:1px solid #a3bda8;padding:12px 0 0}.bellife-qc-modal{padding:14px}} /* Bellife V1.0: schedule contrast in both modes, preserve compact layout. */ .schedule-box{background:#f0f6f1!important;border:1px solid #8bae92!important;color:#193f26!important} .schedule-box h2{color:#193f26!important;font-weight:750!important} .schedule-box .datebar{background:#e2eee5!important;border:1px solid #a3bda8!important} .schedule-box .datebar>button{background:#d4e8d9!important;color:#245b35!important;border-radius:8px!important;min-width:34px} .schedule-box .date-picker-toggle{background:#fff!important;color:#193f26!important;border:1px solid #a3bda8!important;border-radius:8px!important} .schedule-box .date-today{background:#57ad6b!important;color:#102515!important;border-radius:8px!important;font-weight:700!important} html.bellife-dark .schedule-box{background:#252e28!important;border:1px solid #607b68!important;color:#edf4ef!important} html.bellife-dark .schedule-box h2{color:#edf4ef!important} html.bellife-dark .schedule-box .datebar{background:#2d3b32!important;border:1px solid #506b58!important} html.bellife-dark .schedule-box .datebar>button{background:#38463d!important;color:#edf4ef!important} html.bellife-dark .schedule-box .date-picker-toggle{background:#38463d!important;color:#edf4ef!important;border:1px solid #607b68!important} html.bellife-dark .schedule-box .date-today{background:#57ad6b!important;color:#101c13!important} /* V1.04: Individual-item QC inspection and resumable partial progress. */ .bellife-qc-unit-section{margin-top:16px;padding:13px;border:1px solid var(--border-color,#82988b);border-radius:10px} .bellife-qc-unit-section h4{margin:0 0 5px;color:#57ad6b} .bellife-qc-unit-count{margin:0 0 8px;font-weight:700} .bellife-qc-unit-note{font-size:12px;opacity:.8;margin:6px 0} .bellife-qc-unit-list{max-height:230px;overflow-y:auto;display:grid;gap:6px} .bellife-qc-unit-row{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:7px;background:rgba(125,150,130,.13);font-size:13px} .bellife-qc-unit-row input{accent-color:#57ad6b;flex-shrink:0} .bellife-qc-footer button:disabled{opacity:.45;cursor:not-allowed} /* V1.06: scoped, compact QC item layout. Prevent generic form rules from stretching checkboxes. */ .bellife-qc-modal{overflow-x:hidden!important;max-width:calc(100vw - 24px)} .bellife-qc-unit-section{min-width:0;overflow:hidden;margin-top:12px;padding:12px} .bellife-qc-unit-section h4{margin:0 0 3px} .bellife-qc-unit-count{margin:0 0 7px;font-size:12px} .bellife-qc-unit-list{display:flex!important;flex-direction:column!important;gap:5px!important;max-height:230px;overflow-y:auto!important;overflow-x:hidden!important;min-width:0;width:100%;box-sizing:border-box} .bellife-qc-modal .bellife-qc-unit-row{display:grid!important;grid-template-columns:18px 32px minmax(0,1fr) 30px!important;align-items:center!important;column-gap:9px!important;width:100%!important;max-width:100%!important;min-width:0!important;min-height:34px!important;height:auto!important;box-sizing:border-box!important;margin:0!important;padding:6px 9px!important;border-radius:7px;line-height:1.3!important;cursor:pointer} .bellife-qc-modal .bellife-qc-unit-row input[type="checkbox"],.bellife-qc-modal .quality-line input[type="checkbox"]{display:block!important;position:static!important;appearance:auto!important;width:16px!important;height:16px!important;min-width:16px!important;max-width:16px!important;min-height:16px!important;max-height:16px!important;margin:0!important;padding:0!important;flex:0 0 16px!important;accent-color:#57ad6b;box-shadow:none!important} .bellife-qc-unit-number{font-size:11px;font-weight:700;white-space:nowrap;color:#327c46} .bellife-qc-unit-description{min-width:0!important;overflow-wrap:anywhere!important;word-break:normal!important;font-size:12px!important} .bellife-qc-unit-qty{font-size:11px;white-space:nowrap;text-align:right;font-weight:700} .bellife-qc-modal .bellife-qc-body{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px 14px;margin:8px 0 16px} .bellife-qc-modal .bellife-qc-body .quality-line{display:flex!important;align-items:center!important;gap:8px!important;min-width:0!important;min-height:32px!important;height:auto!important;margin:0!important;padding:5px 0!important;font-size:12px!important;line-height:1.35!important} .bellife-qc-modal .bellife-qc-footer{gap:7px} .bellife-dark .bellife-qc-unit-number{color:#a6e5b0} @media(max-width:600px){.bellife-qc-modal .bellife-qc-body{grid-template-columns:minmax(0,1fr)}.bellife-qc-modal .bellife-qc-unit-row{grid-template-columns:18px 28px minmax(0,1fr) 25px!important;gap:6px!important}.bellife-qc-unit-description{font-size:11px!important}} /* V1.13: neutral charcoal dark surfaces; preserve all light-theme styles. */ html.bellife-dark{--dark-bg:#171D1A;--dark-surface:#252A28;--dark-text:#EDF4EF;--dark-muted:#BAC9C0;--dark-border:#414A44} html.bellife-dark body,html.bellife-dark header,html.bellife-dark nav,html.bellife-dark main,html.bellife-dark .shell{background:#171D1A!important;color:#EDF4EF!important} html.bellife-dark .card,html.bellife-dark .schedule-box,html.bellife-dark .timeline-card,html.bellife-dark .home-redesign .home-widget,html.bellife-dark .home-redesign .job-card,html.bellife-dark .compact-task-card,html.bellife-dark .task-summary>div,html.bellife-dark .bellife-fulfillment,html.bellife-dark .settings-menu-button{background:#252A28!important;border-color:#414A44!important;color:#EDF4EF!important} html.bellife-dark .task-tabs,html.bellife-dark .bottom,html.bellife-dark .datebar,html.bellife-dark .note-action,html.bellife-dark .task-state,html.bellife-dark .compact-note-action,html.bellife-dark .home-redesign .upgraded-job,html.bellife-dark .home-redesign .quick-grid button,html.bellife-dark .shirt-section-tabs button:not(.active),html.bellife-dark .shirt-tools button{background:#343B37!important;border-color:#414A44!important;color:#EDF4EF!important} html.bellife-dark input:not([type="checkbox"]):not([type="radio"]),html.bellife-dark select,html.bellife-dark textarea{background:#343B37!important;border-color:#505A53!important;color:#EDF4EF!important} html.bellife-dark .bellife-qc-modal{background:#252A28!important;color:#EDF4EF!important;border-color:#414A44!important} html.bellife-dark .bellife-qc-order-card{background:#252A28!important;color:#EDF4EF!important;border-color:#414A44!important} html.bellife-dark .bellife-qc-customer,html.bellife-dark .bellife-qc-item,html.bellife-dark .bellife-qc-unit-row{background:#343B37!important;color:#EDF4EF!important} html.bellife-dark .bellife-qc-order-heading{background:#343B37!important;color:#80C991!important} html.bellife-dark .bellife-qc-breakdown{border-color:#414A44!important} html.bellife-dark .bellife-qc-unit-section{background:#252A28!important;border-color:#505A53!important} html.bellife-dark .bellife-qc-breakdown>b,html.bellife-dark .bellife-qc-checks-title,html.bellife-dark .bellife-qc-unit-section h4{color:#80C991!important} html.bellife-dark .bellife-qc-facts span,html.bellife-dark .bellife-qc-head small{color:#BAC9C0!important} html.bellife-dark .bellife-qc-unit-number{color:#80C991!important} html.bellife-dark .bellife-qc-modal .btn.secondary{background:#343B37!important;color:#EDF4EF!important;border-color:#414A44!important} html.bellife-dark .schedule-box .datebar,html.bellife-dark .schedule-box .datebar>button,html.bellife-dark .schedule-box .date-picker-toggle{background:#343B37!important;border-color:#414A44!important;color:#EDF4EF!important} /* V1.14: neutral, print-accurate stickers; customer names never printed. */ .bellife-sticker-preview-label{background:#fff!important;color:#000!important;border:2px solid #008b32!important;min-height:118px!important;gap:7px!important} .bellife-sticker-preview-label b{color:#000!important;font-size:28px!important;font-weight:900!important} .bellife-sticker-logo-row{display:flex;align-items:center;justify-content:center;gap:9px;width:90%} .bellife-sticker-logo-row img{width:70px;max-height:68px;object-fit:contain} .bellife-sticker-logo-row span{height:2px;background:#008b32;flex:1} /* V1.21: Display every individual QC item without a nested scrollbar. The enclosing Quality Control modal remains the sole scrolling surface. */ .bellife-qc-modal .bellife-qc-unit-list{ max-height:none!important; height:auto!important; min-height:0!important; overflow:visible!important; overflow-y:visible!important; overflow-x:visible!important; } .bellife-qc-modal .bellife-qc-unit-section{ height:auto!important; max-height:none!important; overflow:visible!important; } /* V1.22: inline inspection edits, no nested scrolling. */ .bellife-qc-modal .bellife-qc-unit-list{max-height:none!important;overflow:visible!important;height:auto!important} .bellife-qc-edit-row{display:flex!important;align-items:center;gap:8px;min-height:38px} .bellife-qc-edit-row .bellife-qc-unit-description{flex:1;min-width:0} .bellife-qc-edit-row select{width:78px;min-width:65px;padding:5px;font-size:12px} .bellife-qc-edit-row .bellife-qc-remove{padding:6px 9px;font-size:11px;flex-shrink:0} @media(max-width:540px){.bellife-qc-edit-row{flex-wrap:wrap}.bellife-qc-edit-row .bellife-qc-unit-description{flex-basis:65%}} /* V1.23: single-line, tightly packed inspection rows with no nested scrollbar. */ .bellife-qc-modal .bellife-qc-unit-list { display:flex!important; flex-direction:column!important; gap:3px!important; max-height:none!important; height:auto!important; overflow:visible!important; width:100%!important; } .bellife-qc-modal .bellife-qc-unit-row.bellife-qc-edit-row { display:grid!important; grid-template-columns:18px 24px minmax(0,1fr) 66px 27px!important; column-gap:5px!important; row-gap:0!important; padding:3px 6px!important; min-height:31px!important; height:auto!important; width:100%!important; max-width:100%!important; box-sizing:border-box!important; align-items:center!important; flex-wrap:nowrap!important; } .bellife-qc-modal .bellife-qc-edit-row .bellife-qc-unit-description { min-width:0!important; width:auto!important; flex:none!important; font-size:11px!important; line-height:1.15!important; overflow:hidden!important; text-overflow:ellipsis!important; white-space:nowrap!important; } .bellife-qc-modal .bellife-qc-edit-row select { display:block!important; width:66px!important; min-width:0!important; max-width:66px!important; height:27px!important; padding:2px 3px!important; margin:0!important; font-size:11px!important; box-sizing:border-box!important; } .bellife-qc-modal .bellife-qc-edit-row .bellife-qc-remove { display:flex!important; align-items:center!important; justify-content:center!important; width:27px!important; min-width:27px!important; max-width:27px!important; height:27px!important; min-height:27px!important; padding:0!important; margin:0!important; font-size:17px!important; line-height:1!important; border-radius:5px!important; grid-column:5!important; } @media(max-width:540px) { .bellife-qc-modal .bellife-qc-unit-row.bellife-qc-edit-row { grid-template-columns:16px 20px minmax(0,1fr) 59px 25px!important; column-gap:3px!important; padding:3px 4px!important; } .bellife-qc-modal .bellife-qc-edit-row select {width:59px!important;max-width:59px!important} .bellife-qc-modal .bellife-qc-edit-row .bellife-qc-remove {width:25px!important;min-width:25px!important;max-width:25px!important} } /* V1.24 sticker preview: two across, three down; no stretching for empty positions */ .bellife-sticker-preview.bellife-sticker-grid{ display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important; grid-template-rows:repeat(3,1fr)!important;gap:7px!important; max-width:310px!important;aspect-ratio:4/7!important;padding:18px!important; box-sizing:border-box!important; } .bellife-sticker-grid .bellife-sticker-preview-label{ min-width:0!important;min-height:0!important;height:100%!important; padding:5px!important;gap:3px!important;box-sizing:border-box!important; } .bellife-sticker-grid .bellife-sticker-preview-label img{ display:block!important;width:85%!important;max-height:67%!important;object-fit:contain!important; } .bellife-sticker-grid .bellife-sticker-preview-label b{ font-size:clamp(10px,2.8vw,17px)!important;white-space:nowrap!important; } .bellife-sticker-preview-empty{min-width:0;min-height:0} /* V1.25 Calendar review bulk selection */ .printshop-calendar-select-toolbar{display:flex;align-items:center;justify-content:space-between; gap:12px;padding:7px 10px;border-bottom:1px solid var(--border,#dce7dd);} .printshop-calendar-select-toolbar label{display:inline-flex;align-items:center;gap:8px;font-weight:600;cursor:pointer} .printshop-calendar-select-toolbar input{width:17px;height:17px;accent-color:#278346} .printshop-calendar-select-toolbar small{opacity:.8} /* V1.28: fit the long pickup/delivery sidebar label within its normal button. */ @media(min-width:751px){ .shell nav>button{box-sizing:border-box;width:100%;min-width:0;max-width:100%;text-align:left;} .shell nav>button[data-page="Awaiting Pickup / Delivery"]{font-size:11px!important;letter-spacing:-.2px!important;gap:7px!important;padding-left:9px!important;padding-right:7px!important;} .shell nav>button[data-page="Awaiting Pickup / Delivery"] .bellife-icon{width:17px!important;height:17px!important;flex-shrink:0!important;} } .printshop-status-report-options{display:flex;flex-wrap:wrap;gap:10px 22px;margin:12px 0 16px;} .printshop-status-report-options label{display:inline-flex;align-items:center;gap:7px;font-weight:600;font-size:13px;cursor:pointer;} .printshop-status-report-options input{accent-color:#3c9b4e;width:16px;height:16px;} /* V1.30: keep calendar batch actions aligned and wrapping on narrow displays. */ .printshop-calendar-batch-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end} @media(max-width:620px){.printshop-calendar-batch-actions{width:100%;justify-content:flex-start}} .printshop-keep-connected{display:flex;align-items:center;gap:9px;padding:8px 0;font-size:13px;font-weight:600}.printshop-keep-connected input{accent-color:#398a4d;width:17px;height:17px} /* V1.33 Customers filters */ .printshop-contact-filters{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0} .printshop-contact-search-row{display:grid;grid-template-columns:minmax(0,1fr) 170px;gap:12px;align-items:end} .printshop-contact-search-row label{min-width:0} @media(max-width:600px){.printshop-contact-search-row{grid-template-columns:1fr}} /* V1.40: prevent dashboard cards from widening mobile viewport. */ @media(max-width:750px){ html,body{max-width:100%;overflow-x:clip} .shell,main,#app,.view-home,.operations-columns,.operations-columns>section, .home-redesign,.home-widget,.widget-body,.widget-head,.widget-foot{min-width:0!important;max-width:100%;box-sizing:border-box} .operations-columns{display:grid!important;grid-template-columns:minmax(0,1fr)!important} .home-widget{width:100%!important;overflow:hidden} .widget-head,.widget-foot{display:flex;flex-wrap:wrap;gap:8px;align-items:center} .widget-head h3{min-width:0;flex:1 1 140px;font-size:clamp(16px,4.7vw,22px)} .widget-head .bellife-widget-controls{display:flex;gap:5px;align-items:center;flex:0 1 auto;min-width:0} .widget-head .btn,.widget-foot .btn{max-width:100%;white-space:normal;font-size:12px;padding:9px 11px} .deadline-item{width:100%;min-width:0;max-width:100%;box-sizing:border-box;display:grid!important;grid-template-columns:minmax(0,auto) minmax(0,1fr) auto;gap:8px;align-items:center;text-align:left;padding:12px 10px} .deadline-item strong{font-size:clamp(12px,3.7vw,16px);white-space:normal} .deadline-item span{min-width:0;overflow-wrap:anywhere;font-size:clamp(13px,3.8vw,17px)} .deadline-item small{white-space:nowrap;font-size:11px} .widget-foot small{min-width:0;flex:1 1 160px} .widget-body .job-card{min-width:0;max-width:100%;box-sizing:border-box} .widget-body .actions,.widget-body .job-actions{flex-wrap:wrap;max-width:100%} .widget-body .actions button{max-width:100%} .shirt-tab-panel[data-shirt-tab="new"] #googleOrderEditor{min-width:0;max-width:100%} } /* V1.41: compact 2 × 2 sticker preview with full order contents */ .bellife-sticker-preview.bellife-sticker-grid{grid-template-rows:repeat(2,minmax(0,1fr))!important;aspect-ratio:1!important;max-width:340px!important;padding:10px!important} .bellife-sticker-grid .bellife-sticker-preview-label{align-items:stretch!important;justify-content:flex-start!important;text-align:left!important;overflow:hidden!important;gap:3px!important;padding:6px!important} .bellife-sticker-grid .bellife-sticker-preview-label strong{background:#006b2a;color:#fff;font-size:10px;text-align:center;overflow-wrap:anywhere} .bellife-sticker-preview-lines{font-size:8px;line-height:1.15;overflow-wrap:anywhere;color:#111} /* V1.42: task archive navigation, using existing theme button tokens */ .printshop-task-history-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.printshop-completed-task-row{gap:12px}.printshop-completed-task-row small{display:block;margin-top:4px} /* V1.46 compact order and awaiting-pickup controls */ .printshop-inline-toggle{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:9px!important;margin:8px 0!important;} .printshop-inline-toggle input[type=checkbox]{width:18px!important;height:18px!important;flex:0 0 18px!important;margin:0!important;} #orderEditor .btn,.printshop-awaiting-view .btn{font-size:12px!important;line-height:1.2!important;padding:8px 11px!important;min-height:32px!important;border-radius:9px!important;} .printshop-awaiting-view .actions{gap:5px!important;flex-wrap:wrap;} .printshop-awaiting-view td{padding:8px 6px!important;} .printshop-awaiting-view .printshop-awaiting-sticker-check{width:18px!important;height:18px!important;margin:0!important;accent-color:#2e8449;} .printshop-awaiting-batch{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0 14px;} .printshop-awaiting-batch[hidden]{display:none!important;} .printshop-awaiting-batch strong{font-size:12px;color:#276b3c;} /* V1.49: production toolbar stays on a single scrollable row. */ .home-redesign .production-order-toolbar{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;justify-content:flex-start!important;align-items:center!important;gap:7px!important;overflow-x:auto!important;overflow-y:hidden!important;white-space:nowrap!important;-webkit-overflow-scrolling:touch;padding:8px 12px!important} .home-redesign .production-order-toolbar > *{flex:0 0 auto!important;white-space:nowrap!important} .home-redesign .production-order-toolbar .btn{font-size:11px!important;min-height:29px!important;padding:5px 9px!important} .home-redesign .production-order-toolbar .compact-select{font-size:11px!important;white-space:nowrap!important} /* V1.52 — approved Option 3 progress-bar card; retain existing production controls */ .home-redesign .home-job-with-stages>.home-stage-panel{ min-width:0!important;overflow:hidden!important; } .home-redesign .home-stage-panel .ps-progress-heading{ display:flex;justify-content:space-between;align-items:center;gap:10px; margin:0 0 7px;font-size:12px;line-height:1.4; color:var(--text,#edf4ef); } .home-redesign .home-stage-panel .ps-progress-heading span{white-space:nowrap;font-size:11px} .home-redesign .home-stage-panel .ps-progress-track{ height:9px;border-radius:999px;background:rgba(125,150,130,.25); overflow:hidden;margin-bottom:12px; } .home-redesign .home-stage-panel .ps-progress-fill{ height:100%;border-radius:999px;background:#72d889; transition:width .18s ease; } .home-redesign .home-production-stages{ display:flex!important;flex-wrap:nowrap!important;gap:12px!important; overflow-x:auto!important;overflow-y:hidden!important; padding:3px 2px 12px!important;scrollbar-width:thin!important; grid-template-columns:none!important; } .home-redesign .home-production-stages>.home-stage-item{ flex:0 0 78px!important;width:78px!important;min-width:78px!important; white-space:normal!important;align-self:flex-start!important; } .home-redesign .home-production-stages .home-stage-name{ max-width:78px!important;white-space:normal!important; overflow-wrap:normal!important;word-break:normal!important; font-size:11px!important;line-height:1.22!important;letter-spacing:0!important; color:var(--text,#edf4ef)!important; } .home-redesign .home-production-stages .home-stage-circle{ width:19px!important;height:19px!important; } html.bellife-dark .home-redesign .ps-progress-heading{color:#EDF4EF} html:not(.bellife-dark) .home-redesign .ps-progress-heading{color:#173d26} @media(max-width:720px){ .home-redesign .home-production-stages>.home-stage-item{ flex-basis:82px!important;width:82px!important;min-width:82px!important; } .home-redesign .home-production-stages .home-stage-name{font-size:11px!important} } /* V1.53 — widen Production Tracker, compact Deadline Alerts; no desktop stage scrollbar */ @media (min-width:1200px){ .operations-columns.home-redesign{grid-template-columns:minmax(0,7fr) minmax(300px,3fr)!important;gap:14px!important} .operations-columns.home-redesign>section{min-width:0!important} .home-redesign .home-job-with-stages{grid-template-columns:52px minmax(170px,1.15fr) minmax(0,3.1fr) 92px!important;gap:10px!important} .home-redesign .home-job-with-stages>.job-actions{grid-column:4!important;grid-row:1!important;flex-direction:column!important} .home-redesign .home-job-with-stages>.home-stage-panel{grid-column:3!important;grid-row:1!important} .home-redesign .home-production-stages{display:grid!important;grid-template-columns:repeat(8,minmax(0,1fr))!important;gap:3px!important;overflow-x:hidden!important;overflow-y:visible!important;scrollbar-width:none!important;padding-bottom:6px!important} .home-redesign .home-production-stages>.home-stage-item{width:auto!important;min-width:0!important;flex:none!important} .home-redesign .home-production-stages .home-stage-name{max-width:100%!important;font-size:10px!important;line-height:1.2!important;white-space:normal!important;overflow-wrap:normal!important;word-break:normal!important} .home-redesign .deadline-widget .widget-body{padding:11px!important} .home-redesign .deadline-widget .deadline-item{padding:9px 10px!important;gap:6px!important;margin-bottom:6px!important;font-size:12px!important} .home-redesign .deadline-widget .deadline-item small{font-size:11px!important} .home-redesign .deadline-widget .widget-head{padding:11px 12px!important} .home-redesign .deadline-widget .widget-head h3{font-size:15px!important} .home-redesign .quick-widget .quick-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;flex-wrap:wrap!important;overflow:visible!important} .home-redesign .quick-widget .quick-grid button{min-width:0!important} } @media (min-width:900px) and (max-width:1199px){ .operations-columns.home-redesign{grid-template-columns:minmax(0,1fr)!important} } /* V1.54: approved clean split row. Explicit grid placement fixes vertical misalignment. */ @media (min-width:1000px){ .operations-columns.home-redesign{grid-template-columns:minmax(0,7fr) minmax(270px,3fr)!important} .home-redesign .home-job-with-stages{ display:grid!important;grid-template-columns:70px minmax(170px,1.1fr) minmax(0,3.5fr) 94px!important; grid-template-rows:auto!important;align-items:center!important;column-gap:12px!important; min-height:154px!important;padding:16px 12px 16px 34px!important; } .home-redesign .home-job-with-stages>.job-avatar{grid-column:1!important;grid-row:1!important;align-self:center!important} .home-redesign .home-job-with-stages>.job-info{grid-column:2!important;grid-row:1!important;align-self:center!important;min-width:0!important} .home-redesign .home-job-with-stages>.home-stage-panel{grid-column:3!important;grid-row:1!important;align-self:center!important;min-width:0!important;overflow:visible!important} .home-redesign .home-job-with-stages>.job-actions{grid-column:4!important;grid-row:1!important;align-self:center!important;min-width:0!important} .home-redesign .home-production-stages{display:grid!important;grid-template-columns:repeat(8,minmax(0,1fr))!important;gap:3px!important;overflow:visible!important;padding:4px 0 8px!important} .home-redesign .home-production-stages>.home-stage-item{min-width:0!important;width:100%!important;flex:none!important} .home-redesign .home-production-stages .home-stage-name{max-width:100%!important;font-size:10px!important;line-height:1.25!important;overflow-wrap:normal!important;word-break:normal!important} .home-redesign .home-stage-panel .ps-progress-track{margin-bottom:12px!important} } @media(min-width:1000px) and (max-width:1350px){ .home-redesign .home-job-with-stages{grid-template-columns:50px minmax(125px,1fr) minmax(0,3.6fr) 76px!important;gap:7px!important} .home-redesign .home-production-stages .home-stage-name{font-size:9px!important} .home-redesign .home-job-with-stages>.job-actions .btn{font-size:10px!important;padding:5px 5px!important} } @media(max-width:999px){ .home-redesign .home-job-with-stages{grid-template-columns:54px minmax(0,1fr) 90px!important;grid-template-rows:auto auto!important;gap:8px!important;align-items:center!important} .home-redesign .home-job-with-stages>.job-avatar{grid-column:1!important;grid-row:1!important} .home-redesign .home-job-with-stages>.job-info{grid-column:2!important;grid-row:1!important} .home-redesign .home-job-with-stages>.job-actions{grid-column:3!important;grid-row:1!important;flex-direction:column!important} .home-redesign .home-job-with-stages>.home-stage-panel{grid-column:1/-1!important;grid-row:2!important;width:100%!important} } /* V1.55: Sticker selection directly beside customer name, not separate grid cell. */ .home-redesign .home-job-with-stages .printshop-customer-sticker-row{display:flex;align-items:center;flex-wrap:wrap;gap:9px;min-width:0} .home-redesign .home-job-with-stages .printshop-customer-sticker-row>b{min-width:0;overflow-wrap:anywhere} .home-redesign .home-job-with-stages .printshop-customer-sticker-row>.bellife-sticker-check{display:inline-flex!important;flex-direction:row!important;align-items:center!important;gap:5px!important;min-width:0!important;width:auto!important;margin:0!important;white-space:nowrap!important;font-size:11px!important;line-height:1.2!important;color:inherit!important;grid-column:auto!important;grid-row:auto!important;position:static!important} .home-redesign .home-job-with-stages .printshop-customer-sticker-row>.bellife-sticker-check input{width:15px!important;height:15px!important;margin:0!important;flex-shrink:0} .home-redesign .home-job-with-stages .printshop-customer-sticker-row>.bellife-sticker-check span{font-size:11px!important;line-height:1.2!important} /* V1.57: one large dynamic title, one continuous progress bar, no added rows */ .home-redesign .home-stage-panel .ps-progress-heading{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;min-width:0!important;margin:0 0 5px!important;white-space:nowrap!important} .home-redesign .home-stage-panel .ps-progress-heading .ps-current-stage{display:block!important;flex:1 1 auto!important;min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;font-size:clamp(14px,1.25vw,19px)!important;font-weight:800!important;line-height:1.2!important;color:#75df96!important} .home-redesign .home-stage-panel .ps-progress-heading span{flex:0 0 auto!important;white-space:nowrap!important;font-size:11px!important} .home-redesign .home-stage-panel .ps-progress-track{width:100%!important;max-width:none!important;margin-bottom:8px!important} .home-redesign .home-stage-panel .home-production-stages{margin-top:0!important} /* V1.58 Sticker Manager — print dimensions are physical inches. */ .ps-sticker-controls{display:flex;align-items:end;gap:12px;flex-wrap:wrap} .ps-sticker-controls label{flex:1;min-width:180px} .ps-sticker-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:7px;margin-top:12px} .ps-sticker-list label{display:flex;align-items:center;gap:8px;padding:10px;border:1px solid #a7c8b2;border-radius:8px} .ps-sticker-list label span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .ps-sticker-preview{overflow:auto;background:#dce5de;padding:14px} .ps-print-sheet{box-sizing:border-box;width:4in;height:7in;background:white;padding:.28in .35in;display:flex;flex-direction:column;justify-content:flex-start;gap:.1in;margin:auto;box-shadow:0 2px 10px #0002} .ps-print-label{box-sizing:border-box;position:relative;flex:none;width:3.3in;height:1.8in;overflow:hidden;border:2px solid #07802e;border-radius:13px;background:#fff;color:#111;font-family:Arial,sans-serif;padding:8px 8px 5px} .ps-label-top{height:31px;display:flex;align-items:flex-start;justify-content:space-between;gap:4px} .ps-label-brand{font-size:17px;font-weight:900;font-style:italic;color:#08662d;line-height:.9} .ps-label-brand small{display:block;font-size:5.8px;color:#151515;font-style:normal;letter-spacing:.2px;margin-top:3px} .ps-label-order{font-size:12px;white-space:nowrap;background:#08772d;color:white;border-radius:12px;padding:5px 8px} .ps-label-rush{font-size:9px;white-space:nowrap;background:#111;color:white;border-radius:10px;padding:6px 5px} .ps-label-content{display:flex;gap:5px;height:calc(100% - 34px)} .ps-label-details{flex:1;min-width:0;font-size:9px;line-height:1.17;font-weight:600;overflow:hidden;overflow-wrap:anywhere} .ps-label-item{font-weight:800;margin-bottom:3px} .ps-label-fact{margin-top:3px} .ps-label-social{width:89px;flex:none;border-left:1px solid #07802e;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#08662d;font-size:10px;font-style:italic} .ps-label-social img{width:76px;height:76px;object-fit:contain;image-rendering:auto} .ps-label-swoosh{position:absolute;bottom:2px;right:5px;width:45%;height:4px;border-radius:90% 30%;background:#079032;transform:skewX(-20deg)} html:not(.bellife-dark) .home-redesign .ps-progress-heading .ps-current-stage{color:#167A3A!important} @media print{ @page{size:4in 7in;margin:0} html,body{width:4in;margin:0!important;padding:0!important;background:#fff!important} .ps-print-sheet{break-after:page;page-break-after:always;box-shadow:none!important;margin:0!important} .ps-print-sheet:last-child{break-after:auto;page-break-after:auto} } /* V1.60: wider cards and full customer names. */ .ps-sticker-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px} .ps-sticker-list label{min-width:0;min-height:58px;align-items:center;flex-wrap:wrap} .ps-sticker-list label input{flex:none} .ps-sticker-list label b{white-space:nowrap;flex:none} .ps-sticker-list label span{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;min-width:0;flex:1} @media(max-width:850px){.ps-sticker-list{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:540px){.ps-sticker-list{grid-template-columns:minmax(0,1fr)}} /* V1.61 Sticker Editor and theme presets */ .ps-sticker-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:15px} .ps-editor-layout{display:grid;grid-template-columns:minmax(220px,1fr) minmax(220px,1fr) minmax(350px,1.4fr);gap:14px;align-items:start} .ps-editor-panel{padding:14px;border:1px solid #a5cbb2;border-radius:12px;min-width:0} .ps-editor-panel label{display:block;margin:10px 0;font-weight:600} .ps-editor-panel input:not([type=checkbox]):not([type=radio]){width:100%;box-sizing:border-box;max-width:100%;margin-top:4px} .ps-editor-panel input[type=checkbox],.ps-editor-panel input[type=radio]{margin-right:8px} .ps-editor-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px} .ps-theme-list{display:grid;gap:9px} .ps-theme-choice{display:flex;align-items:center;text-align:left;gap:12px;background:transparent;border:1px solid #b7c8bc;border-radius:9px;padding:8px;cursor:pointer;color:inherit} .ps-theme-choice.active{border:2px solid #18833b;background:#e8f5eb;color:#134b26} .ps-theme-swatch{display:inline-block;flex:none;width:88px;height:38px;border-radius:7px;border:2px solid var(--ps-accent);background:linear-gradient(160deg,var(--ps-bg) 60%,var(--ps-accent) 60%)} .ps-theme-classic{--ps-accent:#07802e;--ps-bg:#fff;--ps-text:#111;--ps-head:#08662d;--ps-badge:#08772d;--ps-badge-text:#fff} .ps-theme-black{--ps-accent:#60c85b;--ps-bg:#161a17;--ps-text:#fff;--ps-head:#9cf28b;--ps-badge:#398b3c;--ps-badge-text:#fff} .ps-theme-blue{--ps-accent:#1389d2;--ps-bg:#f4faff;--ps-text:#14283a;--ps-head:#095b9d;--ps-badge:#096db6;--ps-badge-text:#fff} .ps-theme-red{--ps-accent:#d82731;--ps-bg:#fff;--ps-text:#161616;--ps-head:#ba202b;--ps-badge:#161616;--ps-badge-text:#fff} .ps-theme-purple{--ps-accent:#e6b836;--ps-bg:#371450;--ps-text:#fff;--ps-head:#ffdb66;--ps-badge:#d9a51f;--ps-badge-text:#251333} .ps-print-label{border-color:var(--ps-accent,#07802e);background:var(--ps-bg,#fff);color:var(--ps-text,#111)} .ps-print-label.ps-square{border-radius:0} .ps-print-label .ps-label-brand{color:var(--ps-head,#08662d)} .ps-print-label .ps-label-brand small{color:var(--ps-text,#111)} .ps-print-label .ps-label-order{background:var(--ps-badge,#08772d);color:var(--ps-badge-text,#fff)} .ps-print-label .ps-label-social{border-left-color:var(--ps-accent,#07802e);color:var(--ps-head,#08662d)} .ps-print-label .ps-label-swoosh{background:var(--ps-accent,#07802e)} .ps-brand-logo{max-width:125px;max-height:30px;object-fit:contain} @media(max-width:1100px){.ps-editor-layout{grid-template-columns:repeat(2,minmax(0,1fr))}.ps-editor-layout>:last-child{grid-column:1/-1}} @media(max-width:650px){.ps-editor-layout{grid-template-columns:minmax(0,1fr)}.ps-editor-layout>:last-child{grid-column:auto}} /* V1.62: premium reference template, QC readability, conditional import. */ .ps-theme-premium{--ps-accent:#087c22;--ps-bg:#fff;--ps-text:#101010;--ps-head:#075f21;--ps-badge:#087c22;--ps-badge-text:#fff} .ps-theme-premium .ps-label-brand{font-weight:950;letter-spacing:-.6px;font-size:18px} .ps-theme-premium .ps-label-content{gap:6px} .ps-theme-premium .ps-label-details{font-size:9.5px;line-height:1.19} .ps-theme-premium .ps-label-item{margin-bottom:5px} .ps-theme-premium .ps-label-swoosh{height:6px;width:62%;bottom:1px;right:3px;border-radius:100% 0 100% 0;transform:skewX(-24deg)} .ps-theme-premium .ps-label-social{font-weight:900} .ps-product-icon,.ps-fact-icon{display:inline-block;min-width:12px;color:#087c22;font-weight:900} .ps-import-shirt-lines[hidden]{display:none!important} .bellife-qc-modal .bellife-qc-body .quality-line{font-size:16px!important;line-height:1.4!important;min-height:40px!important} .bellife-qc-modal .bellife-qc-unit-description{font-size:15px!important;line-height:1.35!important} .bellife-qc-modal .bellife-qc-footer .btn{font-size:15px!important} .bellife-qc-modal .bellife-qc-edit-row select{font-size:15px!important} @media(max-width:600px){.bellife-qc-modal .bellife-qc-body .quality-line{font-size:15px!important}.bellife-qc-modal .bellife-qc-unit-description{font-size:14px!important}} /* V1.63: Sticker Editor uses PrintShop's existing green headers and compact controls. */ .ps-sticker-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px} .ps-editor-layout{display:grid;grid-template-columns:minmax(250px,1fr) minmax(245px,1fr) minmax(350px,1.35fr);gap:12px;align-items:start} .ps-editor-panel{padding:0 12px 14px;border:1px solid var(--line,#a5cbb2);border-radius:12px;min-width:0;overflow:hidden;background:var(--card,#fff);color:inherit} .ps-editor-panel .ps-editor-heading{margin:0 -12px 12px;padding:12px 14px;background:#08652e;color:white;font-size:17px;font-weight:750;line-height:1.3} .ps-editor-panel>label{display:block;margin:10px 0 5px;font-size:13px;font-weight:650} .ps-editor-panel input:not([type=checkbox]):not([type=radio]){width:100%;min-width:0;box-sizing:border-box;margin-top:5px;border-radius:8px;min-height:38px} .ps-editor-panel input[type=file]{padding:7px;max-width:100%;font-size:12px} .ps-editor-panel .ps-editor-choice{display:flex;align-items:center;gap:8px;margin:9px 0;font-weight:600} .ps-editor-panel .ps-editor-choice input{margin:0;flex:none;accent-color:#13863d} .ps-editor-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px} .ps-editor-actions .btn{min-height:38px;border-radius:9px} .ps-theme-list{display:flex;flex-direction:column;gap:8px} .ps-theme-choice{width:100%;min-height:51px;display:flex;align-items:center;text-align:left;gap:10px;background:transparent;border:1px solid #aec7b5;border-radius:9px;padding:7px 10px;cursor:pointer;color:inherit;font-size:13px} .ps-theme-choice b{flex:1;min-width:0} .ps-theme-choice.active{border:2px solid #16803b;background:rgba(39,169,83,.12);color:inherit} .ps-theme-radio{font-size:20px;line-height:1;color:#187c39} .ps-editor-panel .ps-sticker-preview{overflow:auto;max-width:100%;padding:12px;background:#e3ebe5} .ps-sticker-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px} .ps-sticker-list label{display:flex;align-items:center;flex-wrap:nowrap;gap:9px;min-height:42px;padding:6px 10px;box-sizing:border-box;line-height:1.3} .ps-sticker-list label input[type=checkbox]{flex:0 0 auto;margin:0;width:16px;height:16px;accent-color:#198441} .ps-sticker-list label b{flex:0 0 auto;white-space:nowrap;font-size:13px} .ps-sticker-list label span{flex:1;min-width:0;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;font-size:13px} .ps-sticker-list label small{flex:none} @media(max-width:1120px){.ps-editor-layout{grid-template-columns:repeat(2,minmax(0,1fr))}.ps-editor-layout>.ps-editor-panel:last-child{grid-column:1/-1}} @media(max-width:760px){.ps-editor-layout{grid-template-columns:minmax(0,1fr)}.ps-editor-layout>.ps-editor-panel:last-child{grid-column:auto}.ps-sticker-list{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:520px){.ps-sticker-list{grid-template-columns:minmax(0,1fr)}} /* V1.65: isolated Labels editor; prevent global form/label rules from splitting controls. */ .ps165-editor{grid-template-columns:minmax(280px,1fr) minmax(270px,1fr) minmax(390px,1.35fr);gap:12px;align-items:start} .ps165-editor .ps-editor-panel{min-width:0;overflow:hidden} .ps165-editor .ps165-form{display:flex;flex-direction:column;gap:11px;min-width:0} .ps165-editor .ps165-form h4{margin:8px 0 0} .ps165-editor .ps165-field{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:4px!important;min-width:0!important;width:100%!important;margin:0!important;font-size:13px!important} .ps165-editor .ps165-field input,.ps165-editor .ps165-field select,.ps165-editor .ps165-url{display:block!important;position:static!important;min-width:0!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important;margin:0!important} .ps165-editor .ps165-choice{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;min-width:0!important;width:100%!important;margin:0!important;padding:3px 0!important;line-height:1.35!important;white-space:normal!important;font-size:14px!important} .ps165-editor .ps165-choice input[type=radio],.ps165-editor .ps165-choice input[type=checkbox]{display:inline-block!important;position:static!important;appearance:auto!important;flex:0 0 17px!important;width:17px!important;height:17px!important;min-width:17px!important;margin:0!important;padding:0!important;accent-color:#13863d!important} .ps165-editor .ps165-choice span{display:inline!important;position:static!important;flex:1 1 auto!important;min-width:0!important;overflow-wrap:anywhere!important} .ps165-editor .ps165-inline{display:grid;grid-template-columns:1fr 1fr;gap:9px;min-width:0} .ps165-editor .ps165-inline label{display:flex!important;flex-direction:column!important;gap:4px!important;min-width:0!important;margin:0!important;font-size:12px!important} .ps165-editor .ps165-inline input{width:100%!important;min-width:0!important;max-width:100%!important;box-sizing:border-box!important} .ps165-editor .ps-sticker-preview{overflow:auto;max-width:100%;padding:12px;background:#e3ebe5} .ps-label-render-preview{display:flex;align-items:flex-start;justify-content:center;min-height:80px;overflow:auto;color:#153e26} .ps-label-render-preview img{display:block;width:min(100%,4in);height:auto;aspect-ratio:4/7;object-fit:contain;box-shadow:0 2px 9px #0002;background:white} .ps165-editor .ps-theme-choice{min-width:0} .ps165-editor .ps-theme-choice b{overflow-wrap:anywhere} @media(max-width:1170px){.ps165-editor{grid-template-columns:repeat(2,minmax(0,1fr))}.ps165-editor .ps-editor-panel:last-child{grid-column:1/-1}} @media(max-width:700px){.ps165-editor{grid-template-columns:minmax(0,1fr)}.ps165-editor .ps-editor-panel:last-child{grid-column:auto}} /* Production Tracker: keep checkbox, title, metadata icons aligned in compact rows. */ .home-redesign .home-job-with-stages .printshop-customer-sticker-row{display:flex!important;flex-direction:row!important;align-items:center!important;gap:8px!important;flex-wrap:wrap!important;line-height:1.25!important} .home-redesign .home-job-with-stages .printshop-customer-sticker-row>b{line-height:1.25!important} .home-redesign .home-job-with-stages .printshop-customer-sticker-row>.bellife-sticker-check{display:inline-flex!important;align-items:center!important;gap:5px!important;line-height:1.25!important;white-space:nowrap!important;margin:0!important} .home-redesign .home-job-with-stages .job-info small{line-height:1.65!important;vertical-align:middle!important} .home-redesign .home-job-with-stages .job-info small svg{display:inline-block!important;width:13px!important;height:13px!important;vertical-align:-2px!important;margin:0 3px!important} .home-redesign .home-job-with-stages .job-tags{display:flex!important;align-items:center!important;gap:5px!important;flex-wrap:wrap!important} /* V1.67: Four premium-only label templates. */ .ps-theme-wave{border-color:#087c2b!important;background:linear-gradient(160deg,#e9ffe9 0%,#fff 19%,#fff 80%,#d6f6dc 100%)!important} .ps-theme-wave:before{content:"";position:absolute;top:0;left:0;width:42%;height:9px;background:linear-gradient(90deg,#086a26,#48df14,#111);border-radius:80% 0 80% 0;pointer-events:none} .ps-theme-wave .ps-label-swoosh{height:10px;width:65%;background:linear-gradient(110deg,#0a6d29,#51ec1c,#065e25);transform:skewX(-24deg)} .ps-theme-hex{border-color:#08752c!important;background:repeating-linear-gradient(60deg,#fff 0 14px,#f2f6f2 14px 16px)!important} .ps-theme-hex .ps-label-order{background:#111!important;border:2px solid #21b44b!important;border-radius:3px!important} .ps-theme-hex .ps-label-swoosh{height:7px;width:68%;background:linear-gradient(90deg,#111,#11b943,#111);transform:none} .ps-theme-brush{border-color:#087c2b!important;background:#fff!important} .ps-theme-brush:before{content:"";position:absolute;top:2px;left:3px;width:42%;height:7px;background:linear-gradient(90deg,#151515,#1ba940,transparent);transform:skewY(-3deg);pointer-events:none} .ps-theme-brush .ps-label-order{border-radius:4px 16px 3px 14px!important;transform:skewX(-8deg)} .ps-theme-brush .ps-label-swoosh{height:12px;width:62%;background:linear-gradient(90deg,transparent,#1fe04c,#111);transform:skewY(-7deg)} /* V1.68 compact Printing Orders navigation */ .bellife-print-nav-v168{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto;gap:7px;scrollbar-width:thin;padding:4px 0 8px} .bellife-print-nav-v168 .btn{display:flex;flex:0 0 auto;min-width:104px;max-width:132px;min-height:57px;padding:7px 10px;align-items:center;justify-content:center;flex-direction:column;gap:4px;text-align:center;white-space:normal;font-size:12px;line-height:1.2} .bellife-print-nav-v168 .bellife-icon{width:18px;height:18px;flex:none} .ps-payment-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0} .ps-payment-stats>div{border:1px solid #bfdac8;border-radius:8px;padding:10px;display:flex;flex-direction:column;gap:6px} #ps-payment-overlay .bellife-qc-modal{max-width:540px;width:min(94vw,540px)} #ps-payment-overlay label{display:block;margin:10px 0} #ps-payment-overlay input,#ps-payment-overlay select{width:100%;margin-top:4px} @media(max-width:520px){.ps-payment-stats{grid-template-columns:1fr}} /* V1.99 — responsive Home Production Tracker; preserves job actions and stage handlers. */ @media(max-width:720px){ .home-redesign .home-job-with-stages{ display:grid!important;grid-template-columns:minmax(0,1fr)!important; grid-template-rows:auto auto auto auto!important;gap:10px!important; padding:15px 12px 14px 34px!important;min-width:0!important; align-items:stretch!important;overflow:hidden!important; } .home-redesign .home-job-with-stages>.production-drag-controls{position:absolute!important;left:5px!important;top:50%!important;transform:translateY(-50%);z-index:1} .home-redesign .home-job-with-stages>.job-avatar{grid-column:1!important;grid-row:1!important;position:absolute!important;left:12px;top:14px;width:44px;height:44px} .home-redesign .home-job-with-stages>.job-info{grid-column:1!important;grid-row:1!important;min-width:0!important;max-width:100%!important;padding-left:48px!important;align-items:stretch!important;overflow-wrap:anywhere!important} .home-redesign .home-job-with-stages .printshop-customer-sticker-row{display:flex!important;align-items:center!important;flex-wrap:wrap!important;gap:6px!important;min-width:0!important} .home-redesign .home-job-with-stages .printshop-customer-sticker-row b{font-size:16px!important;line-height:1.3!important;overflow-wrap:anywhere!important} .home-redesign .home-job-with-stages .job-tags{display:flex!important;flex-wrap:wrap!important;gap:5px!important;max-width:100%!important} .home-redesign .home-job-with-stages .job-info small{display:block!important;width:100%!important;max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere!important;line-height:1.45!important;font-size:12px!important} .home-redesign .home-job-with-stages>.job-actions{grid-column:1!important;grid-row:2!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;align-items:stretch!important;justify-content:stretch!important;gap:7px!important;min-width:0!important;width:100%!important} .home-redesign .home-job-with-stages>.job-actions>.job-stage-badge{grid-column:1/-1!important;justify-self:start!important;max-width:100%!important;white-space:normal!important} .home-redesign .home-job-with-stages>.job-actions>.btn{min-width:0!important;width:100%!important;min-height:39px!important;white-space:normal!important;overflow-wrap:anywhere!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;font-size:12px!important;padding:8px 6px!important} .home-redesign .home-job-with-stages>.job-actions>.btn:nth-child(n+4):last-child{grid-column:1/-1!important} .home-redesign .home-job-with-stages>.home-stage-panel{grid-column:1!important;grid-row:3!important;min-width:0!important;width:100%!important;max-width:100%!important;overflow:hidden!important;border-top:1px solid rgba(60,110,70,.14);padding-top:10px} .home-redesign .home-job-with-stages .ps-progress-heading{display:flex!important;justify-content:space-between!important;flex-wrap:wrap!important;gap:4px!important} .home-redesign .home-job-with-stages .home-production-stages{display:flex!important;grid-template-columns:none!important;flex-wrap:nowrap!important;gap:7px!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:thin!important;-webkit-overflow-scrolling:touch;padding:8px 0 11px!important;max-width:100%!important} .home-redesign .home-job-with-stages .home-stage-item{flex:0 0 76px!important;width:76px!important;min-width:76px!important;max-width:76px!important;gap:5px!important} .home-redesign .home-job-with-stages .home-stage-name{white-space:normal!important;overflow-wrap:break-word!important;word-break:normal!important;font-size:10px!important;line-height:1.2!important;max-width:76px!important;color:#365345!important;opacity:1!important} html.bellife-dark .home-redesign .home-job-with-stages .home-stage-name{color:#EDF4EF!important} } @media(max-width:390px){ .home-redesign .home-job-with-stages>.job-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important} .home-redesign .home-job-with-stages .home-stage-item{flex-basis:68px!important;width:68px!important;min-width:68px!important} } /* V2.02 shirt icon preview */ .shirt-peek-trigger{cursor:pointer;border:0;display:flex;align-items:center;justify-content:center} .shirt-peek-trigger:focus-visible{outline:3px solid #258e4c;outline-offset:3px} .shirt-peek{position:fixed;z-index:2147483000;left:12px;top:12px;width:min(340px,calc(100vw - 24px));max-height:70vh;overflow:auto;background:white;color:#173629;border:1px solid #c6ddcc;border-radius:14px;box-shadow:0 12px 36px #0003;padding:14px;text-align:left;font-size:14px;line-height:1.5} .shirt-peek-head{display:flex;justify-content:space-between;gap:12px;align-items:center;border-bottom:1px solid #dce9df;padding-bottom:8px} .shirt-peek-head button{border:0;background:transparent;color:inherit;font-size:25px;cursor:pointer} .shirt-peek-line{padding:9px 0;border-bottom:1px solid #e3ede5} .shirt-peek-line strong{display:block;margin-bottom:3px} .shirt-peek-notes{padding-top:10px}.shirt-peek-notes p{margin:5px 0 0;white-space:pre-wrap;overflow-wrap:anywhere} @media(max-width:700px){.shirt-peek{left:50%;top:50%;transform:translate(-50%,-50%);width:min(360px,calc(100vw - 28px));max-height:75dvh}} body.dark .shirt-peek,.dark-mode .shirt-peek,[data-theme="dark"] .shirt-peek{background:#252e28;color:#edf4ef;border-color:#506958} /* V2.08: keep Production Tracker action buttons fully inside their job card. Uses card width (not device width) to prevent sidebar clipping. */ .home-redesign .home-job-with-stages {container-type:inline-size;} .home-redesign .home-job-with-stages>.job-actions { min-width:0!important;max-width:100%!important;box-sizing:border-box!important; } .home-redesign .home-job-with-stages>.job-actions>.btn, .home-redesign .home-job-with-stages>.job-actions>button { box-sizing:border-box!important;min-width:0!important;max-width:100%!important; white-space:normal!important;overflow-wrap:anywhere!important; line-height:1.25!important;text-align:center!important; } @media(min-width:721px){ .home-redesign .home-job-with-stages { grid-template-columns:48px minmax(110px,1fr) minmax(0,2fr) minmax(125px,150px)!important; max-width:100%!important;box-sizing:border-box!important; } .home-redesign .home-job-with-stages>.job-actions { grid-column:4!important;grid-row:1!important;display:flex!important; flex-direction:column!important;align-items:stretch!important;gap:6px!important; width:100%!important; } .home-redesign .home-job-with-stages>.job-actions>.btn {width:100%!important;padding:8px 6px!important;min-height:34px!important;font-size:11px!important;} } @media(min-width:721px) and (max-width:1250px){ .home-redesign .home-job-with-stages { grid-template-columns:44px minmax(0,1fr) minmax(120px,1fr)!important; grid-template-rows:auto auto!important; } .home-redesign .home-job-with-stages>.job-avatar{grid-column:1!important;grid-row:1!important} .home-redesign .home-job-with-stages>.job-info{grid-column:2!important;grid-row:1!important} .home-redesign .home-job-with-stages>.home-stage-panel{grid-column:1/3!important;grid-row:2!important;min-width:0!important} .home-redesign .home-job-with-stages>.job-actions{grid-column:3!important;grid-row:1/3!important} } @media(max-width:720px){ .home-redesign .home-job-with-stages>.job-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;} .home-redesign .home-job-with-stages>.job-actions>.btn{width:100%!important;min-height:38px!important;} .home-redesign .home-job-with-stages>.job-actions>.btn:last-child:nth-child(odd){grid-column:1/-1!important} } /* V2.17 mobile navigation and production alignment */ @media(max-width:750px){ .bottom{box-sizing:border-box;align-items:stretch;gap:4px;padding:6px 5px max(6px,env(safe-area-inset-bottom))!important} .bottom button{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:5px!important;min-width:0;min-height:66px!important;padding:7px 2px!important;line-height:1.15!important} .bottom button .navicon{display:flex!important;align-items:center!important;justify-content:center!important;width:26px!important;height:26px!important;flex:0 0 26px!important;line-height:1!important} .bottom button .navicon .bellife-icon{display:block!important;position:static!important;width:23px!important;height:23px!important;max-width:23px!important;max-height:23px!important;margin:0!important;transform:none!important} .bottom button .navlabel{display:block!important;position:static!important;font-size:12px!important;line-height:15px!important;height:15px!important;white-space:nowrap!important;text-align:center!important;margin:0!important;transform:none!important} .view-production .ps-production-page-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.view-production .ps-production-page-tabs button{min-width:0;white-space:normal;padding:9px 5px}.view-production .tablewrap{max-width:100%;overflow-x:auto}.view-production .actions{display:flex;flex-wrap:wrap;gap:6px}.view-production .actions .btn{min-height:36px;font-size:12px} } .ps-po-table{width:100%;border-collapse:collapse}.ps-po-table td,.ps-po-table th{padding:9px;border-bottom:1px solid #b4c8b8;text-align:left}.ps-po-table input{min-width:0;width:100%} /* V2.17.2: compact payment confirmation actions */ #ps-payment-overlay .ps-payment-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px} #ps-payment-overlay .ps-payment-actions .btn{width:auto;min-height:0;padding:8px 14px;font-size:14px;border-radius:10px} #ps-payment-overlay .ps-payment-actions .btn[hidden]{display:none} /* V2.18: customer name links (open customer profile) */ .ps-link{background:none;border:0;padding:0;margin:0;font:inherit;font-weight:700;color:inherit;text-align:left;cursor:pointer;text-decoration:underline;text-decoration-color:rgba(127,127,127,.45);text-underline-offset:3px;min-height:0;box-shadow:none} .ps-link:hover,.ps-link:focus-visible{text-decoration-color:currentColor} a.btn{text-decoration:none} /* V2.18.1: compact customer database */ .ps-cust-head-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap} .ps-cust-import{position:relative} .ps-cust-tiles{grid-template-columns:repeat(4,minmax(0,1fr))} .ps-cust-tiles .opmetric{text-align:left;cursor:pointer} .ps-cust-tiles .opmetric.is-selected{outline:3px solid #86cc80;outline-offset:1px} .ps-cust-toolbar{display:grid;grid-template-columns:minmax(0,1fr) 170px 150px 190px;gap:10px;align-items:end;margin-bottom:6px} .ps-cust-toolbar label{min-width:0} .ps-cust-banner{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 14px;margin:10px 0;border-radius:12px;background:rgba(214,170,80,.14);border:1px solid rgba(214,170,80,.45)} .ps-cust-count{margin:10px 0 4px} .ps-cust-table{width:100%} .ps-cust-table td,.ps-cust-table th{padding:9px 10px;vertical-align:middle} .ps-cust-row{cursor:pointer} .ps-cust-row:hover,.ps-cust-row:focus-visible{background:rgba(134,204,128,.12);outline:none} .ps-cust-name{font-weight:700;display:block} .ps-cust-row small{display:block;font-size:12px} .ps-cust-num{text-align:right;white-space:nowrap} .ps-cust-due{color:#b5651d} .ps-cust-src{font-size:12px;opacity:.75} .ps-cust-actions{text-align:right;white-space:nowrap} .ps-cust-actions .btn{padding:5px 12px;min-height:0;font-size:13px} .ps-cust-chev{display:inline-block;margin-left:8px;font-size:20px;opacity:.45;vertical-align:middle} .ps-cust-mobile-only{display:none!important} .ps-cust-more{display:flex;align-items:center;gap:12px;justify-content:center;margin:14px 0 4px} .ps-cust-hint{text-align:center} @media(max-width:900px){.ps-cust-toolbar{grid-template-columns:1fr 1fr 1fr}.ps-cust-search{grid-column:1/-1}.ps-cust-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:700px){.ps-cust-hide-sm{display:none}.ps-cust-mobile-only{display:block!important}.ps-cust-actions .btn{display:none}.ps-cust-table td,.ps-cust-table th{padding:9px 6px}} @media(max-width:480px){.ps-cust-toolbar{grid-template-columns:1fr 1fr}.ps-cust-toolbar label:last-child{grid-column:1/-1}} .tablewrap table.ps-cust-table{min-width:0!important} @media(max-width:900px){.operations-metrics.ps-cust-tiles{grid-template-columns:repeat(2,minmax(0,1fr))!important}} @media(max-width:700px){.ps-cust-table .ps-cust-num{padding-left:4px}.ps-cust-banner .btn{padding:6px 14px;min-height:0}} .tablewrap table.ps-cust-table{width:100%!important} /* V2.19: business details card */ .ps-biz-logo{display:flex;gap:14px;align-items:center;padding:12px;margin:8px 0 14px;border:1px dashed rgba(127,127,127,.4);border-radius:12px;background:#fff;color:#14261b} .ps-biz-logo img{width:64px;height:64px;object-fit:contain} .ps-biz-logo small{display:block;color:#5f6f64} /* V2.19: label templates */ .ps-theme-gold{--ps-accent:#d4af37;--ps-bg:#111} .ps-theme-gold.ps-theme-swatch{background:linear-gradient(160deg,#111 62%,#d4af37 62%);border-color:#d4af37} .ps-theme-band.ps-theme-swatch{background:linear-gradient(180deg,#0b7a34 45%,#fff 45%);border-color:#0b7a34} .ps-theme-mono.ps-theme-swatch{background:repeating-linear-gradient(0deg,#fff 0 9px,#000 9px 10px);border-color:#000} .ps219-sheet{margin:0 0 14px;text-align:center}.ps219-sheet img{max-width:100%;height:auto;border:1px solid #d7dfd9;border-radius:6px;box-shadow:0 2px 10px #0001} .ps219-sheet figcaption{font-size:12px;opacity:.7;margin-top:4px} .ps219-note{font-size:12px} /* V2.20: social links card */ .ps-social-grid{display:grid;grid-template-columns:minmax(0,1fr) 200px;gap:16px;align-items:start} .ps-social-qr{text-align:center}.ps-social-qr img{width:180px;height:180px;image-rendering:pixelated;border:1px solid #dfe7e1;border-radius:10px;background:#fff} .ps-social-qr small{display:block;opacity:.6} @media(max-width:700px){.ps-social-grid{grid-template-columns:1fr}} /* V2.20: label download menu */ .ps220-modal{max-width:560px} .ps220-opts{display:grid;gap:10px;margin:14px 0} .ps220-opt{display:flex;flex-direction:column;gap:4px;text-align:left;padding:14px 16px;border-radius:14px;border:2px solid #d6e5da;background:#fff;color:#14261b;cursor:pointer;font:inherit} .ps220-opt:hover{border-color:#1f9d4d;background:#f3faf5} .ps220-opt small{color:#5d6d62} .ps220-check{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.4} .ps220-check input{width:auto;margin-top:3px} html.bellife-dark .ps220-opt{background:#1f2622;color:#e7efe9;border-color:#3b4640} /* V2.22: Wix clean-up */ .ps222-wix{max-width:560px} .ps222-wix-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:8px 0} .ps222-wix-tools input[type=search]{flex:1;min-width:160px} .ps222-wix-tools label{display:flex;gap:6px;align-items:center;white-space:nowrap} .ps222-wix-tools label input{width:auto} .ps222-wix-list{max-height:46vh;overflow:auto;border:1px solid rgba(127,127,127,.25);border-radius:12px;padding:4px 8px;margin-bottom:12px} .ps222-wix-row{display:flex;gap:10px;align-items:center;padding:8px 2px;border-bottom:1px solid rgba(127,127,127,.15)} .ps222-wix-row:last-child{border:0}.ps222-wix-row input{width:auto;flex:none} .ps222-wix-row small{display:block;opacity:.7} .ps222-danger{background:#c62828!important;border-color:#c62828!important;color:#fff!important}