.ozcalc-wrap { margin: 24px 0; }

.ozcalc-card {
  border: 1px solid rgba(0,0,0,0.10);
  border-radius: 16px;
  padding: 18px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(0,0,0,0.06);
}

/* Theme override protection */
.ozcalc-card h2.ozcalc-title { margin-top: 0 !important; }

/* Updated per request: cover all margins */
.ozcalc-card h3.ozcalc-panel-title { margin: 0 !important; }


.ozcalc-title {
  margin: 0 0 16px 0;
  font-size: 22px;
  line-height: 1.25;
}

/* Two-column layout */
.ozcalc-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
@media (max-width: 980px) {
  .ozcalc-layout { grid-template-columns: 1fr; }
}

.ozcalc-panel {
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 16px;
  padding: 16px;
  background: rgba(0,0,0,0.015);
}

h3.ozcalc-panel-title {
  font-size: 20px;
  font-weight: 900;
  margin: 0 0 10px 0;
}

.ozcalc-panel-divider {
  height: 1px;
  background: rgba(0,0,0,0.10);
  margin: 10px 0 16px 0;
}

/* Inputs grid */
.ozcalc-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.ozcalc-field label {
  display: block;
  font-weight: 700;
  margin: 0 0 6px 0;
  font-size: 16px;
}

.ozcalc-wrap .ozcalc-field input.ozcalc-input {
  background-color: #ffffff !important;
}

/* Inputs + selects */
.ozcalc-input, .ozcalc-select {
  width: 100%;
  box-sizing: border-box;
  padding: 12px 12px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,0.18);
  background: #fff;
}

.ozcalc-input:focus, .ozcalc-select:focus {
  outline: none;
  border-color: rgba(0,0,0,0.35);
}

/* Chrome fix: prevent descender clipping inside native <select> */
.ozcalc-select {
  font-size: 16px;
  line-height: 1.2 !important;
  height: 48px;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 12px;
  padding-right: 38px;
  -webkit-appearance: none;
  appearance: none;
  text-rendering: geometricPrecision;

  background-image:
    linear-gradient(45deg, transparent 50%, rgba(0,0,0,0.55) 50%),
    linear-gradient(135deg, rgba(0,0,0,0.55) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 12px) 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}

.ozcalc-help { margin-top: 6px; font-size: 14px; opacity: 0.78; }
.ozcalc-inline { margin-top: 8px; }
.ozcalc-input-small { max-width: 260px; }

.ozcalc-field-toggle .ozcalc-toggle { display: flex; align-items: center; gap: 10px; }

.ozcalc-actions { display: flex; align-items: center; gap: 12px; margin-top: 14px; }
@media (max-width: 980px) { .ozcalc-actions { flex-direction: column; align-items: stretch; } }

.ozcalc-btn {
  border: 0;
  border-radius: 12px;
  padding: 12px 14px;
  font-weight: 900;
  cursor: pointer;
  background: rgba(30, 64, 175, 0.12);
}
.ozcalc-btn:hover { background: rgba(30, 64, 175, 0.18); }

.ozcalc-note { font-size: 13px; opacity: 0.8; }

/* 180-day helper line */
.ozcalc-helperline {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,0.10);
  background: rgba(0,0,0,0.02);
  font-size: 14px;
  font-weight: 800;
  opacity: 0.92;
}
.ozcalc-helper-ok {
  border-color: rgba(13, 148, 136, 0.25);
  background: rgba(13, 148, 136, 0.10);
}
.ozcalc-helper-warn {
  border-color: rgba(234, 179, 8, 0.35);
  background: rgba(234, 179, 8, 0.12);
}

/* Assumptions + details */
.ozcalc-details { margin-top: 14px; }
.ozcalc-details summary { cursor: pointer; font-weight: 900; }

.ozcalc-details ul {
  margin: 10px 0 0 0;
  padding-left: 20px;
  font-size: 16px;
  opacity: 0.85;
  display: grid;
  gap: 8px;
}
.ozcalc-details li { line-height: 1.35; }

/* Results */
.ozcalc-results { margin-top: 6px; }

.ozcalc-error {
  padding: 12px 12px;
  border-radius: 12px;
  border: 1px solid rgba(220, 38, 38, 0.25);
  background: rgba(220, 38, 38, 0.06);
}

