/* =============================================================================
   BloomBooks Theme Override for Order Book
   
   CRITICAL: This file applies BloomBooks visual styling to the Order Book
   without breaking the spreadsheet/grid functionality.
   
   DO NOT modify selectors that could affect:
   - Table cells (td, th)
   - Grid containers with display: grid
   - Spreadsheet wrapper elements
   - Any elements with data-grid, data-cell, or similar attributes
   ============================================================================= */

/* --- CSS Variables: BloomBooks Color Palette --- */
:root {
  --bb-bg-primary: #fafaf9;
  --bb-bg-secondary: #ffffff;
  --bb-bg-tertiary: #f5f3f0;
  --bb-bg-card: #ffffff;
  --bb-bg-hover: #f0eeeb;
  --bb-bg-input: #ffffff;
  
  --bb-border: #e8e4df;
  --bb-border-light: #f0eeeb;
  
  --bb-text-primary: #2d2d2d;
  --bb-text-secondary: #6b6b6b;
  --bb-text-muted: #a0a0a0;
  --bb-text-link: #5a7d60;
  
  --bb-accent: #6b8f71;
  --bb-accent-end: #5a7d60;
  --bb-accent-gradient: linear-gradient(135deg, #6b8f71, #5a7d60);
  --bb-accent-soft: rgba(107,143,113,0.12);
  
  --bb-secondary: #d4a0a0;
  --bb-secondary-end: #c48b8b;
  
  --bb-success: #6b8f71;
  --bb-warning: #d4a574;
  --bb-danger: #c47070;
  --bb-info: #7ca8c6;
  
  --bb-radius: 12px;
  --bb-radius-sm: 8px;
  --bb-shadow: 0 2px 8px rgba(0,0,0,0.06);
  --bb-shadow-lg: 0 8px 24px rgba(0,0,0,0.08);
  --bb-transition: 0.2s ease;
  
  --bb-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

/* --- Base Styles --- */
body {
  background-color: var(--bb-bg-primary) !important;
  color: var(--bb-text-primary) !important;
  font-family: var(--bb-font) !important;
}

/* --- Hide Tom Trovato / ChatGPT Logos --- */
img[src*="tom-trovato"],
img[src*="ChatGPT"],
img[src*="logo"][alt*="Tom"],
img[src*="avatar"][alt*="Tom"] {
  display: none !important;
}

/* --- Login Screen --- */
.login-screen,
[class*="login"][class*="container"],
[class*="auth"][class*="container"] {
  background: var(--bb-bg-primary) !important;
  background-image: radial-gradient(circle at 30% 50%, rgba(107,143,113,0.07) 0%, transparent 60%),
                    radial-gradient(circle at 70% 80%, rgba(212,160,160,0.06) 0%, transparent 50%) !important;
}

[class*="login"][class*="card"],
[class*="auth"][class*="card"] {
  background: var(--bb-bg-card) !important;
  border: 1px solid var(--bb-border) !important;
  border-radius: var(--bb-radius) !important;
  box-shadow: var(--bb-shadow-lg) !important;
}

/* --- Sidebar Styling --- */
aside,
nav[class*="sidebar"],
[class*="sidebar"][class*="nav"],
[role="navigation"][class*="sidebar"],
.sidebar-container {
  background: var(--bb-bg-secondary) !important;
  border-right: 1px solid var(--bb-border) !important;
}

/* Sidebar Header */
aside > div:first-child,
[class*="sidebar"] > div:first-child,
[class*="sidebar"][class*="header"] {
  border-bottom: 1px solid var(--bb-border) !important;
  background: var(--bb-bg-secondary) !important;
}

/* Navigation Items */
aside a,
aside button:not([class*="sheet"]):not([class*="grid"]),
nav[class*="sidebar"] a,
nav[class*="sidebar"] button:not([class*="sheet"]):not([class*="grid"]),
[class*="nav"][class*="item"]:not([class*="sheet"]):not([class*="grid"]),
[role="navigation"] a {
  color: var(--bb-text-secondary) !important;
  border-radius: var(--bb-radius-sm) !important;
  transition: all var(--bb-transition) !important;
}

aside a:hover,
aside button:hover:not([class*="sheet"]):not([class*="grid"]),
nav[class*="sidebar"] a:hover,
nav[class*="sidebar"] button:hover:not([class*="sheet"]):not([class*="grid"]),
[class*="nav"][class*="item"]:hover:not([class*="sheet"]):not([class*="grid"]) {
  background: var(--bb-bg-hover) !important;
  color: var(--bb-text-primary) !important;
  text-decoration: none !important;
}

/* Active Navigation Item */
aside a[class*="active"],
aside button[class*="active"]:not([class*="sheet"]):not([class*="grid"]),
nav[class*="sidebar"] a[class*="active"],
nav[class*="sidebar"] button[class*="active"]:not([class*="sheet"]):not([class*="grid"]),
[class*="nav"][class*="item"][class*="active"]:not([class*="sheet"]):not([class*="grid"]),
[aria-current="page"] {
  background: var(--bb-accent-soft) !important;
  color: var(--bb-accent) !important;
  font-weight: 500 !important;
}

/* --- Top Bar / Header --- */
header,
[class*="topbar"],
[class*="header"]:not([class*="table"]):not([class*="grid"]):not([class*="sheet"]) {
  background: var(--bb-bg-secondary) !important;
  border-bottom: 1px solid var(--bb-border) !important;
}

/* Page Title */
h1:not(table h1):not([class*="grid"] h1),
h2:not(table h2):not([class*="grid"] h2),
[class*="page"][class*="title"],
[class*="page-title"] {
  color: var(--bb-text-primary) !important;
  font-weight: 600 !important;
}

/* --- Tab Navigation --- */
[role="tablist"],
[class*="tabs"]:not([class*="sheet"]):not([class*="grid"]) {
  border-bottom: 2px solid var(--bb-border) !important;
  gap: 0 !important;
  overflow-x: auto !important;
}

[role="tab"],
[class*="tab"]:not([class*="table"]):not([class*="sheet"]):not([class*="grid"]) {
  color: var(--bb-text-secondary) !important;
  border-bottom: 2px solid transparent !important;
  transition: all var(--bb-transition) !important;
  background: transparent !important;
  margin-bottom: -2px !important;
  padding: 10px 18px !important;
  font-weight: 500 !important;
}

[role="tab"]:hover,
[class*="tab"]:hover:not([class*="table"]):not([class*="sheet"]):not([class*="grid"]) {
  color: var(--bb-text-primary) !important;
}

[role="tab"][aria-selected="true"],
[role="tab"][data-state="active"],
[class*="tab"][class*="active"]:not([class*="table"]):not([class*="sheet"]):not([class*="grid"]) {
  color: var(--bb-accent) !important;
  border-bottom-color: var(--bb-accent) !important;
}

/* --- Buttons (Exclude Grid Buttons) --- */
button:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table button):not(.handsontable button):not([data-grid] button),
[class*="btn"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table *):not(.handsontable *):not([data-grid] *),
input[type="button"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table input),
input[type="submit"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table input) {
  border-radius: var(--bb-radius-sm) !important;
  transition: all var(--bb-transition) !important;
  font-weight: 500 !important;
}

/* Primary Buttons */
button[class*="primary"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table button),
[class*="btn-primary"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table *),
button[variant="default"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table button) {
  background: var(--bb-accent-gradient) !important;
  color: #ffffff !important;
  border: none !important;
}

button[class*="primary"]:hover:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table button),
[class*="btn-primary"]:hover:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table *) {
  filter: brightness(1.05) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(107,143,113,0.25) !important;
}

