:root {
  --bg: #f7f4ec;
  --panel: #fffdf8;
  --panel-2: #fbf8ef;
  --border: #e9e2d4;
  --text: #26251f;
  --muted: #787467;
  --green: #547c2e;
  --green-2: #86a65f;
  --green-soft: #edf3e3;
  --orange: #e67a20;
  --orange-soft: #fff1e3;
  --purple: #7567d8;
  --purple-soft: #f3efff;
  --shadow: 0 10px 30px rgba(75, 64, 38, .07);
  --radius: 18px;
  --sidebar: 240px;
}

* {
  box-sizing: border-box
}

body {
  margin: 0;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: linear-gradient(180deg, #fbfaf5 0%, #f7f3ea 100%);
  color: var(--text);
}

button,
input {
  font: inherit
}

.app {
  min-height: 100vh;
  display: grid;
  grid-template-columns: var(--sidebar) 1fr;
}

.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  padding: 20px 16px;
  background: rgba(252, 249, 240, .96);
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 18px;
  overflow: auto;
}

.brand {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 3px 10px 12px;
}

.brand-mark {
  width: 48px;
  height: 48px;
  border-radius: 15px;
  display: grid;
  place-items: center;
  font-size: 26px;
  color: white;
  background: linear-gradient(135deg, #7ca050, #d8a33d);
  box-shadow: 0 8px 18px rgba(116, 147, 71, .2);
}

.brand h1 {
  margin: 0;
  font-size: 24px;
  line-height: 1;
  letter-spacing: -.8px;
}

.brand small {
  color: var(--muted);
  display: block;
  margin-top: 5px;
  line-height: 1.25;
}

.nav {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.nav a {
  text-decoration: none;
  color: #514e45;
  display: flex;
  align-items: center;
  gap: 12px;
  border-radius: 12px;
  padding: 12px 13px;
  font-size: 14px;
  font-weight: 600;
  transition: .2s ease;
}

.nav a:hover {
  background: #f2eee3;
  transform: translateX(2px);
}

.nav a.active {
  background: linear-gradient(90deg, #ecf2dd, #f6f0df);
  color: #30451f;
  box-shadow: inset 0 0 0 1px rgba(87, 118, 51, .08);
}

.nav i {
  font-size: 18px;
  width: 22px;
  text-align: center;
}

.sidebar-sep {
  height: 1px;
  background: var(--border);
  margin: 4px 6px;
}

.invite {
  margin-top: auto;
  background: linear-gradient(180deg, #fff7e7, #f6e8cd);
  border: 1px solid #ead8b4;
  border-radius: 18px;
  padding: 18px;
  overflow: hidden;
  position: relative;
}

.invite:after {
  content: "🌿";
  position: absolute;
  right: 12px;
  bottom: 36px;
  font-size: 56px;
  opacity: .25;
}

.invite h3 {
  margin: 0 0 8px;
  font-size: 17px;
  max-width: 150px;
}

.invite p {
  margin: 0 0 14px;
  color: #6e6657;
  font-size: 12px;
  line-height: 1.55;
  max-width: 165px;
}

.btn {
  border: 0;
  border-radius: 10px;
  padding: 10px 14px;
  cursor: pointer;
  font-weight: 700;
  transition: .2s ease;
}

.btn:hover {
  transform: translateY(-1px)
}

.btn-green {
  background: var(--green);
  color: #fff
}

.btn-outline {
  background: #fffdf8;
  border: 1px solid #cdd7b9;
  color: var(--green)
}

.btn-light {
  background: #f7f5ee;
  color: #544f45
}

.main {
  min-width: 0;
  padding: 20px 24px 24px;
}

.topbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
}

.welcome h2 {
  margin: 0;
  font-size: 25px;
  letter-spacing: -.6px;
}

.welcome p {
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.top-actions {
  display: flex;
  align-items: center;
  gap: 14px;
}

.icon-btn {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid var(--border);
  background: var(--panel);
  display: grid;
  place-items: center;
  cursor: pointer;
  position: relative;
}

.notification-dot {
  position: absolute;
  right: -2px;
  top: -2px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #ef781f;
  color: white;
  font-size: 10px;
  font-weight: 800;
  display: grid;
  place-items: center;
  border: 2px solid #fff;
}

.profile {
  display: flex;
  align-items: center;
  gap: 10px;
}

.avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-weight: 800;
  color: #fff;
  background: linear-gradient(135deg, #b37d47, #f0c495);
}

.profile strong {
  font-size: 13px
}

.profile span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  margin-top: 2px
}

.kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  margin-bottom: 18px;
}

.card {
  background: rgba(255, 253, 248, .92);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.kpi {
  padding: 20px;
  display: flex;
  gap: 15px;
  align-items: flex-start;
  min-height: 146px;
}

.kpi-icon {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  flex: none;
  display: grid;
  place-items: center;
  font-size: 24px;
  background: var(--green-soft);
  color: var(--green);
}

.kpi.orange .kpi-icon {
  background: var(--orange-soft);
  color: var(--orange);
}

.kpi h4 {
  margin: 2px 0 7px;
  font-size: 13px;
  font-weight: 700;
}

.kpi .value {
  font-size: 23px;
  font-weight: 800;
  letter-spacing: -.5px;
}

.kpi small {
  display: block;
  margin-top: 12px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.trend-good {
  color: #4f8c39;
  font-weight: 700
}

.trend-bad {
  color: #dd6c2d;
  font-weight: 700
}

.progress {
  height: 9px;
  border-radius: 999px;
  background: #e7e3d8;
  overflow: hidden;
  margin-top: 12px;
}

.progress>span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #587b34, #8eaa61);
}

.layout {
  display: grid;
  grid-template-columns: 1.45fr 1fr;
  gap: 18px;
}

.section-card {
  padding: 18px;
}

.section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 15px;
}

.section-title {
  display: flex;
  align-items: center;
  gap: 10px;
}

.section-title i {
  color: var(--green);
  font-size: 18px
}

.section-title h3 {
  margin: 0;
  font-size: 17px;
  letter-spacing: -.3px;
}

.link {
  border: 0;
  background: transparent;
  color: #4b6d31;
  cursor: pointer;
  font-weight: 700;
  font-size: 12px;
}

.week {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
}

.day {
  min-width: 0;
  padding: 13px 9px;
  text-align: center;
  border-right: 1px solid var(--border);
  background: #fffefa;
}

.day:last-child {
  border-right: 0
}

.day strong {
  display: block;
  font-size: 12px;
  margin-bottom: 11px;
}

.meal-photo {
  width: 76px;
  height: 76px;
  margin: 0 auto 10px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 38px;
  background:
    radial-gradient(circle at 30% 25%, rgba(255, 255, 255, .9), transparent 25%),
    linear-gradient(135deg, #f5dfb7, #d18c3b);
  border: 4px solid #f7ead2;
  box-shadow: 0 7px 16px rgba(111, 78, 31, .15);
}

.day .meal-name {
  font-size: 11px;
  font-weight: 800;
  min-height: 28px;
  line-height: 1.3;
}

.day .side {
  font-size: 10px;
  color: #5c594f;
  min-height: 32px;
  margin-top: 5px;
  line-height: 1.35;
}

.day .time {
  display: block;
  color: #8c877c;
  font-size: 10px;
  margin-top: 8px;
}

.tipbar {
  margin-top: 12px;
  background: #edf2e2;
  border: 1px solid #dae4c5;
  border-radius: 11px;
  padding: 11px 13px;
  display: flex;
  justify-content: space-between;
  gap: 14px;
  font-size: 11px;
  color: #53643b;
}

.inventory-list,
.suggestions,
.shopping-list {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.inventory-item {
  display: grid;
  grid-template-columns: 30px 1fr auto auto;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid #eee8dc;
}

.inventory-item:last-child {
  border-bottom: 0
}

.item-icon {
  font-size: 23px
}

.inventory-item strong {
  font-size: 12px
}

.expiry {
  font-size: 11px;
  color: var(--orange);
  font-weight: 700;
}

.qty {
  font-size: 11px;
  color: #5a564d;
  min-width: 44px;
  text-align: right;
}

.muted-note {
  color: var(--muted);
  font-size: 11px;
  margin-top: 12px;
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.bottom-grid {
  display: grid;
  grid-template-columns: 1fr 1.1fr 1fr;
  gap: 18px;
  margin-top: 18px;
}

.shopping-row {
  display: grid;
  grid-template-columns: 20px 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid #eee8dc;
  border-radius: 9px;
  background: #fffefa;
}

.shopping-row input {
  width: 16px;
  height: 16px;
  accent-color: var(--green);
}

.shopping-row label {
  font-size: 12px;
  cursor: pointer;
}

.shopping-row.done label {
  text-decoration: line-through;
  color: #8a877e;
}

.tag {
  border-radius: 999px;
  padding: 4px 8px;
  background: #f2efe7;
  color: #6b665a;
  font-size: 9px;
  font-weight: 700;
  white-space: nowrap;
}

.chart-wrap {
  height: 230px;
  position: relative;
  padding-top: 10px;
}

svg {
  display: block;
  width: 100%;
  height: 100%
}

.chart-grid line {
  stroke: #e8e3d8;
  stroke-width: 1
}

.chart-label {
  fill: #918c81;
  font-size: 10px
}

.line-green {
  fill: none;
  stroke: #5f8839;
  stroke-width: 3
}

.line-orange {
  fill: none;
  stroke: #e67a20;
  stroke-width: 3
}

.line-blue {
  fill: none;
  stroke: #4c8fd8;
  stroke-width: 3
}

.chart-note {
  background: #eef3e2;
  border: 1px solid #d9e3c2;
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 11px;
  color: #53643b;
  margin-top: 8px;
}

.suggestion {
  display: grid;
  grid-template-columns: 36px 1fr 20px;
  gap: 10px;
  align-items: center;
  padding: 13px;
  border-radius: 12px;
  border: 1px solid #ebe5d9;
  background: #fffefa;
}

.suggestion:first-child {
  border-color: #ecd6b7;
  background: #fff8ed;
}

.suggestion:nth-child(3) {
  background: #faf8ff;
  border-color: #e1dbfa;
}

.suggestion i {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: var(--orange);
  background: #fff0da;
  font-size: 18px;
}

.suggestion:nth-child(2) i {
  color: var(--green);
  background: var(--green-soft);
}

.suggestion:nth-child(3) i {
  color: var(--purple);
  background: var(--purple-soft);
}

.suggestion strong {
  display: block;
  font-size: 11px;
  line-height: 1.4;
}

.suggestion span {
  display: block;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.4;
  margin-top: 3px;
}

.footer {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 20px;
  padding: 13px 4px 0;
  border-top: 1px solid var(--border);
  color: #8a8579;
  font-size: 10px;
}

.modal {
  position: fixed;
  inset: 0;
  background: rgba(34, 31, 24, .42);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
  z-index: 30;
}

.modal.show {
  display: flex
}

.modal-box {
  width: min(520px, 100%);
  background: #fffdf8;
  border-radius: 18px;
  border: 1px solid var(--border);
  box-shadow: 0 30px 80px rgba(35, 31, 21, .25);
  padding: 20px;
}

.modal-box h3 {
  margin: 0 0 14px
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px
}

.field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 12px
}

.field label {
  font-size: 11px;
  font-weight: 700;
  color: #625f55
}

.field input,
.field select {
  border: 1px solid #ddd7ca;
  border-radius: 10px;
  background: #fff;
  padding: 10px 11px;
  outline: none;
}

.modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 6px
}

.toast {
  position: fixed;
  right: 22px;
  bottom: 22px;
  min-width: 240px;
  background: #2f4521;
  color: #fff;
  padding: 13px 15px;
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(26, 35, 19, .28);
  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;
  transition: .25s ease;
  z-index: 50;
  font-size: 12px;
  font-weight: 700;
}

.toast.show {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width:1200px) {
  .kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr))
  }

  .layout {
    grid-template-columns: 1fr
  }

  .bottom-grid {
    grid-template-columns: 1fr 1fr
  }

  .bottom-grid> :last-child {
    grid-column: 1/-1
  }
}

