
/* =========================================================
   Gadget Makers Blog — Laptop Charger Guide
   Scope: .gmblaptop
   Recommended: Appearance > Customize > Additional CSS
   ========================================================= */
.gmblaptop,
.gmblaptop *{
  box-sizing:border-box !important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
}

.gmblaptop{
  --ink:#0f172a;
  --text:#334155;
  --muted:#64748b;
  --line:#e2e8f0;
  --soft:#f8fafc;
  --blue:#2563eb;
  --blue-dark:#1e3a8a;
  --blue-soft:#eff6ff;
  --green:#166534;
  --green-soft:#f0fdf4;
  --orange:#ff9900;
  --amber-soft:#fffbeb;
  --red:#991b1b;
  --red-soft:#fef2f2;
  max-width:920px !important;
  margin:0 auto !important;
  color:var(--text) !important;
  font-size:17px !important;
  line-height:1.72 !important;
}

.gmblaptop p{margin:0 0 1.05em !important;color:var(--text) !important}
.gmblaptop a{color:var(--blue) !important;text-decoration:none !important}
.gmblaptop ul,.gmblaptop ol{margin:.55em 0 1.25em !important;padding-left:1.25em !important}
.gmblaptop li{margin:.42em 0 !important;color:var(--text) !important}

.gmblaptop .section-title{
  margin:2.1em 0 .72em !important;
  color:var(--ink) !important;
  font-size:clamp(1.55rem,3vw,1.95rem) !important;
  line-height:1.24 !important;
  font-weight:850 !important;
  letter-spacing:-.02em !important;
}

.gmblaptop .sub-title{
  margin:1.25em 0 .5em !important;
  color:var(--ink) !important;
  font-size:1.18rem !important;
  line-height:1.35 !important;
  font-weight:800 !important;
}

/* Hero */
.gmblaptop .hero{
  margin:0 0 24px !important;
  padding:30px !important;
  border:1px solid #bfdbfe !important;
  border-radius:24px !important;
  background:
    radial-gradient(circle at 91% 8%,rgba(37,99,235,.15),transparent 32%),
    linear-gradient(135deg,#eff6ff 0%,#ffffff 58%,#f0fdf4 100%) !important;
  box-shadow:0 14px 38px rgba(15,23,42,.07) !important;
}

.gmblaptop .eyebrow{
  display:inline-block !important;
  margin:0 0 11px !important;
  padding:6px 11px !important;
  border-radius:999px !important;
  background:#dbeafe !important;
  color:#1d4ed8 !important;
  font-size:12px !important;
  line-height:1.2 !important;
  font-weight:850 !important;
  letter-spacing:.06em !important;
  text-transform:uppercase !important;
}

.gmblaptop .hero-title{
  margin:0 0 .45em !important;
  color:var(--ink) !important;
  font-size:clamp(1.8rem,4vw,2.45rem) !important;
  line-height:1.15 !important;
  font-weight:900 !important;
  letter-spacing:-.035em !important;
}

.gmblaptop .hero-lead{
  margin:0 !important;
  color:#334155 !important;
  font-size:1.04rem !important;
}

.gmblaptop .facts{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:11px !important;
  margin-top:19px !important;
}

.gmblaptop .fact{
  padding:14px 10px !important;
  border:1px solid #dbeafe !important;
  border-radius:13px !important;
  background:rgba(255,255,255,.96) !important;
  text-align:center !important;
}

.gmblaptop .fact strong{
  display:block !important;
  color:#1d4ed8 !important;
  font-size:1.08rem !important;
  line-height:1.25 !important;
  font-weight:850 !important;
}

.gmblaptop .fact span{
  display:block !important;
  margin-top:3px !important;
  color:var(--muted) !important;
  font-size:12px !important;
  line-height:1.35 !important;
}

/* Notice boxes */
.gmblaptop .disclosure,
.gmblaptop .method,
.gmblaptop .tip,
.gmblaptop .warning,
.gmblaptop .note,
.gmblaptop .summary{
  margin:19px 0 !important;
  padding:16px 18px !important;
  border-radius:14px !important;
}

.gmblaptop .disclosure{
  border:1px solid #fed7aa !important;
  border-left:4px solid #f59e0b !important;
  background:#fffbeb !important;
  color:#713f12 !important;
  font-size:13px !important;
}

.gmblaptop .method{
  border:1px solid #cbd5e1 !important;
  background:#f8fafc !important;
  font-size:14px !important;
}

.gmblaptop .tip{
  border:1px solid #bbf7d0 !important;
  background:var(--green-soft) !important;
}
.gmblaptop .tip strong{color:var(--green) !important}

.gmblaptop .note{
  border:1px solid #bfdbfe !important;
  background:var(--blue-soft) !important;
}

.gmblaptop .warning{
  border:1px solid #fecaca !important;
  background:var(--red-soft) !important;
  color:var(--red) !important;
}

.gmblaptop .summary{
  border:2px solid #bfdbfe !important;
  background:var(--blue-soft) !important;
}

/* CTA */
.gmblaptop .cta{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  min-height:48px !important;
  padding:12px 18px !important;
  border:0 !important;
  border-radius:10px !important;
  background:var(--orange) !important;
  color:#111827 !important;
  font-size:15px !important;
  line-height:1.2 !important;
  font-weight:850 !important;
  text-align:center !important;
  text-decoration:none !important;
  box-shadow:0 5px 14px rgba(255,153,0,.24) !important;
  transition:transform .15s ease,box-shadow .15s ease !important;
}

.gmblaptop .cta:hover{
  transform:translateY(-1px) !important;
  box-shadow:0 8px 18px rgba(255,153,0,.31) !important;
}

.gmblaptop .cta.dark{
  background:#111827 !important;
  color:#fff !important;
  box-shadow:none !important;
}

/* Selector */
.gmblaptop .selector-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:15px !important;
  margin:24px 0 31px !important;
}

