/* MojPrint Classic Fashion Shop Redesign
   Appearance-only override. Existing IDs, form names, hrefs and JS hooks are not changed. */
:root{
  --bg:#f7f7f5;
  --surface:#ffffff;
  --surface-2:#f2f2ef;
  --ink:#111111;
  --ink-soft:#2b2b2b;
  --muted:#747474;
  --muted-2:#9a9a9a;
  --line:#deded8;
  --line-dark:#c8c8bf;
  --brand:#003b71;
  --brand-dark:#002f5b;
  --brand-soft:#eef4fa;
  --danger:#b42318;
  --ok:#116d38;
  --radius-sm:2px;
  --radius-md:4px;
  --radius-lg:6px;
  --shadow:none;
  --shadow-soft:0 1px 0 rgba(17,17,17,.04);
}
*{box-sizing:border-box}
html,body{
  background:var(--bg)!important;
  color:var(--ink)!important;
  font-family:Inter,Arial,sans-serif!important;
  letter-spacing:-.01em;
}
body:before{display:none!important}
a{text-decoration:none}
img{max-width:100%}
::selection{background:var(--brand);color:#fff}

/* Global text rhythm */
h1,h2,h3,h4,.grid-title,.product-name,.item-top h3,.top h1,.brand,.site-brand{
  color:var(--ink)!important;
  letter-spacing:-.045em!important;
}
p,.muted,.grid-subtitle,.product-desc,.item-desc,.mini-note,.empty-state,.inline-note,.meta{
  color:var(--muted)!important;
}
.eyebrow,.hero-kicker,.section-title,.thumb-label,.panel-card h4,.field-label{
  color:var(--brand)!important;
  letter-spacing:.18em!important;
  font-weight:800!important;
}

/* Header: classic shop bar */
.site-header{
  background:#fff!important;
  backdrop-filter:none!important;
  border-bottom:1px solid var(--line)!important;
  box-shadow:none!important;
}
.site-header-inner{
  min-height:72px!important;
  max-width:1380px!important;
}
.site-brand,.brand{
  font-weight:900!important;
  color:#111!important;
  letter-spacing:-.055em!important;
}
.site-brand span,.brand span{color:var(--brand)!important;background:transparent!important;display:inline!important;padding:0!important;border-radius:0!important;box-shadow:none!important}.logo-dot{color:var(--brand)!important;background:transparent!important}
.site-links{gap:2px!important}
.site-link{
  min-height:40px!important;
  padding:0 13px!important;
  border-radius:0!important;
  color:#222!important;
  background:transparent!important;
  border:1px solid transparent!important;
  box-shadow:none!important;
  text-transform:uppercase!important;
  letter-spacing:.075em!important;
  font-size:12px!important;
  font-weight:800!important;
}
.site-link:hover,.site-link.is-active{
  background:transparent!important;
  color:var(--brand)!important;
  border-bottom-color:var(--brand)!important;
}
.site-link.is-cart{
  background:var(--ink)!important;
  color:#fff!important;
  border-color:var(--ink)!important;
  padding:0 15px!important;
  margin-left:8px!important;
}
.site-link.is-cart:hover,.site-link.is-cart.is-active{
  background:var(--brand)!important;
  border-color:var(--brand)!important;
  color:#fff!important;
}
.site-cart-badge{
  border-radius:0!important;
  background:#fff!important;
  color:var(--ink)!important;
  font-size:11px!important;
}

/* Main containers */
.page-shell,.wrap{background:transparent!important}
.container,.wrap{max-width:1320px!important}
body.has-site-nav .container{padding-top:24px!important}

/* Cards and panels: square, premium, no toy shadows */
.hero-card,.side-card,.product-card,.summary-card,.designer-panel,.designer-stage,.detail-card,
.card,.stat,.empty,.item,.cart-item,.radio-card,.panel-card,.product-summary-card,.panel-block,
.asset-tray-panel,.asset-item,.layer-item,.product-item,.box,.modal-content,.form-card,
.admin-shell .card,.admin-shell .stat{
  background:#fff!important;
  border:1px solid var(--line)!important;
  border-radius:var(--radius-lg)!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.product-card,.order-card,.card,.item,.cart-item,.product-item{
  transition:border-color .16s ease, transform .16s ease, background .16s ease!important;
}
.product-card:hover,.order-card:hover,.card:hover,.item:hover,.cart-item:hover,.product-item:hover{
  transform:none!important;
  border-color:var(--ink)!important;
  box-shadow:none!important;
}

/* Hero and carousel */
.hero{gap:18px!important;padding:22px 0 34px!important}
.hero-card{padding:34px!important}
.hero h1,.hero-card h1{
  font-size:clamp(36px,4.8vw,68px)!important;
  line-height:.92!important;
  max-width:820px;
}
.hero p{font-size:16px!important;color:#555!important;max-width:68ch!important}
.hero-badges{gap:8px!important}
.hero-badge,.pill,.summary-pill{
  border-radius:0!important;
  background:#fff!important;
  border:1px solid var(--line)!important;
  color:#333!important;
  box-shadow:none!important;
  text-transform:uppercase!important;
  letter-spacing:.07em!important;
  font-size:11px!important;
}
.side-card{padding:20px!important}
.side-preview,.detail-preview,.product-visual,.mockup-shell,.mockup-container,.mockup-frame,.thumb,.item-preview,.asset-thumb{
  background:#f4f4f1!important;
  border:1px solid var(--line)!important;
  border-radius:var(--radius-md)!important;
  box-shadow:none!important;
}
.product-visual{min-height:320px!important;margin-bottom:18px!important}
.detail-preview{min-height:650px!important}
.side-preview{min-height:380px!important}

.hero-carousel{
  position:relative!important;
  overflow:hidden!important;
  margin:0 0 34px!important;
  min-height:520px!important;
  border-radius:0!important;
  border:1px solid var(--line)!important;
  box-shadow:none!important;
  background:#111!important;
}
.hero-carousel-track{
  height:100%!important;
  display:flex!important;
  transition:transform .55s ease!important;
  will-change:transform!important;
}
.hero-slide{
  flex:0 0 100%!important;
  width:100%!important;
  display:grid!important;
  min-height:520px!important;
  padding:0!important;
  gap:0!important;
  grid-template-columns:.86fr 1.14fr!important;
  background:#111!important;
  color:#fff!important;
}
.hero-slide:after{display:none!important}
.hero-slide-copy{
  align-self:stretch!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  padding:46px!important;
  border-right:1px solid rgba(255,255,255,.16)!important;
}
.hero-slide-kicker{
  color:#b8cce0!important;
  font-size:11px!important;
  text-transform:uppercase!important;
  letter-spacing:.24em!important;
}
.hero-slide-title{
  font-size:clamp(42px,5vw,74px)!important;
  line-height:.88!important;
  letter-spacing:-.075em!important;
  margin:16px 0 16px!important;
}
.hero-slide-text{color:#dedede!important;line-height:1.8!important;max-width:48ch!important}
.hero-slide-media{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:520px!important;
  border:0!important;
  border-radius:0!important;
  background:#efefeb!important;
  padding:38px!important;
}
.hero-slide-media img{
  max-height:440px!important;
  filter:none!important;
}
.hero-carousel-dots{position:absolute!important;z-index:5!important;display:flex!important;left:46px!important;bottom:34px!important;gap:6px!important}
.hero-carousel-dot{
  width:30px!important;height:3px!important;border-radius:0!important;background:rgba(255,255,255,.35)!important;
}
.hero-carousel-dot.is-active{width:46px!important;background:#fff!important}
.hero-carousel-arrow{position:absolute!important;z-index:6!important;display:flex!important;right:28px!important;bottom:28px!important;gap:0!important;border:1px solid rgba(255,255,255,.28)!important}
.hero-carousel-arrow button{
  width:48px!important;height:44px!important;border-radius:0!important;border:0!important;
  border-left:1px solid rgba(255,255,255,.28)!important;background:rgba(17,17,17,.65)!important;
  backdrop-filter:none!important;color:#fff!important;
}
.hero-carousel-arrow button:first-child{border-left:0!important}

/* Product listing */
.grid-head{padding:6px 0 18px!important;border-bottom:1px solid var(--line)!important;margin-bottom:18px!important}
.grid-title{font-size:30px!important}
.products-grid{gap:16px!important}
.product-card{padding:12px!important}
.product-meta{margin-bottom:14px!important}
.product-name{font-size:18px!important;line-height:1.1!important}
.price,#product-price,.item-price,.summary-total{
  color:var(--ink)!important;
  font-weight:900!important;
}
.small-note{color:#777!important;text-transform:uppercase!important;letter-spacing:.08em!important;font-size:11px!important}
.swatches{gap:8px!important}
.swatch{
  width:24px!important;height:24px!important;border-radius:0!important;border:1px solid var(--line-dark)!important;box-shadow:none!important;
}
.swatch.active{outline:2px solid var(--brand)!important;outline-offset:2px!important;box-shadow:none!important;transform:none!important}

/* Buttons and form controls */
button,.btn,.btn-link,.primary-btn,.ghost-btn,.soft-btn,.link-btn,.action-btn,.secondary-cta,
.nav-item-btn,.side-view-btn,.mini-tool-btn,.tab-btn,.chip,.size-chip,.qty-box button,.image-upload-btn,
.back-shop-btn,.preview-switch button{
  border-radius:var(--radius-md)!important;
  box-shadow:none!important;
  text-transform:uppercase!important;
  letter-spacing:.055em!important;
  font-weight:800!important;
}
.primary-btn,.btn-primary,.btn:not(.secondary):not(.remove):not(.link-btn),.action-btn.primary,
.side-view-btn.active,.nav-item-btn.active,.mini-tool-btn.active,.preview-switch button.active,.tab-btn.active,
.chip.active,.size-chip.active{
  background:var(--ink)!important;
  border-color:var(--ink)!important;
  color:#fff!important;
  box-shadow:none!important;
}
.primary-btn:hover,.btn-primary:hover,.action-btn.primary:hover{background:var(--brand)!important;border-color:var(--brand)!important;color:#fff!important}
.ghost-btn,.soft-btn,.btn-secondary,.btn.secondary,.action-btn.secondary,.secondary-cta,.link-btn,.back-shop-btn,
.nav-item-btn,.side-view-btn,.mini-tool-btn,.tab-btn,.chip,.size-chip,.qty-box button{
  background:#fff!important;
  border:1px solid var(--line)!important;
  color:var(--ink)!important;
}
.ghost-btn:hover,.soft-btn:hover,.btn-secondary:hover,.btn.secondary:hover,.link-btn:hover,
.nav-item-btn:hover,.side-view-btn:hover,.mini-tool-btn:hover,.tab-btn:hover,.chip:hover,.size-chip:hover{
  border-color:var(--ink)!important;
  transform:none!important;
}
.link-btn.remove,.danger,.btn.danger{color:#fff!important;background:var(--danger)!important;border-color:var(--danger)!important}
input,textarea,select,.field,.field-textarea,.designer-input,.designer-select{
  border-radius:var(--radius-md)!important;
  border:1px solid var(--line-dark)!important;
  background:#fff!important;
  color:var(--ink)!important;
  box-shadow:none!important;
}
input:focus,textarea:focus,select:focus,.field:focus,.field-textarea:focus,.designer-input:focus,.designer-select:focus{
  outline:none!important;
  border-color:var(--brand)!important;
  box-shadow:0 0 0 3px rgba(0,59,113,.10)!important;
}
.radio-card:hover{border-color:var(--ink)!important}

/* Cart / orders / checkout */
.layout{gap:18px!important}
.list-head{border-bottom:1px solid var(--line)!important}
.cart-list,.orders{gap:10px!important}
.item-grid{gap:18px!important}
.thumb{border-radius:var(--radius-sm)!important}
.summary{top:96px!important}
.summary-row{border-bottom:1px solid var(--line)!important;background:transparent!important;border-left:0!important;border-right:0!important;border-top:0!important;border-radius:0!important}
.summary-list{gap:0!important;border:1px solid var(--line)!important;background:#fff!important}
.summary-list .summary-row{padding:14px!important}
.empty{background:#fff!important}
.status,.flash{
  background:var(--brand-soft)!important;
  border:1px solid #cad8e5!important;
  color:var(--brand)!important;
  border-radius:var(--radius-md)!important;
}
.err{border-radius:var(--radius-md)!important}

/* Designer/editor: keep geometry, remove toy look */
body.page-edit{background:#fff!important}
.sidebar-main{
  background:#fff!important;
  border-right:1px solid var(--line)!important;
  box-shadow:none!important;
}
.sidebar-header{background:#fff!important;border-bottom:1px solid var(--line)!important}
.inner-shell,.panel-content,.asset-tray-wrap{background:#fff!important}
.product-summary-card,.panel-block,.asset-tray-panel{border-radius:var(--radius-lg)!important}
.inner-nav{border-radius:var(--radius-md)!important;background:#f4f4f1!important;border:1px solid var(--line)!important;box-shadow:none!important}
.mockup-header,.floating-zoom,.bottom-zoom{background:#fff!important;border:1px solid var(--line)!important;border-radius:var(--radius-md)!important;box-shadow:none!important}
#shirtCanvas,canvas{border-radius:var(--radius-md)!important}
.print-guide{border:2px dashed rgba(0,59,113,.55)!important;background:rgba(0,59,113,.035)!important;border-radius:var(--radius-md)!important}
.print-guide::before{background:#fff!important;color:var(--brand)!important;border:1px solid #cad8e5!important;border-radius:0!important}
.image-upload-btn{border-style:dashed!important;background:#f7f7f5!important;color:var(--brand)!important}
.asset-item.active,.layer-item.active{border-color:var(--brand)!important;box-shadow:0 0 0 3px rgba(0,59,113,.08)!important}

/* Admin */
.admin-shell .sidebar{
  background:#111!important;
  color:#fff!important;
  border-right:0!important;
  box-shadow:none!important;
}
.admin-shell .brand{color:#fff!important}.admin-shell .brand span{color:#9fc3e8!important}
.admin-shell .side-note{color:#aaa!important}
.admin-shell .nav{gap:4px!important}
.admin-shell .nav a{
  border-radius:0!important;
  color:#d7d7d7!important;
  border:1px solid transparent!important;
  background:transparent!important;
  text-transform:uppercase!important;
  letter-spacing:.07em!important;
  font-size:12px!important;
}
.admin-shell .nav a:hover,.admin-shell .nav a.active{background:#1b1b1b!important;color:#fff!important;border-color:#333!important;border-left-color:#9fc3e8!important}
.admin-shell .nav a.logout{background:#1b1b1b!important;margin-top:22px!important}
.admin-shell .main{background:var(--bg)!important}
.admin-shell .top{border-bottom:1px solid var(--line)!important;padding-bottom:22px!important}
.admin-shell th{background:#efefeb!important;color:#222!important;text-transform:uppercase!important;letter-spacing:.06em!important;font-size:11px!important}
.admin-shell td{background:#fff!important}
.admin-shell tr:hover td{background:#fafafa!important}
.admin-shell .table-wrap{border-radius:var(--radius-lg)!important;border:1px solid var(--line)!important;background:#fff!important}
.admin-shell .img{border-radius:var(--radius-md)!important;background:#f4f4f1!important}
.admin-shell .badge{border-radius:0!important;background:var(--brand-soft)!important;color:var(--brand)!important}
.admin-shell .btn{border-radius:var(--radius-md)!important;background:var(--ink)!important;color:#fff!important}
.admin-shell .btn.secondary{background:#fff!important;color:#111!important;border:1px solid var(--line)!important}
.admin-shell label{color:#222!important;text-transform:uppercase!important;letter-spacing:.05em!important;font-size:11px!important}

/* Login */
.box{border-radius:var(--radius-lg)!important;border:1px solid var(--line)!important;background:#fff!important}
body:has(.box){background:var(--bg)!important}

@media(max-width:1080px){
  .hero-slide{grid-template-columns:1fr!important;min-height:auto!important}
  .hero-slide-copy{border-right:0!important;border-bottom:1px solid rgba(255,255,255,.16)!important;padding:34px!important}
  .hero-slide-media{min-height:300px!important}
  .hero-carousel{min-height:auto!important}
  .products-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:760px){
  .site-header-inner{min-height:auto!important;align-items:flex-start!important}
  .site-links{gap:0!important}
  .site-link{font-size:11px!important;padding:0 10px!important}
  .site-link.is-cart{margin-left:0!important}
  .hero-card{padding:22px!important}
  .hero-slide-title{font-size:40px!important}
  .hero-slide-copy{padding:28px 22px!important}
  .hero-carousel-dots{left:22px!important;bottom:22px!important}
  .hero-carousel-arrow{right:18px!important;bottom:18px!important}
  .products-grid{grid-template-columns:1fr!important}
  .product-visual{min-height:260px!important}
}

/* Fix: keep MojPrint wordmark clean and keep shop products visible under carousel */
.site-brand span{background:transparent!important;display:inline!important;padding:0!important;border-radius:0!important;color:var(--brand)!important}
.site-brand{background:transparent!important;white-space:nowrap!important}
#products-grid.products-grid{display:grid!important;visibility:visible!important;opacity:1!important}
.hero-carousel + section{display:block!important;visibility:visible!important;opacity:1!important}

/* Final logo + editor color patch */
:root{--primary-green:var(--brand)!important;--primary-green-dark:var(--brand-dark)!important}
.site-brand,.site-brand:visited{background:transparent!important;color:#111!important;display:inline-flex!important;align-items:baseline!important;gap:0!important;line-height:1!important;overflow:visible!important;white-space:nowrap!important}
.site-brand span,.site-brand span:before,.site-brand span:after{background:transparent!important;background-image:none!important;color:var(--brand)!important;display:inline!important;padding:0!important;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;text-shadow:none!important;-webkit-text-fill-color:var(--brand)!important;-webkit-background-clip:border-box!important;background-clip:border-box!important}
.page-edit .logo-text,.page-edit .logo-dot{display:none!important}
.page-edit .sidebar-header .header-top{justify-content:flex-end!important;margin-bottom:0!important}
.page-edit .nav-item-btn.active{background:var(--brand-soft)!important;color:var(--brand)!important;border-color:#cad8e5!important;box-shadow:none!important}
.page-edit .nav-item-btn:hover,.page-edit .action-btn.active,.page-edit .action-btn:hover,.page-edit .shape-btn:hover{background:var(--brand-soft)!important;color:var(--brand)!important;border-color:#cad8e5!important}
.page-edit input[type=range]::-webkit-slider-thumb{background:var(--brand)!important}
.page-edit input[type=range]::-moz-range-thumb{background:var(--brand)!important}
.page-edit .add-cart-btn,.page-edit .send-tshirt-btn,.page-edit .primary-btn{background:var(--brand)!important;border-color:var(--brand)!important;color:#fff!important;background-image:none!important}
.page-edit .add-cart-btn:hover,.page-edit .send-tshirt-btn:hover,.page-edit .primary-btn:hover{background:var(--brand-dark)!important;border-color:var(--brand-dark)!important}
.page-edit .workspace-stage{border-radius:var(--radius-lg)!important;background:#f4f4f1!important}