@media (max-width:850px) {
  :root {
    --sidebar: 78px
  }

  .brand h1,
  .brand small,
  .nav a span,
  .invite {
    display: none
  }

  .brand {
    justify-content: center;
    padding-left: 0;
    padding-right: 0
  }

  .nav a {
    justify-content: center;
    padding: 12px 0
  }

  .main {
    padding: 16px
  }

  .topbar {
    align-items: center
  }

  .profile div:last-child {
    display: none
  }

  .week {
    grid-template-columns: repeat(2, minmax(0, 1fr))
  }

  .day {
    border-bottom: 1px solid var(--border)
  }
}

@media (max-width:600px) {
  .app {
    display: block
  }

  .sidebar {
    position: static;
    height: auto;
    width: 100%;
    flex-direction: row;
    align-items: center;
    padding: 10px;
    overflow-x: auto;
  }

  .brand {
    min-width: 54px
  }

  .nav {
    flex-direction: row
  }

  .nav a {
    min-width: 44px
  }

  .sidebar-sep {
    display: none
  }

  .main {
    padding: 12px
  }

  .kpis {
    grid-template-columns: 1fr
  }

  .bottom-grid {
    grid-template-columns: 1fr
  }

  .week {
    grid-template-columns: 1fr
  }

  .top-actions .profile {
    display: none
  }

  .footer {
    flex-direction: column
  }
}