.gmblaptop .selector{
  display:flex !important;
  flex-direction:column !important;
  gap:10px !important;
  min-width:0 !important;
  padding:19px !important;
  border:1px solid var(--line) !important;
  border-radius:17px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
}

.gmblaptop .selector.featured{
  border:2px solid var(--blue) !important;
  box-shadow:0 11px 28px rgba(37,99,235,.12) !important;
}

.gmblaptop .badge{
  display:inline-block !important;
  align-self:flex-start !important;
  margin:0 !important;
  padding:5px 9px !important;
  border-radius:999px !important;
  background:#dbeafe !important;
  color:#1e40af !important;
  font-size:11px !important;
  line-height:1.2 !important;
  font-weight:850 !important;
  letter-spacing:.04em !important;
  text-transform:uppercase !important;
}

.gmblaptop .selector-name{
  margin:0 !important;
  color:var(--ink) !important;
  font-size:1.08rem !important;
  line-height:1.35 !important;
  font-weight:850 !important;
}

.gmblaptop .selector p{
  margin:0 !important;
  color:var(--text) !important;
  font-size:14px !important;
  line-height:1.58 !important;
}

.gmblaptop .best-for{
  margin-top:auto !important;
  color:#475569 !important;
  font-size:13px !important;
  line-height:1.45 !important;
  font-weight:750 !important;
}

