/* ==========================================================
   ギフトオーダーフォーム
   すべて .gof 配下にスコープしているため、テーマのCSSとは衝突しません。
   色を変えたい場合は、下の --gof-accent を書き換えてください。
   ========================================================== */

.gof{
	--gof-accent:#8b1d24;
	--gof-accent-dark:#6d1219;
	--gof-ink:#2b2724;
	--gof-muted:#736c66;
	--gof-line:#d9d2ca;
	--gof-bg:#fbf9f7;
	--gof-danger:#b4231d;
	max-width:720px;
	margin:0 auto;
	color:var(--gof-ink);
	font-family:inherit;
	line-height:1.8;
	font-size:16px;
}
.gof *{box-sizing:border-box;}

.gof-lead{margin:0 0 28px;color:var(--gof-muted);font-size:15px;}

.gof-alert{
	margin:0 0 24px;
	padding:14px 18px;
	border:1px solid var(--gof-danger);
	border-left-width:5px;
	border-radius:4px;
	background:#fff6f5;
	color:var(--gof-danger);
	font-weight:700;
	font-size:15px;
}

.gof-row{
	display:grid;
	grid-template-columns:170px 1fr;
	gap:16px 24px;
	padding:20px 0;
	border-top:1px solid var(--gof-line);
	align-items:start;
}
.gof-row:first-of-type{border-top:none;padding-top:0;}

.gof-label{
	display:flex;
	align-items:center;
	gap:10px;
	font-weight:700;
	font-size:15px;
	padding-top:10px;
}
.gof-req{
	flex:none;
	background:var(--gof-accent);
	color:#fff;
	font-size:11px;
	font-weight:700;
	line-height:1;
	padding:5px 7px;
	border-radius:3px;
	letter-spacing:.04em;
}
.gof-field{min-width:0;}