/* EvPilot Shopping AJAX */
.shopping-item-meta {
  margin-top: 4px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.4;
}

.shopping-item-note {
  margin-top: 5px;
  color: #777064;
  font-size: 10px;
  line-height: 1.45;
}

.shopping-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  flex-wrap: wrap;
}

.shopping-item-row {
  grid-template-columns: 20px minmax(0, 1fr) auto;
}

.shopping-item-row .btn {
  padding: 6px 8px;
}

@media(max-width:600px) {
  .shopping-item-row {
    grid-template-columns: 22px 1fr;
  }

  .shopping-actions {
    grid-column: 2;
    justify-content: flex-start;
  }
}

/* EvPilot Meal Planner */
.meal-week-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 10px;
}

.meal-day-card {
  border: 1px solid var(--border);
  border-radius: 14px;
  background: #fffefa;
  overflow: hidden;
}

.meal-day-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px;
  border-bottom: 1px solid var(--border);
}

.meal-day-head strong {
  display: block;
  font-size: 11px;
}

.meal-day-head span {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 9px;
}

.meal-day-head .btn {
  padding: 6px 8px;
}

.meal-day-body {
  min-height: 170px;
  padding: 14px 9px;
  text-align: center;
}

.meal-day-body.empty {
  opacity: .62;
}