/* Secondary/Outline Buttons */
button[class*="secondary"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table button),
button[class*="outline"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table button),
[class*="btn-secondary"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table *),
[class*="btn-outline"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table *) {
  background: var(--bb-bg-tertiary) !important;
  color: var(--bb-text-primary) !important;
  border: 1px solid var(--bb-border) !important;
}

button[class*="secondary"]:hover:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table button),
button[class*="outline"]:hover:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table button),
[class*="btn-secondary"]:hover:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table *),
[class*="btn-outline"]:hover:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table *) {
  background: var(--bb-bg-hover) !important;
  border-color: var(--bb-secondary) !important;
}

/* Danger Buttons */
button[class*="danger"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table button),
button[class*="destructive"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table button),
[class*="btn-danger"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table *),
[class*="btn-destructive"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table *) {
  background: var(--bb-danger) !important;
  color: #ffffff !important;
}

/* Ghost/Text Buttons */
button[class*="ghost"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table button),
[class*="btn-ghost"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table *) {
  background: transparent !important;
  color: var(--bb-text-secondary) !important;
}

button[class*="ghost"]:hover:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table button),
[class*="btn-ghost"]:hover:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table *) {
  background: var(--bb-bg-tertiary) !important;
  color: var(--bb-text-primary) !important;
}

