/* Collectors Network — Shopify theme bridge
   Safe overlay for custom marketplace pages.
   Add after the existing page styles:
   <link rel="stylesheet" href="/theme-bridge.css">
*/

:root{
  --cn-black:#181410;
  --cn-paper:#F7F3ED;
  --cn-cream:#FEFCF9;
  --cn-warm:#EDE7DC;
  --cn-gold:#C4974A;
  --cn-gold-soft:#E8D5B0;
  --cn-muted:#7A7168;
  --cn-border:#DDD6CB;
  --cn-radius:18px;
  --cn-radius-lg:26px;
  --cn-shadow:0 18px 48px rgba(24,20,16,.08);
  --cn-shadow-soft:0 10px 30px rgba(24,20,16,.06);
}

html{
  scroll-behavior:smooth;
}

body{
  background:
    radial-gradient(circle at top left, rgba(232,213,176,.26), transparent 34%),
    var(--cn-paper);
}

/* Header */
.header{
  min-height:68px;
  box-shadow:0 10px 34px rgba(0,0,0,.12);
}

.brand-logo img{
  transition:opacity .2s ease, transform .2s ease;
}

.brand-logo:hover img{
  opacity:.86;
  transform:translateY(-1px);
}

.header-link,
.logout{
  transition:background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}

.header-link:hover,
.logout:hover{
  transform:translateY(-1px);
}

/* Main shell */
.dashboard{
  max-width:1240px;
}

.dashboard-shell{
  gap:28px;
}

.sidebar,
.hero-card,
.card,
.table-card,
.login-shell{
  border-color:rgba(221,214,203,.9);
  box-shadow:var(--cn-shadow-soft);
}

.sidebar{
  border-radius:var(--cn-radius-lg);
  background:rgba(254,252,249,.86);
  backdrop-filter:blur(10px);
}

.seller-mini h2,
.hero-card h1,
.table-head h2,
.login-card h2,
.login-hero h1,
.stat-value{
  letter-spacing:-.015em;
}

.side-title{
  color:var(--cn-muted);
}

.side-link{
  border-radius:12px;
  padding:11px 12px;
  margin-left:-12px;
  width:calc(100% + 24px);
  transition:background .18s ease, color .18s ease, transform .18s ease;
}

.side-link:hover,
.side-link.active{
  background:rgba(196,151,74,.10);
  color:var(--cn-black);
  transform:translateX(2px);
}

.side-link.active{
  font-weight:600;
}

.logout-link:hover{
  background:rgba(140,59,47,.08);
  color:var(--red);
}

/* Hero / cards */
.hero-card{
  border-radius:var(--cn-radius-lg);
  background:
    linear-gradient(135deg, rgba(254,252,249,.96), rgba(237,231,220,.92)),
    var(--cn-cream);
  overflow:hidden;
  position:relative;
}

.hero-card:after{
  content:"";
  position:absolute;
  right:-80px;
  top:-90px;
  width:220px;
  height:220px;
  border-radius:50%;
  background:rgba(196,151,74,.12);
  pointer-events:none;
}

.hero-card p{
  max-width:680px;
}

.cards{
  gap:16px;
}

.card{
  border-radius:22px;
  background:rgba(254,252,249,.9);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.card:hover{
  transform:translateY(-2px);
  border-color:rgba(196,151,74,.42);
  box-shadow:var(--cn-shadow);
}

.stat-label{
  color:var(--cn-muted);
}

/* Buttons */
.btn,
.header-link,
.logout,
.order-tab{
  text-transform:uppercase;
}

.btn{
  border-radius:999px;
  transition:background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease, opacity .18s ease;
}

.btn:hover:not(:disabled),
.link-list a:hover{
  transform:translateY(-1px);
}

.primary{
  background:var(--cn-black);
  color:var(--cn-gold-soft);
}

.primary:hover:not(:disabled){
  background:#000;
}

.secondary:hover:not(:disabled){
  background:var(--cn-black);
  color:var(--cn-gold-soft);
  border-color:var(--cn-black);
}

.small-btn{
  border-radius:999px;
  padding:9px 13px;
}

/* Tables / lists */
.table-card{
  border-radius:22px;
  background:rgba(254,252,249,.92);
}

.table-head{
  background:linear-gradient(180deg, rgba(254,252,249,.98), rgba(247,243,237,.58));
}

.link-list a,
.fake-link{
  border-radius:18px;
  transition:background .18s ease, border-color .18s ease, transform .18s ease;
}

.link-list a:hover{
  border-color:rgba(196,151,74,.5);
  background:rgba(237,231,220,.38);
}

.item-row{
  transition:background .18s ease;
}

.item-row:hover{
  background:rgba(237,231,220,.24);
}

.item-thumb,
.item-thumb-placeholder{
  border-radius:16px;
  overflow:hidden;
}

.item-info strong{
  font-weight:600;
}

.item-meta{
  color:var(--cn-muted);
}

/* Order tabs */
.order-tabs{
  background:rgba(247,243,237,.55);
  scrollbar-width:none;
}

.order-tabs::-webkit-scrollbar{
  display:none;
}

.order-tab{
  transition:background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}

.order-tab:hover{
  transform:translateY(-1px);
}

.order-tab.active{
  box-shadow:0 8px 20px rgba(24,20,16,.12);
}

/* Status pills */
.pill{
  border:1px solid rgba(0,0,0,.04);
}

.pill.new{color:#8b6b19;background:#fff6df}
.pill.processing{color:#7A5A18;background:#fff3d8}
.pill.shipped{color:#275C7A;background:#e8f3f8}
.pill.completed{color:var(--green);background:#edf6ee}
.pill.cancelled{color:var(--red);background:#f8e9e9}

/* Inputs */
.field input,
.field textarea{
  border-radius:14px;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.field input:focus,
.field textarea:focus{
  box-shadow:0 0 0 4px rgba(196,151,74,.12);
  background:#fff;
}

/* Empty states */
.empty{
  background:
    radial-gradient(circle at center top, rgba(232,213,176,.22), transparent 40%),
    rgba(254,252,249,.72);
  color:var(--cn-muted);
}

/* Login */
.login-shell{
  border-radius:28px;
}

.login-benefit{
  border-radius:20px;
}

/* Mobile polish */
@media(max-width:920px){
  .dashboard-shell{
    gap:18px;
  }

  .sidebar{
    border-radius:22px;
  }

  .side-link{
    margin-left:0;
    width:100%;
  }
}

@media(max-width:560px){
  .header-actions{
    gap:6px;
  }

  .header-link,
  .logout{
    padding:8px 10px;
    font-size:9px;
  }

  .hero-card,
  .table-card,
  .card,
  .sidebar{
    border-radius:20px;
  }

  .hero-card{
    padding:24px;
  }

  .item-row{
    padding:16px;
  }

  .item-main{
    width:100%;
  }

  .item-info strong{
    max-width:220px;
  }

  .small-btn{
    flex:1;
  }
}