.meal-emoji {
  margin-bottom: 10px;
  font-size: 32px;
}

.meal-day-body strong {
  display: block;
  min-height: 34px;
  font-size: 11px;
  line-height: 1.4;
}

.meal-day-body span {
  display: block;
  min-height: 30px;
  margin-top: 6px;
  color: #666156;
  font-size: 10px;
  line-height: 1.4;
}

.meal-day-body small {
  display: block;
  margin-top: 10px;
  color: var(--muted);
  font-size: 9px;
}

@media(max-width:1200px) {
  .meal-week-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media(max-width:750px) {
  .meal-week-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media(max-width:450px) {
  .meal-week-grid {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   EvPilot Market Fişleri
   ========================================================= */

/* =========================================================
   EvPilot Market Fişleri v2 — Compact
   ========================================================= */

.receipt-modal-box {
  width: min(1050px, 96vw);
  max-height: 92vh;
  overflow: auto;
}

.receipt-products {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.receipt-product-row {
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fffefa;
}

.receipt-product-line {
  display: grid;
  grid-template-columns: minmax(170px, 2fr) minmax(120px, 1.1fr) 85px 90px 110px 100px 74px 38px;
  gap: 7px;
  align-items: center;
}

.receipt-product-line input,
.receipt-product-line select {
  width: 100%;
  min-height: 36px;
  padding: 7px 8px;
  border: 1px solid #ddd5c7;
  border-radius: 8px;
  background: #fff;
  font-size: 11px;
}

.receipt-product-line .rp-total {
  text-align: right;
  white-space: nowrap;
  font-size: 11px;
}

.receipt-stock-toggle.compact {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 36px;
  margin: 0;
  padding: 6px 7px;
  border-radius: 8px;
  background: var(--green-soft);
  cursor: pointer;
  font-size: 10px;
  font-weight: 700;
}

.receipt-stock-toggle.compact input {
  width: 14px;
  min-height: auto;
  height: 14px;
  margin: 0;
  accent-color: var(--green);
}

.receipt-stock-toggle.compact span {
  white-space: nowrap;
}

.receipt-product-line .rp-remove {
  width: 36px;
  height: 36px;
  padding: 0;
  display: grid;
  place-items: center;
}

.receipt-products-header {
  margin-top: 4px;
  margin-bottom: 8px;
}

.receipt-total-box {
  margin: 10px 0 12px;
  padding: 10px 13px;
}

.receipt-total-box strong {
  font-size: 18px;
}

@media(max-width:980px) {
  .receipt-product-line {
    grid-template-columns: 2fr 1.2fr 80px 85px 100px;
  }

  .receipt-product-line .rp-total,
  .receipt-stock-toggle.compact,
  .receipt-product-line .rp-remove {
    grid-row: 2;
  }
}

@media(max-width:650px) {
  .receipt-product-line {
    grid-template-columns: 1fr 1fr;
  }

  .receipt-product-line .rp-name {
    grid-column: 1 / -1;
  }

  .receipt-product-line .rp-total {
    text-align: left;
  }
}

/* =========================================================
   EvPilot Receipt AI / OCR
   ========================================================= */

.receipt-ai-panel {
  margin: 12px 0;
  padding: 13px;
  border: 1px dashed #cec2ae;
  border-radius: 12px;
  background: #faf7ef;
}

.receipt-ai-head strong {
  display: block;
  font-size: 12px;
}

.receipt-ai-head span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.5;
}

.receipt-ai-controls {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
}

.receipt-ai-controls input[type="file"] {
  flex: 1;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  font-size: 10px;
}

.receipt-ai-status {
  margin-top: 10px;
  padding: 10px 11px;
  border-radius: 9px;
  font-size: 10px;
  line-height: 1.5;
}

.receipt-ai-status.loading {
  color: #675723;
  background: #fff7d8;
}

.receipt-ai-status.success {
  color: #3f652c;
  background: #edf5e7;
}

.receipt-ai-status.error {
  color: #8e3a2d;
  background: #fff0eb;
}

@media(max-width:650px) {
  .receipt-ai-controls {
    align-items: stretch;
    flex-direction: column;
  }

  .receipt-ai-controls .btn {
    width: 100%;
  }
}

/* EvPilot - Fiş hibrit toplam doğrulama */

.receipt-summary-box {
  margin: 10px 0 14px;
  padding: 12px 14px;
  border: 1px solid #d9e3c2;
  border-radius: 12px;
  background: #f8faF3;
}

.receipt-summary-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 7px 0;
  border-bottom: 1px solid #e6eadf;
  font-size: 11px;
}

.receipt-summary-row:last-child {
  border-bottom: 0;
}

.receipt-summary-row.declared {
  color: #4f4a42;
}

.receipt-summary-row.discount {
  color: #b65f2c;
}

.receipt-summary-row.final {
  padding-top: 10px;
  color: #405b2e;
}

.receipt-summary-row.final strong {
  font-size: 20px;
}

.receipt-declared-input {
  display: flex;
  align-items: center;
  gap: 5px;
}

.receipt-declared-input input {
  width: 150px;
  padding: 7px 9px;
  text-align: right;
  border: 1px solid #d9d0c2;
  border-radius: 8px;
  background: #fff;
  font-size: 11px;
}

.receipt-total-warning {
  margin: 8px 0;
  padding: 9px 10px;
  border-radius: 8px;
  background: #fff4df;
  color: #8a5d23;
  font-size: 10px;
  line-height: 1.45;
}

/* EvPilot Receipts V4 extra */
.receipt-v4-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, .65fr);
  gap: 18px
}

.receipt-v4-side {
  display: flex;
  flex-direction: column;
  gap: 18px
}

.receipt-v4-main {
  min-width: 0
}

.section-title>div small {
  display: block;
  margin-top: 3px;
  color: #8a8277;
  font-size: 9px
}

.receipt-month-list {
  padding: 0 18px 18px
}

.receipt-month-group {
  margin-bottom: 11px;
  overflow: hidden;
  border: 1px solid #e7decf;
  border-radius: 16px;
  background: #fffefa
}

.receipt-month-group.current {
  border-color: #d8e4c4
}

.receipt-month-header {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 14px;
  border: 0;
  background: #fbf8f1;
  cursor: pointer;
  text-align: left
}

.receipt-month-group.current .receipt-month-header {
  background: linear-gradient(90deg, #f1f6e8, #fff9ef)
}

.receipt-month-left,
.receipt-month-right {
  display: flex;
  align-items: center;
  gap: 10px
}

.receipt-month-left>div strong {
  display: block;
  font-size: 11px
}

.receipt-month-left>div small {
  display: block;
  margin-top: 2px;
  color: #8a8277;
  font-size: 8px
}

.month-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: #567b32;
  background: #ebf2df
}

.current-month-badge {
  padding: 4px 7px;
  border-radius: 999px;
  color: #567b32;
  background: #e5eed7;
  font-size: 8px;
  font-weight: 700
}

.receipt-month-right strong {
  font-size: 11px
}

.receipt-month-body {
  padding: 7px 10px 10px
}

.receipt-v4-row {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 10px;
  margin-top: 7px;
  border: 1px solid #eee5d8;
  border-radius: 13px;
  background: #fff
}

.receipt-v4-thumb {
  width: 58px;
  min-width: 58px;
  height: 58px;
  padding: 0;
  overflow: hidden;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 11px;
  background: #f2eee6;
  cursor: pointer
}

.receipt-v4-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover
}

