/* ICP global UI — ปุ่มสไตล์ตราม้าบิน ใช้ได้ทุกหน้า
 * วิธีใช้:
 *  HTML:      <a class="icp-btn" href="#">อ่านเพิ่มเติม</a>
 *  Elementor: Button widget > Advanced > CSS Classes ใส่ icp-btn (หรือ icp-btn icp-btn--outline)
 *  ตัวแปร:    icp-btn--outline (ขอบแดงพื้นขาว), icp-btn--white (ปุ่มขาวบนพื้นแดง), icp-btn--sm, icp-btn--lg, icp-btn--arrow (ใส่ → ท้าย), icp-btn--block (เต็มแถว)
 */
.icp-btn,
.icp-btn .elementor-button, .icp-btn.elementor-button {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 44px; padding: 10px 24px; border: 2px solid transparent; border-radius: 8px;
	background: linear-gradient(180deg, #d0252b 0%, #a3121a 100%) !important;
	color: #fff !important; font-weight: 700; font-size: 16px; line-height: 1.3; text-decoration: none !important; cursor: pointer;
	box-shadow: 0 3px 8px rgba(163,18,26,.35); transition: filter .15s, transform .15s, box-shadow .15s;
	font-family: inherit;
}
.icp-btn:hover, .icp-btn .elementor-button:hover, .icp-btn.elementor-button:hover { filter: brightness(1.08); transform: translateY(-1px); box-shadow: 0 6px 14px rgba(163,18,26,.4); color: #fff !important; }
.icp-btn:active, .icp-btn .elementor-button:active { transform: none; filter: brightness(.96); }
.icp-btn:focus-visible { outline: 3px solid rgba(179,21,27,.35); outline-offset: 2px; }

/* outline: ขอบแดง พื้นโปร่ง */
.icp-btn--outline, .icp-btn--outline .elementor-button {
	background: #fff !important; color: #b3151b !important; border-color: #b3151b; box-shadow: none;
}
.icp-btn--outline:hover, .icp-btn--outline .elementor-button:hover { background: #fdeaea !important; color: #b3151b !important; filter: none; box-shadow: none; }

/* white: ใช้บนพื้นแดง/รูป */
.icp-btn--white, .icp-btn--white .elementor-button { background: #fff !important; color: #b3151b !important; box-shadow: 0 3px 10px rgba(0,0,0,.25); }
.icp-btn--white:hover, .icp-btn--white .elementor-button:hover { background: #fff !important; color: #8c1216 !important; }

/* ขนาด */
.icp-btn--sm, .icp-btn--sm .elementor-button { min-height: 36px; padding: 6px 16px; font-size: 14px; border-radius: 6px; }
.icp-btn--lg, .icp-btn--lg .elementor-button { min-height: 52px; padding: 14px 32px; font-size: 18px; border-radius: 10px; }
.icp-btn--block, .icp-btn--block .elementor-button { display: flex; width: 100%; }

/* ลูกศร → ท้ายข้อความ (ตาม mockup "ดูสินค้าทั้งหมด →") */
.icp-btn--arrow:not(.elementor-widget)::after, .icp-btn--arrow .elementor-button-text::after { content: "→"; font-weight: 400; margin-left: 2px; transition: transform .15s; }
.icp-btn--arrow:not(.elementor-widget):hover::after, .icp-btn--arrow:hover .elementor-button-text::after { transform: translateX(3px); }

/* ลิงก์แดงขีดเส้นใต้แบบ "ดูข้อมูล →" */
.icp-link { color: #b3151b !important; text-decoration: underline; text-underline-offset: 3px; font-size: 14px; }
.icp-link:hover { color: #8c1216 !important; }

/* Elementor: ปุ่มที่ใส่ class ที่ widget ให้ไม่ถูก padding ของ widget ครอบ */
.elementor-widget-button.icp-btn { background: none !important; box-shadow: none; padding: 0; border: 0; min-height: 0; display: block; }
.elementor-widget-button.icp-btn:hover { transform: none; filter: none; }