/* --- Form Inputs (Exclude Grid Inputs) --- */
input:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table input):not(.handsontable input):not([data-grid] input),
select:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table select):not(.handsontable select):not([data-grid] select),
textarea:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table textarea):not(.handsontable textarea):not([data-grid] textarea) {
  background: var(--bb-bg-input) !important;
  color: var(--bb-text-primary) !important;
  border: 1px solid var(--bb-border) !important;
  border-radius: var(--bb-radius-sm) !important;
  transition: border var(--bb-transition), box-shadow var(--bb-transition) !important;
}

input:focus:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table input):not(.handsontable input):not([data-grid] input),
select:focus:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table select):not(.handsontable select):not([data-grid] select),
textarea:focus:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table textarea):not(.handsontable textarea):not([data-grid] textarea) {
  border-color: var(--bb-accent) !important;
  box-shadow: 0 0 0 3px rgba(107,143,113,0.12) !important;
  outline: none !important;
}

/* --- Cards (Exclude Grid Containers) --- */
[class*="card"]:not([class*="grid"]):not([class*="sheet"]):not(table *):not(.handsontable *):not([data-grid] *),
[class*="panel"]:not([class*="grid"]):not([class*="sheet"]):not(table *):not(.handsontable *):not([data-grid] *) {
  background: var(--bb-bg-card) !important;
  border: 1px solid var(--bb-border) !important;
  border-radius: var(--bb-radius) !important;
  box-shadow: var(--bb-shadow) !important;
}

[class*="card"]:hover:not([class*="grid"]):not([class*="sheet"]):not(table *):not(.handsontable *):not([data-grid] *) {
  border-color: #d8d4cf !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
}

/* --- Modal / Dialog --- */
[role="dialog"],
[class*="modal"],
[class*="dialog"]:not([class*="grid"]):not([class*="sheet"]) {
  background: var(--bb-bg-secondary) !important;
  border: 1px solid var(--bb-border) !important;
  border-radius: var(--bb-radius) !important;
  box-shadow: var(--bb-shadow-lg) !important;
}

/* Modal Overlay */
[class*="overlay"],
[class*="backdrop"] {
  background: rgba(0, 0, 0, 0.3) !important;
  backdrop-filter: blur(2px) !important;
}

/* Modal Header */
[class*="modal"][class*="header"],
[class*="dialog"][class*="header"] {
  border-bottom: 1px solid var(--bb-border) !important;
}

/* Modal Footer */
[class*="modal"][class*="footer"],
[class*="dialog"][class*="footer"] {
  border-top: 1px solid var(--bb-border) !important;
}

/* --- Badges / Status Indicators --- */
[class*="badge"]:not([class*="grid"]):not([class*="sheet"]):not(table *):not(.handsontable *),
[class*="status"]:not([class*="grid"]):not([class*="sheet"]):not(table *):not(.handsontable *):not(header *) {
  border-radius: 12px !important;
  font-weight: 600 !important;
  font-size: 0.75rem !important;
}

/* Success/Confirmed */
[class*="success"],
[class*="confirmed"] {
  background: rgba(107,143,113,0.12) !important;
  color: var(--bb-success) !important;
}