.receipt-v4-thumb.empty {
  cursor: default;
  color: #aaa195;
  font-size: 20px
}

.receipt-v4-info {
  min-width: 0;
  flex: 1
}

.receipt-v4-info>.js-receipt-market {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 11px;
  white-space: nowrap
}

.receipt-v4-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 6px
}

.receipt-v4-meta span,
.receipt-image-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 6px;
  border: 0;
  border-radius: 7px;
  color: #81796f;
  background: #f7f3ec;
  font-size: 8px
}

.receipt-image-link {
  color: #567b32;
  background: #edf4e5;
  cursor: pointer
}

.receipt-v4-total {
  color: #4d6d2f;
  font-size: 11px;
  white-space: nowrap
}

.receipt-v4-actions {
  display: flex;
  gap: 5px
}

.receipt-v4-actions .btn {
  padding: 6px 8px
}

.receipt-v4-month-total {
  padding: 4px 20px 20px;
  color: #4f7130;
  font-size: 27px;
  font-weight: 800
}

.receipt-v4-feature-copy {
  padding: 0 20px 20px;
  color: #81796f;
  font-size: 9px;
  line-height: 1.55
}

.rp-price-history {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
  padding: 7px 9px;
  border: 1px solid #dce8ca;
  border-radius: 9px;
  color: #567b32;
  background: #f3f7ed;
  text-align: left;
  cursor: pointer
}

.rp-price-history[hidden] {
  display: none
}

.history-icon {
  width: 27px;
  height: 27px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #e5edd9
}

.history-copy {
  flex: 1;
  min-width: 0
}

.history-copy strong {
  display: block;
  font-size: 8px
}

.history-copy small {
  display: block;
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #71805e;
  font-size: 8px;
  white-space: nowrap
}

.small-modal .modal-box {
  width: min(560px, 94vw)
}

.receipt-image-modal-box {
  width: min(680px, 94vw) !important
}

.receipt-image-viewer {
  padding: 0 18px 18px;
  text-align: center
}

.receipt-image-viewer img {
  max-width: 100%;
  max-height: 72vh;
  border-radius: 12px;
  object-fit: contain
}

.price-history-summary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  padding: 0 18px 12px
}

.price-stat {
  padding: 12px;
  border-radius: 12px
}

.price-stat.low {
  color: #49712d;
  background: #edf5e6
}