/* Product cards */
.gmblaptop .product{
  display:grid !important;
  grid-template-columns:175px minmax(0,1fr) !important;
  gap:22px !important;
  align-items:center !important;
  margin:29px 0 !important;
  padding:22px !important;
  border:1px solid #bfdbfe !important;
  border-radius:19px !important;
  background:linear-gradient(135deg,#fff 0%,#eff6ff 100%) !important;
  box-shadow:0 11px 30px rgba(15,23,42,.065) !important;
}

.gmblaptop .product-visual{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:165px !important;
  padding:14px !important;
  border-radius:14px !important;
  background:#fff !important;
}

.gmblaptop .product-visual img{
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:145px !important;
  max-height:150px !important;
  object-fit:contain !important;
}

.gmblaptop .watt-badge{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:132px !important;
  height:132px !important;
  border-radius:28px !important;
  background:linear-gradient(135deg,#0f172a,#2563eb) !important;
  color:#fff !important;
  font-size:2.1rem !important;
  font-weight:900 !important;
  letter-spacing:-.05em !important;
  box-shadow:0 12px 24px rgba(37,99,235,.2) !important;
}

.gmblaptop .product-title{
  margin:4px 0 8px !important;
  color:var(--ink) !important;
  font-size:1.22rem !important;
  line-height:1.35 !important;
  font-weight:850 !important;
}

.gmblaptop .product .cta{width:auto !important;min-width:235px !important}

.gmblaptop .procon{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:11px !important;
  margin:12px 0 15px !important;
}

.gmblaptop .pro,.gmblaptop .con{
  padding:11px 13px !important;
  border-radius:11px !important;
  font-size:13px !important;
  line-height:1.52 !important;
}

.gmblaptop .pro{background:var(--green-soft) !important;color:var(--green) !important}
.gmblaptop .con{background:var(--red-soft) !important;color:var(--red) !important}

/* Tables */
.gmblaptop .table-wrap{
  width:100% !important;
  margin:22px 0 28px !important;
  overflow-x:auto !important;
  border:1px solid var(--line) !important;
  border-radius:15px !important;
  background:#fff !important;
  box-shadow:0 6px 18px rgba(15,23,42,.04) !important;
  -webkit-overflow-scrolling:touch !important;
}

.gmblaptop table{
  width:100% !important;
  min-width:700px !important;
  margin:0 !important;
  border-collapse:collapse !important;
  border-spacing:0 !important;
  background:#fff !important;
}

.gmblaptop th{
  padding:14px 16px !important;
  border:0 !important;
  background:#0f1f42 !important;
  color:#fff !important;
  text-align:left !important;
  vertical-align:middle !important;
  font-size:14px !important;
  line-height:1.4 !important;
  font-weight:850 !important;
}

.gmblaptop td{
  padding:14px 16px !important;
  border:0 !important;
  border-top:1px solid var(--line) !important;
  background:#fff !important;
  color:var(--text) !important;
  vertical-align:top !important;
  font-size:14px !important;
  line-height:1.58 !important;
}

.gmblaptop tbody tr:nth-child(even) td{background:#f8fafc !important}

/* Steps */
.gmblaptop .steps{
  list-style:none !important;
  counter-reset:gmblaptop-step !important;
  margin:0 0 1.3em !important;
  padding:0 !important;
}

.gmblaptop .steps li{
  position:relative !important;
  margin:0 0 12px !important;
  padding:16px 17px 16px 56px !important;
  border:1px solid var(--line) !important;
  border-radius:13px !important;
  background:#fff !important;
}

.gmblaptop .steps li:before{
  counter-increment:gmblaptop-step !important;
  content:counter(gmblaptop-step) !important;
  position:absolute !important;
  top:16px !important;
  left:16px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:28px !important;
  height:28px !important;
  border-radius:50% !important;
  background:var(--blue) !important;
  color:#fff !important;
  font-size:14px !important;
  font-weight:850 !important;
}

/* FAQ */
.gmblaptop .faq details{
  margin:10px 0 !important;
  overflow:hidden !important;
  border:1px solid var(--line) !important;
  border-radius:13px !important;
  background:#fff !important;
}

.gmblaptop .faq summary{
  position:relative !important;
  cursor:pointer !important;
  list-style:none !important;
  padding:16px 48px 16px 18px !important;
  color:var(--ink) !important;
  font-size:16px !important;
  line-height:1.45 !important;
  font-weight:800 !important;
}

.gmblaptop .faq summary::-webkit-details-marker{display:none !important}

.gmblaptop .faq summary:after{
  content:"+" !important;
  position:absolute !important;
  top:50% !important;
  right:18px !important;
  transform:translateY(-50%) !important;
  color:var(--blue) !important;
  font-size:24px !important;
  line-height:1 !important;
  font-weight:500 !important;
}

.gmblaptop .faq details[open] summary:after{content:"−" !important}
.gmblaptop .faq-answer{padding:0 18px 17px !important}

/* Sticky CTA */
.gmblaptop .sticky-cta{
  position:sticky !important;
  bottom:12px !important;
  z-index:20 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:14px !important;
  margin:24px 0 !important;
  padding:12px 14px !important;
  border:1px solid #bfdbfe !important;
  border-radius:14px !important;
  background:rgba(255,255,255,.96) !important;
  box-shadow:0 10px 28px rgba(15,23,42,.14) !important;
  backdrop-filter:blur(8px) !important;
}

.gmblaptop .sticky-copy{
  color:var(--ink) !important;
  font-size:14px !important;
  line-height:1.35 !important;
  font-weight:800 !important;
}

.gmblaptop .sticky-cta .cta{
  width:auto !important;
  min-width:190px !important;
  min-height:43px !important;
  padding:10px 15px !important;
  font-size:14px !important;
}

/* Final */
.gmblaptop .final{
  margin:31px 0 8px !important;
  padding:27px !important;
  border-radius:20px !important;
  background:linear-gradient(135deg,#0b1739 0%,#1e3a8a 100%) !important;
  color:#fff !important;
  text-align:center !important;
}

.gmblaptop .final-title{
  margin:0 0 9px !important;
  color:#fff !important;
  font-size:1.58rem !important;
  line-height:1.28 !important;
  font-weight:850 !important;
}

.gmblaptop .final p{color:#dbeafe !important}
.gmblaptop .final .cta{width:auto !important;min-width:240px !important}

/* Mobile */
@media(max-width:760px){
  .gmblaptop{font-size:16px !important}
  .gmblaptop .hero{padding:21px !important;border-radius:18px !important}
  .gmblaptop .facts{grid-template-columns:1fr 1fr !important}
  .gmblaptop .selector-grid{grid-template-columns:1fr !important}
  .gmblaptop .product{grid-template-columns:1fr !important;padding:18px !important}
  .gmblaptop .procon{grid-template-columns:1fr !important}
  .gmblaptop .product .cta,.gmblaptop .final .cta{width:100% !important;min-width:0 !important}
  .gmblaptop .sticky-cta{
    flex-direction:column !important;
    align-items:stretch !important;
    text-align:center !important;
  }
  .gmblaptop .sticky-cta .cta{width:100% !important;min-width:0 !important}
  .gmblaptop table,.gmblaptop thead,.gmblaptop tbody,.gmblaptop th,.gmblaptop td,.gmblaptop tr{
    display:block !important;
    min-width:0 !important;
  }
  .gmblaptop thead{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    overflow:hidden !important;
    clip:rect(0 0 0 0) !important;
  }
  .gmblaptop tbody tr{
    padding:12px 14px !important;
    border-bottom:1px solid var(--line) !important;
    background:#fff !important;
  }
  .gmblaptop tbody tr:last-child{border-bottom:0 !important}
  .gmblaptop td{
    display:grid !important;
    grid-template-columns:42% 58% !important;
    gap:10px !important;
    padding:9px 0 !important;
    border:0 !important;
    border-bottom:1px dashed #e5e7eb !important;
    background:#fff !important;
  }
  .gmblaptop td:last-child{border-bottom:0 !important}
  .gmblaptop td:before{
    content:attr(data-label) !important;
    color:var(--ink) !important;
    font-weight:800 !important;
  }
}
