/* Eterano v1.20.1d — Light Mode Refinement Pass
   Purpose: give list-heavy screens the same visual hierarchy as Settings.
   Light mode only. Dark mode and the navy sidebar remain untouched. */

/* Light-mode design tokens: a visibly separate canvas, crisp white cards,
   slightly stronger separators, and more readable secondary text. */
html[data-theme="light"]{
  --eterano-light-canvas:#e7edf5;
  --eterano-light-canvas-top:#f0f4fa;
  --eterano-light-card:#ffffff;
  --eterano-light-inner:#f6f9fd;
  --eterano-light-toolbar:#f8fbff;
  --eterano-light-border:#ccd8e7;
  --eterano-light-border-strong:#bccbdd;
  --eterano-light-muted:#586a84;
  --eterano-light-shadow:0 10px 26px rgba(18,47,88,.085);
  --eterano-light-shadow-soft:0 6px 18px rgba(18,47,88,.07);
  --line:var(--eterano-light-border);
  --muted:var(--eterano-light-muted);
  --shadow-soft:var(--eterano-light-shadow-soft);
}

/* The canvas needs enough contrast for white content surfaces to read as
   deliberate sections instead of white text blocks floating on white. */
html[data-theme="light"] #appPage,
html[data-theme="light"] .app-main{
  background:
    radial-gradient(circle at 76% -10%,rgba(19,213,255,.05),transparent 27rem),
    linear-gradient(180deg,var(--eterano-light-canvas-top) 0,var(--eterano-light-canvas) 100%);
}
html[data-theme="light"] .content{color:var(--ink)}

/* Shared major surfaces. Keep white cards crisp and visible against canvas. */
html[data-theme="light"] :where(
  .panel,.stat-card,.order-card,.receipt-card,.customer-card,.product-card,
  .invoice-card,.quote-card1190,.journal-entry,.books-card,.accountant-center1140,
  .open-banking-connection,.open-banking-alert-row,.followup-row1160
){
  background:var(--eterano-light-card)!important;
  border-color:var(--eterano-light-border)!important;
  box-shadow:var(--eterano-light-shadow-soft);
}

/* Summary/KPI cards should feel like a distinct tier between page chrome and rows. */
html[data-theme="light"] :where(
  .stat-card,.invoice-stats-grid .stat-card,.quote-stats1190 .stat-card,
  .accounting-stats-grid .stat-card
){
  border-color:var(--eterano-light-border-strong)!important;
  box-shadow:0 8px 20px rgba(18,47,88,.075);
}

/* Toolbars are functional sections, not loose controls. */
html[data-theme="light"] #view-orders>.toolbar,
html[data-theme="light"] #view-customers>.toolbar,
html[data-theme="light"] #view-products>.toolbar,
html[data-theme="light"] #view-receipts>.toolbar,
html[data-theme="light"] #view-invoices .invoice-toolbar,
html[data-theme="light"] #view-quotes .quote-toolbar1190{
  padding:10px 12px;
  border:1px solid var(--eterano-light-border);
  border-radius:16px;
  background:rgba(255,255,255,.88);
  box-shadow:0 6px 18px rgba(18,47,88,.055);
  margin-bottom:14px;
}

/* Accounting has a toolbar inside a white transaction panel, so use an inner
   surface rather than another white block. */
html[data-theme="light"] .accounting-toolbar{
  padding:10px;
  border:1px solid #d5dfeb;
  border-radius:14px;
  background:var(--eterano-light-toolbar);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75);
  margin-bottom:14px;
}

/* Primary tab/navigation surfaces need their own level. */
html[data-theme="light"] :where(.settings-tabs-nav,.accounting-internal-tabs,#accountingInternalTabs,.invoice-workspace-tabs1160){
  background:#fff!important;
  border-color:var(--eterano-light-border)!important;
  box-shadow:0 7px 20px rgba(18,47,88,.065)!important;
}
html[data-theme="light"] :where(.settings-tabs-nav,.accounting-internal-tabs,#accountingInternalTabs,.invoice-workspace-tabs1160) button:not(.active){
  color:#52647f;
}

