@import url('./styles-base.css?v=5.62');

/* PharmaNexus+ visual refinement v2 */
#app{max-width:1180px;min-height:100dvh;background:var(--bg)}
.screen{padding-bottom:100px}
.topbar{padding-left:28px;padding-right:28px}
.dash-hero{margin:22px 28px 0;background-color:#000C20;box-shadow:0 14px 32px rgba(7,20,46,.14), 0 0 0 1px rgba(96,165,250,.28)}
.dash-hero-name{font-size:24px}
.section-row{margin-left:28px;margin-right:28px}.grid3{margin:0 28px;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.tool-card{min-height:126px;padding:18px 12px 16px;border-radius:16px;box-shadow:0 4px 18px rgba(20,33,61,.045);transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.tool-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(20,33,61,.08);border-color:#CBD5E1}.tool-ico{width:56px;height:56px;border-radius:16px}.tool-ico svg{width:27px;height:27px}.tool-card span{font-size:14px}
.list-card{margin-left:28px;margin-right:28px;border-radius:14px;box-shadow:0 4px 16px rgba(20,33,61,.04)}
.form-wrap{margin-left:28px;margin-right:28px}.form-card{background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:0 8px 28px rgba(0,0,0,.25);padding:22px}.scaleup-wrap{display:grid;grid-template-columns:minmax(0,520px) minmax(340px,1fr);gap:22px;align-items:start;margin:24px 28px}.scaleup-wrap>.form-card,.scaleup-wrap>.scaleup-result{margin:0}.form-wrap-tight{margin:0}.machine-summary{margin:2px 0 16px;padding:14px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(180deg,#0B1E42,#071430)}.machine-summary-head{font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}.machine-summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.machine-summary-grid>div{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 8px;text-align:center}.machine-summary-grid>div.featured{background:rgba(79,70,229,.18);border-color:rgba(129,140,248,.5)}.machine-summary-grid b{display:block;font-size:16px;color:var(--ink)}.machine-summary-grid span{display:block;font-size:11.5px;color:var(--muted);margin-top:3px}.rule-strip{display:flex;gap:8px;align-items:flex-start;padding:11px 12px;border-radius:12px;background:rgba(255,255,255,.04);color:var(--muted);font-size:11.5px;line-height:1.45;margin:4px 0 12px}.rule-dot{width:7px;height:7px;border-radius:50%;background:#10B981;flex:none;margin-top:4px}.btn-primary-large{text-transform:none;font-size:15px;padding:15px;border-radius:13px}
.recommendation-card{background:var(--card);border:1px solid rgba(139,124,246,.4);border-radius:20px;padding:24px;box-shadow:0 10px 30px rgba(0,0,0,.3);position:sticky;top:86px}.recommendation-kicker{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#8B7CF6}.recommendation-main{font-size:26px;line-height:1;font-weight:900;color:#8B7CF6;margin-top:10px;letter-spacing:-.03em}.recommendation-main span{font-size:14px;font-weight:700}.recommendation-factor{margin-top:7px;color:var(--muted);font-weight:700}.recommendation-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0 14px}.recommendation-metrics>div{background:rgba(255,255,255,.04);border-radius:12px;padding:12px;text-align:center}.recommendation-metrics strong{display:block;font-size:16px;color:var(--ink)}.recommendation-metrics span{display:block;color:var(--muted);font-size:11.5px;margin-top:4px}.recommendation-status{border-top:1px solid var(--line);padding-top:13px;font-size:11.5px;font-weight:700;color:#8B7CF6}.alt-list{margin:18px 0 0}.alt-row{min-height:52px;padding:12px 14px}.alt-factor{color:var(--muted);font-weight:600}.result-empty-panel{padding:24px}.result-empty-panel p{margin:0;color:var(--muted);line-height:1.55}
#resultScaleUp .btn-ghost-star{color:#8B7CF6;border-color:rgba(139,124,246,.4)}
#resultProdTime .btn-ghost-star{color:#FB923C;border-color:rgba(251,146,60,.4)}
#capacityContainer .btn-ghost-star{color:#60A5FA;border-color:rgba(96,165,250,.4)}
.bottom-nav{max-width:720px;border:1px solid var(--line);border-bottom:0;border-radius:18px 18px 0 0;box-shadow:0 -6px 20px rgba(20,33,61,.05)}
@media (min-width:900px){.bottom-nav{left:50%;right:auto;transform:translateX(-50%);width:720px}.dash-hero{width:100%;max-width:760px;align-self:center;height:420px}.photo-card-grid{width:100%;max-width:760px;align-self:center}.dash-slogan{max-width:520px;margin:0 auto}}
@media (min-width:641px) and (max-width:780px){.dash-hero{height:450px}}
@media (min-width:781px) and (max-width:899px){.dash-hero{height:536px}}
@media (max-width:899px){#app{max-width:100%}.grid3{grid-template-columns:repeat(3,minmax(0,1fr))}.scaleup-wrap{grid-template-columns:1fr}.recommendation-card{position:relative;top:auto}}
@media (max-width:640px){.dash-hero,.section-row,.grid3,.form-wrap,.list-card{margin-left:16px;margin-right:16px}.topbar{padding-left:16px;padding-right:16px}.dash-hero{margin-top:16px}.dash-hero-name{font-size:20px}.grid3{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.tool-card{min-height:128px}.scaleup-wrap{margin:16px}.form-card{padding:18px}.machine-summary-grid{grid-template-columns:repeat(2,1fr)}.recommendation-metrics{grid-template-columns:1fr 1fr}.recommendation-metrics>div:last-child{grid-column:1/-1}.bottom-nav{max-width:none;width:100%;border-radius:0;border:0}}
@media (max-width:370px){.dash-hero{height:222px}}

/* ---------- Tools page: 4 essential functions ---------- */
.tools-list-wrap{margin:6px 18px 110px}.tools-list{display:flex;flex-direction:column;gap:10px}.tool-card.tool-row{width:100%;min-height:92px;padding:4px 0;border:0;background:transparent;display:flex;align-items:center;justify-content:flex-start;gap:16px;text-align:left;box-shadow:none;border-radius:16px}.tool-card.tool-row:hover,.tool-card.tool-row:active{transform:none;box-shadow:none;border-color:transparent}.tool-ico-image{width:88px;height:88px;flex:0 0 88px;display:block;overflow:hidden;border-radius:16px;background:#07142F;box-shadow:0 0 0 1px rgba(255,255,255,.14)}.tool-ico-image img{display:block;width:100%;height:100%;object-fit:cover}.tool-row-copy{min-width:0;flex:1 1 auto;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding-right:4px}.tool-row-title{font-size:18px;font-weight:800;line-height:1.16;color:var(--ink);white-space:normal}.tool-row-subtitle{font-size:14px;font-weight:700;line-height:1.24}.tool-row-description{font-size:13.5px;font-weight:500;line-height:1.3}
@media(max-width:520px){.tools-list-wrap{margin:4px 16px 106px}.tools-list{gap:7px}.tool-card.tool-row{min-height:86px;gap:14px;padding:3px 0}.tool-ico-image{width:82px;height:82px;flex-basis:82px;border-radius:15px}.tool-row-title{font-size:17px}.tool-row-subtitle{font-size:13.5px}.tool-row-description{font-size:13px}}
@media(max-width:370px){.tools-list-wrap{margin-left:14px;margin-right:14px}.tool-card.tool-row{gap:12px}.tool-ico-image{width:76px;height:76px;flex-basis:76px;border-radius:14px}.tool-row-title{font-size:16px}.tool-row-subtitle,.tool-row-description{font-size:12.5px}}

/* ---------- Equipment Database ---------- */
.equipment-db-wrap{margin:0 18px 24px}.eq-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin:16px 0}.eq-head h2{margin:0;font-size:16px}.eq-head p{margin:5px 0 0;color:var(--muted);font-size:13px;max-width:340px}.eq-empty{padding:28px 16px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:var(--radius);font-size:13px}.eq-editor{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px;margin-top:8px;box-shadow:var(--shadow)}.eq-editor-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:4px}.eq-editor-title{font-size:17px;font-weight:800}.eq-status-select{border:1px solid var(--line);border-radius:8px;padding:6px 8px;font-size:11.5px;font-weight:700;background:var(--card);color:var(--ink)}.eq-section{font-size:11px;font-weight:800;color:#fff;text-transform:uppercase;letter-spacing:.04em;margin:18px 0 10px}.eq-optional{text-transform:none;font-weight:600;color:#fff}.eq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.eq-field label{display:block;font-size:11px;font-weight:700;color:var(--muted);margin-bottom:5px}.eq-field input,.eq-field select{width:100%;box-sizing:border-box;border:1px solid var(--line);background:var(--card);color:var(--ink);caret-color:var(--indigo);border-radius:10px;padding:9px;font:inherit;font-size:14px}.eq-note{font-size:11.5px;color:var(--muted);margin-top:10px;line-height:1.45}.eq-preview{display:flex;justify-content:space-between;align-items:center;background:var(--indigo-light);border-radius:12px;padding:12px 14px;margin-top:12px}.eq-preview-label{font-size:11.5px;font-weight:700;color:var(--indigo)}.eq-preview-value{font-size:16px;font-weight:800;color:var(--indigo)}.eq-preview-empty{background:var(--amber-bg);color:var(--amber);border-radius:12px;padding:11px 14px;margin-top:12px;font-size:11.5px;font-weight:600}.eq-editor-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:16px}.eq-editor-actions-right{display:flex;gap:8px}.eq-delete{background:rgba(220,38,38,.12);border:1px solid rgba(248,113,113,.4);color:#FCA5A5;border-radius:10px;padding:9px 14px;font-weight:800;font-size:13px;cursor:pointer}
@media(max-width:520px){.eq-grid{grid-template-columns:1fr}.eq-editor-actions{flex-direction:column;align-items:stretch}.eq-editor-actions-right{width:100%}.eq-editor-actions-right button{flex:1}}

/* ---------- Capacity & Utilization ---------- */
.cu-step{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px 16px;margin-bottom:10px;box-shadow:var(--shadow)}.cu-step-label{font-size:13px;font-weight:800;color:#fff;text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px}.cu-step-label-row{display:flex;justify-content:space-between;align-items:center}.cu-pill-row{display:flex;gap:8px;flex-wrap:wrap}.cu-pill{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:8px 14px;font-size:13px;font-weight:700;color:var(--ink);cursor:pointer}.cu-pill.active{background:#60A5FA;border-color:#60A5FA;color:#0B1220}.cu-select{width:100%;box-sizing:border-box;border:1px solid var(--line);background:var(--card);color:var(--ink);caret-color:var(--indigo);border-radius:10px;padding:10px;font:inherit;font-size:13px}.cu-note{font-size:11.5px;color:#fff;margin-top:8px;line-height:1.4}.cu-note.cu-warn{color:var(--amber)}.cu-machine-group{display:flex;flex-direction:column;gap:8px;max-height:280px;overflow-y:auto;margin-bottom:14px}.cu-machine-group:last-child{margin-bottom:0}.cu-machine-row{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:12px;padding:10px 12px;cursor:pointer}.cu-machine-row input{flex:none}.cu-machine-name{font-size:13px;font-weight:700;flex:1}.cu-machine-summary{font-size:13px;color:#fff;text-align:right}.cu-oee-toggle{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--ink);margin-top:4px}.cu-breakdown{margin-top:16px}.cu-table{width:100%;border-collapse:collapse;font-size:11.5px;margin-top:8px}.cu-table th{text-align:left;color:#fff;font-weight:700;padding:6px 8px;border-bottom:1px solid var(--line)}.cu-table td{padding:7px 8px;border-bottom:1px solid var(--line)}#capacityContainer .btn-primary{width:100%;margin-top:4px;margin-bottom:14px}
#capacityContainer .result-cell .lbl,#capacityContainer .result-hero .lbl,#capacityContainer .result-panel h3{color:#fff}
@media(max-width:520px){.cu-machine-summary{text-align:left}.cu-machine-row{flex-wrap:wrap}}

/* ---------- Tools page final mobile row layout ---------- */
.tools-list-wrap{margin:4px 16px 104px}.tools-list{display:flex;flex-direction:column;gap:0}.tool-card.tool-row{width:100%;min-height:94px;padding:9px 2px;margin:0;border:0;border-bottom:1px solid rgba(148,163,184,.16);background:transparent;display:flex !important;flex-direction:row !important;align-items:center !important;justify-content:flex-start !important;gap:15px;text-align:left !important;box-shadow:none;border-radius:0}.tool-card.tool-row:last-child{border-bottom:0}.tool-card.tool-row:hover,.tool-card.tool-row:active{transform:none;box-shadow:none;border-color:rgba(148,163,184,.16)}.tool-card.tool-row>.tool-ico-image{width:78px;height:78px;flex:0 0 78px;margin:0;border-radius:15px}.tool-card.tool-row>.tool-row-copy{min-width:0;flex:1 1 auto;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:3px;padding:0;text-align:left}.tool-card.tool-row .tool-row-title{font-size:17px;line-height:1.18;font-weight:800;color:#F1F5F9;text-align:left}.tool-card.tool-row .tool-row-description{font-size:13.5px;line-height:1.28;font-weight:600;text-align:left}
@media(max-width:520px){.tools-list-wrap{margin:2px 16px 104px}.tool-card.tool-row{min-height:92px;gap:14px;padding:7px 0}.tool-card.tool-row>.tool-ico-image{width:76px;height:76px;flex-basis:76px;border-radius:14px}.tool-card.tool-row .tool-row-title{font-size:16.5px}.tool-card.tool-row .tool-row-description{font-size:13px}}
@media(max-width:370px){.tools-list-wrap{margin-left:14px;margin-right:14px}.tool-card.tool-row{gap:11px;min-height:86px}.tool-card.tool-row>.tool-ico-image{width:70px;height:70px;flex-basis:70px}.tool-card.tool-row .tool-row-title{font-size:15.5px}.tool-card.tool-row .tool-row-description{font-size:12.5px}}

/* ---------- Equipment Database visual hierarchy ---------- */
.eq-head h2{display:none}
.eq-head{margin:12px 0 18px}
.eq-head p{margin:0;color:var(--muted);font-size:13px;line-height:1.45;font-weight:500;max-width:520px}
.eq-field label{display:block;font-size:11px;font-weight:800;color:#fff;text-transform:uppercase;letter-spacing:.04em;margin-bottom:8px}
.eq-top-tabs{margin-top:16px}
.eq-top-tabs .tab{font-size:13px;font-weight:800;padding:12px 8px;line-height:1.15}
.eq-top-tabs .tab.active{color:#fff}

/* ---------- Equipment Database field spacing ---------- */
.equipment-db-wrap .cu-step-label-row{margin-bottom:18px !important}
.equipment-db-wrap .eq-field label{margin-bottom:12px}
.equipment-db-wrap #eq_addOccupancyMachine,.equipment-db-wrap #eq_addOutputMachine{margin-top:4px !important;margin-bottom:22px !important}
@media(max-width:520px){.equipment-db-wrap .cu-step-label-row{margin-bottom:18px !important}.equipment-db-wrap .eq-field label{margin-bottom:12px}.equipment-db-wrap #eq_addOccupancyMachine,.equipment-db-wrap #eq_addOutputMachine{margin-top:4px !important;margin-bottom:24px !important}}


/* ---------- Equipment Database selected-machine layout ---------- */
#screen-equipment.eq-editing .eq-top-tabs{display:none}
#screen-equipment.eq-editing .equipment-db-wrap{margin-top:18px}
.eq-selected-actions{margin:0 0 12px;display:flex;align-items:center}
.eq-change-equipment{border:1px solid #4F46E5;background:#4F46E5;color:#fff;font:inherit;font-size:13px;font-weight:800;padding:8px 12px;border-radius:10px;cursor:pointer;white-space:nowrap}
.eq-add-machine{display:block;width:100%;margin-top:30px;margin-bottom:14px}
@media(max-width:520px){.eq-add-machine{margin-top:32px;margin-bottom:16px}.eq-selected-actions{margin-bottom:12px}}

/* Equipment selection action */
.eq-change-equipment{border:1px solid #4F46E5;background:#4F46E5;color:#fff;font:inherit;font-size:13px;font-weight:800;padding:8px 12px;border-radius:10px;cursor:pointer;white-space:nowrap}
.eq-editor-top .eq-change-equipment{margin-left:auto}

/* ---------- Capacity & Utilization: match Reset button colour ---------- */
#screen-capacity .cu-pill.active{background:#3B82F6;border-color:#3B82F6;color:#fff}
#screen-capacity #capacityContainer .btn-primary{background:#3B82F6;border-color:#3B82F6;color:#fff;opacity:1}

/* ---------- About screen: integrated into existing stylesheet ---------- */
#screen-about > div[style*="padding:2px 18px 0"]{display:none}
#screen-about .about-hero{background:transparent;border:0;border-radius:0;box-shadow:none;margin:8px 18px 18px;padding:0;text-align:center}
#screen-about .about-hero img{width:100%;max-width:none;height:auto;display:block;margin:0 auto 8px;padding:0;background:#fff;border-radius:12px;box-sizing:border-box}
#screen-about .about-section:has(.about-privacy){display:none}
#screen-about .about-section{margin:0 18px 10px;padding:5px 14px 11px}
#screen-about .about-section-label{padding:10px 0 8px}
#screen-about .about-row{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;align-items:start;padding-bottom:4px !important}
#screen-about .about-row .settings-icon{width:34px;height:34px;border-radius:10px}
#screen-about .about-row .settings-icon svg{width:17px;height:17px}
#screen-about .about-row-title{font-size:0;line-height:1.2}
#screen-about .about-row-title::before{content:'PharmaNexus';font-size:15.5px;font-weight:700}
#screen-about .about-row-title::after{content:'+';display:inline-block;position:relative;top:-0.42em;margin-left:1px;font-size:10px;font-weight:800;line-height:1}
#screen-about .about-row-sub{font-size:0;line-height:1.45;margin-top:4px}
#screen-about .about-row-sub::before{content:'Technical Tools for Pharmaceutical Engineering';font-size:12.5px}
#screen-about .about-detail-row{padding:8px 0}
#screen-about .about-footer{margin:6px 18px 16px}

/* About -> App Details spacing */
#screen-about .about-section + .about-section{margin-top:25px !important}

/* Capacity UI refinement */
#capacityContainer #cu_actualOutput{font-size:13px}