.price-stat.high {
  color: #a46126;
  background: #fff0df
}

.price-stat span {
  display: block;
  font-size: 8px
}

.price-stat strong {
  display: block;
  margin-top: 4px;
  font-size: 15px
}

.price-history-list {
  max-height: 340px;
  overflow: auto;
  padding: 0 18px 18px
}

.price-history-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 0;
  border-bottom: 1px solid #eee6da
}

.price-history-item div strong {
  display: block;
  font-size: 9px
}

.price-history-item div span {
  display: block;
  margin-top: 2px;
  color: #8b8378;
  font-size: 8px
}

.history-price {
  color: #567b32;
  font-size: 10px
}

.saved-receipt-image-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 8px;
  padding: 7px 9px;
  border: 1px solid #dce8ca;
  border-radius: 9px;
  color: #567b32;
  background: #f1f6e9;
  font-size: 9px;
  cursor: pointer
}

@media(max-width:1050px) {
  .receipt-v4-layout {
    grid-template-columns: 1fr
  }

  .receipt-v4-side {
    display: grid;
    grid-template-columns: 1fr 1fr
  }
}

@media(max-width:650px) {
  .receipt-v4-side {
    grid-template-columns: 1fr
  }

  .receipt-v4-row {
    align-items: flex-start;
    flex-wrap: wrap
  }

  .receipt-v4-info {
    min-width: calc(100% - 75px)
  }

  .receipt-v4-total {
    margin-left: 69px
  }

  .receipt-v4-actions {
    margin-left: auto
  }
}

/* EvPilot Banka Ekstreleri V2 */

.statement-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 18px;
  padding: 24px 27px;
  border: 1px solid #e7dece;
  border-radius: 24px;
  background:
    radial-gradient(circle at 0% 0%, rgba(109, 149, 63, .15), transparent 34%),
    radial-gradient(circle at 100% 100%, rgba(232, 176, 102, .14), transparent 34%),
    linear-gradient(135deg, #fffefb, #faf5ec);
  box-shadow: 0 16px 38px rgba(78, 63, 31, .06);
}

.statement-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 9px;
  border-radius: 999px;
  color: #557c31;
  background: #edf4e4;
  font-size: 9px;
  font-weight: 700;
}

.statement-hero h2 {
  margin: 9px 0 6px;
  font-size: 23px;
  letter-spacing: -.03em;
}

.statement-hero p {
  max-width: 670px;
  margin: 0;
  color: #80786d;
  font-size: 10px;
  line-height: 1.55;
}

.statement-file-actions {
  min-width: 205px;
  text-align: right;
}

.statement-file-name {
  max-width: 250px;
  margin-top: 7px;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #8a8277;
  font-size: 8px;
  white-space: nowrap;
}

.statement-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

.statement-kpi {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  border-radius: 19px;
}

.statement-kpi-icon {
  width: 46px;
  min-width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: #567b32;
  background: #edf4e5;
  font-size: 17px;
}

.statement-kpi.orange .statement-kpi-icon {
  color: #bd7427;
  background: #fff0df;
}

.statement-kpi.green .statement-kpi-icon {
  color: #368061;
  background: #e9f5ef;
}

.statement-kpi.purple .statement-kpi-icon {
  color: #7063cb;
  background: #f0edff;
}

.statement-kpi span {
  display: block;
  color: #81796f;
  font-size: 8px;
  font-weight: 700;
}

.statement-kpi strong {
  display: block;
  margin-top: 3px;
  font-size: 18px;
}

.statement-kpi small {
  display: block;
  margin-top: 4px;
  color: #928b80;
  font-size: 7px;
}

.statement-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.statement-panel {
  min-width: 0;
  overflow: hidden;
  border-radius: 22px;
}

.statement-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 18px 18px 10px;
}

.panel-label {
  display: block;
  margin-bottom: 3px;
  color: #76964e;
  font-size: 7px;
  font-weight: 800;
  letter-spacing: .09em;
}

.statement-panel-head h3 {
  margin: 0;
  font-size: 16px;
}

.statement-panel-head small {
  display: block;
  margin-top: 3px;
  color: #8c857b;
  font-size: 8px;
}

.statement-bulk-actions {
  display: flex;
  gap: 5px;
}

.statement-bulk-actions .btn {
  padding: 7px 9px;
  font-size: 8px;
}

.statement-selection-summary {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 15px;
  padding: 8px 18px;
  color: #837b70;
  background: #faf7f0;
  font-size: 8px;
}

.statement-selection-summary strong {
  color: #3f3b34;
}

.statement-import-toolbar,
.statement-saved-filters {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 10px 18px;
  border-bottom: 1px solid #eee6da;
}

.statement-import-toolbar select,
.statement-saved-filters select,
.statement-search input {
  min-height: 34px;
  border: 1px solid #ded5c7;
  border-radius: 9px;
  background: #fff;
  padding: 6px 8px;
  font-size: 8px;
}

.statement-import-toolbar .btn {
  margin-left: auto;
  font-size: 8px;
}

