/* ALOXLY v1.5 — precision UI, sidebar, search, product purchase flow */

/* ---------- Shared icon language ---------- */
.ui-icon{font-style:normal!important;line-height:1!important;display:inline-grid!important;place-items:center!important}

/* ---------- Admin: fixed geometry ---------- */
.admin-body{--admin-sidebar-w:276px;--admin-sidebar-compact-w:72px}
.admin-sidebar{width:var(--admin-sidebar-w)!important;min-width:var(--admin-sidebar-w)!important;max-width:var(--admin-sidebar-w)!important;box-sizing:border-box!important}
.admin-main{width:calc(100% - var(--admin-sidebar-w))!important;margin-right:var(--admin-sidebar-w)!important}
.admin-body.admin-sidebar-collapsed .admin-sidebar{width:var(--admin-sidebar-compact-w)!important;min-width:var(--admin-sidebar-compact-w)!important;max-width:var(--admin-sidebar-compact-w)!important;padding-inline:9px!important}
.admin-body.admin-sidebar-collapsed .admin-main{width:calc(100% - var(--admin-sidebar-compact-w))!important;margin-right:var(--admin-sidebar-compact-w)!important}
.admin-sidebar-head{height:52px!important;min-height:52px!important;display:flex!important;align-items:center!important;flex-wrap:nowrap!important}
.sidebar-collapse-btn{width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;border-radius:10px!important}
.sidebar-collapse-btn .ui-icon{font-size:18px!important;width:18px!important;height:18px!important}
.admin-body.admin-sidebar-collapsed .admin-sidebar-head{display:grid!important;place-items:center!important;padding:0 0 12px!important}
.admin-body.admin-sidebar-collapsed .admin-brand{display:none!important}
.admin-body.admin-sidebar-collapsed .sidebar-collapse-btn{display:grid!important;place-items:center!important;margin:0!important;width:42px!important;height:42px!important}
.admin-nav{width:100%!important}
.admin-nav-group>a{width:100%!important;box-sizing:border-box!important}

