/* ============================================================
   SeaOwl — Firefox userChrome.css theme
   ----------------------------------------------------------------
   Minimal re-skin of Firefox's browser chrome. Keeps Firefox's
   structure, spacing, and behaviour 100% intact — only overrides
   what genuinely needs to change for the SeaOwl identity:

     - Tab bar           (dark surface, active tab cyan underline)
     - URL bar           (dark fill, cyan focus outline)
     - Sidebar           (dark, matching the tab bar)
     - Find bar          (dark)
     - Hover / selection (el-hover / el-selected from the palette)

   No widget chrome. No icon tint. No content-area overrides
   (that's what userContent.css is for, not shipped here).

   Install:
     1. about:profiles → open current profile's root directory
     2. Create a `chrome/` subdirectory if it doesn't exist
     3. Drop this file in as `chrome/userChrome.css`
     4. about:config → set
        `toolkit.legacyUserProfileCustomizations.stylesheets` true
     5. Restart Firefox

   Back up any existing `chrome/userChrome.css` first.

   Source: github.com/rosnovsky/seaowl
   ============================================================ */

:root {
  /* Single hue knob — flip the brand colour without touching
     anything else. 185 cyan is the SeaOwl default. */
  --sea-bg:            #0b0e17;
  --sea-surface:       #0f1420;
  --sea-elevated:      #111827;

  --sea-border:        #1e2a38;
  --sea-border-focus:  #2dd4bf;

  --sea-text:          #cce8e5;
  --sea-text-muted:    #6b8296;
  --sea-text-dis:      #3a4a5a;

  --sea-el-selected:   #1a3040;
  --sea-el-hover:      #1e2a38;

  --sea-primary:       #2dd4bf;
  --sea-success:       #4ade80;
  --sea-warning:       #fbbf24;
  --sea-error:         #f87171;
}

/* ----- Root window + toolbars ----- */
:root,
#main-window,
#navigator-toolbox,
#titlebar,
#TabsToolbar,
#nav-bar,
#PersonalToolbar {
  background-color: var(--sea-bg) !important;
  color: var(--sea-text) !important;
  --toolbar-bgcolor: var(--sea-bg) !important;
  --toolbar-color: var(--sea-text) !important;
  --toolbarbutton-icon-fill: var(--sea-text-muted) !important;
  --lwt-accent-color: var(--sea-bg) !important;
  --lwt-text-color: var(--sea-text) !important;
}

#navigator-toolbox {
  border-bottom: 1px solid var(--sea-border) !important;
}

/* ----- Tab strip ----- */
#TabsToolbar {
  --tab-min-height: 34px;
  background-color: var(--sea-bg) !important;
}

.tabbrowser-tab {
  color: var(--sea-text-muted) !important;
}

.tabbrowser-tab .tab-content {
  padding-inline: 10px !important;
}

.tabbrowser-tab:hover:not([selected]) .tab-background {
  background-color: var(--sea-el-hover) !important;
}

.tabbrowser-tab[selected] {
  color: var(--sea-text) !important;
}

.tabbrowser-tab[selected] .tab-background {
  background-color: var(--sea-surface) !important;
  background-image: none !important;
  border-bottom: 2px solid var(--sea-primary) !important;
  box-shadow: none !important;
}

.tab-line {
  display: none !important;
}

/* Close button — muted by default, error red on hover */
.tab-close-button {
  fill: var(--sea-text-muted) !important;
}

.tab-close-button:hover {
  fill: var(--sea-error) !important;
  background-color: transparent !important;
}

/* New tab button */
#tabs-newtab-button,
#new-tab-button {
  fill: var(--sea-text-muted) !important;
}

#tabs-newtab-button:hover,
#new-tab-button:hover {
  background-color: var(--sea-el-hover) !important;
  fill: var(--sea-primary) !important;
}

/* ----- URL bar ----- */
#urlbar,
#urlbar-background {
  --urlbar-box-bgcolor: var(--sea-surface) !important;
  --urlbar-box-focused-bgcolor: var(--sea-elevated) !important;
  background-color: var(--sea-surface) !important;
}

