/* ==========================================================================
   BuddyTH — การแสดงผล "รายละเอียดสินค้า" (2026-11-03)
   ใช้ไฟล์เดียวกัน 2 ที่:
     account.buddyth.com/assets/css/product-content.css   (ในตัวแก้ไข — เห็นเหมือนหน้าจริง)
     www.buddyth.com/stores/assets/css/product-content.css (หน้าสินค้า / หน้าแอดมินตรวจสินค้า)
   ทุกอย่างอยู่ใต้ .bdc-content และใช้ class prefix bdc- ไม่ชนกับ Bootstrap
   ========================================================================== */
.bdc-content{
  --bdc-text:#334155; --bdc-head:#0f172a; --bdc-muted:#64748b; --bdc-line:#e2e8f0; --bdc-soft:#f8fafc;
  --bdc-accent:#4f46e5; --bdc-accent-soft:#eef2ff;
  color:var(--bdc-text); font-size:15px; line-height:1.8; word-break:break-word; overflow-wrap:anywhere;
}
.dark .bdc-content{
  --bdc-text:#cbd5e1; --bdc-head:#f1f5f9; --bdc-muted:#94a3b8; --bdc-line:#334155; --bdc-soft:#1e293b;
  --bdc-accent:#a5b4fc; --bdc-accent-soft:rgba(99,102,241,.16);
}
.bdc-content > :first-child{margin-top:0}
.bdc-content > :last-child{margin-bottom:0}

.bdc-content p{margin:0 0 .9em}
.bdc-content h2,.bdc-content h3,.bdc-content h4{color:var(--bdc-head);font-weight:700;line-height:1.35;margin:1.4em 0 .5em}
.bdc-content h2{font-size:1.5em}
.bdc-content h3{font-size:1.25em}
.bdc-content h4{font-size:1.08em}
.bdc-content a{color:var(--bdc-accent);text-decoration:underline;text-underline-offset:2px}
.bdc-content b,.bdc-content strong{font-weight:700;color:var(--bdc-head)}
.bdc-content code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.88em;background:var(--bdc-soft);
  border:1px solid var(--bdc-line);border-radius:5px;padding:.1em .35em}
.bdc-content pre{margin:0 0 1em;padding:14px 16px;border-radius:10px;background:#0f172a;color:#e2e8f0;overflow-x:auto;
  font-size:13px;line-height:1.65;white-space:pre}
.bdc-content pre code{background:none;border:0;padding:0;color:inherit;font-size:inherit}
.bdc-content blockquote{margin:0 0 1em;padding:.6em 1em;border-left:4px solid var(--bdc-accent);background:var(--bdc-soft);
  border-radius:0 10px 10px 0;color:var(--bdc-muted);font-style:italic}
.bdc-content hr{border:0;height:1px;background:var(--bdc-line);margin:1.6em 0;opacity:1}

/* จัดตำแหน่ง */
.bdc-content .bdc-center{text-align:center}
.bdc-content .bdc-right{text-align:right}
.bdc-content blockquote.bdc-center{border-left:0;border-radius:10px}

