/* ── Sidebar & standalone calculator ── */

.calc-card { border: 1px solid #e5e7eb; border-radius: 0.75rem; background: #f9fafb; box-shadow: 0 1px 3px rgba(0,0,0,0.08); overflow: hidden; }
.calc-toggle { display: flex; align-items: center; gap: 0.5rem; width: 100%; padding: 0.75rem 0.875rem; border: none; background: transparent; cursor: pointer; text-align: left; }
.calc-title { font-size: 0.8rem; font-weight: 600; color: #374151; flex: 1; }
.calc-chevron { width: 1rem; height: 1rem; color: #9ca3af; transition: transform 0.2s; }
.calc-chevron.open { transform: rotate(180deg); }
.calc-body { padding: 0 0.875rem 0.875rem; border-top: 1px solid #e5e7eb; }

/* Standalone inputs */
.calc-label { display: block; font-size: 0.7rem; font-weight: 500; color: #6b7280; margin-bottom: 0.2rem; }
.calc-input { width: 100%; padding: 0.375rem 0.5rem; border: 1px solid #d1d5db; border-radius: 0.375rem; font-size: 0.8rem; color: #374151; outline: none; background: #fff; box-sizing: border-box; }
.calc-input-prefix { position: absolute; left: 0.5rem; top: 50%; transform: translateY(-50%); font-size: 0.75rem; color: #9ca3af; }
.calc-input-suffix { position: absolute; right: 0.5rem; top: 50%; transform: translateY(-50%); font-size: 0.75rem; color: #9ca3af; }

/* Size buttons */
.calc-size-btn { padding: 0.2rem 0.5rem; font-size: 0.7rem; font-weight: 500; border-radius: 0.375rem; cursor: pointer; border: 1px solid #d1d5db; background: #fff; color: #6b7280; }
.calc-size-btn.active { border-color: #d97706; background: #fffbeb; color: #b45309; }

/* Submit */
.calc-submit { width: 100%; padding: 0.375rem 0.75rem; background: #d97706; color: #fff; font-size: 0.8rem; font-weight: 500; border: none; border-radius: 0.5rem; cursor: pointer; }
.calc-submit:hover { background: #b45309; }

/* Result */
.calc-result { margin-top: 0.75rem; padding: 0.625rem; background: #fff; border: 1px solid #e5e7eb; border-radius: 0.5rem; }
.calc-result-label { font-size: 0.75rem; color: #6b7280; }
.calc-result-price { font-size: 1.125rem; font-weight: 700; color: #d97706; }
.calc-result-cost { font-size: 0.8rem; font-weight: 500; color: #374151; }
.calc-result-divider { margin-top: 0.375rem; padding-top: 0.375rem; border-top: 1px solid #e5e7eb; }
.calc-result-part-label { font-size: 0.7rem; color: #9ca3af; }
.calc-result-part-value { font-size: 0.7rem; font-weight: 500; color: #6b7280; }
.calc-result-part-value.profit { color: #059669; }
.calc-result-part-value.tax { color: #dc2626; }
.calc-error { margin-top: 0.75rem; padding: 0.5rem; background: #fef2f2; border: 1px solid #fecaca; border-radius: 0.5rem; }
.calc-error span { font-size: 0.75rem; color: #dc2626; }
.calc-fx { font-size: 0.6rem; color: #9ca3af; text-align: right; margin-top: 0.375rem; }

/* ── Dark mode ── */
.dark .calc-card { border-color: rgba(255,255,255,0.1); background: rgba(255,255,255,0.05); }
.dark .calc-title { color: #e5e7eb; }
.dark .calc-body { border-top-color: rgba(255,255,255,0.1); }
.dark .calc-label { color: #9ca3af; }
.dark .calc-input { border-color: #4b5563; background: rgba(255,255,255,0.05); color: #e5e7eb; }
.dark .calc-input-prefix,
.dark .calc-input-suffix { color: #6b7280; }
.dark .calc-size-btn { border-color: #4b5563; background: rgba(255,255,255,0.05); color: #9ca3af; }
.dark .calc-size-btn.active { border-color: #d97706; background: rgba(217,119,6,0.15); color: #fbbf24; }
.dark .calc-result { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.1); }
.dark .calc-result-label { color: #9ca3af; }
.dark .calc-result-cost { color: #d1d5db; }
.dark .calc-result-divider { border-top-color: rgba(255,255,255,0.1); }
.dark .calc-result-part-label { color: #6b7280; }
.dark .calc-result-part-value { color: #9ca3af; }
.dark .calc-result-part-value.profit { color: #34d399; }
.dark .calc-result-part-value.tax { color: #f87171; }
.dark .calc-error { background: rgba(220,38,38,0.1); border-color: #7f1d1d; }
.dark .calc-error span { color: #f87171; }
.dark .calc-fx { color: #6b7280; }