/* Warning */
[class*="warning"],
[class*="pending"] {
  background: rgba(212,165,116,0.15) !important;
  color: var(--bb-warning) !important;
}

/* Danger/Error */
[class*="danger"],
[class*="error"],
[class*="cancelled"] {
  background: rgba(196,112,112,0.12) !important;
  color: var(--bb-danger) !important;
}

/* Info */
[class*="info"] {
  background: rgba(124,168,198,0.12) !important;
  color: var(--bb-info) !important;
}

/* --- Dropdown Menus --- */
[role="menu"],
[class*="dropdown"][class*="menu"],
[class*="context-menu"] {
  background: var(--bb-bg-card) !important;
  border: 1px solid var(--bb-border) !important;
  border-radius: var(--bb-radius) !important;
  box-shadow: var(--bb-shadow-lg) !important;
}

[role="menuitem"],
[class*="dropdown"][class*="item"],
[class*="menu"][class*="item"]:not([class*="nav"]) {
  color: var(--bb-text-secondary) !important;
  border-radius: var(--bb-radius-sm) !important;
  transition: all var(--bb-transition) !important;
}

[role="menuitem"]:hover,
[class*="dropdown"][class*="item"]:hover,
[class*="menu"][class*="item"]:hover:not([class*="nav"]) {
  background: var(--bb-bg-hover) !important;
  color: var(--bb-text-primary) !important;
}

/* --- Separator / Divider --- */
hr,
[class*="separator"],
[class*="divider"]:not([class*="grid"]):not([class*="sheet"]) {
  border-color: var(--bb-border) !important;
}

/* --- Scrollbar Styling --- */
::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
}

::-webkit-scrollbar-track {
  background: transparent !important;
}

::-webkit-scrollbar-thumb {
  background: var(--bb-border) !important;
  border-radius: 4px !important;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--bb-text-muted) !important;
}

/* --- Select Dropdowns --- */
select:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table select):not(.handsontable select) {
  appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%236b6b6b'%3E%3Cpath d='M6 8L1 3h10z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 10px center !important;
  padding-right: 30px !important;
}

/* --- Toast / Notification --- */
[class*="toast"],
[role="alert"]:not([class*="grid"]):not([class*="sheet"]) {
  border-radius: var(--bb-radius-sm) !important;
  box-shadow: var(--bb-shadow-lg) !important;
}

[class*="toast"][class*="success"] {
  background: var(--bb-success) !important;
}

[class*="toast"][class*="error"],
[class*="toast"][class*="danger"] {
  background: var(--bb-danger) !important;
}

[class*="toast"][class*="info"] {
  background: var(--bb-info) !important;
}

[class*="toast"][class*="warning"] {
  background: var(--bb-warning) !important;
}

/* --- User Avatar / Profile --- */
[class*="avatar"]:not([class*="grid"]):not([class*="sheet"]):not(table *) {
  border-radius: 50% !important;
  background: var(--bb-accent-gradient) !important;
  color: #ffffff !important;
}

/* --- Loading Spinner --- */
[class*="spinner"],
[class*="loading"] {
  border-color: var(--bb-border) !important;
  border-top-color: var(--bb-accent) !important;
}

/* --- Empty State --- */
[class*="empty"]:not([class*="grid"]):not([class*="sheet"]):not(table *) {
  color: var(--bb-text-muted) !important;
}

/* --- Link Styling --- */
a:not([class*="nav"]):not([class*="tab"]):not([class*="button"]):not([class*="btn"]):not(table a):not(.handsontable a):not([data-grid] a) {
  color: var(--bb-text-link) !important;
}

a:hover:not([class*="nav"]):not([class*="tab"]):not([class*="button"]):not([class*="btn"]):not(table a):not(.handsontable a):not([data-grid] a) {
  text-decoration: underline !important;
}

/* --- Checkbox and Radio (Exclude Grid) --- */
input[type="checkbox"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table input):not(.handsontable input):not([data-grid] input),
input[type="radio"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table input):not(.handsontable input):not([data-grid] input) {
  accent-color: var(--bb-accent) !important;
}

