/* Akeia Video — MediaCMS brand overrides (_extra.css loads last).
   Pattern mirrors FinOps: green gradient header + white logo pill. */

:root {
  --akeia-green-1: #cde899;
  --akeia-green-2: #9dc369;
  --akeia-green-3: #89b362;
  --akeia-green-4: #77a65b;
  --akeia-green-5: #5d8d49;
  --akeia-navy: #1e2761;
}

body {
  --default-theme-color: var(--akeia-green-5);
  --default-brand-color: var(--akeia-green-4);
  --default-logo-height: 1.35em;
  --logo-height: 1.35em;
  --body-bg-color: #ffffff;
  --body-text-color: #2a2f45;
  --header-bg-color: transparent;
  --header-circle-button-color: var(--akeia-navy);
  --header-popup-menu-color: #2a2f45;
  --header-popup-menu-icon-color: var(--akeia-navy);
  --sidebar-bg-color: #f7f7f7;
}

body.dark_theme {
  --default-theme-color: var(--akeia-green-2);
  --default-brand-color: var(--akeia-green-1);
  --body-bg-color: #141820;
  --body-text-color: #e8ebe4;
  --header-circle-button-color: #1e2761;
  --sidebar-bg-color: #1a1f2a;
}

/* FinOps-style five-stop green header band */
.page-header {
  background-color: transparent !important;
  background-image: linear-gradient(
    90deg,
    #cde899 0%,
    #9dc369 28%,
    #89b362 55%,
    #77a65b 78%,
    #5d8d49 100%
  ) !important;
  border-bottom: 1px solid rgba(30, 39, 97, 0.14);
}

.page-header:after {
  opacity: 0 !important;
  box-shadow: none !important;
}

/* White pill around the AKEIA wordmark (FinOps .brand-logo-card) */
.logo span {
  float: none !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  border-radius: 9999px;
  padding: 0.35rem 0.9rem;
  box-shadow: 0 2px 6px rgba(30, 39, 97, 0.12);
}

.logo span > img,
.logo picture,
.logo picture img {
  max-height: 1.35rem !important;
  height: 1.35rem;
  width: auto;
  display: block;
}

/* Header controls sit on the green band — keep light-mode contrast in both themes.
   Dark theme otherwise paints .circle-icon-button as #272727 (hamburger disappears). */
.page-header .circle-icon-button {
  --txt-color: var(--akeia-navy) !important;
  --bg-color: #ffffff !important;
  --bg-focus-color: rgba(30, 39, 97, 0.08) !important;
  --bg-active-color: rgba(30, 39, 97, 0.14) !important;
  color: var(--akeia-navy) !important;
  background-color: #ffffff !important;
  box-shadow: 0 1px 3px rgba(30, 39, 97, 0.16);
}

.page-header .circle-icon-button .material-icons,
.page-header .circle-icon-button i,
.page-header .material-icons {
  color: var(--akeia-navy) !important;
}

.page-header .button-link {
  color: var(--akeia-navy) !important;
  font-weight: 600;
}

a {
  color: var(--default-theme-color);
}

button,
.btn,
input[type="submit"] {
  accent-color: var(--akeia-green-5);
}

/* Oval / pill search (header + misc search boxes) */
.search-field-wrap form > div,
.search-field-wrap .text-field-wrap {
  border-radius: 9999px;
}

.search-field-wrap input[type="text"] {
  border-radius: 9999px 0 0 9999px !important;
  padding-left: 1rem !important;
  padding-right: 0.75rem !important;
}

.search-field-wrap button[type="submit"] {
  border-radius: 0 9999px 9999px 0 !important;
}

.search-box input {
  border-radius: 9999px !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}

/* Empty-home welcome copy (hardcoded "Welcome to MediaCMS!" in index.js) */
.welcome-title {
  font-size: 0 !important;
  line-height: 0 !important;
}

.welcome-title::before {
  content: "Welcome to AkeiaCMS!";
  display: block;
  font-size: 2rem;
  line-height: 1.25;
  font-weight: inherit;
  color: inherit;
}

/* Pill / oval action buttons (upload + related .button-link CTAs) */
.button-link,
a.button-link,
button.button-link,
.empty-media .button-link,
.page-header .button-link {
  border-radius: 9999px !important;
  padding-left: 1.25rem !important;
  padding-right: 1.25rem !important;
}