/* Hesaplama araçları (cms/tools/*.twig) — yalnız araç sayfalarında yüklenir (cms/hbblog toolAssets) */

/* Sekmeler */
.hb-tool-tabs [aria-selected="true"] { background: #fff; color: #111827; box-shadow: 0 1px 2px rgba(0, 0, 0, .06); }
.hb-tool-tabs [aria-selected="false"] { color: #6b7280; }
.hb-tool-tabs [aria-selected="false"]:hover { color: #111827; }
.hb-tool [hidden] { display: none !important; }

/* Direnç çizimi: bacak — gövde (bantlar) — bacak */
.hb-res { display: flex; align-items: center; justify-content: center; }
.hb-res-lead { flex: 1; max-width: 6rem; height: 4px; background: linear-gradient(#cfd4da, #9aa1a9); border-radius: 2px; }
.hb-res-body {
	position: relative; display: flex; align-items: stretch; gap: 10px;
	height: 56px; padding: 0 26px; border-radius: 28px;
	background: linear-gradient(180deg, #f3dfb6 0%, #e6c78f 45%, #cfa866 100%);
	box-shadow: inset 0 -6px 10px rgba(0, 0, 0, .12), 0 6px 14px rgba(0, 0, 0, .08);
}
.hb-band { width: 12px; border-radius: 2px; box-shadow: inset 0 -4px 6px rgba(0, 0, 0, .18); }
/* Tolerans bandı diğerlerinden ayrık durur */
.hb-res-body .hb-band[data-band-visual="tol"], .hb-res-body .hb-band[data-vband="5"] { margin-left: 14px; }

.hb-band[data-color="black"]  { background: #1f2124; }
.hb-band[data-color="brown"]  { background: #7a4a24; }
.hb-band[data-color="red"]    { background: #d7261e; }
.hb-band[data-color="orange"] { background: #f07c12; }
.hb-band[data-color="yellow"] { background: #f5d211; }
.hb-band[data-color="green"]  { background: #1f9d48; }
.hb-band[data-color="blue"]   { background: #1f5fd1; }
.hb-band[data-color="violet"] { background: #8a3fd1; }
.hb-band[data-color="grey"]   { background: #8b8f96; }
.hb-band[data-color="white"]  { background: #f8f8f6; box-shadow: inset 0 0 0 1px #d6d6d2; }
.hb-band[data-color="gold"]   { background: linear-gradient(180deg, #f6e08a, #c9a227 55%, #9b7a13); }
.hb-band[data-color="silver"] { background: linear-gradient(180deg, #f2f3f5, #b8bcc2 55%, #8d9299); }

/* SMD direnç çipi */
.hb-smd {
	display: flex; align-items: center; justify-content: center;
	width: 180px; height: 84px; border-radius: 6px;
	background: linear-gradient(90deg, #c9ccd1 0 14%, #1d1f22 14% 86%, #c9ccd1 86%);
	box-shadow: 0 8px 18px rgba(0, 0, 0, .15);
}
.hb-smd span { color: #f5f5f4; font: 700 1.6rem/1 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .12em; }

/* Seramik kondansatör (kod gösterimi) */
.hb-cap {
	display: flex; align-items: center; justify-content: center;
	width: 120px; height: 120px; border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #f7c46a, #d98e1f 70%);
	box-shadow: 0 8px 18px rgba(0, 0, 0, .15);
}
.hb-cap span { color: #3b2400; font: 700 1.4rem/1 ui-monospace, SFMono-Regular, Menlo, monospace; }

@media (max-width: 480px) {
	.hb-res-body { gap: 7px; padding: 0 18px; height: 48px; }
	.hb-band { width: 9px; }
}