/* ---------- Admin: unified small actions ---------- */
.icon-action,.table-icon-btn,.category-admin-row>.table-icon-btn{
  width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;
  border-radius:9px!important;padding:0!important;display:inline-grid!important;place-items:center!important;
  background:var(--admin-panel)!important;border:1px solid var(--admin-line)!important;color:var(--admin-text)!important;
}
.icon-action .ui-icon,.table-icon-btn .ui-icon,.category-admin-row>.table-icon-btn .ui-icon{
  width:16px!important;height:16px!important;font-size:16px!important;color:currentColor!important;margin:0!important
}
.action-edit{color:#315b28!important}.action-view{color:#35526d!important}.action-delete{color:#a33b34!important}
.action-edit:hover{background:#edf8e9!important;color:#234c1d!important;border-color:#bbd9b0!important}
.action-view:hover{background:#eef5fb!important;color:#294962!important;border-color:#bfd1df!important}
.action-delete:hover{background:#fff0ef!important;color:#912d28!important;border-color:#efc1bd!important}
.admin-body[data-admin-theme="dark"] .action-edit,.admin-body[data-admin-theme="dark"] .action-view{color:#dce9d8!important}
.admin-body[data-admin-theme="dark"] .action-delete{color:#ffaaa2!important}

/* ---------- Admin: one search component everywhere ---------- */
.admin-search,.inventory-toolbar .admin-search{
  height:44px!important;min-height:44px!important;display:flex!important;align-items:center!important;gap:9px!important;
  padding:0 12px!important;border:1px solid var(--admin-line)!important;border-radius:12px!important;
  background:var(--admin-panel)!important;box-shadow:none!important;overflow:hidden!important
}
.admin-search>.ui-icon{width:17px!important;height:17px!important;font-size:17px!important;color:var(--admin-muted)!important;flex:0 0 17px!important}
.admin-search input{
  height:100%!important;min-height:0!important;flex:1!important;width:100%!important;min-width:0!important;
  padding:0!important;margin:0!important;border:0!important;outline:0!important;box-shadow:none!important;
  background:transparent!important;border-radius:0!important;color:var(--admin-text)!important
}
.admin-search input:focus{border:0!important;box-shadow:none!important;outline:0!important}
.admin-search:focus-within{border-color:#8aaa7d!important;box-shadow:0 0 0 3px rgba(159,232,112,.16)!important}
.admin-toolbar>.admin-ghost-btn{height:44px!important;min-height:44px!important}

/* ---------- Checkbox: only one Hugeicons badge ---------- */
.permission-grid label,.permission-check,.checkbox-line,.check-line{position:relative!important}
.permission-grid label input[type="checkbox"],.permission-check input[type="checkbox"],.checkbox-line input[type="checkbox"],.check-line input[type="checkbox"]{
  position:absolute!important;opacity:0!important;width:1px!important;height:1px!important;pointer-events:none!important
}
.permission-grid label::before,.permission-check::before,.checkbox-line::before,.check-line::before{content:none!important;display:none!important}
.checkbox-hugeicon{
  order:3!important;flex:0 0 21px!important;width:21px!important;height:21px!important;font-size:21px!important;
  margin-inline-start:auto!important;color:#577053!important;opacity:.28!important;transition:color .16s ease,opacity .16s ease,transform .16s ease!important
}
.permission-grid label input:checked~.checkbox-hugeicon,.permission-check input:checked~.checkbox-hugeicon,.checkbox-line input:checked~.checkbox-hugeicon,.check-line input:checked~.checkbox-hugeicon{
  opacity:1!important;color:#2d6b25!important;transform:scale(1.02)!important
}
.admin-body[data-admin-theme="dark"] .checkbox-hugeicon{color:#8c9a89!important}
.admin-body[data-admin-theme="dark"] input:checked~.checkbox-hugeicon{color:#9fe870!important}
.permission-grid label,.permission-check{cursor:pointer!important}

/* ---------- Store: one search style ---------- */
.header-search,.catalog-search,.mobile-search{
  border:1px solid var(--store-border,var(--line))!important;background:var(--store-surface,#fff)!important;
  box-shadow:none!important;overflow:hidden!important
}
.header-search input,.catalog-search input,.mobile-search input{
  border:0!important;box-shadow:none!important;outline:0!important;background:transparent!important;border-radius:0!important
}
.header-search:focus-within,.catalog-search:focus-within,.mobile-search:focus-within{
  border-color:color-mix(in srgb,var(--ink) 42%,var(--store-border,var(--line)))!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--lime) 18%,transparent)!important
}
.header-search button{width:30px!important;height:30px!important;min-width:30px!important;border:0!important;background:transparent!important;color:var(--ink)!important;padding:0!important;display:grid!important;place-items:center!important}
.header-search button:hover{background:color-mix(in srgb,var(--lime) 18%,transparent)!important;color:var(--ink)!important}

/* ---------- Store archive ---------- */
.product-card .quick-buy-row,.product-card .quick-add,.product-card>.product-info>.quick-buy-trigger{display:none!important}
.product-info{padding-bottom:4px!important}
.favorite-btn{width:32px!important;height:32px!important;min-width:32px!important;border-radius:10px!important}
.favorite-btn .ui-icon{font-size:16px!important;width:16px!important;height:16px!important}
.favorite-btn:hover{background:var(--lime)!important;color:var(--ink)!important}

/* White buttons must always preserve contrast on hover. */
.btn.secondary,.admin-ghost-btn,body:not(.admin-body) .quick-add button{
  color:var(--ink)!important;background:var(--store-surface,#fff)!important
}
.btn.secondary:hover,body:not(.admin-body) .quick-add button:hover{
  color:var(--ink)!important;background:color-mix(in srgb,var(--lime) 20%,var(--store-surface,#fff))!important;border-color:color-mix(in srgb,var(--ink) 20%,var(--line))!important
}

/* ---------- Product page: reduced cognitive load ---------- */
.product-page{padding-top:52px!important}
.product-page .product-detail-grid{align-items:start!important}
.product-page .product-detail{padding-top:12px!important}
.product-page .product-detail h1{font-size:clamp(34px,4.2vw,52px)!important;margin-top:0!important}
.product-page .product-detail .lead{font-size:16px!important;line-height:1.85!important;margin-bottom:12px!important}
.product-page .description{font-size:14px!important;line-height:1.9!important;margin:18px 0 22px!important;color:var(--store-muted,var(--muted))!important}
.product-buy-line{display:flex!important;align-items:flex-end!important;gap:9px!important;width:100%!important;margin:20px 0 0!important}
.product-cart-inline{display:flex!important;align-items:flex-end!important;gap:9px!important;flex:1 1 auto!important;min-width:0!important}
.compact-qty{width:92px!important;min-width:92px!important;font-size:11px!important;color:var(--store-muted,var(--muted))!important}
.compact-qty>span{display:block!important;margin-bottom:5px!important}
.compact-qty .qty-input{height:46px!important;margin:0!important;text-align:center!important;padding:0 8px!important}
.add-cart-inline,.product-quick-buy{height:46px!important;min-height:46px!important;border-radius:12px!important;flex:1 1 0!important;white-space:nowrap!important;font-size:13px!important;padding:0 14px!important}
.product-quick-buy{border:1px solid var(--ink)!important;background:var(--ink)!important;color:#fff!important;font-weight:600!important;cursor:pointer!important}
.product-quick-buy:hover{background:color-mix(in srgb,var(--ink) 88%,#fff)!important;color:#fff!important}
.compact-benefits{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;margin-top:22px!important}
.compact-benefits>div{min-width:0!important;align-items:center!important}
.compact-benefits>div>.ui-icon{width:30px!important;height:30px!important;flex:0 0 30px!important;font-size:17px!important;padding:0!important;display:grid!important;place-items:center!important}
.compact-benefits strong{font-size:11.5px!important;white-space:nowrap!important}
.compact-benefits small{font-size:9.5px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}

/* ---------- Direct order popup ---------- */
.quick-buy-backdrop{padding:18px!important;backdrop-filter:blur(2px)!important}
.quick-order-modal{width:min(620px,100%)!important;max-height:min(92dvh,820px)!important;overflow:auto!important;padding:20px!important}
.quick-order-modal>header{margin-bottom:14px!important}
.quick-order-modal>header>div{min-width:0!important}
.quick-buy-eyebrow{display:block!important;font-size:11px!important;color:var(--store-muted,var(--muted))!important;margin-bottom:2px!important}
.quick-order-modal>header h2{font-size:21px!important}
.quick-buy-product{grid-template-columns:72px minmax(0,1fr)!important;padding:10px!important}
.quick-buy-product img{width:72px!important;height:72px!important}
.quick-order-form{margin-top:14px!important}
.quick-order-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:11px!important}
.quick-order-grid label{font-size:12px!important;font-weight:500!important;color:var(--store-text,#17210f)!important}
.quick-order-grid label.full{grid-column:1/-1!important}
.quick-order-grid input,.quick-order-grid textarea{
  width:100%!important;margin-top:6px!important;border:1px solid var(--store-border,var(--line))!important;border-radius:11px!important;
  background:var(--store-surface,#fff)!important;color:var(--store-text,#17210f)!important;outline:0!important;padding:0 12px!important;font:inherit!important
}
.quick-order-grid input{height:44px!important}.quick-order-grid textarea{min-height:68px!important;padding-top:10px!important;resize:vertical!important}
.quick-order-grid input:focus,.quick-order-grid textarea:focus{border-color:color-mix(in srgb,var(--ink) 38%,var(--line))!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--lime) 18%,transparent)!important}
.quick-order-qty{max-width:110px!important}
.quick-order-submit{width:100%!important;height:47px!important;border:0!important;border-radius:12px!important;background:var(--ink)!important;color:#fff!important;font-size:13.5px!important;font-weight:600!important;margin-top:13px!important;cursor:pointer!important}
.quick-order-submit:hover{background:color-mix(in srgb,var(--ink) 88%,#fff)!important;color:#fff!important}
.quick-order-note{display:block!important;text-align:center!important;margin-top:8px!important;color:var(--store-muted,var(--muted))!important;font-size:10.5px!important}

/* ---------- Store mobile off-canvas ---------- */
.mobile-menu-backdrop{position:fixed!important;inset:0!important;z-index:208!important;background:rgba(7,13,6,.42)!important;opacity:0!important;transition:opacity .22s ease!important;backdrop-filter:blur(2px)!important}
.mobile-menu-backdrop.open{opacity:1!important}
.mobile-menu{
  display:block!important;position:fixed!important;z-index:210!important;inset-block:0!important;right:0!important;left:auto!important;
  width:292px!important;max-width:calc(100vw - 42px)!important;height:100dvh!important;padding:0!important;margin:0!important;
  background:var(--store-surface,#fff)!important;border-left:1px solid var(--store-border,var(--line))!important;
  box-shadow:-24px 0 60px rgba(8,18,7,.16)!important;transform:translateX(104%)!important;
  transition:transform .26s cubic-bezier(.2,.8,.2,1)!important;overflow:hidden!important
}
.mobile-menu.open{transform:translateX(0)!important}
.mobile-menu-head{height:72px!important;padding:0 16px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;border-bottom:1px solid var(--store-border,var(--line))!important}
.mobile-drawer-brand{font-size:17px!important}.mobile-drawer-brand .brand-mark{width:34px!important;height:34px!important;border-radius:10px!important;font-size:16px!important}
.mobile-menu-close{width:36px!important;height:36px!important;border:1px solid var(--store-border,var(--line))!important;background:var(--store-surface,#fff)!important;color:var(--ink)!important;border-radius:10px!important;display:grid!important;place-items:center!important;padding:0!important}
.mobile-menu-inner{height:calc(100dvh - 72px)!important;padding:16px!important;overflow-y:auto!important;display:block!important}
.mobile-search{height:44px!important;border-radius:12px!important;display:flex!important;align-items:center!important;gap:8px!important;padding:0 10px!important;margin-bottom:16px!important}
.mobile-search>.ui-icon{font-size:17px!important}.mobile-search input{flex:1!important;min-width:0!important;height:100%!important;padding:0!important}
.mobile-search button{width:30px!important;height:30px!important;border:0!important;border-radius:8px!important;background:color-mix(in srgb,var(--lime) 22%,transparent)!important;color:var(--ink)!important;display:grid!important;place-items:center!important;padding:0!important}
.mobile-drawer-nav{display:grid!important;gap:4px!important}
.mobile-drawer-nav>a{min-height:48px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;padding:0 12px!important;border-radius:11px!important;color:var(--store-text,#17210f)!important;font-size:14px!important;font-weight:500!important}
.mobile-drawer-nav>a:hover{background:color-mix(in srgb,var(--lime) 15%,transparent)!important;color:var(--ink)!important}
.mobile-drawer-nav>a>span{display:grid!important;place-items:center!important;color:var(--store-muted,var(--muted))!important}.mobile-drawer-nav>a>span .ui-icon{font-size:16px!important}
body.mobile-drawer-open{overflow:hidden!important}

/* ---------- Responsive ---------- */
@media(min-width:901px){.mobile-menu,.mobile-menu-backdrop{display:none!important}}
@media(max-width:900px){
  .admin-sidebar{width:292px!important;min-width:292px!important;max-width:292px!important;transform:translateX(105%)!important;padding:16px 13px!important}
  .admin-body.admin-menu-open .admin-sidebar{transform:translateX(0)!important}
  .admin-body.admin-sidebar-collapsed .admin-sidebar{width:292px!important;min-width:292px!important;max-width:292px!important}
  .admin-main,.admin-body.admin-sidebar-collapsed .admin-main{width:100%!important;margin-right:0!important}
  .admin-body.admin-sidebar-collapsed .admin-brand{display:inline-flex!important;width:auto!important;margin:0!important}
  .admin-body.admin-sidebar-collapsed .admin-brand-name,.admin-body.admin-sidebar-collapsed .admin-nav-group>span,.admin-body.admin-sidebar-collapsed .admin-nav-group>a>b,.admin-body.admin-sidebar-collapsed .open-store>span,.admin-body.admin-sidebar-collapsed .admin-user>div{display:initial!important}
  .admin-body.admin-sidebar-collapsed .admin-sidebar-head{display:flex!important;place-items:initial!important;padding:0 4px 12px!important}
  .admin-body.admin-sidebar-collapsed .admin-nav-group>a,.admin-body.admin-sidebar-collapsed .open-store,.admin-body.admin-sidebar-collapsed .admin-user{width:100%!important;justify-content:flex-start!important;padding-inline:11px!important;margin:0!important}
  .sidebar-collapse-btn{display:none!important}.admin-close-btn{display:grid!important}
  .admin-menu-btn{display:grid!important}
}
@media(max-width:620px){
  .icon-action,.table-icon-btn,.category-admin-row>.table-icon-btn{width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important}
  .icon-action .ui-icon,.table-icon-btn .ui-icon{font-size:15px!important;width:15px!important;height:15px!important}
  .admin-search{height:43px!important;min-height:43px!important}
  .favorite-btn{width:29px!important;height:29px!important;min-width:29px!important;border-radius:9px!important}.favorite-btn .ui-icon{font-size:15px!important;width:15px!important;height:15px!important}
  .product-page{padding-top:28px!important}
  .product-page .product-detail h1{font-size:27px!important;line-height:1.35!important}
  .product-page .product-detail .lead{font-size:14px!important}
  .product-page .description{font-size:13px!important;margin:14px 0 18px!important}
  .product-buy-line{gap:6px!important;align-items:flex-end!important}
  .product-cart-inline{gap:6px!important}
  .compact-qty{width:70px!important;min-width:70px!important}.compact-qty>span{font-size:9px!important}.compact-qty .qty-input{height:42px!important;font-size:16px!important}
  .add-cart-inline,.product-quick-buy{height:42px!important;min-height:42px!important;font-size:11px!important;padding:0 8px!important;border-radius:10px!important}
  .compact-benefits{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important;margin-top:18px!important}
  .compact-benefits>div{gap:5px!important;align-items:center!important}.compact-benefits>div>.ui-icon{width:24px!important;height:24px!important;flex-basis:24px!important;font-size:14px!important}
  .compact-benefits strong{font-size:9.5px!important}.compact-benefits small{font-size:7.5px!important}
  .quick-order-modal{padding:16px!important;border-radius:18px!important}.quick-order-grid{grid-template-columns:1fr!important;gap:9px!important}.quick-order-grid label.full{grid-column:auto!important}.quick-order-qty{max-width:none!important}.quick-order-grid input,.quick-order-grid textarea{font-size:16px!important}
  .quick-buy-product{grid-template-columns:60px 1fr!important}.quick-buy-product img{width:60px!important;height:60px!important}
}

/* Unchecked state stays visible as a clean empty control; selected state uses the chosen badge icon. */
.permission-grid label input:not(:checked)~.checkbox-hugeicon,
.permission-check input:not(:checked)~.checkbox-hugeicon,
.checkbox-line input:not(:checked)~.checkbox-hugeicon,
.check-line input:not(:checked)~.checkbox-hugeicon{
  opacity:1!important;color:transparent!important;border:1px solid var(--admin-line)!important;border-radius:6px!important;font-size:0!important;background:var(--admin-panel)!important
}
.permission-grid label input:checked~.checkbox-hugeicon,
.permission-check input:checked~.checkbox-hugeicon,
.checkbox-line input:checked~.checkbox-hugeicon,
.check-line input:checked~.checkbox-hugeicon{
  border:0!important;background:transparent!important;font-size:21px!important
}

/* Keep quantity + both purchase actions on one stable row. */
.product-buy-line{display:grid!important;grid-template-columns:minmax(0,1.7fr) minmax(120px,1fr)!important;align-items:end!important}
.product-cart-inline{display:grid!important;grid-template-columns:92px minmax(0,1fr)!important;align-items:end!important;width:100%!important}
@media(max-width:620px){
  .product-buy-line{grid-template-columns:minmax(0,1.72fr) minmax(92px,1fr)!important}
  .product-cart-inline{grid-template-columns:70px minmax(0,1fr)!important}
}
@media(max-width:820px){
  .mobile-menu{max-height:none!important;border-top:0!important;overflow:hidden!important}
  .mobile-menu.open{max-height:none!important;border-color:var(--store-border,var(--line))!important}
}
.inventory-search-form{display:flex!important;align-items:center!important;gap:8px!important;min-width:min(100%,420px)!important}
.inventory-search-form .admin-search{flex:1 1 auto!important;min-width:0!important}
.inventory-search-form>.admin-ghost-btn{height:44px!important;min-height:44px!important}
@media(max-width:620px){.inventory-search-form{width:100%!important;min-width:0!important}.inventory-search-form>.admin-ghost-btn{flex:0 0 auto!important}}
