/*
Theme Name:   Hello Elementor Child (wonderpet)
Description:  www.wonderpet.asia 子主題。2026-10-30 由 OceanWP 轉換。
Template:     hello-elementor
Version:      1.0.0
Text Domain:  hello-elementor-child
*/

/* =====================================================================
 * 1. 原 OceanWP「外觀 → 自訂」設定的顏色
 * ===================================================================== */

body {
	background-color: #f0fadd;
}

a {
	color: #7baa3c;
}

a:hover,
a:active {
	color: #ec6b00;
}

/* =====================================================================
 * 2. 原 OceanWP 的基礎樣式
 *    Hello 沒有這些、或預設值不同（例如 Hello 的連結和按鈕預設是桃紅色、
 *    表格有斑馬紋）。不補的話，沒有在 Elementor 裡個別設定樣式的文字、
 *    標題、表格、表單都會變樣。
 * ===================================================================== */

/* OceanWP 把根字級設成 62.5%（1rem = 10px），Hello 沒設（1rem = 16px）。
   不補的話，用 rem 的元件（WordPress 區塊間距、Download Manager 等）都會放大 1.6 倍 */
html {
	font-size: 62.5%;
}

body {
	font-family: "Open Sans", sans-serif;
	font-size: 14px;
	line-height: 1.8;
	color: #4a4a4a;
	overflow-wrap: break-word;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: 600;
	margin: 0 0 20px;
	color: #333;
	line-height: 1.4;
}
h1 { font-size: 23px; }
h2 { font-size: 20px; }
h3 { font-size: 18px; }
h4 { font-size: 17px; }
h5 { font-size: 15px; }
h6 { font-size: 14px; }

p {
	margin: 0 0 20px;
}

ul,
ol {
	margin: 15px 0 15px 20px;
}

img {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}

blockquote,
.wp-block-quote {
	font-style: italic;
	margin: 20px 40px;
	padding-left: 20px;
	border-left: 3px solid #7baa3c;
}

table {
	width: 100%;
	margin-bottom: 2.618em;
	font-size: inherit;
	border-collapse: collapse;
	border-spacing: 0;
}
table td,
table th {
	padding: 10px;
	line-height: inherit;
	text-align: left;
	vertical-align: top;
	border: 0;
	border-bottom: 1px solid #e9e9e9;
}
table th {
	text-transform: uppercase;
}
/* 取消 Hello 的表格斑馬紋與 hover 底色 */
table tbody > tr:nth-child(odd) > td,
table tbody > tr:nth-child(odd) > th,
table tbody tr:hover > td,
table tbody tr:hover > th {
	background-color: transparent;
}

select {
	width: 100%;
	max-width: 100%;
	height: 2.25em;
	min-height: auto;
	border: 1px solid #ddd;
	border-radius: 0;
	background-color: #fff;
	cursor: pointer;
	padding: 0 15px;
	margin: 0;
}

form input[type="text"],
form input[type="password"],
form input[type="email"],
form input[type="url"],
form input[type="date"],
form input[type="month"],
form input[type="time"],
form input[type="datetime"],
form input[type="datetime-local"],
form input[type="week"],
form input[type="number"],
form input[type="search"],
form input[type="tel"],
form input[type="color"],
form textarea {
	display: inline-block;
	min-height: 40px;
	width: 100%;
	font-size: 14px;
	line-height: 1.8;
	padding: 6px 12px;
	vertical-align: middle;
	background-color: transparent;
	color: #333;
	border: 1px solid #ddd;
	border-radius: 3px;
	transition: all .3s ease;
}
form input:focus,
form textarea:focus {
	border-color: #bbb;
	outline: 0;
}

input[type="button"],
input[type="reset"],
input[type="submit"],
button[type="submit"],
.button {
	display: inline-block;
	font-family: inherit;
	background-color: #7baa3c;
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	margin: 0;
	padding: 14px 20px;
	border: 0;
	border-radius: 0;
	cursor: pointer;
	text-align: center;
	letter-spacing: .1em;
	line-height: 1;
	transition: all .3s ease;
}
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
button[type="submit"]:hover,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
button[type="submit"]:focus,
.button:hover,
.button:focus {
	background-color: #ec6b00;
	color: #fff;
}

.clr:after {
	content: "";
	display: block;
	visibility: hidden;
	clear: both;
	height: 0;
}

/* =====================================================================
 * 3. 麵包屑（原 OceanWP 樣式 + 原附加 CSS 的 position/overflow 覆寫，合併成一條）
 * ===================================================================== */

.site-breadcrumbs {
	position: relative;
	max-width: 100%;
	height: 32px;
	line-height: 32px;
	font-size: 13px;
	color: #c6c6c6;
	font-weight: normal;
	white-space: nowrap;
	overflow: visible;
}

/* =====================================================================
 * 4. 原「外觀 → 自訂 → 附加的 CSS」（.site-breadcrumbs 那條已併入上面第 3 段）
 * ===================================================================== */

.wp-block-table tr:first-child td {
	background-color: grey;
}

.wp-block-table tr td:first-child {
	background-color: red !important;
	font-weight: bold !important;
}

#general_footer a {
	color: white !important;
}

#general_footer a:hover {
	color: #EC6B00 !important;
}

.download-button:focus {
	outline: 0 !important;
	border: none !important;
	-moz-outline-style: none !important;
}

/* 服務 tag 內的連結維持白字（避免被 a{color:#7baa3c} 接管）2026-09-23 */
.taxonomy-tag a,
.taxonomy-tag a:hover,
.taxonomy-tag a:focus,
.taxonomy-tag a:visited {
	color: #fff;
	text-decoration: none;
}

/* =====================================================================
 * 5. 回到頂端按鈕（原 OceanWP 內建，程式在 functions.php 第 9 段）
 * ===================================================================== */

#scroll-top {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 100;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 2px;
	background-color: rgba(0, 0, 0, .4);
	color: #fff;
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s ease, visibility .3s ease, background-color .3s ease;
}
/* 顯示/隱藏由 JS 直接寫在按鈕的 style 上，不用 class：
   WP Rocket「移除未使用 CSS」是在頁面未捲動時判斷，只在捲動後才出現的 class 規則會被刪掉 */
#scroll-top:hover {
	background-color: rgba(0, 0, 0, .8);
	color: #fff;
}