/* Тогооч Панда — дулаан улбар шар theme */
:root{
  --tp-primary: #ff7a00;      /* гол улбар шар */
  --tp-primary-600:#e96e00;
  --tp-primary-700:#cc6200;
  --tp-accent:  #e63946;      /* амт/халуун мэдрэмж */
  --tp-cream:   #fff4e5;      /* зөөлөн суурь */
  --tp-ink:     #2d1f18;      /* бордуу бичвэр */
}

html,body{height:100%;}
body{
  background:
    radial-gradient(24px 24px at 12px 12px, rgba(0,0,0,.03) 1px, transparent 1px) repeat,
    linear-gradient(180deg, #fff8ef 0%, var(--tp-cream) 100%) no-repeat;
  background-size: 24px 24px, cover;
  color: var(--tp-ink);
}

/* NAVBAR */
.navbar-panda{
  background: linear-gradient(90deg, var(--tp-primary) 0%, var(--tp-primary-600) 100%);
}
.navbar-panda .nav-link,
.navbar-panda .navbar-brand{color:#fff;}
.navbar-panda .nav-link.active,
.navbar-panda .nav-link:hover{color:#fff; opacity:.9;}
.navbar-panda .navbar-toggler{ border-color: rgba(255,255,255,.35); }
.navbar-panda .navbar-toggler-icon{ filter: invert(1); opacity:.85; }

/* CART BADGE */
.badge-cart{
  position: absolute; top:-6px; right:-8px;
  font-size:.65rem; background:#fff; color:var(--tp-primary);
  border:1px solid rgba(0,0,0,.05);
}

/* BUTTONS */
.btn-panda{
  background: var(--tp-primary);
  color:#fff; border:none;
}
.btn-panda:hover{ background: var(--tp-primary-700); color:#fff; }

/* SURFACES */
.card-soft{
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 8px 24px rgba(255,122,0,.08);
}
.pill{
  background: #ffe1c5; color: var(--tp-primary-700);
  border-radius: 999px; padding:.25rem .6rem; font-weight:600;
}

/* HERO */
.hero{
  background: linear-gradient(180deg, #fff3e3 0%, #ffe8cf 100%);
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.hero .lead{ color:#8a5a3d; }

/* FOOTER */
.footer-panda{
  background: var(--tp-primary-700);
  color:#ffecd7;
}

/* UTILS */
.link-underline-0{ text-decoration:none }
.link-underline-0:hover{ text-decoration:underline }

.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Social link icon томруулах */
.social-link i {
  font-size: 28px;   /* хүссэн хэмжээгээр өөрчил */
  color: #1877f2;    /* Facebook цэнхэр */
  transition: all .2s ease;
}

/* Hover үед underline + өнгө өөрчлөх */
.social-link:hover {
  text-decoration: underline;
}

.social-link:hover i {
  color: #145dbf;
  transform: scale(1.1);
}