.saved-toolbar {
  border-top: 1px solid #eee6da;
}

.statement-search {
  min-width: 160px;
  position: relative;
  flex: 1;
}

.statement-search i {
  position: absolute;
  left: 9px;
  top: 50%;
  transform: translateY(-50%);
  color: #a39b90;
}

.statement-search input {
  width: 100%;
  padding-left: 27px;
}

.statement-table-wrap {
  max-height: 590px;
  overflow: auto;
}

.statement-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 8px;
}

.statement-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 9px 8px;
  border-bottom: 1px solid #ded6ca;
  color: #716a61;
  background: #f7f3ec;
  text-align: left;
  font-size: 7px;
  font-weight: 800;
  white-space: nowrap;
}

.statement-table td {
  padding: 9px 8px;
  border-bottom: 1px solid #f0e9df;
  vertical-align: middle;
}

.statement-table tbody tr:hover {
  background: #fcfaf6;
}

.statement-table tr.already-exists {
  opacity: .62;
  background: #faf9f7;
}

.statement-table .check-col {
  width: 34px;
}

.description-cell {
  min-width: 160px;
  max-width: 280px;
}

.description-cell strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.description-cell small {
  display: block;
  margin-top: 2px;
  color: #9a9287;
  font-size: 7px;
}

.amount-cell {
  font-weight: 700;
  white-space: nowrap;
}

.statement-type,
.duplicate-badge,
.new-badge {
  display: inline-flex;
  padding: 4px 6px;
  border-radius: 999px;
  font-size: 7px;
  font-weight: 700;
  white-space: nowrap;
}

.statement-type.expense {
  color: #a05b30;
  background: #fff0e6;
}

.statement-type.income {
  color: #397554;
  background: #eaf4ed;
}

.duplicate-badge {
  color: #8a6d42;
  background: #f2eee5;
}

.new-badge {
  color: #527432;
  background: #eaf3df;
}

.empty-row td {
  height: 230px;
  text-align: center;
}

.empty-row i {
  display: block;
  margin-bottom: 7px;
  color: #8da765;
  font-size: 26px;
}

.empty-row strong {
  display: block;
  font-size: 10px;
}

.empty-row span {
  display: block;
  margin-top: 4px;
  color: #958d82;
  font-size: 8px;
}

.btn.danger {
  color: #a65050;
}

@media(max-width:1150px) {
  .statement-workspace {
    grid-template-columns: 1fr;
  }

  .statement-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media(max-width:760px) {
  .statement-hero {
    align-items: flex-start;
    flex-direction: column;
  }

  .statement-file-actions {
    width: 100%;
    text-align: left;
  }

  .statement-kpis {
    grid-template-columns: 1fr;
  }

  .statement-panel-head,
  .statement-import-toolbar,
  .statement-saved-filters {
    align-items: stretch;
    flex-direction: column;
  }

  .statement-import-toolbar .btn {
    width: 100%;
    margin-left: 0;
  }

  .statement-search {
    width: 100%;
  }
}/* =========================================================
   EvPilot Banka Ekstreleri V3
   ========================================================= */

.bank-statement-hero{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:16px;
  padding:22px 25px;
  border:1px solid #e7ddcd;
  border-radius:23px;
  background:
    radial-gradient(circle at 0 0,rgba(119,153,68,.15),transparent 34%),
    linear-gradient(135deg,#fffefb,#faf5ec);
  box-shadow:0 14px 34px rgba(79,64,32,.06);
}

.bank-statement-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 9px;
  border-radius:999px;
  color:#567b32;
  background:#edf4e5;
  font-size:9px;
  font-weight:700;
}

.bank-statement-hero h2{
  margin:9px 0 6px;
  font-size:22px;
  letter-spacing:-.03em;
}

.bank-statement-hero p{
  max-width:720px;
  margin:0;
  color:#80786e;
  font-size:9px;
  line-height:1.55;
}

.statement-filter-card{
  margin-bottom:16px;
  padding:14px 16px 10px;
  border-radius:20px;
}

.statement-filter-grid{
  display:grid;
  grid-template-columns:
    minmax(120px,.7fr)
    minmax(250px,1.7fr)
    minmax(100px,.6fr)
    minmax(100px,.6fr)
    auto;
  gap:10px;
  align-items:end;
}

.statement-filter-grid .field{
  margin:0;
}

.statement-filter-actions{
  display:flex;
  align-items:end;
}

.statement-filter-summary{
  margin-top:10px;
  padding-top:9px;
  border-top:1px solid #eee5d8;
  color:#81796f;
  font-size:8px;
}

.statement-workspace{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);
  gap:15px;
  align-items:start;
}

.statement-panel{
  min-width:0;
  overflow:hidden;
  border-radius:21px;
}

.statement-panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:17px 17px 9px;
}

.panel-label{
  display:block;
  margin-bottom:3px;
  color:#75934e;
  font-size:7px;
  font-weight:800;
  letter-spacing:.08em;
}