.gof-input{
	width:100%;
	padding:12px 14px;
	border:1px solid var(--gof-line);
	border-radius:6px;
	background:#fff;
	color:var(--gof-ink);
	font-size:16px; /* iOSの自動ズーム防止のため16px以上を維持 */
	font-family:inherit;
	line-height:1.5;
	-webkit-appearance:none;
	appearance:none;
	transition:border-color .15s, box-shadow .15s;
}
.gof select.gof-input{
	background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23736c66' stroke-width='1.6'/%3E%3C/svg%3E");
	background-repeat:no-repeat;
	background-position:right 14px center;
	padding-right:38px;
}
.gof-input:focus{
	outline:none;
	border-color:var(--gof-accent);
	box-shadow:0 0 0 3px rgba(139,29,36,.13);
}
.gof-input-s{max-width:210px;}
.gof-input-m{max-width:330px;}
.gof-input.is-invalid{border-color:var(--gof-danger);background:#fffafa;}

.gof-inline{display:flex;flex-wrap:wrap;gap:10px;}
.gof-inline .gof-input-s{flex:1 1 180px;max-width:240px;}

.gof-help{margin:8px 0 0;font-size:13px;color:var(--gof-muted);line-height:1.6;}
.gof-error{margin:8px 0 0;font-size:13.5px;color:var(--gof-danger);font-weight:700;display:none;}
.gof-error.is-shown{display:block;}

.gof-terms{
	max-height:190px;
	overflow-y:auto;
	border:1px solid var(--gof-line);
	border-radius:6px;
	background:var(--gof-bg);
	padding:16px 18px;
	margin-bottom:16px;
	font-size:14px;
	line-height:1.9;
	-webkit-overflow-scrolling:touch;
}
.gof-terms p{margin:0 0 12px;}
.gof-terms p:last-child{margin-bottom:0;}

/* --- 商品の複数選択 --- */
.gof [hidden]{display:none !important;}

.gof-items{display:flex;flex-direction:column;gap:10px;}

.gof-item-row{
	display:grid;
	grid-template-columns:1fr 104px 60px;
	gap:10px;
	align-items:center;
}
.gof-item-col,.gof-qty-col,.gof-remove-col{min-width:0;}

.gof-qty-label{display:flex;align-items:center;gap:7px;margin:0;}
.gof-qty-text{
	flex:none;
	font-size:13px;
	color:var(--gof-muted);
	white-space:nowrap;
}
.gof-qty-input{text-align:right;padding-left:8px;padding-right:8px;}

.gof-row-remove{
	width:100%;
	padding:11px 6px;
	border:1px solid var(--gof-line);
	border-radius:6px;
	background:#fff;
	color:var(--gof-muted);
	font-size:13px;
	font-family:inherit;
	cursor:pointer;
	transition:background-color .15s,color .15s;
}
.gof-row-remove:hover{background:#fdf3f3;border-color:var(--gof-danger);color:var(--gof-danger);}
.gof-row-remove[disabled]{opacity:.35;cursor:default;}
.gof-row-remove[disabled]:hover{background:#fff;border-color:var(--gof-line);color:var(--gof-muted);}

.gof-items-actions{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:14px;
	margin-top:14px;
}
.gof-add-row{
	padding:10px 18px;
	border:1px dashed var(--gof-accent);
	border-radius:6px;
	background:#fff;
	color:var(--gof-accent);
	font-size:14px;
	font-weight:700;
	font-family:inherit;
	cursor:pointer;
	transition:background-color .15s;
}
.gof-add-row:hover{background:var(--gof-bg);}
.gof-add-row[disabled]{opacity:.4;cursor:default;}
.gof-add-row[disabled]:hover{background:#fff;}
.gof-items-note{margin:0;font-size:13px;color:var(--gof-muted);}

/* --- 1行だけの商品欄（中華おせちなど） --- */
.gof-items.is-single .gof-item-row{grid-template-columns:1fr 104px;}
.gof-items.is-single .gof-remove-col{display:none;}

/* --- 受け取り方法 --- */
.gof-radios{display:flex;flex-direction:column;gap:8px;}
.gof-radio{
	display:flex;
	align-items:flex-start;
	gap:11px;
	padding:12px 14px;
	border:1px solid var(--gof-line);
	border-radius:6px;
	background:#fff;
	cursor:pointer;
	transition:border-color .15s, background-color .15s;
}
.gof-radio:hover{border-color:var(--gof-accent);}
.gof-radio input{
	flex:none;
	width:20px;height:20px;
	margin:3px 0 0;
	accent-color:var(--gof-accent);
	cursor:pointer;
}
.gof-radio input:checked + .gof-radio-text{font-weight:700;}
.gof-radio-label{display:block;font-size:15px;}
.gof-radio-period{display:block;font-size:13.5px;color:var(--gof-muted);font-weight:400;}
.gof-radios.is-invalid .gof-radio{border-color:var(--gof-danger);}

.gof-note-box{
	margin:12px 0 0;
	padding:12px 14px;
	border-left:4px solid var(--gof-accent);
	background:var(--gof-bg);
	font-size:14px;
	line-height:1.7;
}
.gof-note-box p{margin:0 0 6px;}
.gof-note-box p:last-child{margin-bottom:0;}

.gof-opt{
	flex:none;
	background:#fff;
	color:var(--gof-muted);
	border:1px solid var(--gof-line);
	font-size:11px;
	font-weight:700;
	line-height:1;
	padding:4px 6px;
	border-radius:3px;
}
.gof textarea.gof-input{min-height:120px;resize:vertical;}

@media (max-width:640px){
	.gof-item-row{
		grid-template-columns:1fr auto;
		gap:8px 10px;
		padding:14px;
		border:1px solid var(--gof-line);
		border-radius:6px;
		background:var(--gof-bg);
	}
	.gof-item-col{grid-column:1 / -1;}
	.gof-qty-col{grid-column:1;}
	.gof-remove-col{grid-column:2;}
	.gof-row-remove{width:auto;padding:11px 16px;}
}

/* --- 同意事項の折りたたみ --- */
.gof-terms-lead{margin:0 0 18px;font-size:14.5px;color:var(--gof-muted);}
.gof-terms-lead p{margin:0 0 8px;}

.gof-agreement{margin-bottom:22px;}
.gof-agreement:last-of-type{margin-bottom:0;}

.gof-doc{
	border:1px solid var(--gof-line);
	border-radius:6px;
	background:var(--gof-bg);
	overflow:hidden;
}
.gof-doc-summary{
	padding:13px 16px;
	font-size:14.5px;
	font-weight:700;
	cursor:pointer;
	list-style:none;
	display:flex;
	align-items:center;
	gap:10px;
}
.gof-doc-summary::-webkit-details-marker{display:none;}
.gof-doc-summary::before{
	content:"";
	flex:none;
	width:8px;height:8px;
	border-right:2px solid var(--gof-accent);
	border-bottom:2px solid var(--gof-accent);
	transform:rotate(-45deg);
	margin-left:3px;
	transition:transform .15s;
}
.gof-doc[open] > .gof-doc-summary::before{transform:rotate(45deg);}
.gof-doc-summary:hover{background:#f4efe9;}
.gof-doc-summary:focus-visible{outline:3px solid rgba(139,29,36,.35);outline-offset:-3px;}

.gof-doc-body{
	max-height:300px;
	overflow-y:auto;
	padding:4px 18px 18px;
	border-top:1px solid var(--gof-line);
	font-size:14px;
	line-height:1.9;
	background:#fff;
	-webkit-overflow-scrolling:touch;
}
.gof-doc-body p{margin:14px 0 0;}
.gof-doc-body h4{
	margin:20px 0 6px;
	font-size:14.5px;
	font-weight:700;
}
.gof-doc-body h4:first-child{margin-top:16px;}
.gof-doc-body ul,.gof-doc-body ol{margin:8px 0 0;padding-left:1.4em;}
.gof-doc-body li{margin:4px 0;}
.gof-doc-body table{width:100%;border-collapse:collapse;margin:12px 0 0;font-size:13.5px;}
.gof-doc-body th,.gof-doc-body td{
	border:1px solid var(--gof-line);
	padding:8px 10px;
	text-align:left;
	vertical-align:top;
}
.gof-doc-body th{background:var(--gof-bg);white-space:nowrap;width:9em;}

.gof-check{
	display:flex;
	align-items:flex-start;
	gap:11px;
	padding:11px 0;
	cursor:pointer;
	font-size:15px;
}
.gof-check input{
	flex:none;
	width:21px;height:21px;
	margin:3px 0 0;
	accent-color:var(--gof-accent);
	cursor:pointer;
}
.gof-check a{color:var(--gof-accent);text-decoration:underline;text-underline-offset:2px;}

.gof-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}

.gof-actions{
	display:flex;
	flex-wrap:wrap;
	gap:12px;
	margin-top:32px;
}
.gof-btn{
	flex:1 1 200px;
	min-height:56px;
	padding:14px 28px;
	border:1px solid var(--gof-accent);
	border-radius:6px;
	background:var(--gof-accent);
	color:#fff;
	font-size:16px;
	font-weight:700;
	font-family:inherit;
	letter-spacing:.03em;
	cursor:pointer;
	transition:background-color .15s;
}
.gof-btn:hover{background:var(--gof-accent-dark);border-color:var(--gof-accent-dark);}
.gof-btn:focus-visible{outline:3px solid rgba(139,29,36,.35);outline-offset:2px;}
.gof-btn[disabled]{opacity:.55;cursor:default;}
.gof-btn-ghost{flex:0 1 150px;background:#fff;color:var(--gof-accent);}
.gof-btn-ghost:hover{background:var(--gof-bg);border-color:var(--gof-accent);}

.gof-panel{padding:4px 0;}
.gof-panel-title{
	margin:0 0 20px;
	font-size:19px;
	font-weight:700;
	padding-bottom:12px;
	border-bottom:2px solid var(--gof-accent);
}
.gof-summary{margin:0;}
.gof-summary div{
	display:grid;
	grid-template-columns:170px 1fr;
	gap:8px 24px;
	padding:14px 0;
	border-bottom:1px solid var(--gof-line);
}
.gof-summary dt{font-weight:700;font-size:14px;color:var(--gof-muted);margin:0;}
.gof-summary dd{margin:0;word-break:break-all;}

@media (max-width:640px){
	.gof-row,.gof-summary div{grid-template-columns:1fr;gap:6px;}
	.gof-label{padding-top:0;}
	.gof-row{padding:18px 0;}
	.gof-input-s,.gof-input-m,.gof-inline .gof-input-s{max-width:none;}
	.gof-btn,.gof-btn-ghost{flex:1 1 100%;}
}
@media (prefers-reduced-motion:reduce){
	.gof *{transition:none !important;}
}
