/* Custom CSS skin to make AdminJS match the Laminar Tiles branding on a clean white theme */

:root {
  --color-primary: #061B2D;       /* Brand deep navy blue */
  --color-accent: #C5A880;        /* Brand gold/brass */
  --color-text: #0C1E29;          /* Dark slate text */
  --color-slate: #8B9DAE;         /* Slate blue/grey secondary text */
  --color-bg-light: #F8F9FA;      /* Subtle grey background */
  --color-border: #EEEEEF;        /* Light grey borders */
}

/* 1. Brand Logo Styling
   Adjusts size and spacing for the Laminar SVG brand logo on the white sidebar header */
img[src*="LaminarLogo.svg"],
.adminjs_Logo img,
[data-css="logo-image"] {
  max-height: 40px !important;
  object-fit: contain !important;
  width: auto !important;
}

/* Hide fallback text brand name when logo is active */
aside header h1,
.adminjs_Sidebar header h1 {
  display: none !important;
}

/* 2. Sidebar Navigation Styling (White Theme) */
aside,
[data-testid="sidebar"],
.adminjs_Sidebar,
section.sidebar {
  background-color: #FFFFFF !important;
  border-right: 1px solid var(--color-border) !important;
}

[data-css="sidebar-branding"],
aside header,
.adminjs_Sidebar header {
  background-color: #FFFFFF !important;
  border-bottom: 1px solid var(--color-border) !important;
  padding: 24px 16px !important;
}

/* Sidebar navigation links */
[data-testid="sidebar"] a,
aside a,
.adminjs_Sidebar a {
  color: var(--color-text) !important;
  font-weight: 500 !important;
  transition: all 0.2s ease-in-out !important;
}

/* Hover state: background turns light grey, text changes to corporate navy */
[data-testid="sidebar"] a:hover,
aside a:hover,
.adminjs_Sidebar a:hover {
  color: var(--color-primary) !important;
  background-color: var(--color-bg-light) !important;
  padding-left: 18px !important;
}

/* Selected active link state: brand navy blue background with a gold left indicator border */
[data-testid="sidebar"] a[class*="active"],
[data-testid="sidebar"] a[href*="/admin/resources/"] {
  color: var(--color-primary) !important;
  background-color: rgba(6, 27, 45, 0.05) !important; /* Subtle navy background tint */
  border-left: 3px solid var(--color-accent) !important; /* Gold active marker */
  font-weight: 600 !important;
}

/* Group headings in sidebar */
[data-css="sidebar-group-title"],
aside section h3,
.adminjs_Sidebar section h3 {
  color: var(--color-slate) !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  margin-top: 15px !important;
}

/* 3. Button and Action Element Overrides (Corporate Navy & Gold) */
button,
a.button,
.adminjs_Button,
[data-testid="button"],
button[class*="Button"] {
  background-color: var(--color-primary) !important;
  color: #FFFFFF !important;
  border: none !important;
  font-weight: 600 !important;
  transition: all 0.2s ease-in-out !important;
}

button:hover,
.adminjs_Button:hover,
button[class*="Button"]:hover {
  background-color: var(--color-accent) !important; /* Changes to gold on hover */
  cursor: pointer !important;
  color: #FFFFFF !important;
}

/* Primary link styling */
a {
  color: var(--color-primary) !important;
}
a:hover {
  color: var(--color-accent) !important;
}