#urlbar-background {
  border: 1px solid var(--sea-border) !important;
  border-radius: 6px !important;
}

#urlbar[focused="true"] > #urlbar-background {
  border-color: var(--sea-primary) !important;
  box-shadow: 0 0 0 1px var(--sea-primary) !important;
  outline: none !important;
}

#urlbar .urlbar-input,
#urlbar-input {
  color: var(--sea-text) !important;
  caret-color: var(--sea-primary) !important;
}

/* Autocomplete dropdown */
.urlbarView {
  background-color: var(--sea-elevated) !important;
  border: 1px solid var(--sea-border) !important;
  color: var(--sea-text) !important;
}

.urlbarView-row:hover,
.urlbarView-row[selected] {
  background-color: var(--sea-el-selected) !important;
}

.urlbarView-title {
  color: var(--sea-text) !important;
}

.urlbarView-url,
.urlbarView-secondary {
  color: var(--sea-text-muted) !important;
}

/* Search bar ----- */
#searchbar {
  background-color: var(--sea-surface) !important;
  border: 1px solid var(--sea-border) !important;
  color: var(--sea-text) !important;
}

#searchbar:focus-within {
  border-color: var(--sea-primary) !important;
}

/* ----- Toolbar buttons ----- */
.toolbarbutton-1 {
  --toolbarbutton-hover-background: var(--sea-el-hover) !important;
  --toolbarbutton-active-background: var(--sea-el-selected) !important;
}

.toolbarbutton-1 .toolbarbutton-icon {
  fill: var(--sea-text-muted) !important;
}

.toolbarbutton-1:hover:not([disabled]) .toolbarbutton-icon {
  fill: var(--sea-text) !important;
}

.toolbarbutton-1[open] .toolbarbutton-icon {
  fill: var(--sea-primary) !important;
}

/* ----- Bookmarks bar ----- */
#PersonalToolbar .bookmark-item {
  color: var(--sea-text-muted) !important;
}

#PersonalToolbar .bookmark-item:hover {
  background-color: var(--sea-el-hover) !important;
  color: var(--sea-text) !important;
}

/* ----- Sidebar ----- */
#sidebar-box,
#sidebar-header,
#sidebar {
  background-color: var(--sea-bg) !important;
  color: var(--sea-text) !important;
  border-right: 1px solid var(--sea-border) !important;
  -moz-appearance: none !important;
}

#sidebar-header {
  border-bottom: 1px solid var(--sea-border) !important;
}

#sidebar-title {
  color: var(--sea-text) !important;
}

#sidebar-switcher-target {
  color: var(--sea-text-muted) !important;
}

/* ----- Find bar ----- */
.findbar-container,
findbar {
  background-color: var(--sea-surface) !important;
  color: var(--sea-text) !important;
  border-top: 1px solid var(--sea-border) !important;
}

.findbar-textbox {
  background-color: var(--sea-elevated) !important;
  border: 1px solid var(--sea-border) !important;
  color: var(--sea-text) !important;
}

.findbar-textbox:focus {
  border-color: var(--sea-primary) !important;
  box-shadow: 0 0 0 1px var(--sea-primary) !important;
}

.findbar-textbox[status="notfound"] {
  border-color: var(--sea-error) !important;
  background-color: var(--sea-surface) !important;
}

.found-matches {
  color: var(--sea-text-muted) !important;
}

/* ----- Menus, popups, panels ----- */
menupopup,
panel,
.panel-subview-body {
  --panel-background: var(--sea-elevated) !important;
  --panel-color: var(--sea-text) !important;
  --panel-border-color: var(--sea-border) !important;
}

menuitem:hover,
.subviewbutton:hover {
  background-color: var(--sea-el-hover) !important;
  color: var(--sea-text) !important;
}

/* ----- Status bar / notification ----- */
#statuspanel-label {
  background-color: var(--sea-surface) !important;
  color: var(--sea-text-muted) !important;
  border: 1px solid var(--sea-border) !important;
}

/* End. ~220 lines. */