/* Orders: each record should clearly read as an independent row card. */
html[data-theme="light"] #view-orders .cards-list{
  gap:12px;
}
html[data-theme="light"] #view-orders .order-card{
  background:#fff!important;
  border:1px solid var(--eterano-light-border-strong)!important;
  box-shadow:0 7px 18px rgba(18,47,88,.065)!important;
}
html[data-theme="light"] #view-orders .order-card:hover{
  border-color:#9eb9d8!important;
  box-shadow:0 12px 26px rgba(18,47,88,.105)!important;
}

/* Invoices: stronger KPI tier, grouped toolbar and separated invoice rows. */
html[data-theme="light"] #view-invoices .invoice-stats-grid{
  gap:14px;
}
html[data-theme="light"] #view-invoices .invoice-list{
  gap:12px;
}
html[data-theme="light"] #view-invoices .invoice-card{
  background:#fff!important;
  border:1px solid var(--eterano-light-border-strong)!important;
  box-shadow:0 7px 18px rgba(18,47,88,.065)!important;
}
html[data-theme="light"] #view-invoices .invoice-card:hover{
  border-color:#9eb9d8!important;
  box-shadow:0 12px 26px rgba(18,47,88,.105)!important;
}

/* Quotes inherit the same list language so the new workflow does not regress. */
html[data-theme="light"] #view-quotes .quote-list1190{
  gap:12px;
}
html[data-theme="light"] #view-quotes .quote-card1190{
  background:#fff!important;
  border:1px solid var(--eterano-light-border-strong)!important;
  box-shadow:0 7px 18px rgba(18,47,88,.065)!important;
}
html[data-theme="light"] #view-quotes .quote-card1190:hover{
  border-color:#9eb9d8!important;
  box-shadow:0 12px 26px rgba(18,47,88,.105)!important;
}

/* Accounting: outer section = white card; inner records = soft nested surface.
   This avoids the previous white-on-white sheet effect. */
html[data-theme="light"] .accounting-transactions-card{
  background:#fff!important;
  border:1px solid var(--eterano-light-border-strong)!important;
  box-shadow:var(--eterano-light-shadow)!important;
}
html[data-theme="light"] .accounting-transaction-list{
  gap:10px;
}
html[data-theme="light"] .accounting-transaction-row{
  background:var(--eterano-light-inner)!important;
  border:1px solid #cfdae8!important;
  box-shadow:0 3px 10px rgba(18,47,88,.035);
  padding:14px 15px;
}
html[data-theme="light"] .accounting-transaction-row:hover{
  background:#fff!important;
  border-color:#9eb9d8!important;
  box-shadow:0 8px 18px rgba(18,47,88,.085);
}
html[data-theme="light"] .accounting-transactions-heading{
  padding-bottom:14px;
  border-bottom:1px solid #d8e2ee;
  margin-bottom:14px;
}
html[data-theme="light"] .accounting-month-control select{
  background:#fff;
  border-color:var(--eterano-light-border-strong);
}

/* Form/search controls should be visibly nested inside cards/toolbars. */
html[data-theme="light"] :where(input,textarea,select,.slug-field,.search-field){
  background:#f7faff;
  border-color:#c9d6e6;
}
html[data-theme="light"] .search-field{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75);
}
html[data-theme="light"] :where(input,textarea,select,.slug-field,.search-field):hover{
  border-color:#afc2d8;
}

/* Secondary text remains secondary but must be readable in Light mode. */
html[data-theme="light"] :where(
  .muted,.card-main p,.meta-pair span,.invoice-card-main small,.invoice-card-main span,
  .quote-card1190 small,.quote-card1190 span,.accounting-row-date small,
  .accounting-row-main small,.accounting-row-amount small,.field-help
){
  color:var(--eterano-light-muted)!important;
}

/* Keep row labels and metadata visually grouped rather than washed out. */
html[data-theme="light"] :where(.meta-pair span,.invoice-card-main small,.quote-card1190 small){
  font-weight:650;
}

/* Small-screen spacing remains compact; hierarchy improvements still apply. */
@media(max-width:760px){
  html[data-theme="light"] #view-orders>.toolbar,
  html[data-theme="light"] #view-customers>.toolbar,
  html[data-theme="light"] #view-products>.toolbar,
  html[data-theme="light"] #view-receipts>.toolbar,
  html[data-theme="light"] #view-invoices .invoice-toolbar,
  html[data-theme="light"] #view-quotes .quote-toolbar1190{
    padding:9px;
    border-radius:14px;
  }
  html[data-theme="light"] .accounting-transaction-row{padding:13px}
}