/* OfficeCalculator v152 — higher contrast, styled within the existing homepage layout. */
.oc-calculator-app {
  --oc-bg:#ffffff;
  --oc-panel:#f5f8fc;
  --oc-border:#c5d2e1;
  --oc-text:#14243d;
  --oc-muted:#40536d;
  --oc-key:#ffffff;
  --oc-key-hover:#eef4fc;
  --oc-accent:#2563eb;
  --oc-accent-dark:#1d4ed8;
}
.oc-calculator-app.is-dark,
body.oc-dark .oc-calculator-app {
  --oc-bg:#15212c;
  --oc-panel:#1c2c3b;
  --oc-border:#5e7488;
  --oc-text:#f8fafc;
  --oc-muted:#c5d2de;
  --oc-key:#223544;
  --oc-key-hover:#30495d;
  --oc-accent:#2a74a8;
  --oc-accent-dark:#245b8f;
}

.oc-calculator-app.calculator-shell {
  border-color:#c5d2e1;
  color:var(--oc-text);
}
.oc-calculator-app .calculator-topbar {
  background:#f7f9fc;
  border-bottom-color:#d8e1ec;
}
.oc-calculator-app .mode-tab.active {
  color:#1747a6;
  background:#e7efff;
  border-color:#7da6f8;
  box-shadow:inset 0 -2px 0 #2563eb;
  font-weight:700;
}
.oc-calculator-app .business-tool-tab.active,
.oc-calculator-app .workspace-tab.active {
  color:#ffffff;
  background:#2563eb;
  border-color:#1d4ed8;
  font-weight:700;
}
.oc-calculator-app button:disabled {
  color:#50627a;
  background:#edf1f6;
  border-color:#c5d2e1;
  opacity:1;
  cursor:not-allowed;
}
.oc-calculator-app .display-panel {
  background:linear-gradient(115deg,#f5f8fc 0%,#e7eef9 100%) !important;
  border-color:#d0dceb !important;
}
.oc-calculator-app .display-panel .expression,
html body .oc-calculator-app .display-panel #expression {
  color:#435875 !important;
  -webkit-text-fill-color:#435875 !important;
}
.oc-calculator-app .display-panel .display-message,
html body .oc-calculator-app .display-panel #displayMessage {
  color:#435875 !important;
  -webkit-text-fill-color:#435875 !important;
}
.oc-calculator-app .display-panel output#result,
html body .oc-calculator-app .display-panel output#result {
  color:#14243d !important;
  -webkit-text-fill-color:#14243d !important;
}

.oc-calculator-app .memory-row button {
  color:#29415f;
  background:#f1f5fa;
  border-color:#d0dbe8;
  font-weight:700;
}
.oc-calculator-app .keypad .key {
  border-color:#c5d2e1;
  font-weight:700;
}
.oc-calculator-app .keypad .number {
  color:#14243d;
  background:#ffffff;
  border-color:#c5d2e1;
}
.oc-calculator-app .keypad .number:hover {
  color:#14243d;
  background:#eef4fc;
  border-color:#8ba8ce;
}
.oc-calculator-app .keypad .utility:not([data-action="clear"]) {
  color:#29415f !important;
  -webkit-text-fill-color:#29415f !important;
  background:#f0f4f9 !important;
  border-color:#c5d2e1 !important;
}
.oc-calculator-app .keypad .utility:not([data-action="clear"]):hover {
  background:#e7eff9 !important;
  border-color:#8ba8ce !important;
}
.oc-calculator-app .keypad [data-action="clear"] {
  color:#9a2020;
  background:#fff0f0;
  border-color:#e7a3a3;
}
.oc-calculator-app .keypad [data-action="clear"]:hover {
  color:#761616;
  background:#ffe3e3;
  border-color:#d17878;
}
.oc-calculator-app .keypad .operator {
  color:#1747a6;
  background:#e8f0ff;
  border-color:#a8c3f7;
}
.oc-calculator-app .keypad .operator:hover {
  color:#12377e;
  background:#dbe8ff;
  border-color:#7da6f8;
}
.oc-calculator-app .keypad .equals {
  color:#ffffff;
  background:#2563eb;
  border-color:#1d4ed8;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22);
}
.oc-calculator-app .keypad .equals:hover {
  color:#ffffff;
  background:#1d4ed8;
  border-color:#1e40af;
}