/* รายการ */
.bdc-content ul,.bdc-content ol{margin:0 0 1em;padding-left:1.6em}
.bdc-content li{margin:.2em 0}
.bdc-content ul{list-style:disc}
.bdc-content ol{list-style:decimal}
.bdc-content ul.bdc-checklist{list-style:none;padding-left:0}
.bdc-content ul.bdc-checklist > li{position:relative;padding-left:1.9em}
.bdc-content ul.bdc-checklist > li::before{content:'';position:absolute;left:0;top:.3em;width:1.15em;height:1.15em;border-radius:5px;
  border:2px solid #cbd5e1;background:#fff;box-sizing:border-box}
.bdc-content ul.bdc-checklist > li.bdc-checked::before{border-color:#16a34a;background:#16a34a
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E") center/80% no-repeat}
.dark .bdc-content ul.bdc-checklist > li::before{background-color:#0f172a;border-color:#475569}
.dark .bdc-content ul.bdc-checklist > li.bdc-checked::before{background-color:#16a34a;border-color:#16a34a}

/* สีตัวอักษร / ไฮไลต์ */
.bdc-content .bdc-tc-red{color:#dc2626}
.bdc-content .bdc-tc-orange{color:#ea580c}
.bdc-content .bdc-tc-yellow{color:#ca8a04}
.bdc-content .bdc-tc-green{color:#16a34a}
.bdc-content .bdc-tc-blue{color:#2563eb}
.bdc-content .bdc-tc-purple{color:#9333ea}
.bdc-content .bdc-tc-pink{color:#db2777}
.bdc-content .bdc-tc-gray{color:#64748b}
.dark .bdc-content .bdc-tc-red{color:#f87171}
.dark .bdc-content .bdc-tc-orange{color:#fb923c}
.dark .bdc-content .bdc-tc-yellow{color:#facc15}
.dark .bdc-content .bdc-tc-green{color:#4ade80}
.dark .bdc-content .bdc-tc-blue{color:#60a5fa}
.dark .bdc-content .bdc-tc-purple{color:#c084fc}
.dark .bdc-content .bdc-tc-pink{color:#f472b6}
.dark .bdc-content .bdc-tc-gray{color:#94a3b8}
.bdc-content mark{padding:.05em .2em;border-radius:4px;color:inherit}
.bdc-content .bdc-hl-yellow{background:#fef08a}
.bdc-content .bdc-hl-green{background:#bbf7d0}
.bdc-content .bdc-hl-blue{background:#bfdbfe}
.bdc-content .bdc-hl-pink{background:#fbcfe8}
.bdc-content .bdc-hl-red{background:#fecaca}
.dark .bdc-content mark{color:#0f172a}

/* กล่องข้อความ (callout) */
.bdc-content .bdc-callout{position:relative;margin:0 0 1em;padding:12px 16px 12px 46px;border-radius:12px;border:1px solid;line-height:1.7}
.bdc-content .bdc-callout::before{position:absolute;left:14px;top:11px;width:22px;height:22px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;font-style:normal;color:#fff;line-height:1}
.bdc-content .bdc-callout-info{background:#eff6ff;border-color:#bfdbfe;color:#1e3a8a}
.bdc-content .bdc-callout-info::before{content:'i';background:#3b82f6}
.bdc-content .bdc-callout-success{background:#f0fdf4;border-color:#bbf7d0;color:#14532d}
.bdc-content .bdc-callout-success::before{content:'✓';background:#16a34a}
.bdc-content .bdc-callout-warning{background:#fffbeb;border-color:#fde68a;color:#78350f}
.bdc-content .bdc-callout-warning::before{content:'!';background:#f59e0b}
.bdc-content .bdc-callout-danger{background:#fef2f2;border-color:#fecaca;color:#7f1d1d}
.bdc-content .bdc-callout-danger::before{content:'✕';background:#ef4444}
.dark .bdc-content .bdc-callout-info{background:rgba(59,130,246,.12);border-color:rgba(59,130,246,.35);color:#bfdbfe}
.dark .bdc-content .bdc-callout-success{background:rgba(22,163,74,.12);border-color:rgba(22,163,74,.35);color:#bbf7d0}
.dark .bdc-content .bdc-callout-warning{background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.35);color:#fde68a}
.dark .bdc-content .bdc-callout-danger{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.35);color:#fecaca}
.bdc-content .bdc-callout b,.bdc-content .bdc-callout strong{color:inherit}

/* รูปภาพ */
.bdc-content figure{margin:0 auto 1.2em;text-align:center}
.bdc-content figure img,.bdc-content > img{display:block;max-width:100%;height:auto;margin:0 auto;border-radius:10px}
.bdc-content figure.bdc-img-full img{width:100%}
.bdc-content figure.bdc-img-medium{max-width:66%}
.bdc-content figure.bdc-img-small{max-width:40%}
@media (max-width:640px){.bdc-content figure.bdc-img-medium,.bdc-content figure.bdc-img-small{max-width:100%}}
.bdc-content figcaption{margin-top:.5em;font-size:.85em;color:var(--bdc-muted);line-height:1.5}

/* วิดีโอ */
.bdc-content .embed-wrap{position:relative;margin:0 0 1.2em;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:12px;background:#0f172a}
.bdc-content .embed-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ปุ่มลิงก์ */
.bdc-content p.bdc-cta{margin:1.2em 0}
.bdc-content .bdc-btn{display:inline-flex;align-items:center;justify-content:center;gap:.4em;min-height:44px;padding:.55em 1.4em;border-radius:10px;
  font-weight:600;text-decoration:none;line-height:1.3;transition:filter .15s,transform .15s;border:2px solid var(--bdc-accent)}
.bdc-content .bdc-btn:hover{filter:brightness(1.08);transform:translateY(-1px)}
.bdc-content .bdc-btn-primary,.bdc-content .bdc-btn:not(.bdc-btn-outline){background:#4f46e5;border-color:#4f46e5;color:#fff}
.bdc-content .bdc-btn-outline{background:transparent;color:var(--bdc-accent)}

/* ตาราง */
.bdc-content table.bdc-table{width:100%;margin:0 0 1.2em;border-collapse:separate;border-spacing:0;border:1px solid var(--bdc-line);border-radius:10px;overflow:hidden;font-size:.94em;display:table}
.bdc-content table.bdc-table th,.bdc-content table.bdc-table td{padding:9px 12px;border-bottom:1px solid var(--bdc-line);border-right:1px solid var(--bdc-line);vertical-align:top;text-align:left}
.bdc-content table.bdc-table tr > :last-child{border-right:0}
.bdc-content table.bdc-table tr:last-child > *{border-bottom:0}
.bdc-content table.bdc-table th{background:var(--bdc-soft);color:var(--bdc-head);font-weight:600}
@media (max-width:640px){.bdc-content table.bdc-table{display:block;overflow-x:auto;white-space:nowrap}}

/* คำถามพบบ่อย */
.bdc-content details.bdc-faq{margin:0 0 .6em;border:1px solid var(--bdc-line);border-radius:12px;background:var(--bdc-soft);overflow:hidden}
.bdc-content details.bdc-faq > summary{list-style:none;cursor:pointer;padding:12px 44px 12px 16px;position:relative;font-weight:600;color:var(--bdc-head)}
.bdc-content details.bdc-faq > summary::-webkit-details-marker{display:none}
.bdc-content details.bdc-faq > summary::after{content:'+';position:absolute;right:16px;top:50%;transform:translateY(-50%);font-size:20px;font-weight:400;color:var(--bdc-muted)}
.bdc-content details.bdc-faq[open] > summary::after{content:'–'}
.bdc-content details.bdc-faq .bdc-faq-body{padding:0 16px 14px;color:var(--bdc-text)}
