/* SPDX-FileCopyrightText: 2026 Arnold Bagabaldo */
/* SPDX-License-Identifier: LicenseRef-GoOffice-Proprietary */

/* Study 1 visual system: restrained institutional surfaces, clear hierarchy, and local-control cues. */
:root {
  --sc-navy: #0b1f3a;
  --sc-blue: #0365ac;
  --sc-teal: #0e7c66;
  --sc-gold: #d99a21;
  --sc-ink: #101828;
  --sc-body: #4a5568;
  --sc-muted: #667085;
  --sc-line: #dbe5ef;
  --sc-sky: #f6fbff;
  --sc-panel: rgba(255, 255, 255, 0.96);
  --sc-shadow: 0 16px 42px rgba(10, 35, 65, 0.1);
}

:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark),
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-native-shell,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .mail-shell {
  background: var(--sc-sky);
}

:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-workspace-topbar,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .mail-topbar,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-native-pane,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .office-files-rail,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .office-suite-workspace,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .office-details-panel {
  border-color: var(--sc-line);
  background: var(--sc-panel);
  box-shadow: var(--sc-shadow);
}

:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-workspace-topbar,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .mail-topbar {
  border-top: 3px solid var(--sc-navy);
}

:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-workspace-nav a,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .top-actions a,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-button,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .button {
  border-color: rgba(3, 101, 172, 0.2);
  color: var(--sc-navy);
  background: #ffffff;
}

:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-button.primary,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .top-actions a.primary,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .compose-button,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .office-new-menu .primary,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .office-action-menu .primary {
  color: #ffffff;
  border-color: var(--sc-blue);
  background: var(--sc-blue);
}

:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-account-button,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .identity-chip {
  background: var(--sc-navy);
}

:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-pane,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-toolbar,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-native-repeatable,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-native-trace {
  border-color: var(--sc-line);
  box-shadow: none;
}

:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-native-title .eyebrow,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .office-suite-title .eyebrow,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-native-detail .eyebrow {
  color: var(--sc-gold);
}

:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) input:focus,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) select:focus,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) textarea:focus {
  outline: 3px solid rgba(3, 101, 172, 0.14);
  outline-offset: 1px;
}

:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-account-panel,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .mail-account-panel,
:root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-chat-account-menu {
  border-color: var(--sc-line);
  box-shadow: 0 20px 48px rgba(10, 35, 65, 0.16);
}

@media (max-width: 700px) {
  :root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .go-workspace-topbar,
  :root:not([data-go-theme="dark"]) .go-workspace-app:not(.is-go-dark):not(.is-office-dark) .mail-topbar,
}
