/* OGAPHARM: the client's identity, applied to a pharmacy procurement interface. */
:root {
  --brand: #29c092;
  --green: #11644d;
  --green2: #0e7a59;
  --lime: #def6eb;
  --ink: #163e32;
  --muted: #63776d;
  --line: #dce7df;
  --bg: #f6f9f7;
  --shadow: 0 16px 48px #173e3214;
  font-family: 'IBM Plex Sans', Arial, sans-serif;
  color: var(--ink);
  font-size: 14px;
}
body { background: var(--bg); background-image: none; }
button, input, select, textarea { font-family: inherit; }
h1, h2, h3 { letter-spacing: -.035em; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid #16825e; outline-offset: 3px;
}
.brand { display: inline-flex; gap: 0; flex-shrink: 0; letter-spacing: 0; }
.brand img { display: block; width: 210px; height: auto; max-width: 100%; object-fit: contain; }
.btn { border-radius: 6px; font-size: 13px; font-weight: 600; transition: background .15s, border-color .15s; }
.btn:hover { transform: none; }
.btn.primary { background: linear-gradient(110deg, #29c092, #4dcea3); color: #fff; border: 1px solid #29b98b; }
.btn.primary:hover { background: #37c99a; border-color: #1c9e74; }
.btn.secondary { color: #234c3c; border-color: #d4e1d8; }
.btn.secondary:hover { background: #f0f8f3; border-color: #b2d4c1; }
.pill { background: #e6f6ee; color: #256449; border-radius: 4px; font-size: 10px; }
.muted { color: var(--muted); }
.public-nav, .nav-item, .admin-subnav .btn, .admin-tabs button { text-transform: uppercase; }
.nav-item { line-height: 1.45; }
.boot .boot-logo { width: 218px; height: auto; }

/* Public partner entrance. */
.public-site { background: #fff; }
.public-site::before { content: ''; display: block; height: 4px; background: linear-gradient(90deg,#29c092,#87dfbd); }
.public-site .public-head { max-width: 1340px; min-height: 94px; padding: 21px 38px; border-bottom: 1px solid var(--line); }
.public-site .public-nav { gap: 29px; font-size: 13px; font-weight: 500; color: #385c4b; }
.public-site .public-nav a:hover { color: #08754e; }
.public-site .public-actions { gap: 10px; }
.public-site .public-head .btn { min-height: 42px; padding: 10px 16px; }
.public-site .public-main { max-width: 1340px; margin: 0 auto; padding: 0 38px; }
.public-site .hero { padding: 68px 0 62px; max-width: none; gap: 64px; grid-template-columns: 1.02fr 1fr; align-items: center; }
.public-site .hero-copy { min-width: 0; padding: 12px 0; }
.public-site .eyebrow { color: #287653; font-size: 10px; font-weight: 600; letter-spacing: .15em; margin: 0 0 25px; }
.public-site .hero h1 { font-size: clamp(49px,4.7vw,68px); line-height: 1.05; font-weight: 600; letter-spacing: -.055em; margin: 0 0 23px; }
.public-site .hero h1 span { color: #11704f; }
.public-site .hero-subtitle { font-size: 23px; font-weight: 400; margin: 0 0 19px; letter-spacing: -.025em; }
.public-site .hero p { font-size: 16px; line-height: 1.65; color: #617367; max-width: 430px; margin-bottom: 28px; }
.public-site .hero-buttons { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 21px; }
.public-site .hero-buttons .btn { min-height: 47px; padding: 13px 19px; }
.public-site .hero-note { color: #6b7c70; font-size: 11px; gap: 8px; line-height: 1.5; }
.public-site .hero-note .icon { width: 15px; height: 15px; }
.partner-showcase { border: 1px solid #cfe6d8; border-radius: 10px; overflow: hidden; min-width: 0; background: #fff; }
.showcase-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 23px 25px; background: #e7f7ef; border-bottom: 1px solid #d4e9dc; }
.partner-showcase.soft-gradient .showcase-heading { background: linear-gradient(115deg,#def5e9,#f0faf5); }
.showcase-heading strong { display: block; color: #164c35; font-size: 17px; font-weight: 600; letter-spacing: -.025em; margin-bottom: 4px; }
.showcase-heading span { display: block; color: #51745d; font-size: 12px; }
.showcase-heading > .icon { width: 29px; height: 29px; color: #22a677; stroke-width: 1.4; }
.showcase-products { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
.partner-showcase .hero-product { position: relative; inset: auto; transform: none; width: auto; height: auto; margin: 0; display: flex; flex-direction: column; text-align: left; padding: 0; border: 0; border-radius: 0; background: #fff; overflow: hidden; }
.partner-showcase .hero-product + .hero-product { border-left: 1px solid #e0ebe4; }
.partner-showcase .showcase-visual { height: 211px; width: 100%; display: flex; align-items: center; justify-content: center; background: #fbfcf9; transition: background .15s; }
.partner-showcase .hero-product:hover .showcase-visual { background: #edf7f0; }
.partner-showcase .showcase-visual img { width: 80%; height: 174px; object-fit: contain; mix-blend-mode: multiply; }
.partner-showcase .showcase-visual .bottle-wrap { position: relative; inset: auto; transform: scale(1.22); margin: 0; }
.partner-showcase .showcase-visual .box-wrap { position: relative; inset: auto; transform: none; margin: 0; }
.partner-showcase .box-wrap .b-title { font-size: 13px; line-height: 1.15; }
.showcase-product-info { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; padding: 16px 19px 18px; border-top: 1px solid #edf1eb; }
.showcase-product-info strong { display: block; font-size: 14px; font-weight: 600; letter-spacing: -.015em; line-height: 1.3; color: #254b35; }
.showcase-product-info small { display: block; font-size: 11px; color: #697e6e; margin-top: 6px; }
.showcase-product-info > .icon { width: 16px; height: 16px; color: #309969; }
.showcase-selection { display: flex; align-items: center; justify-content: space-between; gap: 14px; border-top: 1px solid #d8e8dd; background: #f5faf6; padding: 15px 21px; }
.showcase-selection strong { display: block; font-size: 9px; letter-spacing: .13em; color: #557461; font-weight: 500; margin-bottom: 4px; }
.showcase-selection span { font-size: 13px; font-weight: 600; letter-spacing: .025em; color: #166443; }
.selection-mark { width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; color: #126b45; background: #d7f2e3; border-radius: 50%; }
.showcase-caption { font-size: 9px; letter-spacing: .07em; color: #718775; padding: 9px 21px; border-top: 1px solid #e3eee6; margin: 0; }
.showcase-empty { min-height: 290px; display: flex; align-items: center; padding: 65px 25px; font-size: 14px; color: #5c7665; }
.public-site .public-strip { max-width: none; border-color: #dce7df; margin: 0; grid-template-columns: 1fr 1fr 1fr; }
.public-site .public-strip > div { padding: 25px 23px; gap: 15px; }
.public-site .public-strip > div:first-child { padding-left: 0; }
.public-site .public-strip strong { font-size: 13px; font-weight: 600; color: #31503b; margin-bottom: 5px; }
.public-site .public-strip span { font-size: 11px; color: #6c7c6e; }
.public-site .public-strip .icon { color: #3c9d70; width: 23px; height: 23px; }
.public-site .public-section { max-width: none; padding: 0; margin: 64px 0; }
.partner-process { display: grid; grid-template-columns: .85fr 1.5fr; gap: 80px; }
.process-intro h2 { max-width: 340px; font-size: 34px; line-height: 1.15; letter-spacing: -.04em; font-weight: 500; margin-bottom: 19px; }
.process-intro > p { color: #6d7d70; font-size: 13px; max-width: 285px; line-height: 1.7; }
.process-intro .eyebrow { margin-bottom: 18px; }
.partner-steps { border-top: 1px solid #dae6dc; }
.partner-step { display: grid; grid-template-columns: 40px 1fr; gap: 14px; padding: 22px 0; border-bottom: 1px solid #dae6dc; }
.partner-step .number { color: #2ba575; font-size: 13px; font-weight: 500; padding-top: 3px; }
.partner-step h3 { font-size: 17px; font-weight: 500; letter-spacing: -.02em; margin: 0 0 6px; }
.partner-step p { color: #6a7b6d; font-size: 13px; line-height: 1.65; margin: 0; max-width: 530px; }
.partner-faq { display: grid; grid-template-columns: .85fr 1.5fr; gap: 80px; }
.public-site .partner-faq h2 { font-size: 30px; line-height: 1.2; font-weight: 500; }
.partner-questions { border-top: 1px solid var(--line); }
.partner-questions details { border-bottom: 1px solid var(--line); padding: 20px 0; }
.partner-questions summary { cursor: pointer; font-size: 15px; line-height: 1.5; font-weight: 500; }
.partner-questions p { margin: 15px 0 0; font-size: 14px; color: #536d5b; line-height: 1.7; }
.no-js-note { margin: 0; padding: 14px 21px; background: #e7f7ef; text-align: center; }
.partner-contact { display: flex; justify-content: space-between; align-items: center; gap: 40px; padding: 34px 39px; border: 1px solid #cee8d9; border-left: 4px solid #29c092; border-radius: 7px; background: #f2faf5; }
.partner-contact h2 { font-size: 26px; letter-spacing: -.035em; margin: 0 0 10px; font-weight: 500; }
.partner-contact p { color: #5a7462; font-size: 13px; margin: 0; max-width: 620px; line-height: 1.7; }
.partner-contact .contact-details { margin-top: 12px; font-size: 13px; }
.partner-contact .btn { flex-shrink: 0; min-height: 46px; }
.public-site .footer { max-width: 1340px; margin: 0 auto; padding: 23px 38px 30px; font-size: 11px; color: #728175; }
.public-site .footer button:hover { color: #0f7550; }

/* Partner workspace: data stays denser than the public entrance. */
.shell { grid-template-columns: 238px minmax(0,1fr); }
.sidebar { width: 238px; padding: 29px 17px 16px; border-right-color: #dce7df; overflow-y: auto; }
.sidebar .brand { margin: 0 8px 30px; }
.sidebar .brand img { width: 187px; height: auto; }
.nav-label { font-size: 9px; letter-spacing: .11em; color: #8a9b8f; margin-top: 18px; }
.nav-item { font-size: 12px; color: #617766; border-radius: 4px; min-height: 43px; gap: 11px; }
.nav-item:hover { color: #176945; background: #f2f9f4; }
.nav-item.active { background: #e7f7ee; box-shadow: inset 3px 0 #29c092; color: #126441; font-weight: 600; }
.nav-item .counter { color: #236a45; background: #fff; }
.support-box { background: transparent; border: 0; border-top: 1px solid #e1e9e1; border-radius: 0; margin: 23px 5px 6px; padding: 18px 8px 8px; }
.support-heading { display: flex; align-items: flex-start; gap: 9px; }
.support-heading .icon { width: 17px; height: 17px; margin: 0; color: #3d9e71; }
.support-heading strong { font-size: 12px; line-height: 1.5; }
.support-box p { font-size: 11px; color: #7b8e7e; margin: 9px 0 11px; }
.support-box a { color: #246b48; font-size: 11px; }
.topbar { height: 76px; padding: 0 30px; border-color: #dce7df; }
.breadcrumb { color: #899b8e; font-size: 11px; }
.breadcrumb strong { color: #34573f; }
.avatar { background: #e6f6ec; color: #2b7550; border-radius: 7px; }
.user-button strong { font-size: 12px; }
.user-button small { font-size: 10px; color: #79907d; }
.content { padding: 29px 30px 32px; }
.page-heading { margin-bottom: 22px; }
.page-heading h1 { font-size: 30px; font-weight: 500; letter-spacing: -.04em; margin-bottom: 7px; }
.page-heading p { color: #6f8174; font-size: 12px; line-height: 1.6; }
.heading-note { color: #6d8673; }
.catalog-banner { background: linear-gradient(110deg,#e7f7ec,#f2faf5); border-color: #d3eadb; border-radius: 6px; padding: 18px 22px; min-height: 101px; margin-bottom: 24px; }
.catalog-banner .eyebrow { font-size: 9px; color: #348a5e; letter-spacing: .13em; margin-bottom: 6px; }
.catalog-banner h2 { font-size: 20px; font-weight: 500; letter-spacing: -.025em; color: #245c3c; margin-bottom: 4px; }
.catalog-banner p { color: #6b8b74; font-size: 11px; }
.catalog-banner .banner-art { display: none; }
.catalog-banner .btn { background: #fff; color: #236941; border-color: #c8e3d2; font-size: 12px; }
.catalog-head { border-bottom: 1px solid #dce7df; margin-bottom: 18px; align-items: flex-end; }
.tabs { background: transparent; padding: 0; border-radius: 0; gap: 19px; }
.tab { padding: 12px 2px 14px; background: transparent; border-bottom: 2px solid transparent; border-radius: 0; font-size: 13px; color: #7f9486; }
.tab.active { background: transparent; box-shadow: none; border-bottom-color: #29c092; color: #1c6742; }
.tab b { background: #e8f5ec; color: #4b8b61; font-size: 10px; }
.catalog-meta { padding-bottom: 15px; font-size: 10px; color: #7c9182; }
.toolbar { gap: 9px; margin-bottom: 16px; }
.search-field { border-color: #d6e4da; border-radius: 5px; background: #fff; }
.search-field input { font-size: 12px; }
.toolbar select { border-color: #d6e4da; border-radius: 5px; background-color: #fff; font-size: 12px; }
.result-line { font-size: 11px; color: #728876; margin-bottom: 12px; }
.table-wrap { border-color: #d9e6dd; border-radius: 6px; background: #fff; }
.product-table th { background: #f0f6f1; color: #4d6f57; font-size: 9px; font-weight: 500; letter-spacing: .06em; padding-top: 14px; padding-bottom: 14px; }
.product-table td { border-bottom-color: #e5ede7; padding-top: 13px; padding-bottom: 13px; font-size: 12px; }
.product-table tbody tr:hover { background: #f5fbf7; }
.product-name { font-family: inherit; color: #29583b; font-size: 13px; font-weight: 500; letter-spacing: -.01em; }
.product-sub { color: #617267; font-size: 10px; }
.sku { color: #647669; font-variant-numeric: tabular-nums; font-size: 10px; }
.manufacturer { color: #607e68; font-size: 11px; }
.stock { color: #33704b; font-size: 10px; }
.price { color: #235638; font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: -.035em; }
.price-note { color: #5f7065; font-size: 9px; }
.quantity { border-radius: 4px; border-color: #d7e4da; background: #fff; }
.quantity button { color: #62896c; }
.quantity input { font-variant-numeric: tabular-nums; color: #315a3c; }
.add-btn { border-radius: 5px; color: #fff; background: #43c99b; }
.add-btn:hover { background: #29b884; }
.add-btn:disabled { background: #e6eee8; color: #91a194; }
.table-footer { color: #7c9381; font-size: 10px; margin-top: 17px; }
.pagination button { border-radius: 4px; }
.pagination button.active { background: #daf3e4; color: #1e7047; }
.product-card { box-shadow: none; border-color: #dbe8df; border-radius: 7px; overflow: hidden; }
.product-card:hover { box-shadow: 0 5px 18px #183e330a; border-color: #bdddc9; }
.product-card-info { padding: 17px 15px; }
.product-visual { background: #f3f8f3 !important; }
.product-visual .pill { background: #fff; color: #4c8b61; }
.brand-name { color: #81a18a; font-size: 10px; letter-spacing: .05em; }
.product-expiry { color: #819789; font-size: 10px; }
.panel { border-color: #dbe7df; border-radius: 7px; box-shadow: none; }
.panel h2 { font-weight: 500; }
.field { font-size: 12px; color: #56775e; }
.field input, .field select, .field textarea { border-color: #d6e4da; border-radius: 5px; background: #fff; color: #274f36; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: #4fb48b; box-shadow: 0 0 0 3px #29c09212; }
.demo-bar { color: #6d8a75; background: #f0f7f2; border-color: #dcebe0; border-radius: 5px; }
.workspace-foot { color: #91a194; font-size: 10px; margin-top: 34px; }
.admin-tabs { border-bottom-color: #d7e6dc; }
.admin-tabs button { font-size: 12px; border-radius: 4px; }
.admin-tabs button.active { color: #1e6c43; background: #e1f4e8; }
.bulk-toolbar { background: #edf8f1; border-color: #d3e8dc; }
.invoice-due { background: #fff2ef; }
.invoice-due td { color: #ad493d; }

@media (min-width: 1200px) { .product-grid { grid-template-columns: repeat(5,minmax(0,1fr)); } }
@media (max-width: 1100px) {
  .public-site .hero { gap: 35px; }
  .public-site .public-head, .public-site .footer { padding-left: 28px; padding-right: 28px; }
  .public-site .public-main { padding: 0 28px; }
  .public-site .public-nav { gap: 17px; }
  .public-site .public-head .brand img { width: 181px; }
  .partner-process { gap: 40px; }
  .partner-faq { gap: 40px; }
  .public-site .public-strip > div { padding: 23px 17px; }
  .shell { grid-template-columns: 213px minmax(0,1fr); }
  .sidebar { width: 213px; padding-left: 12px; padding-right: 12px; }
  .sidebar .brand img { width: 175px; }
  .content { padding-left: 23px; padding-right: 23px; }
  .topbar { padding-left: 23px; padding-right: 23px; }
}
@media (max-width: 900px) {
  .public-site .public-nav { display: none; }
  .public-site .hero { grid-template-columns: 1fr 1fr; gap: 25px; padding-top: 44px; }
  .public-site .hero h1 { font-size: 48px; }
  .public-site .hero-subtitle { font-size: 20px; }
  .public-site .hero p { font-size: 14px; }
  .showcase-heading { padding: 20px 17px; }
  .showcase-heading strong { font-size: 15px; }
  .partner-showcase .showcase-visual { height: 190px; }
  .showcase-product-info { padding: 14px 12px; }
  .showcase-product-info strong { font-size: 12px; }
  .showcase-product-info small { font-size: 10px; }
  .showcase-product-info > .icon { display: none; }
  .partner-process { grid-template-columns: .85fr 1.3fr; gap: 30px; }
  .public-site .public-strip .icon { display: none; }
}
@media (max-width: 680px) {
  .partner-faq { grid-template-columns: 1fr; gap: 22px; }
  .public-site .partner-faq h2 { font-size: 28px; margin-bottom: 0; }
  .partner-questions summary { font-size: 14px; }
  .showcase-empty { min-height: 265px; }
  .public-site .public-head { padding: 17px 20px; min-height: 79px; }
  .public-site .public-head .brand img { width: 151px; }
  .public-site .public-actions .btn.secondary, .public-site .public-actions .btn .icon { display: none; }
  .public-site .public-actions .btn { padding: 9px 12px; min-height: 38px; font-size: 11px; }
  .public-site .public-main { padding: 0 21px; }
  .public-site .hero { grid-template-columns: 1fr; gap: 32px; padding: 35px 0 34px; }
  .public-site .hero-copy { padding: 0; }
  .public-site .eyebrow { font-size: 9px; letter-spacing: .1em; margin-bottom: 22px; }
  .public-site .hero h1 { font-size: clamp(43px,10vw,59px); margin-bottom: 20px; letter-spacing: -.055em; }
  .public-site .hero-subtitle { font-size: 21px; margin-bottom: 16px; }
  .public-site .hero p { font-size: 14px; margin-bottom: 23px; max-width: 340px; }
  .public-site .hero-buttons { gap: 8px; margin-bottom: 18px; }
  .public-site .hero-buttons .btn { font-size: 11px; padding: 11px 13px; min-height: 43px; gap: 6px; }
  .public-site .hero-buttons .icon { width: 16px; height: 16px; }
  .public-site .hero-note { font-size: 10px; }
  .showcase-heading { padding: 20px; }
  .showcase-heading strong { font-size: 16px; }
  .showcase-product-info { padding: 14px 16px; }
  .showcase-product-info strong { font-size: 13px; }
  .partner-showcase .showcase-visual { height: 190px; }
  .showcase-selection { padding: 14px 18px; }
  .showcase-selection strong { font-size: 8px; }
  .showcase-selection span { font-size: 12px; }
  .showcase-caption { font-size: 8px; padding-left: 18px; }
  .public-site .public-strip { display: block; }
  .public-site .public-strip > div, .public-site .public-strip > div:first-child { padding: 18px 0; gap: 14px; }
  .public-site .public-strip > div + div { border-left: 0; border-top: 1px solid #e5ede6; }
  .public-site .public-strip .icon { display: block; width: 22px; height: 22px; }
  .public-site .public-strip strong { font-size: 13px; margin-bottom: 3px; }
  .public-site .public-section { margin: 39px 0; }
  .partner-process { display: block; }
  .process-intro h2 { font-size: 29px; max-width: 280px; }
  .process-intro > p { max-width: 330px; margin-bottom: 25px; }
  .partner-step { padding: 20px 0; gap: 9px; grid-template-columns: 32px 1fr; }
  .partner-step h3 { font-size: 16px; }
  .partner-step p { font-size: 12px; }
  .partner-contact { display: block; padding: 25px 22px; }
  .partner-contact h2 { font-size: 24px; }
  .partner-contact p { font-size: 12px; }
  .partner-contact .btn { margin-top: 22px; }
  .public-site .footer { padding: 22px 21px 28px; display: block; line-height: 1.7; font-size: 10px; }
  .public-site .footer > div { margin-top: 10px; }
  .shell { display: block; }
  .sidebar { width: 238px; padding: 28px 17px 16px; transform: translateX(-100%); }
  .sidebar.open { transform: translateX(0); }
  .sidebar .brand img { width: 187px; }
  .topbar { height: 67px; padding: 0 15px; }
  .content { padding: 23px 16px; }
  .page-heading h1 { font-size: 27px; }
  .page-heading p { font-size: 11px; }
  .catalog-banner { padding: 16px; margin-bottom: 19px; }
  .catalog-banner h2 { font-size: 18px; max-width: 245px; }
  .catalog-banner p { font-size: 10px; }
  .tabs { gap: 17px; }
  .tab { font-size: 11px; gap: 6px; }
  .tab b { font-size: 9px; }
  .catalog-meta { padding-bottom: 11px; }
  .product-card-info { padding: 13px 11px; }
  .product-name { font-size: 12px; }
  .workspace-foot { margin-top: 29px; font-size: 9px; }
}
@media (max-width: 360px) {
  .public-site .public-head { padding-left: 17px; padding-right: 17px; }
  .public-site .public-head .brand img { width: 132px; }
  .public-site .public-main { padding: 0 17px; }
  .public-site .hero h1 { font-size: 43px; }
  .public-site .hero-buttons .btn { font-size: 10px; padding-left: 11px; padding-right: 11px; }
  .showcase-product-info { padding-left: 12px; padding-right: 12px; }
  .showcase-product-info strong { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