/* Hero */
.ozcalc-hero {
  border-radius: 16px;
  padding: 16px;
  border: 1px solid rgba(0,0,0,0.06);
}
.ozcalc-hero-label { font-size: 16px; font-weight: 900; opacity: 0.85; }
.ozcalc-hero-value { font-size: 38px; font-weight: 950; margin-top: 8px; letter-spacing: -0.02em; }
.ozcalc-hero-sub { margin-top: 6px; font-size: 14px; opacity: 0.75; }
.ozcalc-hero-good { background: rgba(13, 148, 136, 0.08); }
.ozcalc-hero-bad  { background: rgba(185, 28, 28, 0.07); }

/* Highlight card */
.ozcalc-highlightcard {
  margin-top: 12px;
  border-radius: 14px;
  padding: 14px;
  border: 1px solid rgba(0,0,0,0.06);
  background: rgba(2, 132, 199, 0.06);
}
.ozcalc-highlightcard-label { font-size: 16px; font-weight: 900; opacity: 0.80; }
.ozcalc-highlightcard-value { margin-top: 6px; font-size: 24px; font-weight: 950; }
.ozcalc-highlightcard-sub { margin-top: 6px; font-size: 14px; opacity: 0.75; }

/* Badges section */
.ozcalc-badges-section { margin-top: 14px; padding-top: 2px; }
.ozcalc-badges-title { font-size: 14px; font-weight: 950; opacity: 0.85; }
.ozcalc-badges-hr { height: 1px; background: rgba(0,0,0,0.10); margin: 10px 0 12px 0; }
.ozcalc-badges { display: grid; grid-template-columns: 1fr; gap: 10px; }

/* Block badges */
.ozcalc-badge {
  display: block;
  border-radius: 15px;
  padding: 10px 12px;
  font-size: 14px;
  font-weight: 850;
  background: rgba(0,0,0,0.03);
  border: 1px solid rgba(0,0,0,0.08);
  opacity: 0.95;
}

/* Metric cards */
.ozcalc-metrics {
  margin-top: 14px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
.ozcalc-metric { border-radius: 14px; padding: 14px; border: 1px solid rgba(0,0,0,0.06); }
.ozcalc-metric-label { font-size: 16px; font-weight: 900; opacity: 0.85; }
.ozcalc-metric-value { margin-top: 8px; font-size: 24px; font-weight: 950; }
.ozcalc-metric-sub { margin-top: 6px; font-size: 14px; opacity: 0.75; }

.ozcalc-metric-sky    { background: rgba(2, 132, 199, 0.07); }
.ozcalc-metric-violet { background: rgba(124, 58, 237, 0.06); }
.ozcalc-metric-sand   { background: rgba(245, 158, 11, 0.08); }

/* Compare card */
.ozcalc-compare {
  margin-top: 14px;
  border-radius: 16px;
  border: 1px solid rgba(0,0,0,0.08);
  background: #fff;
  padding: 14px;
}
.ozcalc-compare-title { font-weight: 950; font-size: 18px; margin-bottom: 10px; }
.ozcalc-compare-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  border-top: 1px solid rgba(0,0,0,0.06);
}
.ozcalc-compare-row:first-of-type { border-top: 0; }
.ozcalc-compare-label { opacity: 0.82; font-weight: 800; }
.ozcalc-compare-value { font-weight: 950; }
.ozcalc-compare-value-oz { color: rgba(13, 148, 136, 0.95); }
.ozcalc-compare-row-total {
  background: rgba(0,0,0,0.02);
  margin: 10px -14px -14px -14px;
  padding: 12px 14px;
  border-top: 1px solid rgba(0,0,0,0.06);
  border-bottom-left-radius: 16px;
  border-bottom-right-radius: 16px;
}

/* Pills */
.ozcalc-pills { margin-top: 12px; }
.ozcalc-pill {
  margin-top: 10px;
  display: inline-block;
  padding: 8px 12px;
  border-radius: 15px;
  border: 1px solid rgba(0,0,0,0.10);
  font-size: 14px;
  opacity: 0.92;
  background: rgba(0,0,0,0.02);
}
.ozcalc-pill-good { border-color: rgba(13, 148, 136, 0.25); background: rgba(13, 148, 136, 0.10); }
.ozcalc-pill-warn { border-color: rgba(234, 179, 8, 0.35); background: rgba(234, 179, 8, 0.12); }

/* Meta */
.ozcalc-meta {
  margin-top: 14px;
  font-size: 16px;
  opacity: 0.85;
  display: grid;
  gap: 6px;
}

/* Disclaimer */
.ozcalc-disclaimer { margin-top: 14px; font-size: 12.5px; opacity: 0.8; }