.oc-calculator-app .history-panel {
  background:#ffffff;
  border-color:#d8e1ec;
}
.oc-calculator-app .history-heading h2,
.oc-calculator-app .session-heading h3 {
  color:#1b3761;
}
.oc-calculator-app .history-heading span,
.oc-calculator-app .privacy-note,
.oc-calculator-app .keyboard-tip,
.oc-calculator-app .empty-history {
  color:#40536d;
}
.oc-calculator-app .history-item {
  border-color:#c5d2e1;
}
.oc-calculator-app .history-actions button,
.oc-calculator-app .session-primary-actions #saveResultImage,
.oc-calculator-app .session-primary-actions #downloadCsv {
  color:#1b3761;
  background:#ffffff;
  border-color:#aebed1;
  font-weight:700;
}
.oc-calculator-app .history-actions button:hover,
.oc-calculator-app .session-primary-actions #saveResultImage:hover,
.oc-calculator-app .session-primary-actions #downloadCsv:hover {
  color:#12377e;
  background:#edf3fc;
  border-color:#7e9fc8;
}
.oc-calculator-app .history-heading .text-button {
  color:#1b3761;
  border-color:#aebed1;
}
.oc-calculator-app .session-manager > input,
.oc-calculator-app .session-manager > textarea,
.oc-calculator-app .business-form input,
.oc-calculator-app .business-form select,
.oc-calculator-app .workspace-pane input,
.oc-calculator-app .workspace-pane textarea {
  color:#0f172a;
  background:#ffffff;
  border-color:#aebed1;
}
.oc-calculator-app .session-primary-actions #saveSession,
.oc-calculator-app .business-buttons button,
.oc-calculator-app .business-result-actions button {
  color:#ffffff;
  background:#2563eb;
  border-color:#1d4ed8;
  font-weight:700;
}
.oc-calculator-app .session-primary-actions #saveSession:hover,
.oc-calculator-app .business-buttons button:hover,
.oc-calculator-app .business-result-actions button:hover {
  color:#ffffff;
  background:#1d4ed8;
}
.oc-calculator-app .business-form label {
  color:#40566c;
}
.oc-calculator-app .business-result[data-state="success"] {
  color:#135a35;
  background:#e7f6ec;
  border-color:#74b587;
}
.oc-calculator-app .business-result[data-state="error"] {
  color:#8b1e1e;
  background:#fee2e2;
  border-color:#dc8585;
}