.statement-panel-head h3{
  margin:0;
  font-size:15px;
}

.statement-panel-head small{
  display:block;
  margin-top:3px;
  color:#91897e;
  font-size:8px;
}

.statement-bulk-actions{
  display:flex;
  gap:5px;
}

.statement-bulk-actions .btn{
  padding:6px 8px;
  font-size:8px;
}

.statement-selection-summary,
.statement-period-stats{
  display:flex;
  flex-wrap:wrap;
  gap:13px;
  padding:8px 17px;
  color:#81796f;
  background:#faf7f1;
  font-size:8px;
}

.statement-selection-summary strong,
.statement-period-stats strong{
  color:#3e3932;
}

.statement-import-toolbar,
.statement-saved-tools{
  display:flex;
  align-items:center;
  gap:7px;
  padding:9px 17px;
  border-bottom:1px solid #eee6da;
}

.statement-import-toolbar select,
.statement-search input{
  min-height:33px;
  border:1px solid #ddd4c6;
  border-radius:9px;
  padding:6px 8px;
  background:#fff;
  font-size:8px;
}

.statement-import-toolbar .btn{
  margin-left:auto;
  font-size:8px;
}

.statement-search{
  position:relative;
  flex:1;
}

.statement-search i{
  position:absolute;
  left:9px;
  top:50%;
  transform:translateY(-50%);
  color:#9e968b;
}

.statement-search input{
  width:100%;
  padding-left:27px;
}

.statement-table-wrap{
  max-height:610px;
  overflow:auto;
}

.statement-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  font-size:8px;
}

.statement-table th{
  position:sticky;
  top:0;
  z-index:2;
  padding:9px 8px;
  border-bottom:1px solid #dfd6ca;
  color:#70685f;
  background:#f7f3ec;
  text-align:left;
  font-size:7px;
  font-weight:800;
  white-space:nowrap;
}

.statement-table td{
  padding:9px 8px;
  border-bottom:1px solid #f0e9df;
  vertical-align:middle;
}

.statement-table tbody tr:hover{
  background:#fcfaf6;
}

.statement-table tr.already-exists{
  opacity:.6;
  background:#faf9f7;
}

.description-cell{
  min-width:170px;
  max-width:300px;
}

.description-cell strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.description-cell small{
  display:block;
  margin-top:3px;
  color:#968e82;
  font-size:7px;
}

.amount-cell{
  font-weight:700;
  white-space:nowrap;
}

.new-badge,
.duplicate-badge,
.posted-badge,
.projection-badge{
  display:inline-flex;
  padding:4px 6px;
  border-radius:999px;
  font-size:7px;
  font-weight:700;
  white-space:nowrap;
}

.new-badge{
  color:#557632;
  background:#ebf3e1;
}

.duplicate-badge{
  color:#826d4d;
  background:#f2eee6;
}

.posted-badge{
  color:#456b31;
  background:#eaf3e2;
}

.projection-badge{
  color:#8b651d;
  background:#fff2d9;
}

.projected-row{
  background:#fffaf0;
}

.projected-row td{
  border-bottom-color:#f3e4c5;
}

.empty-row td{
  height:220px;
  text-align:center;
}

.empty-row i{
  display:block;
  margin-bottom:7px;
  color:#86a45a;
  font-size:24px;
}

.empty-row strong{
  display:block;
  font-size:10px;
}

.bank-manager-box{
  width:min(820px,94vw);
}

.bank-account-form-grid{
  display:grid;
  grid-template-columns:
    .7fr 1.2fr 1.2fr .9fr .6fr;
  gap:9px;
  padding:0 18px;
}

.bank-account-list{
  display:grid;
  gap:7px;
  padding:15px 18px 18px;
  border-top:1px solid #eee6da;
}

.bank-account-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 11px;
  border:1px solid #ece3d7;
  border-radius:11px;
  background:#fffdf9;
}

.bank-account-row strong{
  display:block;
  font-size:9px;
}

.bank-account-row span{
  display:block;
  margin-top:2px;
  color:#8b8378;
  font-size:8px;
}

.bank-empty{
  padding:18px;
  color:#8b8378;
  text-align:center;
  font-size:9px;
}

.btn.danger{
  color:#a65050;
}

@media(max-width:1200px){
  .statement-filter-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .statement-filter-actions{
    grid-column:1/-1;
  }

  .statement-workspace{
    grid-template-columns:1fr;
  }
}

@media(max-width:760px){
  .bank-statement-hero{
    align-items:flex-start;
    flex-direction:column;
  }

  .statement-filter-grid{
    grid-template-columns:1fr;
  }

  .statement-filter-actions{
    grid-column:auto;
  }

  .statement-panel-head,
  .statement-import-toolbar,
  .statement-saved-tools{
    align-items:stretch;
    flex-direction:column;
  }

  .statement-import-toolbar .btn{
    width:100%;
    margin-left:0;
  }

  .bank-account-form-grid{
    grid-template-columns:1fr;
  }
}