/* --- Popover / Tooltip --- */
[role="tooltip"],
[class*="popover"],
[class*="tooltip"] {
  background: var(--bb-bg-card) !important;
  border: 1px solid var(--bb-border) !important;
  border-radius: var(--bb-radius-sm) !important;
  box-shadow: var(--bb-shadow-lg) !important;
  color: var(--bb-text-primary) !important;
}

/* --- Progress Bar --- */
[class*="progress"]:not([class*="grid"]):not([class*="sheet"]):not(table *) {
  background: var(--bb-border) !important;
  border-radius: var(--bb-radius-sm) !important;
}

[class*="progress"][class*="bar"],
[class*="progress"] > div {
  background: var(--bb-accent-gradient) !important;
  border-radius: var(--bb-radius-sm) !important;
}

/* --- Accordion / Collapsible --- */
[class*="accordion"],
[class*="collapsible"] {
  border: 1px solid var(--bb-border) !important;
  border-radius: var(--bb-radius) !important;
}

[class*="accordion"][class*="trigger"],
[class*="collapsible"][class*="trigger"] {
  background: var(--bb-bg-tertiary) !important;
  border-radius: var(--bb-radius-sm) !important;
}

[class*="accordion"][class*="trigger"]:hover,
[class*="collapsible"][class*="trigger"]:hover {
  background: var(--bb-bg-hover) !important;
}

/* --- Slider / Range Input --- */
input[type="range"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table input) {
  accent-color: var(--bb-accent) !important;
}

/* --- Code / Monospace --- */
code:not([class*="grid"]):not([class*="sheet"]):not(table code),
pre:not([class*="grid"]):not([class*="sheet"]):not(table pre) {
  background: var(--bb-bg-tertiary) !important;
  border: 1px solid var(--bb-border) !important;
  border-radius: var(--bb-radius-sm) !important;
  color: var(--bb-text-primary) !important;
}

/* --- Form Labels --- */
label:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table label):not(.handsontable label):not([data-grid] label) {
  color: var(--bb-text-secondary) !important;
  font-weight: 500 !important;
}

/* --- Data Table Headers (Non-Grid Tables Only) --- */
table:not(.handsontable):not([data-grid]):not([class*="sheet"]) th {
  color: var(--bb-text-muted) !important;
  font-weight: 600 !important;
  border-bottom: 1px solid var(--bb-border-light) !important;
}

/* --- Utility: Focus Visible --- */
*:focus-visible:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]):not(table *):not(.handsontable *):not([data-grid] *) {
  outline: 2px solid var(--bb-accent) !important;
  outline-offset: 2px !important;
}

/* =============================================================================
   MOBILE RESPONSIVE ADJUSTMENTS
   ============================================================================= */

@media (max-width: 768px) {
  /* Ensure touch targets are accessible */
  button:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]),
  [class*="btn"]:not([class*="cell"]):not([class*="grid"]):not([class*="sheet"]),
  a:not(table a):not(.handsontable a):not([data-grid] a) {
    min-height: 44px !important;
  }
  
  /* Tab scrolling */
  [role="tablist"],
  [class*="tabs"]:not([class*="sheet"]):not([class*="grid"]) {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

/* =============================================================================
   PRINT STYLES
   ============================================================================= */

@media print {
  body {
    background: #ffffff !important;
    color: #000000 !important;
  }
  
  aside,
  nav[class*="sidebar"],
  header,
  [class*="topbar"],
  button:not([class*="print"]) {
    display: none !important;
  }
  
  [class*="card"],
  [class*="modal"],
  [class*="dialog"] {
    box-shadow: none !important;
    border: 1px solid #cccccc !important;
  }
}

/* Hide broken logo images on login page */
img[data-testid="img-logo"], img[data-testid="img-davsoft-logo"], img[alt="BloomBooks Order Book"], img[alt="A DAV SOFT Product"] {
  display: none !important;
}