.oc-calculator-app button:focus-visible,
.oc-calculator-app input:focus-visible,
.oc-calculator-app select:focus-visible,
.oc-calculator-app textarea:focus-visible {
  position:relative;
  z-index:3;
  outline:3px solid #1d4ed8 !important;
  outline-offset:2px;
  box-shadow:0 0 0 5px #ffffff !important;
}
.oc-calculator-app.is-dark button:disabled,
body.oc-dark .oc-calculator-app button:disabled {
  color:#c5d2de;
  background:#263846;
  border-color:#5e7488;
}
.oc-calculator-app.is-dark .display-panel,
body.oc-dark .oc-calculator-app .display-panel {
  background:linear-gradient(180deg,#163a5c 0%,#0c2035 100%) !important;
  border-color:#3b6284 !important;
}
.oc-calculator-app.is-dark .display-panel .expression,
.oc-calculator-app.is-dark .display-panel .display-message,
body.oc-dark .oc-calculator-app .display-panel #expression,
body.oc-dark .oc-calculator-app .display-panel #displayMessage {
  color:#dceaf4 !important;
  -webkit-text-fill-color:#dceaf4 !important;
}
.oc-calculator-app.is-dark .display-panel output#result,
body.oc-dark .oc-calculator-app .display-panel output#result {
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
}
.oc-calculator-app.is-dark .calculator-topbar,
body.oc-dark .oc-calculator-app .calculator-topbar,
.oc-calculator-app.is-dark .history-panel,
body.oc-dark .oc-calculator-app .history-panel {
  background:#1c2c3b;
  border-color:#5e7488;
}
.oc-calculator-app.is-dark .keypad .number,
body.oc-dark .oc-calculator-app .keypad .number {
  color:#f8fafc;
  background:#223544;
  border-color:#5e7488;
}
.oc-calculator-app.is-dark .keypad .number:hover,
body.oc-dark .oc-calculator-app .keypad .number:hover {
  color:#ffffff;
  background:#30495d;
  border-color:#83a0b8;
}
.oc-calculator-app.is-dark .keypad .utility:not([data-action="clear"]),
body.oc-dark .oc-calculator-app .keypad .utility:not([data-action="clear"]) {
  color:#f8fafc !important;
  -webkit-text-fill-color:#f8fafc !important;
  background:#344654 !important;
  border-color:#6b8295 !important;
}
.oc-calculator-app.is-dark .keypad [data-action="clear"],
body.oc-dark .oc-calculator-app .keypad [data-action="clear"] {
  color:#ffe4e4;
  background:#542222;
  border-color:#aa6262;
}
.oc-calculator-app.is-dark .keypad .operator,
body.oc-dark .oc-calculator-app .keypad .operator {
  color:#eaf4fc;
  background:#163a5c;
  border-color:#5e8aab;
}
.oc-calculator-app.is-dark .keypad .operator:hover,
body.oc-dark .oc-calculator-app .keypad .operator:hover {
  color:#ffffff;
  background:#245b8f;
  border-color:#8bb7d6;
}
.oc-calculator-app.is-dark .history-heading h2,
body.oc-dark .oc-calculator-app .history-heading h2,
.oc-calculator-app.is-dark .session-heading h3,
body.oc-dark .oc-calculator-app .session-heading h3,
.oc-calculator-app.is-dark .history-heading span,
body.oc-dark .oc-calculator-app .history-heading span,
.oc-calculator-app.is-dark .privacy-note,
body.oc-dark .oc-calculator-app .privacy-note,
.oc-calculator-app.is-dark .keyboard-tip,
body.oc-dark .oc-calculator-app .keyboard-tip,
.oc-calculator-app.is-dark .empty-history,
body.oc-dark .oc-calculator-app .empty-history,
.oc-calculator-app.is-dark .business-form label,
body.oc-dark .oc-calculator-app .business-form label {
  color:#d2dee8;
}
.oc-calculator-app.is-dark .history-actions button,
body.oc-dark .oc-calculator-app .history-actions button,
.oc-calculator-app.is-dark .session-primary-actions #saveResultImage,
body.oc-dark .oc-calculator-app .session-primary-actions #saveResultImage,
.oc-calculator-app.is-dark .session-primary-actions #downloadCsv,
body.oc-dark .oc-calculator-app .session-primary-actions #downloadCsv {
  color:#eaf4fc;
  background:#223544;
  border-color:#6b8295;
}
.oc-calculator-app.is-dark .session-manager > input,
.oc-calculator-app.is-dark .session-manager > textarea,
.oc-calculator-app.is-dark .business-form input,
.oc-calculator-app.is-dark .business-form select,
.oc-calculator-app.is-dark .workspace-pane input,
.oc-calculator-app.is-dark .workspace-pane textarea,
body.oc-dark .oc-calculator-app .session-manager > input,
body.oc-dark .oc-calculator-app .session-manager > textarea,
body.oc-dark .oc-calculator-app .business-form input,
body.oc-dark .oc-calculator-app .business-form select,
body.oc-dark .oc-calculator-app .workspace-pane input,
body.oc-dark .oc-calculator-app .workspace-pane textarea {
  color:#f8fafc;
  background:#223544;
  border-color:#6b8295;
}
.oc-calculator-app.is-dark .business-result[data-state="success"],
body.oc-dark .oc-calculator-app .business-result[data-state="success"] {
  color:#c8f3d8;
  background:#153c31;
  border-color:#4d9974;
}
.oc-calculator-app.is-dark .business-result[data-state="error"],
body.oc-dark .oc-calculator-app .business-result[data-state="error"] {
  color:#ffe4e4;
  background:#542222;
  border-color:#aa6262;
}
.oc-calculator-app.is-dark button:focus-visible,
.oc-calculator-app.is-dark input:focus-visible,
.oc-calculator-app.is-dark select:focus-visible,
.oc-calculator-app.is-dark textarea:focus-visible,
body.oc-dark .oc-calculator-app button:focus-visible,
body.oc-dark .oc-calculator-app input:focus-visible,
body.oc-dark .oc-calculator-app select:focus-visible,
body.oc-dark .oc-calculator-app textarea:focus-visible {
  outline-color:#ffffff !important;
  box-shadow:0 0 0 5px #15212c !important;
}

@media (max-width:600px) {
  .oc-calculator-app .calculator-topbar .status-controls {
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:flex-start;
    flex-wrap:wrap;
    gap:5px;
    width:100%;
  }
  .oc-calculator-app .calculator-topbar .status-controls .small-control {
    flex:0 1 auto;
    width:auto;
    min-width:0;
    min-height:34px;
    padding:5px 8px;
    font-size:11px;
    white-space:nowrap;
  }
  .oc-calculator-app input,
  .oc-calculator-app select,
  .oc-calculator-app textarea {
    font-size:16px;
  }
  .oc-calculator-app .session-manager > input,
  .oc-calculator-app .business-form input,
  .oc-calculator-app .business-form select {
    min-height:44px;
  }
}
@media (max-width:360px) {
  .oc-calculator-app .calculator-topbar .status-controls .small-control {
    min-height:32px;
    padding:4px 6px;
    font-size:10px;
  }
}
@media (prefers-reduced-motion:reduce) {
  .oc-calculator-app button { transition:none !important; }
}