html {
  min-height: 100%;
}

/* =========================================================
   ZEMHAN EXECUTIVE CRM — v18 tam arayüz dönüşümü
   ========================================================= */
:root {
  --zx-ink: #101828;
  --zx-navy: #101727;
  --zx-navy-2: #182238;
  --zx-gold: #cda96b;
  --zx-gold-soft: #f4ead8;
  --zx-bg: #f2f4f8;
  --zx-card: #ffffff;
  --zx-line: #e6e9ef;
  --zx-muted: #7a8496;
  --zx-green: #2f8b6d;
  --zx-red: #bd5b56;
}
html, body {
  color: var(--zx-ink);
  background: var(--zx-bg);
}
body {
  background:
    radial-gradient(circle at 82% 5%, #e8e1d4 0, transparent 25%),
    linear-gradient(145deg, #f6f7f9, #eef1f6);
}
.crm-shell {
  background: transparent;
}
.crm-sidebar {
  background:
    radial-gradient(circle at 20% 0, #263550 0, transparent 34%),
    linear-gradient(180deg, #151e30 0%, #0d1422 100%);
  border-right: 1px solid #ffffff0d;
  box-shadow: 18px 0 55px #0d14221f;
}
.crm-logo {
  background: #fff;
  border: 1px solid #ffffff26;
  box-shadow: 0 12px 30px #00000042;
}
.crm-brand-copy strong,
.crm-brand strong {
  color: #fff;
  letter-spacing: .2px;
}
.crm-brand-copy span,
.crm-brand small {
  color: #aeb8ca;
}
.crm-nav a {
  color: #aeb7c8;
  border: 1px solid transparent;
  border-radius: 12px;
  min-height: 46px;
  transition: .2s ease;
}
.crm-nav a:hover {
  color: #fff;
  background: #ffffff0a;
  border-color: #ffffff0b;
}
.crm-nav a.active {
  color: #fff;
  background: linear-gradient(135deg, #c29b5d26, #ffffff0d);
  border-color: #d1ae7440;
  box-shadow: inset 3px 0 var(--zx-gold), 0 12px 28px #0002;
}
.crm-nav a.active:before {
  display: none;
}
.crm-nav svg {
  color: var(--zx-gold);
  stroke-width: 1.8px;
}
.sidebar-profile {
  background: #ffffff08;
  border: 1px solid #ffffff10;
  border-radius: 15px;
}
.profile-avatar {
  color: #1a2232;
  background: linear-gradient(145deg, #ead8b7, #c69d5c);
}
.crm-main {
  max-width: 1600px;
  padding-top: 30px;
}
.crm-topbar {
  align-items: center;
}
.crm-eyebrow {
  color: #a17d45;
  letter-spacing: 1.7px;
}
.crm-topbar h1 {
  color: var(--zx-ink);
  font-size: 34px;
  letter-spacing: -1.4px;
}
.new-event-button,
.save-organization-button {
  color: #fff;
  background: linear-gradient(135deg, #1e2a43, #111827);
  border: 1px solid #ffffff20;
  box-shadow: 0 13px 28px #11182730;
}
.crm-tabs {
  background: #ffffffd9;
  border: 1px solid #fff;
  border-radius: 14px;
  padding: 5px;
  box-shadow: 0 12px 35px #1720330d;
}
.crm-tabs a {
  color: #7e8797;
  border-radius: 10px;
  min-height: 40px;
}
.crm-tabs a.active {
  color: #fff;
  background: linear-gradient(135deg, #1e293b, #111827);
  border-color: #111827;
  box-shadow: 0 9px 20px #11182725;
}
.crm-tabs a.active svg {
  color: var(--zx-gold);
}
.summary-card,
.finance-summary .summary-card,
.finance-summary .summary-card:nth-child(n) {
  color: var(--zx-ink);
  background: linear-gradient(150deg, #fff, #f9fafc);
  border: 1px solid #fff;
  border-radius: 17px;
  box-shadow: 0 14px 38px #1720330d;
}
.summary-card:before,
.finance-summary .summary-card:before {
  background: radial-gradient(circle, #cda96b1b, transparent 68%);
}
.summary-symbol,
.finance-summary .summary-symbol,
.finance-summary .summary-card:nth-child(n) .summary-symbol {
  color: #192438;
  background: linear-gradient(145deg, #f2e5ce, #d5b77e);
  border: 1px solid #fff8;
  border-radius: 12px;
  box-shadow: 0 8px 18px #9e794b20;
}
.summary-symbol svg,
.finance-summary .summary-symbol svg {
  stroke-width: 1.8px;
}
.summary-card p,
.finance-summary .summary-card p,
.finance-summary .summary-card:nth-child(n) p {
  color: var(--zx-muted);
  letter-spacing: .7px;
}
.summary-card strong,
.finance-summary .summary-card strong.compact-value,
.finance-summary .summary-card:nth-child(n) strong.compact-value {
  color: var(--zx-ink);
}
.finance-page-heading {
  color: #fff;
  background:
    radial-gradient(circle at 88% 20%, #d2ae7040, transparent 25%),
    linear-gradient(135deg, #1a2740, #101727 72%);
  border: 1px solid #ffffff14;
  border-radius: 20px;
  padding: 25px 27px;
  box-shadow: 0 18px 40px #10172729;
}
.finance-page-heading:after {
  opacity: .18;
  color: var(--zx-gold);
}
.finance-page-heading p {
  color: #d7b87f;
}
.finance-page-heading h2 {
  color: #fff;
}
.finance-page-heading span {
  color: #bcc5d4;
}
.expense-manager {
  background: linear-gradient(150deg, #fff, #fbfcfe);
  border: 1px solid #fff;
  border-radius: 20px;
  box-shadow: 0 16px 44px #17203310;
}
.expense-manager-head {
  border-bottom: 1px solid var(--zx-line);
  padding-bottom: 16px;
}
.expense-manager-head p {
  color: #a17d45;
}
.expense-manager-head h3 {
  color: var(--zx-ink);
}
.expense-manager-head > strong {
  color: #fff;
  background: linear-gradient(135deg, #25334c, #111827);
  border-color: #ffffff1f;
  box-shadow: 0 9px 20px #11182720;
}
.expense-entry-form {
  background: #f3f5f8;
  border-color: #e4e8ee;
  border-radius: 14px;
}
.expense-entry-form input,
.expense-entry-form select {
  color: var(--zx-ink);
  background: #fff;
  border-color: #dfe4eb;
  border-radius: 9px;
}
.expense-entry-form input:focus,
.expense-entry-form select:focus {
  border-color: #c5a264;
  box-shadow: 0 0 0 4px #c5a26418;
}
.expense-entry-form > button {
  background: linear-gradient(135deg, #d0ac6c, #a77f40);
  box-shadow: 0 9px 20px #9d773b26;
}
.expense-category {
  color: #72552a;
  background: var(--zx-gold-soft);
}
.expense-record-list article b {
  color: #a47738;
}
.organization-list-card,
.organization-form-card,
.calendar-card,
.work-task-panel,
.team-panel {
  background: #ffffffef;
  border: 1px solid #fff;
  border-radius: 19px;
  box-shadow: 0 16px 45px #1720330d;
}
.section-heading {
  background: linear-gradient(180deg, #fff, #fafbfc);
  border-bottom-color: var(--zx-line);
}
.crm-search {
  background: #f3f5f8;
  border-color: #e1e5eb;
}
.date-box {
  color: #6d532d;
  background: linear-gradient(145deg, #f6ead6, #ead4ad);
  border-color: #e5cda2;
}
.organization-actions a,
.organization-actions button {
  border-radius: 9px;
}
.payment-status.paid,
.crm-status.completed {
  color: #237156;
  background: #e4f3ed;
}
.mobile-bottom-nav,
.mobile-bottom-nav.with-admin {
  background: #111a2aeF;
  border: 1px solid #ffffff18;
  box-shadow: 0 18px 45px #0d14224d;
}
.mobile-bottom-nav a,
.mobile-bottom-nav button {
  color: #9da8ba;
}
.mobile-bottom-nav a:active,
.mobile-bottom-nav a:focus {
  color: #f0d39d;
  background: #ffffff0a;
}
.mobile-bottom-nav .mobile-add span {
  color: #182033;
  background: linear-gradient(145deg, #efd39e, #c89e5d);
  border-color: #1d293d;
  box-shadow: 0 10px 25px #0005;
}
@media (max-width: 760px) {
  body {
    background: linear-gradient(180deg, #eef1f6, #f8f9fb);
  }
  .crm-sidebar {
    background:
      radial-gradient(circle at 90% 0, #354665, transparent 40%),
      linear-gradient(135deg, #172238, #0d1422);
    border-bottom: 0;
    box-shadow: 0 10px 30px #11182725;
  }
  .crm-main {
    padding-top: 18px;
  }
  .crm-topbar h1 {
    font-size: 27px;
  }
  .crm-tabs {
    background: #ffffffed;
    border-radius: 13px;
  }
  .finance-page-heading {
    border-radius: 18px;
    padding: 19px 18px;
  }
  .finance-summary .summary-card,
  .finance-summary .summary-card:nth-child(n) {
    background: linear-gradient(150deg, #fff, #f8fafc);
    border-radius: 15px;
  }
  .expense-manager {
    border-radius: 17px;
  }
  .organization-list-card,
  .organization-form-card,
  .calendar-card {
    border-radius: 17px;
  }
}

/* Muhasebe paneli — 2026 revizyonu */
.finance-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 22px;
}
.finance-summary .summary-card {
  min-height: 108px;
  border: 1px solid #eadfe3;
  background: linear-gradient(150deg, #fff 0%, #fbf7f8 100%);
  box-shadow: 0 16px 36px #3b29330f;
}
.finance-summary .summary-card:nth-child(n + 5) {
  background: linear-gradient(150deg, #fff 0%, #f7f1f3 100%);
}
.finance-summary .summary-card p {
  text-transform: uppercase;
  letter-spacing: 0.55px;
  font-size: 9px;
  font-weight: 850;
}
.finance-summary .summary-card strong.compact-value {
  font-size: 20px;
  letter-spacing: -0.45px;
}
.finance-summary .summary-symbol {
  color: #fff;
  background: linear-gradient(145deg, #a8665f, #76433f);
  font-family: Georgia, serif;
  font-size: 18px;
  box-shadow: 0 8px 18px #8d514b32;
}
@media (max-width: 1100px) {
  .finance-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  .finance-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .finance-summary .summary-card {
    min-height: 101px;
    padding: 13px 10px;
  }
  .finance-summary .summary-card strong.compact-value {
    font-size: 16px;
  }
  .finance-summary .summary-symbol {
    width: 36px;
    height: 36px;
    font-size: 15px;
  }
}

/* Gider yönetimi */
.expense-manager {
  order: 2;
  background: #fffefa;
  border: 1px solid #ebe3dc;
  border-radius: 22px;
  padding: 22px;
  box-shadow: 0 16px 42px #2c1f3112;
}
.finance-page > .finance-summary {
  order: 3;
}
.finance-page > .finance-page-heading {
  order: 1;
}
.expense-manager-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 18px;
}
.expense-manager-head p {
  color: #a8665f;
  letter-spacing: 1.4px;
  margin: 0 0 5px;
  font-size: 9px;
  font-weight: 900;
}
.expense-manager-head h3 {
  color: #182033;
  margin: 0 0 5px;
  font-size: 21px;
}
.expense-manager-head span {
  color: #888291;
  font-size: 12px;
}
.expense-manager-head > strong {
  color: #8f504a;
  background: #f7ebe7;
  border: 1px solid #ecd4cf;
  border-radius: 12px;
  padding: 10px 13px;
  white-space: nowrap;
}
.expense-entry-form {
  display: grid;
  grid-template-columns: 0.8fr 1.5fr 0.7fr 0.8fr auto;
  align-items: end;
  gap: 10px;
  background: #f8f5f3;
  border: 1px solid #eee5e1;
  border-radius: 16px;
  padding: 14px;
}
.expense-entry-form label {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.expense-entry-form label > span {
  color: #746c75;
  font-size: 10px;
  font-weight: 800;
}
.expense-entry-form input,
.expense-entry-form select {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: 42px;
  color: #282331;
  background: #fff;
  border: 1px solid #e2d9dd;
  border-radius: 10px;
  padding: 0 11px;
  font: inherit;
  font-size: 12px;
  outline: none;
}
.expense-entry-form input:focus,
.expense-entry-form select:focus {
  border-color: #b87871;
  box-shadow: 0 0 0 4px #a8665f14;
}
.expense-entry-form > button {
  height: 42px;
  color: #fff;
  background: linear-gradient(135deg, #a8665f, #804a46);
  border: 0;
  border-radius: 10px;
  padding: 0 16px;
  font-weight: 800;
  white-space: nowrap;
  cursor: pointer;
}
.expense-entry-form > button:disabled {
  opacity: 0.65;
}
.expense-message {
  color: #77504c;
  background: #fbf2ef;
  border-radius: 10px;
  margin-top: 10px;
  padding: 9px 12px;
  font-size: 11px;
  font-weight: 700;
}
.expense-record-list {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}
.expense-record-list article {
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid #eee8e3;
  padding: 10px 4px;
}
.expense-category {
  color: #8f504a;
  background: #f7ebe7;
  border-radius: 999px;
  padding: 6px 9px;
  text-align: center;
  font-size: 10px;
  font-weight: 850;
}
.expense-record-list article > div {
  display: grid;
  gap: 3px;
}
.expense-record-list article strong {
  color: #272231;
  font-size: 13px;
}
.expense-record-list article small {
  color: #948d96;
  font-size: 10px;
}
.expense-record-list article b {
  color: #9b514b;
  font-size: 14px;
  white-space: nowrap;
}
.expense-record-list article button {
  color: #a25852;
  background: #fff4f2;
  border: 1px solid #efd9d5;
  border-radius: 8px;
  padding: 7px 10px;
  cursor: pointer;
}
.expense-empty {
  color: #938b94;
  background: #faf8f7;
  border: 1px dashed #ded6da;
  border-radius: 12px;
  padding: 18px;
  text-align: center;
  font-size: 12px;
}
@media (max-width: 980px) {
  .expense-entry-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .expense-entry-form > button {
    grid-column: 1 / -1;
  }
}
@media (max-width: 760px) {
  .expense-manager {
    border-radius: 18px;
    padding: 15px;
  }
  .expense-manager-head {
    gap: 10px;
    margin-bottom: 13px;
  }
  .expense-manager-head h3 {
    font-size: 18px;
  }
  .expense-manager-head span {
    display: block;
    max-width: 210px;
  }
  .expense-manager-head > strong {
    padding: 8px 9px;
    font-size: 12px;
  }
  .expense-entry-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    padding: 11px;
  }
  .expense-entry-form label:nth-child(2) {
    grid-column: 1 / -1;
    grid-row: 2;
  }
  .expense-entry-form > button {
    grid-column: 1 / -1;
  }
  .expense-record-list article {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 8px;
  }
  .expense-record-list article button {
    grid-column: 3;
    padding: 6px 8px;
  }
}

/* Aylık kazanç dökümü uygulamadan kaldırıldı; ayrı PDF raporunda kullanılacak. */
.monthly-accounting {
  display: none !important;
}

/* Finance Executive — profesyonel muhasebe ekranı */
.finance-page {
  gap: 22px;
}
.finance-page-heading {
  color: #fff;
  background:
    linear-gradient(115deg, #28243a 0%, #383250 58%, #4d4567 100%);
  border: 1px solid #ffffff18;
  border-radius: 24px;
  padding: 30px 32px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 20px 48px #2d28432b;
}
.finance-page-heading::after {
  content: "₺";
  color: #ffffff0f;
  font-family: Arial, sans-serif;
  font-size: 150px;
  font-weight: 900;
  line-height: 1;
  position: absolute;
  top: -27px;
  right: 28px;
  transform: rotate(8deg);
}
.finance-page-heading p {
  color: #d9d2ff;
  letter-spacing: 1.8px;
  position: relative;
  z-index: 1;
}
.finance-page-heading h2 {
  color: #fff;
  letter-spacing: -1.2px;
  font-size: 33px;
  position: relative;
  z-index: 1;
}
.finance-page-heading span {
  color: #cfc9dc;
  position: relative;
  z-index: 1;
}
.finance-summary {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: stretch;
  gap: 14px;
}
.finance-summary .summary-card {
  grid-column: span 3;
  min-width: 0;
  min-height: 132px;
  background: #fff;
  border: 1px solid #e6e2ec;
  border-radius: 20px;
  align-items: flex-start;
  gap: 14px;
  padding: 20px;
  box-shadow: 0 14px 35px #3730470d;
}
.finance-summary .summary-card::before {
  width: 100px;
  height: 100px;
  top: -45px;
  right: -35px;
}
.finance-summary .summary-card:nth-child(1),
.finance-summary .summary-card:nth-child(5),
.finance-summary .summary-card:nth-child(8) {
  grid-column: span 4;
  min-height: 154px;
}
.finance-summary .summary-card:nth-child(1) {
  background: linear-gradient(145deg, #fff7f5, #fff);
  border-color: #f1d8d3;
}
.finance-summary .summary-card:nth-child(5) {
  color: #fff;
  background: linear-gradient(135deg, #37856b, #24634f);
  border-color: #39816a;
  box-shadow: 0 17px 38px #286b552b;
}
.finance-summary .summary-card:nth-child(8) {
  color: #fff;
  background: linear-gradient(135deg, #7161d7, #5345b2);
  border-color: #6758c8;
  box-shadow: 0 17px 38px #5d4fc02c;
}
.finance-summary .summary-card:nth-child(5)::before,
.finance-summary .summary-card:nth-child(8)::before {
  background: radial-gradient(circle, #ffffff25, transparent 68%);
}
.finance-summary .summary-card:nth-child(5) p,
.finance-summary .summary-card:nth-child(8) p {
  color: #ffffffb8;
}
.finance-summary .summary-card:nth-child(5) strong.compact-value,
.finance-summary .summary-card:nth-child(8) strong.compact-value {
  color: #fff;
}
.finance-summary .summary-card:nth-child(5) .summary-symbol,
.finance-summary .summary-card:nth-child(8) .summary-symbol {
  color: #fff;
  background: #ffffff1c;
  border: 1px solid #ffffff2c;
  box-shadow: none;
}
.finance-summary .summary-symbol {
  border-radius: 13px;
  width: 43px;
  height: 43px;
}
.finance-summary .summary-card > div {
  min-width: 0;
}
.finance-summary .summary-card p {
  color: #888291;
  letter-spacing: 0.7px;
  margin: 0 0 7px;
  font-size: 8.5px;
  font-weight: 850;
}
.finance-summary .summary-card strong.compact-value {
  color: #2c283a;
  white-space: nowrap;
  letter-spacing: -0.6px;
  font-size: clamp(17px, 1.45vw, 23px);
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}
.finance-summary .summary-card:nth-child(1) strong.compact-value {
  color: #df6f65;
}
@media (max-width: 1150px) {
  .finance-summary .summary-card,
  .finance-summary .summary-card:nth-child(1),
  .finance-summary .summary-card:nth-child(5),
  .finance-summary .summary-card:nth-child(8) {
    grid-column: span 6;
  }
}
@media (max-width: 760px) {
  .finance-page {
    gap: 15px;
  }
  .finance-page-heading {
    border-radius: 21px;
    padding: 23px 20px;
  }
  .finance-page-heading::after {
    font-size: 105px;
    top: -17px;
    right: 13px;
  }
  .finance-page-heading h2 {
    font-size: 27px;
  }
  .finance-page-heading span {
    max-width: 230px;
    line-height: 1.5;
    display: block;
  }
  .finance-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .finance-summary .summary-card,
  .finance-summary .summary-card:nth-child(1),
  .finance-summary .summary-card:nth-child(5),
  .finance-summary .summary-card:nth-child(8) {
    grid-column: span 1;
    min-height: 138px;
    border-radius: 18px;
    gap: 10px;
    padding: 14px 11px;
  }
  .finance-summary .summary-card:nth-child(5),
  .finance-summary .summary-card:nth-child(8) {
    grid-column: 1 / -1;
    min-height: 112px;
    align-items: center;
  }
  .finance-summary .summary-symbol {
    width: 37px;
    height: 37px;
  }
  .finance-summary .summary-card strong.compact-value {
    white-space: normal;
    overflow-wrap: anywhere;
    font-size: 16px;
  }
  .finance-summary .summary-card:nth-child(5) strong.compact-value,
  .finance-summary .summary-card:nth-child(8) strong.compact-value {
    font-size: 21px;
  }
}

/* Ay içindeki iş bazlı kazanç detayları */
.monthly-job-breakdown {
  border-top: 1px dashed #ddd7e8;
  grid-column: 1 / -1;
  margin-top: 3px;
  padding-top: 12px;
}
.monthly-job-breakdown summary {
  color: #6254c3;
  cursor: pointer;
  list-style: none;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-radius: 12px;
  padding: 9px 11px;
  font-size: 11px;
  font-weight: 800;
  display: flex;
}
.monthly-job-breakdown summary::-webkit-details-marker {
  display: none;
}
.monthly-job-breakdown summary::before {
  content: "+";
  color: #fff;
  background: #7161d7;
  border-radius: 8px;
  place-items: center;
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  font-size: 16px;
  display: grid;
}
.monthly-job-breakdown[open] summary::before {
  content: "−";
}
.monthly-job-breakdown summary span {
  flex: 1;
}
.monthly-job-breakdown summary strong {
  color: #7161d7;
  font-size: 10px;
}
.monthly-job-list {
  border: 1px solid #ebe7f2;
  border-radius: 16px;
  margin-top: 9px;
  overflow: hidden;
}
.monthly-job-row {
  background: #fcfbff;
  border-bottom: 1px solid #eeeaf4;
  grid-template-columns: minmax(180px, 1.6fr) repeat(4, minmax(85px, 1fr));
  align-items: center;
  gap: 13px;
  padding: 14px 15px;
  display: grid;
}
.monthly-job-row:nth-child(even) {
  background: #f8f6ff;
}
.monthly-job-row:last-child {
  border-bottom: 0;
}
.monthly-job-row > div {
  min-width: 0;
}
.monthly-job-row small {
  color: #918a9b;
  margin-bottom: 4px;
  font-size: 8px;
  display: block;
}
.monthly-job-row strong {
  color: #393449;
  white-space: nowrap;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}
.monthly-job-name strong {
  white-space: normal;
  font-size: 12px;
}
.monthly-job-name small {
  margin: 4px 0 0;
}
.monthly-job-profit strong {
  color: #378267;
  font-size: 13px;
}
.monthly-job-receivable strong {
  color: #dc6c63;
}
@media (max-width: 760px) {
  .monthly-job-breakdown summary {
    padding: 8px 4px;
  }
  .monthly-job-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 8px;
    padding: 14px 12px;
  }
  .monthly-job-name {
    border-bottom: 1px dashed #e2ddeb;
    grid-column: 1 / -1;
    padding-bottom: 9px;
  }
  .monthly-job-row strong {
    white-space: normal;
  }
}

/* Aylık muhasebe listesi */
.monthly-accounting {
  background: #fff;
  border: 1px solid #e7e3ef;
  border-radius: 27px;
  overflow: hidden;
  box-shadow: 0 18px 48px #50486d0d;
}
.monthly-accounting-head {
  background: linear-gradient(135deg, #faf9ff, #f4f1ff);
  border-bottom: 1px solid #e8e3f1;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 23px 25px;
  display: flex;
}
.monthly-accounting-head h3 {
  color: #28243a;
  margin: 0 0 5px;
  font-size: 19px;
}
.monthly-accounting-head p {
  color: #888193;
  margin: 0;
  font-size: 11px;
}
.monthly-accounting-head > span {
  color: #6254c3;
  white-space: nowrap;
  background: #e9e5ff;
  border-radius: 999px;
  padding: 7px 11px;
  font-size: 10px;
  font-weight: 850;
}
.monthly-accounting-list {
  display: grid;
}
.monthly-accounting-row {
  border-bottom: 1px solid #eeeaf3;
  grid-template-columns: minmax(150px, 1.35fr) repeat(5, minmax(95px, 1fr));
  align-items: center;
  gap: 15px;
  padding: 19px 24px;
  display: grid;
  transition: background 0.18s ease;
}
.monthly-accounting-row:last-child {
  border-bottom: 0;
}
.monthly-accounting-row:hover {
  background: #faf9ff;
}
.monthly-accounting-row > div {
  min-width: 0;
}
.monthly-accounting-row small,
.monthly-accounting-month span {
  color: #8c8596;
  margin-bottom: 5px;
  font-size: 9px;
  display: block;
}
.monthly-accounting-row strong {
  color: #342f46;
  white-space: nowrap;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}
.monthly-accounting-month strong {
  text-transform: capitalize;
  font-size: 15px;
}
.monthly-accounting-month span {
  margin: 5px 0 0;
}
.monthly-accounting-profit strong {
  color: #3e8c70;
  font-size: 15px;
}
.monthly-accounting-receivable strong {
  color: #df6d63;
}
.monthly-accounting-empty {
  color: #8a8394;
  text-align: center;
  padding: 38px 20px;
  font-size: 12px;
}
@media (max-width: 1050px) {
  .monthly-accounting-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .monthly-accounting-month {
    grid-column: 1 / -1;
  }
}
@media (max-width: 760px) {
  .monthly-accounting {
    border-radius: 23px;
  }
  .monthly-accounting-head {
    padding: 19px 17px;
  }
  .monthly-accounting-head h3 {
    font-size: 17px;
  }
  .monthly-accounting-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px 10px;
    padding: 18px 16px;
  }
  .monthly-accounting-month {
    border-bottom: 1px dashed #e5e0ed;
    grid-column: 1 / -1;
    padding-bottom: 11px;
  }
  .monthly-accounting-row strong {
    white-space: normal;
    font-size: 12px;
  }
  .monthly-accounting-profit strong {
    font-size: 14px;
  }
}

/* Celebration Bento — renkli modern panel */
:root {
  --bento-ink: #28243a;
  --bento-purple: #7161d7;
  --bento-purple-dark: #5143af;
  --bento-coral: #ef7e73;
  --bento-blue: #65a7dc;
  --bento-mint: #78bda2;
  --bento-yellow: #f2c66f;
  --bento-bg: #f5f3fa;
  --bento-card: #ffffff;
  --bento-line: #e8e4f0;
}
html,
body {
  background: var(--bento-bg);
}
body {
  color: var(--bento-ink);
  background:
    radial-gradient(circle at 8% 8%, #ded9ff 0, transparent 24%),
    radial-gradient(circle at 94% 90%, #ffe1d9 0, transparent 26%),
    #f5f3fa;
}
.crm-sidebar {
  background: linear-gradient(180deg, #ffffff 0%, #faf9ff 100%);
  border-right: 1px solid var(--bento-line);
  box-shadow: 12px 0 40px #514a7010;
}
.crm-brand {
  border-bottom-color: #ece8f3;
}
.crm-logo {
  border: 0;
  border-radius: 17px;
  box-shadow: 0 10px 24px #665d8b22;
}
.crm-nav a {
  color: #7d778b;
  border: 1px solid transparent;
  border-radius: 15px;
}
.crm-nav a:hover {
  color: var(--bento-purple-dark);
  background: #f0edff;
  border-color: #e2dcff;
}
.crm-nav a.active {
  color: #fff;
  background: linear-gradient(135deg, #8071e4, #5d4fc0);
  border-color: transparent;
  box-shadow: 0 11px 25px #6557c53b;
}
.crm-nav a.active::before {
  display: none;
}
.sidebar-profile {
  color: var(--bento-ink);
  background: #f3f0fb;
  border-color: #e6e1f0;
}
.sidebar-profile small,
.sidebar-profile button {
  color: #827b91;
}
.profile-avatar {
  color: #fff;
  background: linear-gradient(145deg, #f19186, #e4675d);
  box-shadow: 0 8px 18px #e66b6030;
}
.crm-main {
  padding-top: 31px;
}
.crm-eyebrow,
.finance-page-heading p {
  color: var(--bento-coral);
}
.crm-topbar h1,
.finance-page-heading h2,
.section-heading h2,
.form-title h2 {
  color: var(--bento-ink);
  font-family: inherit;
  font-weight: 850;
}
.crm-topbar h1 {
  letter-spacing: -1.5px;
  font-size: 35px;
}
.new-event-button,
.save-organization-button {
  color: #fff;
  background: linear-gradient(135deg, #f18a7e, #e3665c);
  border: 0;
  border-radius: 15px;
  box-shadow: 0 13px 27px #e46d6236;
}
.crm-tabs {
  background: #ffffffd9;
  border-color: #e7e2ef;
  border-radius: 22px;
  padding: 7px;
  box-shadow: 0 13px 38px #50486d10;
}
.crm-tabs a {
  color: #817a8e;
  border-radius: 15px;
}
.crm-tabs a.active {
  color: #5e50bb;
  background: #eeebff;
  border-color: #ded8ff;
  box-shadow: none;
}
.summary-card,
.organization-list-card,
.organization-form-card,
.calendar-card,
.work-task-panel,
.team-panel,
.upcoming-alerts {
  background: var(--bento-card);
  border: 1px solid var(--bento-line);
  box-shadow: 0 18px 48px #50486d0d;
}
.summary-card {
  border-radius: 26px;
  min-height: 118px;
  overflow: hidden;
}
.summary-card::before {
  width: 120px;
  height: 120px;
  top: -54px;
  right: -40px;
  background: radial-gradient(circle, #8a7be72c, transparent 67%);
}
.summary-card:nth-child(4n + 2)::before {
  background: radial-gradient(circle, #f18a7e2b, transparent 67%);
}
.summary-card:nth-child(4n + 3)::before {
  background: radial-gradient(circle, #72afd92b, transparent 67%);
}
.summary-card:nth-child(4n + 4)::before {
  background: radial-gradient(circle, #80bea42b, transparent 67%);
}
.summary-symbol,
.finance-summary .summary-symbol {
  color: #fff;
  background: linear-gradient(145deg, #8576e5, #6354c7);
  border: 0;
  border-radius: 17px;
  box-shadow: 0 10px 23px #6658c832;
}
.summary-card:nth-child(4n + 2) .summary-symbol,
.finance-summary .summary-card:nth-child(4n + 2) .summary-symbol {
  background: linear-gradient(145deg, #f29287, #e6685e);
  box-shadow: 0 10px 23px #e86e6330;
}
.summary-card:nth-child(4n + 3) .summary-symbol,
.finance-summary .summary-card:nth-child(4n + 3) .summary-symbol {
  background: linear-gradient(145deg, #78b8e4, #5598cb);
  box-shadow: 0 10px 23px #5a9dcf2d;
}
.summary-card:nth-child(4n + 4) .summary-symbol,
.finance-summary .summary-card:nth-child(4n + 4) .summary-symbol {
  background: linear-gradient(145deg, #8ac9af, #5ca78b);
  box-shadow: 0 10px 23px #62a98e2d;
}
.summary-card strong,
.finance-summary .summary-card strong.compact-value {
  color: var(--bento-ink);
}
.finance-page-heading {
  background:
    radial-gradient(circle at 88% 5%, #ffffff26 0, transparent 25%),
    linear-gradient(125deg, #7969dd 0%, #5b4dbb 55%, #4e43a4 100%);
  border: 0;
  border-radius: 31px;
  padding: 31px 33px;
  box-shadow: 0 20px 46px #5c4ebd32;
}
.finance-page-heading p {
  color: #ffd2cc;
}
.finance-page-heading h2 {
  color: #fff;
}
.finance-page-heading span {
  color: #e7e3ff;
}
.finance-summary {
  gap: 15px;
}
.finance-summary .summary-card,
.finance-summary .summary-card:nth-child(n + 5) {
  background: #fff;
  border-color: #e7e3ef;
  border-radius: 26px;
}
.finance-summary .summary-card:nth-child(n + 5) {
  background: linear-gradient(145deg, #fff, #f5f2ff);
}
.section-heading {
  background: #fff;
}
.crm-search,
.crm-field input,
.crm-field select,
.crm-field textarea {
  background: #f7f5fb;
  border-color: #e5e0ed;
  border-radius: 14px;
}
.crm-search:focus-within,
.crm-field input:focus,
.crm-field select:focus,
.crm-field textarea:focus {
  background: #fff;
  border-color: #8879df;
  box-shadow: 0 0 0 4px #7566d71a;
}
.organization-row:hover {
  background: linear-gradient(90deg, #fff, #f8f6ff);
}
.date-box {
  background: linear-gradient(145deg, #eeeaff, #dfd8ff);
  border-color: #d7cffd;
  border-radius: 15px;
  box-shadow: none;
}
.date-box strong {
  color: #5d4fba;
}
.date-box span {
  color: #7a70a8;
}
.organization-title h3 {
  color: var(--bento-ink);
}
.mobile-bottom-nav,
.mobile-bottom-nav.with-admin {
  background: #fffffff0;
  border-color: #e4dfed;
  border-radius: 27px;
  box-shadow: 0 18px 48px #4e466924;
}
.mobile-bottom-nav a,
.mobile-bottom-nav button {
  color: #7d768a;
}
.mobile-bottom-nav a:active,
.mobile-bottom-nav a[href="#finance"]:focus {
  color: #5c4eba;
  background: #efecff;
}
.mobile-bottom-nav .mobile-add span {
  color: #fff;
  background: linear-gradient(145deg, #f18a7e, #e2655b);
  border-color: #f5f3fa;
  box-shadow: 0 10px 23px #e56c613b;
}
@media (max-width: 760px) {
  body {
    background:
      radial-gradient(circle at 100% 0, #e2dcff, transparent 28%),
      #f5f3fa;
  }
  .crm-sidebar {
    background: #fff;
    border-bottom: 1px solid #e7e2ef;
    box-shadow: 0 8px 26px #50496b12;
  }
  .crm-tabs {
    border-radius: 20px;
  }
  .finance-page-heading {
    border-radius: 25px;
    padding: 25px 21px;
  }
  .summary-card,
  .finance-summary .summary-card {
    border-radius: 22px;
  }
  .organization-list-card,
  .organization-form-card,
  .calendar-card {
    border-radius: 25px;
  }
}

/* Atelier Sage — açık butik arayüz */
:root {
  --sage: #1f4b3a;
  --sage-dark: #15372b;
  --sage-soft: #dce9df;
  --copper: #bd7654;
  --copper-soft: #f1ddd1;
  --ivory: #f8f6ef;
  --paper: #fffefa;
  --charcoal: #24302b;
  --soft-text: #768078;
  --soft-line: #e4e6dd;
}
html,
body {
  background: var(--ivory);
}
body {
  color: var(--charcoal);
  background:
    radial-gradient(circle at 100% 0, #e5eee5 0, transparent 34%),
    radial-gradient(circle at 0 100%, #f3e5db 0, transparent 30%),
    #f8f6ef;
}
.crm-sidebar {
  background: #fbfaf5;
  border-right: 1px solid #e1e3da;
  box-shadow: 12px 0 36px #273c3210;
}
.crm-brand {
  border-bottom-color: #e5e5dc;
}
.crm-logo {
  border: 1px solid #d8ddd2;
  box-shadow: 0 9px 22px #293a3021;
}
.crm-nav a {
  color: #747d76;
  border: 1px solid transparent;
}
.crm-nav a:hover {
  color: var(--sage);
  background: #eef3ed;
  border-color: #e0e8df;
  box-shadow: none;
}
.crm-nav a.active {
  color: #fff;
  background: linear-gradient(135deg, #2c5d49, #183e30);
  border-color: #315e4c;
  box-shadow: 0 10px 22px #1f4b3a2b;
}
.crm-nav a.active::before {
  display: none;
}
.sidebar-profile {
  color: var(--charcoal);
  background: #f0f2eb;
  border-color: #e1e4da;
}
.sidebar-profile small,
.sidebar-profile button {
  color: #7b837d;
}
.profile-avatar {
  color: #fff;
  background: linear-gradient(145deg, #ca8462, #a75f40);
  box-shadow: 0 7px 17px #a15d3e25;
}
.crm-main {
  padding-top: 32px;
}
.crm-eyebrow,
.finance-page-heading p {
  color: var(--copper);
}
.crm-topbar h1,
.finance-page-heading h2,
.section-heading h2,
.form-title h2 {
  color: var(--charcoal);
  font-family: inherit;
  font-weight: 780;
}
.crm-topbar h1 {
  font-size: 34px;
}
.new-event-button,
.save-organization-button {
  color: #fff;
  background: linear-gradient(135deg, #c47b59, #a95d3d);
  border: 0;
  box-shadow: 0 12px 25px #a65e402c;
}
.crm-tabs {
  background: #fffefa;
  border-color: #e3e5dc;
  border-radius: 22px;
  box-shadow: 0 12px 34px #2c3c3310;
}
.crm-tabs a {
  color: #778079;
  border-radius: 15px;
}
.crm-tabs a.active {
  color: var(--sage);
  background: var(--sage-soft);
  border-color: #cadbce;
  box-shadow: none;
}
.summary-card,
.organization-list-card,
.organization-form-card,
.calendar-card,
.work-task-panel,
.team-panel,
.upcoming-alerts {
  background: #fffefa;
  border: 1px solid var(--soft-line);
  box-shadow: 0 18px 45px #26382e0c;
}
.summary-card {
  border-radius: 25px;
  min-height: 116px;
}
.summary-card::before {
  background: radial-gradient(circle, #80aa8a1b, transparent 68%);
}
.summary-symbol,
.finance-summary .summary-symbol {
  color: #fff;
  background: linear-gradient(145deg, #39705a, #1d4b38);
  border: 0;
  border-radius: 16px;
  box-shadow: 0 10px 22px #20513d25;
}
.summary-card:nth-child(even) .summary-symbol,
.finance-summary .summary-card:nth-child(even) .summary-symbol {
  background: linear-gradient(145deg, #d18a68, #ae6343);
  box-shadow: 0 10px 22px #ae634326;
}
.summary-card strong,
.finance-summary .summary-card strong.compact-value {
  color: var(--charcoal);
}
.finance-page-heading {
  background:
    radial-gradient(circle at 90% 10%, #ffffff30 0, transparent 27%),
    linear-gradient(135deg, #2f6650, #1a4634);
  border: 0;
  border-radius: 30px;
  padding: 30px 32px;
  box-shadow: 0 18px 38px #20473524;
}
.finance-page-heading p {
  color: #f0c7b2;
}
.finance-page-heading h2 {
  color: #fff;
}
.finance-page-heading span {
  color: #d7e4dc;
}
.finance-summary .summary-card,
.finance-summary .summary-card:nth-child(n + 5) {
  background: #fffefa;
  border-color: #e1e5dc;
  border-radius: 25px;
}
.finance-summary .summary-card:nth-child(n + 5) {
  background: linear-gradient(145deg, #f2f6ef, #eaf1e9);
}
.section-heading {
  background: #fffefa;
}
.crm-search,
.crm-field input,
.crm-field select,
.crm-field textarea {
  background: #f5f5ef;
  border-color: #dfe2d9;
  border-radius: 14px;
}
.crm-search:focus-within,
.crm-field input:focus,
.crm-field select:focus,
.crm-field textarea:focus {
  background: #fff;
  border-color: #65917a;
  box-shadow: 0 0 0 4px #3f765b18;
}
.organization-row:hover {
  background: #f6f8f2;
}
.date-box {
  background: linear-gradient(145deg, #e4eee5, #d3e3d6);
  border-color: #c8dccd;
  box-shadow: none;
}
.date-box strong {
  color: var(--sage);
}
.date-box span {
  color: #6f8275;
}
.organization-title h3 {
  color: var(--charcoal);
}
.payment-status.partial,
.crm-status.preparing {
  color: #9b5739;
  background: var(--copper-soft);
}
.payment-status.paid,
.crm-status.completed {
  color: #276146;
  background: #dcece1;
}
.mobile-bottom-nav,
.mobile-bottom-nav.with-admin {
  background: #fffefaf2;
  border-color: #dce1d7;
  border-radius: 26px;
  box-shadow: 0 18px 45px #20382b22;
}
.mobile-bottom-nav a,
.mobile-bottom-nav button {
  color: #747e77;
}
.mobile-bottom-nav a:active,
.mobile-bottom-nav a[href="#finance"]:focus {
  color: var(--sage);
  background: #e7efe7;
}
.mobile-bottom-nav .mobile-add span {
  color: #fff;
  background: linear-gradient(145deg, #ca805d, #a95c3d);
  border-color: #f8f6ef;
  box-shadow: 0 9px 22px #a65c3d38;
}
@media (max-width: 760px) {
  body {
    background:
      radial-gradient(circle at 100% 0, #e4eee4, transparent 30%),
      #f7f5ee;
  }
  .crm-sidebar {
    background: #fffefa;
    border-bottom: 1px solid #e1e4db;
    box-shadow: 0 8px 25px #24372d12;
  }
  .crm-tabs {
    border-radius: 19px;
  }
  .finance-page-heading {
    border-radius: 24px;
    padding: 24px 21px;
  }
  .finance-summary .summary-card {
    border-radius: 21px;
  }
  .organization-list-card,
  .organization-form-card,
  .calendar-card {
    border-radius: 24px;
  }
}

.finance-page {
  display: grid;
  gap: 18px;
}
.finance-page-heading {
  padding: 5px 2px 2px;
}
.finance-page-heading p {
  color: #9a5d57;
  letter-spacing: 1.5px;
  margin: 0 0 6px;
  font-size: 9px;
  font-weight: 900;
}
.finance-page-heading h2 {
  color: #272231;
  letter-spacing: -1px;
  margin: 0 0 6px;
  font-size: 30px;
}
.finance-page-heading span {
  color: #8b8491;
  font-size: 12px;
}
@media (max-width: 760px) {
  .finance-page-heading h2 {
    font-size: 25px;
  }
  .finance-page-heading {
    padding: 2px;
  }
}

/* Zemhan Noir — premium arayüz revizyonu */
:root {
  --premium-navy: #101a2a;
  --premium-navy-soft: #17243a;
  --premium-gold: #c6a66b;
  --premium-gold-light: #e6d3a8;
  --premium-cream: #f4f1ea;
  --premium-paper: #fffefa;
  --premium-ink: #182033;
  --premium-muted: #777b84;
  --premium-line: #e8e1d4;
}
html {
  background: var(--premium-cream);
}
body {
  color: var(--premium-ink);
  background:
    radial-gradient(circle at 82% 2%, #e9dcc1 0, transparent 27%),
    linear-gradient(135deg, #f7f5ef 0%, #efebe2 100%);
}
.crm-shell {
  background: transparent;
}
.crm-sidebar {
  background:
    radial-gradient(circle at 18% 0, #293b58 0, transparent 34%),
    linear-gradient(180deg, var(--premium-navy) 0%, #0b1320 100%);
  border-right: 1px solid #ffffff0d;
  box-shadow: 22px 0 65px #10182726;
}
.crm-brand {
  border-bottom-color: #ffffff12;
}
.crm-logo {
  background: #fff;
  border: 1px solid #d9bf8c;
  box-shadow: 0 12px 28px #00000045;
}
.crm-nav {
  gap: 7px;
}
.crm-nav a {
  color: #aeb7c6;
  border-radius: 12px;
  min-height: 48px;
  letter-spacing: 0.1px;
}
.crm-nav a:hover,
.crm-nav a.active {
  color: #fff;
  background: linear-gradient(135deg, #ffffff18, #ffffff08);
  border-color: #d6b77c30;
  box-shadow: inset 0 1px #ffffff0d, 0 10px 24px #00000024;
}
.crm-nav a.active::before {
  background: linear-gradient(#f0d8a3, #b78d48);
  width: 3px;
  height: 24px;
}
.sidebar-profile {
  background: #ffffff08;
  border-color: #ffffff10;
}
.profile-avatar {
  color: #172033;
  background: linear-gradient(145deg, #f0dbac, #b98f4d);
}
.crm-main {
  max-width: 1540px;
  padding-top: 38px;
}
.crm-eyebrow,
.finance-page-heading p {
  color: #9a773d;
}
.crm-topbar h1,
.finance-page-heading h2,
.section-heading h2,
.form-title h2 {
  color: var(--premium-ink);
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 500;
}
.crm-topbar h1 {
  letter-spacing: -1.4px;
  font-size: 36px;
}
.new-event-button,
.save-organization-button {
  color: #fff;
  background: linear-gradient(135deg, #243552, #111d30);
  border: 1px solid #d7bc8659;
  box-shadow: 0 14px 30px #13213a36, inset 0 1px #ffffff24;
}
.crm-tabs {
  background: #fffdf8d9;
  border: 1px solid #e7dfd0;
  border-radius: 18px;
  padding: 7px;
  box-shadow: 0 18px 45px #1820330d;
}
.crm-tabs a {
  color: #767985;
  border-radius: 12px;
  min-height: 44px;
}
.crm-tabs a.active {
  color: #fff;
  background: linear-gradient(135deg, #253653, #142136);
  border-color: #354968;
  box-shadow: 0 9px 20px #18273f2e;
}
.summary-card,
.organization-list-card,
.organization-form-card,
.calendar-card,
.work-task-panel,
.team-panel,
.upcoming-alerts {
  background: linear-gradient(145deg, #fffefa, #fbf8f1);
  border: 1px solid var(--premium-line);
  box-shadow: 0 20px 55px #1620380d;
}
.summary-card {
  border-radius: 20px;
  min-height: 112px;
  padding: 21px;
}
.summary-card::before {
  background: radial-gradient(circle, #c7a6691c, transparent 68%);
}
.summary-symbol,
.finance-summary .summary-symbol {
  color: var(--premium-gold-light);
  background: linear-gradient(145deg, #263854, #111d30);
  border: 1px solid #d3b67838;
  border-radius: 14px;
  place-items: center;
  flex: 0 0 auto;
  width: 46px;
  height: 46px;
  padding: 0;
  display: grid;
  box-shadow: 0 10px 24px #15213829;
}
.summary-symbol svg,
.finance-summary .summary-symbol svg {
  display: block;
  width: 20px;
  height: 20px;
  stroke-width: 1.8px;
}
.summary-card p {
  color: #86858a;
}
.summary-card strong,
.finance-summary .summary-card strong.compact-value {
  color: var(--premium-ink);
  font-variant-numeric: tabular-nums;
}
.finance-page-heading {
  background: linear-gradient(135deg, #152238, #243653);
  border: 1px solid #d1b57638;
  border-radius: 23px;
  padding: 27px 30px;
  box-shadow: 0 20px 45px #14213924;
}
.finance-page-heading p {
  color: var(--premium-gold-light);
}
.finance-page-heading h2 {
  color: #fff;
  font-size: 34px;
}
.finance-page-heading span {
  color: #c2c9d3;
}
.finance-summary {
  align-items: stretch;
  gap: 16px;
}
.finance-summary .summary-card {
  min-width: 0;
  min-height: 118px;
  background: linear-gradient(145deg, #fffefa 0%, #f8f3e9 100%);
  border-color: #e4dac8;
}
.finance-summary .summary-card:nth-child(n + 5) {
  background: linear-gradient(145deg, #f7f2e8 0%, #efe7d9 100%);
}
.finance-summary .summary-card > div {
  min-width: 0;
}
.finance-summary .summary-card strong.compact-value {
  white-space: nowrap;
  font-size: clamp(16px, 1.25vw, 21px);
}
.section-heading {
  background: linear-gradient(180deg, #fffefa, #fbf8f1);
}
.crm-search,
.crm-field input,
.crm-field select,
.crm-field textarea {
  background: #f7f3eb;
  border-color: #e3daca;
}
.crm-search:focus-within,
.crm-field input:focus,
.crm-field select:focus,
.crm-field textarea:focus {
  background: #fff;
  border-color: #b79558;
  box-shadow: 0 0 0 4px #b7955818;
}
.organization-row:hover {
  background: linear-gradient(90deg, #fffefa, #f8f3e9);
}
.date-box {
  background: linear-gradient(145deg, #263854, #121f33);
  border-color: #c3a46752;
  box-shadow: 0 9px 22px #17233a24;
}
.date-box strong {
  color: #f0d8a7;
}
.date-box span {
  color: #cbd1da;
}
.organization-title h3 {
  color: var(--premium-ink);
}
.mobile-bottom-nav {
  background: #fffdf6ed;
  border-color: #dfd5c3;
  box-shadow: 0 18px 50px #121d3029;
}
.mobile-bottom-nav a,
.mobile-bottom-nav button {
  color: #747985;
}
.mobile-bottom-nav a:active,
.mobile-bottom-nav a[href="#finance"]:focus {
  color: #17243a;
  background: #eee7d9;
}
.mobile-bottom-nav .mobile-add span {
  color: #f0d8a7;
  background: linear-gradient(145deg, #263854, #111d30);
  border-color: #f4f1ea;
  box-shadow: 0 10px 24px #111c3038;
}
@media (max-width: 1100px) {
  .finance-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  body {
    background: linear-gradient(160deg, #f7f4ed, #eee9df);
  }
  .crm-sidebar {
    background: linear-gradient(135deg, #17263d, #0e1828);
  }
  .crm-main {
    padding-top: 22px;
  }
  .crm-topbar h1 {
    font-size: 29px;
  }
  .crm-tabs {
    top: 70px;
    border-radius: 16px;
  }
  .finance-page-heading {
    border-radius: 19px;
    padding: 22px 20px;
  }
  .finance-page-heading h2 {
    font-size: 28px;
  }
  .finance-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .finance-summary .summary-card {
    min-height: 116px;
    align-items: flex-start;
    padding: 14px 11px;
  }
  .summary-symbol,
  .finance-summary .summary-symbol {
    width: 38px;
    height: 38px;
  }
  .finance-summary .summary-card strong.compact-value {
    white-space: normal;
    overflow-wrap: anywhere;
    font-size: 16px;
    line-height: 1.15;
  }
  .organization-list-card,
  .organization-form-card,
  .calendar-card {
    border-radius: 20px;
  }
}
.work-task-page {
  gap: 18px;
  display: grid;
}
.work-task-heading {
  justify-content: space-between;
  align-items: center;
  padding: 4px 2px;
  display: flex;
}
.work-task-heading h2 {
  color: #2c283e;
  letter-spacing: -0.7px;
  margin: 0 0 5px;
  font-size: 27px;
}
.work-task-heading > div > p:last-child {
  color: #888392;
  margin: 0;
  font-size: 12px;
}
.work-task-total {
  background: linear-gradient(145deg, #eee9ff, #f8f6ff);
  border: 1px solid #e0d8fa;
  border-radius: 13px;
  flex-direction: column;
  align-items: flex-end;
  padding: 12px 17px;
  display: flex;
}
.work-task-total strong {
  color: #604ab4;
  font-size: 21px;
}
.work-task-total span {
  color: #8b8498;
  font-size: 9px;
}
.work-task-layout {
  grid-template-columns: minmax(290px, 350px) minmax(0, 1fr);
  align-items: start;
  gap: 18px;
  display: grid;
}
.work-task-form,
.work-task-list-card {
  background: #fffffff0;
  border: 1px solid #e7e3ed;
  border-radius: 18px;
  box-shadow: 0 16px 45px #271f4112;
}
.work-task-form {
  padding: 23px;
}
.work-task-form-title {
  border-bottom: 1px solid #efedf2;
  align-items: center;
  gap: 11px;
  margin-bottom: 20px;
  padding-bottom: 16px;
  display: flex;
}
.work-task-form-title > span {
  color: #624cb7;
  background: #eee9ff;
  border-radius: 12px;
  place-items: center;
  width: 42px;
  height: 42px;
  font-size: 19px;
  font-weight: 900;
  display: grid;
}
.work-task-form-title h3 {
  margin: 0 0 4px;
  font-size: 18px;
}
.work-task-form-title p {
  color: #8c8795;
  margin: 0;
  font-size: 10px;
}
.work-task-form label {
  color: #4c4957;
  margin-bottom: 13px;
  font-size: 11px;
  font-weight: 750;
  display: block;
}
.work-task-form input,
.work-task-form select,
.work-task-form textarea {
  color: #2e2c39;
  background: #fbfafd;
  border: 1px solid #ded9e6;
  border-radius: 9px;
  outline: 0;
  width: 100%;
  min-height: 42px;
  margin-top: 6px;
  padding: 10px 11px;
  display: block;
}
.work-task-form textarea {
  resize: vertical;
  min-height: 76px;
}
.work-task-form input:focus,
.work-task-form select:focus,
.work-task-form textarea:focus {
  background: #fff;
  border-color: #7d64ce;
  box-shadow: 0 0 0 4px #7057c71a;
}
.work-task-form-grid {
  grid-template-columns: 1fr 1fr;
  gap: 9px;
  display: grid;
}
.work-task-save {
  color: #fff;
  background: linear-gradient(135deg, #7b62d2, #5945ad);
  border: 0;
  border-radius: 10px;
  width: 100%;
  min-height: 44px;
  font-weight: 800;
  box-shadow: 0 10px 24px #664ebc38;
}
.work-task-save:disabled {
  opacity: 0.6;
}
.work-task-message {
  color: #614bb4;
  background: #f0ecff;
  border-radius: 8px;
  margin-bottom: 12px;
  padding: 10px;
  font-size: 10px;
}
.work-task-list-card {
  overflow: hidden;
}
.work-task-filters {
  background: linear-gradient(#fff, #fdfcff);
  border-bottom: 1px solid #efedf2;
  gap: 6px;
  padding: 16px 18px;
  display: flex;
  overflow-x: auto;
}
.work-task-filters button {
  color: #7e7889;
  white-space: nowrap;
  background: #f7f5f9;
  border: 1px solid #0000;
  border-radius: 9px;
  align-items: center;
  gap: 7px;
  min-height: 35px;
  padding: 7px 10px;
  font-size: 10px;
  font-weight: 800;
  display: flex;
}
.work-task-filters button span {
  background: #ebe7ef;
  border-radius: 10px;
  place-items: center;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  font-size: 8px;
  display: grid;
}
.work-task-filters button.active {
  color: #604ab4;
  background: #eee9ff;
  border-color: #dfd6fb;
}
.work-task-filters button.active span {
  color: #fff;
  background: #6b54bf;
}
.work-task-filters.work-task-pages {
  background: linear-gradient(#fff, #fbf8fa);
  padding: 12px;
}
.work-task-filters.work-task-pages button {
  flex: 1;
  justify-content: center;
  min-height: 44px;
  font-size: 11px;
}
.work-task-filters.work-task-pages button.active {
  color: #8a514c;
  background: linear-gradient(145deg, #fff, #f8e9e6);
  border-color: #ead1cd;
  box-shadow: 0 7px 18px #8f504a1a;
}
.work-task-filters.work-task-pages button.active span {
  background: #9a5d57;
}
.work-task-item {
  border-bottom: 1px solid #f0edf3;
  grid-template-columns: 28px 1fr;
  gap: 12px;
  padding: 18px 20px;
  display: grid;
}
.work-task-item:last-child {
  border-bottom: 0;
}
.work-task-item:hover {
  background: #fdfcff;
}
.work-task-item.done {
  background: #fbfbfc;
}
.work-task-check {
  color: #fff;
  background: #fff;
  border: 2px solid #cfc8da;
  border-radius: 8px;
  place-items: center;
  width: 26px;
  height: 26px;
  padding: 0;
  font-size: 14px;
  font-weight: 900;
  display: grid;
}
.work-task-item.done .work-task-check {
  background: #5dba91;
  border-color: #5dba91;
}
.work-task-content {
  min-width: 0;
}
.work-task-title {
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  display: flex;
}
.work-task-title h3 {
  margin: 1px 0;
  font-size: 14px;
}
.work-task-item.done .work-task-title h3 {
  color: #918c98;
  text-decoration: line-through;
}
.task-priority {
  border-radius: 20px;
  padding: 4px 7px;
  font-size: 8px;
  font-weight: 850;
}
.task-priority.low {
  color: #4c7991;
  background: #e7f4fa;
}
.task-priority.normal {
  color: #8d6a2f;
  background: #fff2dc;
}
.task-priority.high {
  color: #a14d57;
  background: #ffe8eb;
}
.work-task-content > p {
  color: #817c8a;
  margin: 7px 0;
  font-size: 11px;
  line-height: 1.55;
}
.work-task-meta {
  color: #8b8693;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  font-size: 9px;
  display: flex;
}
.task-status {
  border-radius: 20px;
  padding: 4px 7px;
  font-weight: 800;
}
.task-status.todo {
  color: #8d6a2f;
  background: #fff2dc;
}
.task-status.doing {
  color: #5e4cb0;
  background: #eee9ff;
}
.task-status.done {
  color: #31775d;
  background: #dff5e9;
}
.work-task-actions {
  gap: 6px;
  margin-top: 11px;
  display: flex;
}
.work-task-actions button {
  color: #5f4aad;
  background: #f0ecff;
  border: 1px solid #ded6f6;
  border-radius: 8px;
  min-height: 31px;
  padding: 6px 9px;
  font-size: 9px;
  font-weight: 800;
}
.work-task-actions button.task-delete {
  color: #a3444d;
  background: #fff0f1;
  border-color: #f0d8da;
}
.work-task-actions button:disabled {
  cursor: wait;
  opacity: 0.55;
}
.work-task-empty {
  color: #8d8795;
  text-align: center;
  align-content: center;
  place-items: center;
  min-height: 330px;
  padding: 35px;
  display: grid;
}
.work-task-empty > span {
  color: #6c55bf;
  background: #eee9ff;
  border-radius: 15px;
  place-items: center;
  width: 48px;
  height: 48px;
  font-size: 22px;
  display: grid;
}
.work-task-empty h3 {
  color: #383445;
  margin: 13px 0 5px;
}
.work-task-empty p {
  max-width: 300px;
  margin: 0;
  font-size: 11px;
  line-height: 1.55;
}
@media (max-width: 900px) {
  .work-task-layout {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .work-task-page {
    gap: 14px;
  }
  .work-task-heading {
    align-items: flex-start;
    gap: 12px;
  }
  .work-task-heading h2 {
    font-size: 23px;
  }
  .work-task-total {
    padding: 9px 12px;
  }
  .work-task-total strong {
    font-size: 18px;
  }
  .work-task-form,
  .work-task-list-card {
    border-radius: 16px;
  }
  .work-task-form {
    padding: 18px 15px;
  }
  .work-task-form-grid {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .work-task-form input,
  .work-task-form select,
  .work-task-form textarea {
    min-height: 46px;
    font-size: 16px;
  }
  .work-task-filters {
    padding: 13px;
  }
  .work-task-filters button {
    min-height: 40px;
  }
  .work-task-item {
    padding: 16px 13px;
  }
  .work-task-actions button {
    min-height: 40px;
    padding: 8px 11px;
  }
}

/* iPhone 7 Plus–15 uyum katmanı: 375–430px ekranlarda aynı mobil ritim */
@media (max-width: 430px) {
  html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  body {
    min-width: 320px;
    overflow-x: hidden;
  }

  .crm-main {
    width: 100%;
    min-width: 0;
    padding: 18px 14px calc(104px + env(safe-area-inset-bottom));
  }

  .crm-topbar,
  .finance-page,
  .finance-summary,
  .organization-list-card,
  .organization-form-card,
  .calendar-card {
    min-width: 0;
    max-width: 100%;
  }

  .crm-topbar h1 {
    font-size: 25px;
    line-height: 1.12;
  }

  .crm-tabs {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .crm-tabs::-webkit-scrollbar {
    display: none;
  }

  .crm-tabs a {
    flex: 0 0 auto;
    min-width: 48px;
    padding: 8px 9px;
  }

  .finance-page-heading {
    padding: 20px 17px;
    border-radius: 18px;
  }

  .finance-page-heading h2 {
    font-size: 23px;
    line-height: 1.15;
  }

  .finance-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .finance-summary .summary-card,
  .finance-summary .summary-card:nth-child(n) {
    grid-column: auto;
    min-width: 0;
    min-height: 96px;
    padding: 13px 11px;
    border-radius: 16px;
  }

  .finance-summary .summary-symbol {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
  }

  .finance-summary .summary-card p {
    font-size: 10px;
    line-height: 1.25;
  }

  .finance-summary .summary-card strong.compact-value {
    max-width: 100%;
    font-size: clamp(15px, 4.4vw, 19px);
    line-height: 1.1;
    overflow-wrap: anywhere;
  }

  .mobile-bottom-nav,
  .mobile-bottom-nav.with-admin {
    right: 10px;
    bottom: calc(8px + env(safe-area-inset-bottom));
    left: 10px;
    width: auto;
    max-width: none;
    padding-bottom: 2px;
  }

  .mobile-bottom-nav a,
  .mobile-bottom-nav button {
    min-width: 0;
  }

  .mobile-bottom-nav small,
  .mobile-bottom-nav.with-admin small {
    max-width: 58px;
    font-size: 9px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

@media (max-width: 375px) {
  .crm-main {
    padding-right: 11px;
    padding-left: 11px;
  }

  .finance-summary {
    gap: 8px;
  }

  .finance-summary .summary-card,
  .finance-summary .summary-card:nth-child(n) {
    padding: 12px 9px;
  }
}
.summary-card strong.compact-value {
  font-size: 17px;
}
.crm-status.preparing {
  color: #a16b27;
  background: #fff0d8;
}
.crm-status.cancelled {
  color: #a44d56;
  background: #ffe7e9;
}
.form-section-label {
  color: #8a68cf;
  letter-spacing: 1.3px;
  border-top: 1px solid #efedf2;
  margin: 19px 0 12px;
  padding-top: 15px;
  font-size: 9px;
  font-weight: 900;
}
.remaining-payment {
  color: #686373;
  background: #f5f2ff;
  border-radius: 8px;
  justify-content: space-between;
  align-items: center;
  margin: -2px 0 13px;
  padding: 10px 11px;
  font-size: 11px;
  display: flex;
}
.remaining-payment strong {
  color: #6550b8;
  font-size: 14px;
}
.payment-line {
  color: #7f7a88;
  align-items: center;
  gap: 10px;
  margin-top: 9px;
  font-size: 10px;
  display: flex;
}
.payment-status {
  border-radius: 20px;
  padding: 4px 7px;
  font-weight: 800;
}
.payment-status.unpaid {
  color: #a44d56;
  background: #ffe7e9;
}
.payment-status.partial {
  color: #a16b27;
  background: #fff0d8;
}
.payment-status.paid {
  color: #327d62;
  background: #dff5e9;
}
.organization-actions {
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 11px;
  display: flex;
}
.organization-actions a,
.organization-actions button,
.organization-actions label {
  border: 1px solid #e3e0e8;
  border-radius: 8px;
  align-items: center;
  gap: 5px;
  min-height: 30px;
  padding: 6px 9px;
  font-size: 10px;
  font-weight: 800;
  text-decoration: none;
  transition:
    transform 0.15s,
    box-shadow 0.15s;
  display: inline-flex;
}
.organization-actions a:hover,
.organization-actions button:hover,
.organization-actions label:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px #28213d1a;
}
.call-action {
  color: #4f68aa;
  background: #edf3ff;
}
.whatsapp-action {
  color: #26785a;
  background: #e3f6ec;
}
.map-action {
  color: #a25d3e;
  background: #fff0e8;
}
.pdf-action {
  color: #684fae;
  cursor: pointer;
  background: #f0ebff;
}
.edit-action {
  color: #347088;
  cursor: pointer;
  background: #eaf8fc;
}
.delete-action {
  color: #a3444d;
  cursor: pointer;
  background: #fff0f1;
}
.organization-actions button:disabled {
  cursor: wait;
  opacity: 0.6;
  box-shadow: none;
  transform: none;
}
.form-actions {
  gap: 9px;
  display: grid;
}
.form-actions.editing {
  grid-template-columns: 1fr auto;
}
.cancel-edit-button {
  color: #6e6977;
  background: #f4f2f6;
  border: 1px solid #dfdce4;
  border-radius: 9px;
  min-width: 95px;
  padding: 12px 16px;
  font-weight: 800;
}
.cancel-edit-button:disabled {
  opacity: 0.6;
}
.organization-image-field {
  background: #faf9fc;
  border: 1px solid #dfdce5;
  border-radius: 10px;
  grid-template-columns: 108px 1fr;
  align-items: center;
  gap: 13px;
  margin: 4px 0 18px;
  padding: 12px;
  display: grid;
}
.organization-image-preview {
  color: #8a68cf;
  background: #f0ebff;
  border-radius: 8px;
  place-items: center;
  width: 108px;
  height: 82px;
  font-size: 30px;
  display: grid;
  overflow: hidden;
}
.organization-image-preview img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.organization-image-copy {
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  display: flex;
}
.organization-image-copy strong {
  color: #4c4957;
  font-size: 11px;
}
.organization-image-copy small {
  color: #8b8795;
  font-size: 9px;
  line-height: 1.45;
}
.organization-image-button {
  color: #fff;
  cursor: pointer;
  background: #6b55bf;
  border-radius: 8px;
  align-items: center;
  min-height: 34px;
  padding: 8px 11px;
  font-size: 10px;
  font-weight: 800;
  display: inline-flex;
}
.organization-image-button input {
  opacity: 0;
  pointer-events: none;
  width: 1px;
  height: 1px;
  position: absolute;
  overflow: hidden;
}
.remove-organization-image {
  color: #a3444d;
  background: 0 0;
  border: 0;
  padding: 0;
  font-size: 9px;
  font-weight: 800;
}
.image-message {
  color: #a3444d;
  background: #fff0f1;
  border-radius: 8px;
  margin: -10px 0 15px;
  padding: 9px 10px;
  font-size: 10px;
}
@media (max-width: 760px) {
  .organization-actions {
    grid-template-columns: repeat(2, 1fr);
    gap: 6px;
    display: grid;
  }
  .organization-actions a,
  .organization-actions button,
  .organization-actions label {
    justify-content: center;
    min-height: 42px;
    padding: 8px 4px;
    font-size: 10px;
  }
  .form-actions.editing {
    grid-template-columns: 1fr;
  }
  .cancel-edit-button {
    min-height: 44px;
  }
  .organization-image-field {
    grid-template-columns: 88px 1fr;
  }
  .organization-image-preview {
    width: 88px;
    height: 88px;
  }
  .organization-image-button {
    min-height: 42px;
  }
}
.crm-logo {
  object-fit: cover;
  background: #000;
  border: 1px solid #484353;
  border-radius: 50%;
  width: 46px;
  height: 46px;
  padding: 0;
  box-shadow: 0 7px 22px #00000040;
}
.brand-logo {
  object-fit: cover;
  background: #000;
  border: 1px solid #5b566b;
  border-radius: 50%;
  width: 56px;
  height: 56px;
}
.mobile-brand img {
  object-fit: cover;
  border-radius: 50%;
  width: 42px;
  height: 42px;
}
@media (max-width: 760px) {
  .mobile-brand {
    align-items: center;
    gap: 11px;
    display: flex;
  }
}
.crm-tabs {
  background: #fff;
  border: 1px solid #e9e6ee;
  border-radius: 12px;
  gap: 5px;
  margin-bottom: 20px;
  padding: 5px;
  display: flex;
  overflow-x: auto;
  box-shadow: 0 5px 20px #2a23400d;
}
.crm-tabs a {
  color: #7f7a89;
  white-space: nowrap;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  gap: 7px;
  min-height: 40px;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  display: flex;
}
.crm-tabs a.active {
  color: #654fbd;
  background: #f0ecff;
}
.tab-content.form-tab {
  max-width: 620px;
  margin: 0 auto;
}
.calendar-card {
  background: #fff;
  border: 1px solid #e9e6ee;
  border-radius: 15px;
  overflow: hidden;
  box-shadow: 0 8px 30px #29213e0a;
}
.calendar-header {
  border-bottom: 1px solid #efedf2;
  justify-content: space-between;
  align-items: center;
  padding: 22px 24px;
  display: flex;
}
.calendar-header h2 {
  margin: 0 0 5px;
  font-size: 19px;
}
.calendar-header p {
  color: #8f8b98;
  margin: 0;
  font-size: 12px;
}
.calendar-controls {
  align-items: center;
  gap: 12px;
  display: flex;
}
.calendar-controls strong {
  text-align: center;
  text-transform: capitalize;
  min-width: 145px;
}
.calendar-controls button {
  color: #6651bd;
  background: #f1edff;
  border: 0;
  border-radius: 8px;
  place-items: center;
  width: 34px;
  height: 34px;
  padding: 0;
  font-size: 23px;
  display: grid;
}
.calendar-weekdays,
.calendar-grid {
  grid-template-columns: repeat(7, 1fr);
  display: grid;
}
.calendar-weekdays span {
  color: #8f8a97;
  text-align: center;
  background: #faf9fc;
  border-bottom: 1px solid #efedf2;
  padding: 10px;
  font-size: 10px;
  font-weight: 800;
}
.calendar-day {
  border-bottom: 1px solid #f0eef3;
  border-right: 1px solid #f0eef3;
  min-width: 0;
  min-height: 112px;
  padding: 8px;
}
.calendar-day:nth-child(7n) {
  border-right: 0;
}
.calendar-day.outside {
  color: #c7c3cc;
  background: #fbfafc;
}
.day-number {
  place-items: center;
  width: 25px;
  height: 25px;
  font-size: 11px;
  font-weight: 700;
  display: grid;
}
.calendar-day.today .day-number {
  color: #fff;
  background: #7059c7;
  border-radius: 50%;
}
.day-events {
  gap: 4px;
  margin-top: 5px;
  display: grid;
}
.calendar-event {
  color: #8d6427;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: #fff0d8;
  border-left: 3px solid #d49a44;
  border-radius: 5px;
  padding: 5px 6px;
  font-size: 9px;
  overflow: hidden;
}
.calendar-event.preparing {
  color: #6a53b2;
  background: #efebff;
  border-color: #8068d1;
}
.calendar-event.completed {
  color: #327d62;
  background: #dff5e9;
  border-color: #43a27e;
}
.calendar-event.cancelled {
  color: #a44d56;
  background: #ffe7e9;
  border-color: #c86770;
  text-decoration: line-through;
}
.mobile-agenda {
  display: none;
}
@media (max-width: 760px) {
  .crm-tabs {
    z-index: 10;
    scrollbar-width: none;
    margin: -6px 0 14px;
    position: sticky;
    top: 72px;
  }
  .crm-tabs::-webkit-scrollbar {
    display: none;
  }
  .crm-tabs a {
    flex: 1 0 auto;
    min-height: 42px;
    padding: 8px 12px;
  }
  .calendar-header {
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
    padding: 18px 15px;
  }
  .calendar-controls {
    justify-content: space-between;
  }
  .desktop-calendar {
    display: none;
  }
  .mobile-agenda {
    display: block;
  }
  .agenda-item {
    border-bottom: 1px solid #efedf2;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 12px;
    padding: 15px;
    display: grid;
  }
  .agenda-date {
    color: #6953bd;
    text-align: center;
    background: #f3efff;
    border-radius: 10px;
    place-content: center;
    width: 46px;
    height: 52px;
    display: grid;
  }
  .agenda-date strong {
    font-size: 19px;
    line-height: 1;
  }
  .agenda-date span {
    text-transform: uppercase;
    margin-top: 4px;
    font-size: 9px;
  }
  .agenda-title {
    justify-content: space-between;
    align-items: flex-start;
    gap: 7px;
    display: flex;
  }
  .agenda-title h3 {
    margin: 0;
    font-size: 14px;
  }
  .agenda-item p {
    color: #777381;
    margin: 6px 0 4px;
    font-size: 11px;
  }
  .agenda-item small {
    color: #9894a0;
  }
  .agenda-empty {
    color: #8d8995;
    text-align: center;
    padding: 50px 20px;
  }
}
.form-three-columns {
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  display: grid;
}
.profit-preview {
  color: #7b5c58;
  background: #fff2ee;
  border: 1px solid #f0dcd7;
  border-radius: 8px;
  justify-content: space-between;
  align-items: center;
  margin: -5px 0 13px;
  padding: 10px 11px;
  font-size: 11px;
  display: flex;
}
.profit-preview strong {
  color: #9d514b;
  font-size: 14px;
}
.profit-chip {
  color: #397158;
}
.reminder-action {
  color: #7d5733;
  background: #fff4df;
}
.plan-action {
  color: #6a4eb1;
  cursor: pointer;
  background: #f0ebff;
}
.organization-row.expanded {
  background: #fdfbff;
}
.organization-plan {
  background: linear-gradient(145deg, #faf8ff, #fff);
  border: 1px solid #e5dff0;
  border-radius: 12px;
  margin-top: 14px;
  padding: 15px;
}
.plan-heading {
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 14px;
  margin-bottom: 12px;
  display: grid;
}
.plan-heading > div:first-child {
  align-items: center;
  gap: 7px;
  display: flex;
}
.plan-heading span {
  color: #8b8492;
  font-size: 9px;
}
.plan-progress {
  background: #eae5ef;
  border-radius: 20px;
  height: 6px;
  overflow: hidden;
}
.plan-progress i {
  border-radius: inherit;
  background: linear-gradient(90deg, #a86a62, #d49a8f);
  height: 100%;
  transition: width 0.25s;
  display: block;
}
.checklist-grid {
  grid-template-columns: repeat(2, 1fr);
  gap: 7px;
  display: grid;
}
.checklist-grid label {
  color: #625c69;
  cursor: pointer;
  background: #fff;
  border: 1px solid #e7e2eb;
  border-radius: 9px;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 8px 10px;
  font-size: 10px;
  font-weight: 700;
  display: flex;
}
.checklist-grid label.done {
  color: #7c777f;
  background: #f5f3f7;
  text-decoration: line-through;
}
.checklist-grid input {
  opacity: 0;
  pointer-events: none;
  position: absolute;
}
.checklist-grid label > span {
  color: #fff;
  background: #ece7f1;
  border: 1px solid #ddd5e5;
  border-radius: 6px;
  flex: 0 0 20px;
  place-items: center;
  width: 20px;
  height: 20px;
  font-size: 11px;
  display: grid;
}
.checklist-grid label.done > span {
  background: #5c9a7c;
  border-color: #5c9a7c;
}
.finance-summary {
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: 12px;
  display: grid;
}
.finance-summary div {
  text-align: center;
  background: #fff;
  border: 1px solid #e8e3ec;
  border-radius: 9px;
  padding: 10px;
}
.finance-summary span,
.finance-summary strong {
  display: block;
}
.finance-summary span {
  color: #8b8592;
  margin-bottom: 4px;
  font-size: 9px;
}
.finance-summary strong {
  font-size: 13px;
}
.finance-summary .net {
  background: #fff1ed;
  border-color: #efd8d3;
}
.finance-summary .net strong {
  color: #9d514b;
}
@media (max-width: 760px) {
  .form-three-columns {
    grid-template-columns: 1fr;
  }
  .organization-plan {
    margin-left: -2px;
    margin-right: -2px;
    padding: 13px;
  }
  .plan-heading,
  .checklist-grid {
    grid-template-columns: 1fr;
  }
  .checklist-grid label {
    min-height: 46px;
    font-size: 11px;
  }
  .finance-summary {
    gap: 5px;
  }
  .finance-summary div {
    padding: 9px 4px;
  }
  .finance-summary strong {
    font-size: 11px;
  }
  .organization-actions {
    grid-template-columns: repeat(2, 1fr);
  }
}
.expense-editor {
  background: #fbf8f7;
  border: 1px solid #eadfdd;
  border-radius: 11px;
  margin: 2px 0 14px;
  padding: 13px;
}
.expense-editor-head {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  display: flex;
}
.expense-editor-head strong {
  color: #81534e;
  font-size: 12px;
}
.expense-editor-head > strong:last-child {
  font-size: 15px;
}
.expense-editor-head small {
  color: #908488;
  margin-top: 3px;
  font-size: 9px;
  display: block;
}
.expense-row {
  grid-template-columns: 1fr 100px 34px;
  gap: 7px;
  margin-top: 7px;
  display: grid;
}
.expense-row input {
  background: #fff;
  border: 1px solid #e0d7d9;
  border-radius: 8px;
  outline: 0;
  min-width: 0;
  padding: 9px 10px;
  font-size: 11px;
}
.expense-row button {
  color: #a54f4f;
  background: #f7e8e6;
  border: 0;
  border-radius: 8px;
  font-size: 18px;
}
.add-expense-button {
  color: #7652a8;
  background: #f1ebf8;
  border: 1px dashed #cbbce0;
  border-radius: 8px;
  margin-top: 9px;
  padding: 8px 10px;
  font-size: 10px;
  font-weight: 800;
}
.expense-breakdown {
  background: #fff;
  border: 1px dashed #ded5e4;
  border-radius: 9px;
  gap: 5px;
  margin-top: 9px;
  padding: 9px 10px;
  display: grid;
}
.expense-breakdown div {
  color: #756d79;
  justify-content: space-between;
  font-size: 10px;
  display: flex;
}
.expense-breakdown strong {
  color: #514956;
}
.share-pdf-action {
  color: #fff;
  background: #2d9d69;
}
.share-pdf-action:disabled {
  opacity: 0.6;
}
.organization-status-tabs {
  background: #fcfafb;
  border-bottom: 1px solid #eee7eb;
  gap: 7px;
  padding: 12px 18px;
  display: flex;
}
.organization-status-tabs button {
  color: #7f7781;
  background: #f4f0f3;
  border: 1px solid #0000;
  border-radius: 9px;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 8px 12px;
  font-size: 10px;
  font-weight: 800;
  display: flex;
}
.organization-status-tabs button span {
  background: #e8e1e6;
  border-radius: 10px;
  place-items: center;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  font-size: 8px;
  display: grid;
}
.organization-status-tabs button.active {
  color: #8a514c;
  background: #f9eae7;
  border-color: #ead1cd;
}
.organization-status-tabs button.active span {
  color: #fff;
  background: #9a5d57;
}
.upcoming-alerts {
  background: linear-gradient(145deg, #fff8ed, #fff);
  border: 1px solid #f0ddbe;
  border-radius: 15px;
  margin-bottom: 20px;
  overflow: hidden;
  box-shadow: 0 8px 28px #8b64230d;
}
.upcoming-alerts-head {
  border-bottom: 1px solid #f3e6d1;
  justify-content: space-between;
  align-items: center;
  padding: 17px 20px;
  display: flex;
}
.upcoming-alerts-head > div {
  align-items: center;
  gap: 11px;
  display: flex;
}
.upcoming-alerts-head > div > span {
  background: #fff0d8;
  border-radius: 11px;
  place-items: center;
  width: 39px;
  height: 39px;
  display: grid;
}
.upcoming-alerts h2 {
  color: #54463d;
  margin: 0;
  font-size: 16px;
}
.upcoming-alerts p {
  color: #9a8879;
  margin: 3px 0 0;
  font-size: 10px;
}
.upcoming-alerts-head > strong {
  color: #fff;
  background: #d48745;
  border-radius: 50%;
  place-items: center;
  width: 28px;
  height: 28px;
  font-size: 12px;
  display: grid;
}
.upcoming-alert-list {
  display: grid;
}
.upcoming-alert-list a {
  color: inherit;
  border-bottom: 1px solid #f5ead8;
  grid-template-columns: 64px 1fr auto;
  align-items: center;
  gap: 13px;
  padding: 13px 20px;
  text-decoration: none;
  display: grid;
}
.upcoming-alert-list a:last-child {
  border: 0;
}
.alert-day {
  color: #b15d37;
  text-align: center;
  background: #fff0df;
  border-radius: 7px;
  padding: 6px 7px;
  font-size: 9px;
  font-weight: 900;
}
.upcoming-alert-list a > div strong,
.upcoming-alert-list a > div small {
  display: block;
}
.upcoming-alert-list a > div strong {
  font-size: 12px;
}
.upcoming-alert-list a > div small {
  color: #8f8580;
  margin-top: 3px;
  font-size: 9px;
}
.alert-payment {
  color: #8a6252;
  font-size: 10px;
  font-weight: 700;
}
.daily-quick-note {
  background: linear-gradient(145deg, #fffdf8, #fff);
  border: 1px solid #eee0c7;
  border-radius: 15px;
  grid-template-columns: 44px 1fr;
  gap: 13px;
  margin-bottom: 20px;
  padding: 17px 19px;
  display: grid;
  box-shadow: 0 10px 30px #5b422012;
}
.daily-note-icon {
  color: #9a6254;
  background: #fae9dc;
  border-radius: 13px;
  place-items: center;
  width: 44px;
  height: 44px;
  display: grid;
}
.daily-note-copy > div {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
  display: flex;
}
.daily-note-copy > div strong {
  color: #4e4040;
  font-size: 13px;
}
.daily-note-copy > div span {
  color: #9a8c86;
  text-transform: capitalize;
  font-size: 9px;
}
.daily-note-copy textarea {
  color: #443b3d;
  resize: vertical;
  background: #fffc;
  border: 1px solid #eadfd9;
  border-radius: 10px;
  outline: 0;
  width: 100%;
  min-height: 66px;
  padding: 10px 12px;
  font-size: 12px;
  line-height: 1.55;
  display: block;
}
.daily-note-copy textarea:focus {
  background: #fff;
  border-color: #bc8177;
  box-shadow: 0 0 0 4px #a8665f17;
}
.daily-note-copy small {
  color: #a0928d;
  justify-content: flex-end;
  align-items: center;
  gap: 3px;
  min-height: 16px;
  margin-top: 5px;
  font-size: 8px;
  display: flex;
}
.daily-note-copy small.saved {
  color: #4e8c6d;
}
@media (max-width: 760px) {
  .daily-quick-note {
    grid-template-columns: 36px 1fr;
    gap: 10px;
    padding: 14px 13px;
  }
  .daily-note-icon {
    width: 36px;
    height: 36px;
  }
  .daily-note-copy > div {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
  .daily-note-copy textarea {
    min-height: 88px;
    font-size: 16px;
  }
  .organization-status-tabs {
    padding: 10px;
  }
  .organization-status-tabs button {
    flex: 1;
    justify-content: center;
    padding: 8px 6px;
  }
  .expense-row {
    grid-template-columns: 1fr 88px 36px;
  }
  .upcoming-alert-list a {
    grid-template-columns: 58px 1fr;
    padding: 13px;
  }
  .alert-payment {
    grid-column: 2;
  }
  .upcoming-alerts-head {
    padding: 15px;
  }
}
.calendar-eyebrow {
  color: #9c655f;
  letter-spacing: 1.5px;
  margin-bottom: 5px;
  font-size: 8px;
  font-weight: 900;
  display: block;
}
.calendar-controls .today-button {
  color: #fff;
  background: linear-gradient(135deg, #9f665f, #bd8177);
  width: auto;
  padding: 0 13px;
  font-size: 10px;
  font-weight: 800;
}
.calendar-insights {
  background: #eee9ed;
  border-bottom: 1px solid #eee9ed;
  grid-template-columns: repeat(3, minmax(125px, 1fr)) 1.5fr;
  gap: 1px;
  display: grid;
}
.calendar-insights > div {
  background: #fcfafb;
  padding: 13px 18px;
}
.calendar-insights > div > span,
.calendar-insights > div > strong {
  display: block;
}
.calendar-insights > div > span {
  color: #9b929b;
  text-transform: uppercase;
  margin-bottom: 4px;
  font-size: 8px;
  font-weight: 800;
}
.calendar-insights > div > strong {
  color: #4c4351;
  font-size: 13px;
}
.calendar-insights .calendar-legend {
  justify-content: flex-end;
  align-items: center;
  gap: 13px;
  display: flex;
}
.calendar-insights .calendar-legend span {
  color: #827982;
  text-transform: none;
  align-items: center;
  gap: 5px;
  margin: 0;
  font-size: 8px;
  font-weight: 700;
  display: flex;
}
.calendar-legend i,
.selected-day-panel a > i {
  background: #d49a44;
  border-radius: 50%;
  width: 7px;
  height: 7px;
  display: block;
}
.calendar-legend i.preparing,
.selected-day-panel a > i.preparing {
  background: #8068d1;
}
.calendar-legend i.completed,
.selected-day-panel a > i.completed {
  background: #43a27e;
}
.calendar-day {
  color: #4d4652;
  cursor: pointer;
  text-align: left;
  background: #fff;
  border-top: 0;
  border-left: 0;
  transition:
    background 0.18s,
    box-shadow 0.18s;
  position: relative;
}
.calendar-day:hover {
  z-index: 1;
  background: #fdf9f8;
  box-shadow: inset 0 0 0 1px #e5d5d1;
}
.calendar-day.weekend:not(.outside) {
  background: #fdfbfc;
}
.calendar-day.selected {
  z-index: 2;
  background: #fff8f5;
  box-shadow: inset 0 0 0 2px #b77a70;
}
.calendar-day.outside {
  cursor: default;
}
.event-count {
  color: #fff;
  background: #a86d65;
  border-radius: 50%;
  place-items: center;
  width: 18px;
  height: 18px;
  font-size: 8px;
  font-weight: 900;
  display: grid;
  position: absolute;
  top: 9px;
  right: 9px;
}
.selected-day-panel {
  background: linear-gradient(145deg, #fbf7f6, #fff);
  border-top: 1px solid #e9dcda;
  padding: 14px 20px 18px;
}
.selected-day-panel > div {
  color: #84777b;
  text-transform: capitalize;
  justify-content: space-between;
  margin-bottom: 10px;
  font-size: 10px;
  display: flex;
}
.selected-day-panel > div strong {
  color: #945e58;
}
.selected-day-panel a {
  color: #4b4148;
  background: #fff;
  border: 1px solid #eadfdd;
  border-radius: 9px;
  grid-template-columns: 8px 1fr auto;
  align-items: center;
  gap: 10px;
  margin-top: 6px;
  padding: 10px 12px;
  text-decoration: none;
  display: grid;
}
.selected-day-panel a div strong,
.selected-day-panel a div small {
  display: block;
}
.selected-day-panel a div strong {
  font-size: 11px;
}
.selected-day-panel a div small {
  color: #93898d;
  margin-top: 3px;
  font-size: 9px;
}
.selected-day-panel a > span {
  color: #9b625b;
  font-size: 9px;
  font-weight: 800;
}
@media (max-width: 760px) {
  .calendar-insights {
    grid-template-columns: repeat(3, 1fr);
  }
  .calendar-insights > div {
    text-align: center;
    padding: 11px 7px;
  }
  .calendar-insights > div > strong {
    font-size: 11px;
  }
  .calendar-insights .calendar-legend {
    display: none;
  }
  .calendar-controls {
    gap: 8px;
  }
  .calendar-controls strong {
    min-width: 115px;
    font-size: 12px;
  }
  .calendar-controls .today-button {
    padding: 0 10px;
  }
  .agenda-item {
    color: inherit;
    grid-template-columns: 50px minmax(0, 1fr) 14px;
    align-items: center;
    text-decoration: none;
    position: relative;
  }
  .agenda-arrow {
    color: #b7abb6;
    font-size: 22px;
  }
}
* {
  box-sizing: border-box;
}
:root {
  color: #29283a;
  font-synthesis: none;
  background: #f7f6fa;
  font-family:
    Inter,
    Segoe UI,
    Arial,
    sans-serif;
}
html {
  scroll-behavior: smooth;
}
body {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
}
button,
input,
textarea,
select {
  font: inherit;
}
button {
  cursor: pointer;
}
.center-page {
  place-items: center;
  min-height: 100vh;
  display: grid;
}
.crm-shell {
  grid-template-columns: 245px 1fr;
  min-height: 100vh;
  display: grid;
}
.crm-sidebar {
  z-index: 5;
  color: #fff;
  background: linear-gradient(#211d38, #171428);
  flex-direction: column;
  width: 245px;
  height: 100vh;
  padding: 30px 20px;
  display: flex;
  position: fixed;
}
.crm-brand {
  align-items: center;
  gap: 12px;
  padding: 0 8px;
  display: flex;
}
.crm-logo {
  background: linear-gradient(145deg, #ff7d87, #f3a159);
  border-radius: 13px;
  place-items: center;
  width: 42px;
  height: 42px;
  font-size: 22px;
  display: grid;
  box-shadow: 0 8px 24px #ff866640;
}
.crm-brand strong,
.crm-brand small {
  display: block;
}
.crm-brand strong {
  font-size: 22px;
}
.crm-brand small {
  letter-spacing: 1.4px;
  color: #aaa4bf;
  margin-top: 3px;
  font-size: 8px;
}
.crm-nav {
  gap: 7px;
  margin-top: 50px;
  display: grid;
}
.crm-nav a {
  color: #a9a4bb;
  border-radius: 10px;
  align-items: center;
  gap: 13px;
  padding: 13px 14px;
  text-decoration: none;
  display: flex;
}
.crm-nav a span {
  font-size: 19px;
}
.crm-nav a:hover,
.crm-nav a.active {
  color: #fff;
  background: #332e4d;
}
.sidebar-profile {
  border-top: 1px solid #39344d;
  grid-template-columns: 38px 1fr 28px;
  align-items: center;
  gap: 10px;
  margin-top: auto;
  padding: 15px 8px 0;
  display: grid;
}
.profile-avatar {
  background: #6d5fc2;
  border-radius: 11px;
  place-items: center;
  width: 38px;
  height: 38px;
  font-weight: 800;
  display: grid;
}
.sidebar-profile strong,
.sidebar-profile small {
  display: block;
}
.sidebar-profile strong {
  font-size: 12px;
}
.sidebar-profile small {
  color: #918ca3;
  text-overflow: ellipsis;
  max-width: 105px;
  margin-top: 3px;
  font-size: 9px;
  overflow: hidden;
}
.sidebar-profile button {
  color: #9b95aa;
  background: 0 0;
  border: 0;
  font-size: 18px;
}
.crm-main {
  grid-column: 2;
  padding: 38px 42px 50px;
}
.crm-topbar {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 28px;
  display: flex;
}
.crm-eyebrow {
  color: #8a68cf;
  letter-spacing: 1.6px;
  margin: 0 0 6px;
  font-size: 10px;
  font-weight: 800;
}
.crm-topbar h1 {
  letter-spacing: -1px;
  margin: 0 0 6px;
  font-size: 30px;
}
.crm-topbar > div > p:last-child {
  color: #8b8796;
  margin: 0;
}
.new-event-button {
  color: #fff;
  background: linear-gradient(135deg, #7b63d2, #6751bb);
  border-radius: 10px;
  padding: 12px 17px;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 8px 20px #705ac833;
}
.crm-summary {
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 20px;
  display: grid;
}
.summary-card {
  background: #fff;
  border: 1px solid #ebe8f0;
  border-radius: 13px;
  align-items: center;
  gap: 13px;
  padding: 18px;
  display: flex;
  box-shadow: 0 5px 20px #2a234008;
}
.summary-symbol {
  border-radius: 12px;
  place-items: center;
  width: 43px;
  height: 43px;
  font-size: 20px;
  display: grid;
}
.summary-symbol.purple {
  color: #725cc6;
  background: #efeaff;
}
.summary-symbol.orange {
  color: #d47b42;
  background: #fff0e5;
}
.summary-symbol.green {
  color: #37906f;
  background: #dff5eb;
}
.summary-symbol.blue {
  color: #467bb4;
  background: #e6f2ff;
}
.summary-card p {
  color: #8f8b98;
  margin: 0 0 3px;
  font-size: 12px;
}
.summary-card strong {
  font-size: 24px;
}
.crm-grid {
  grid-template-columns: minmax(500px, 1.5fr) minmax(340px, 0.85fr);
  align-items: start;
  gap: 20px;
  display: grid;
}
.organization-list-card,
.organization-form-card {
  background: #fff;
  border: 1px solid #e9e6ee;
  border-radius: 15px;
  box-shadow: 0 8px 30px #29213e0a;
}
.organization-list-card {
  overflow: hidden;
}
.section-heading {
  border-bottom: 1px solid #efedf2;
  justify-content: space-between;
  align-items: center;
  padding: 23px 24px;
  display: flex;
}
.section-heading h2,
.form-title h2 {
  margin: 0 0 5px;
  font-size: 19px;
}
.section-heading p,
.form-title p {
  color: #8f8b98;
  margin: 0;
  font-size: 12px;
}
.crm-search {
  color: #8f8b97;
  background: #faf9fc;
  border: 1px solid #e3e0e8;
  border-radius: 9px;
  align-items: center;
  width: 190px;
  padding: 0 10px;
  display: flex;
}
.crm-search input {
  background: 0 0;
  border: 0;
  outline: 0;
  width: 100%;
  padding: 9px;
  font-size: 12px;
}
.organization-row {
  border-bottom: 1px solid #f0eef3;
  grid-template-columns: 52px 1fr 25px;
  align-items: center;
  gap: 14px;
  padding: 18px 24px;
  transition: all 0.2s;
  display: grid;
}
.organization-row:last-child {
  border: 0;
}
.date-box {
  text-align: center;
  background: #f3efff;
  border-radius: 11px;
  place-content: center;
  width: 50px;
  height: 55px;
  display: grid;
}
.date-box strong {
  color: #6953bd;
  font-size: 20px;
  line-height: 1;
}
.date-box span {
  color: #8d7ec5;
  text-transform: uppercase;
  margin-top: 4px;
  font-size: 10px;
}
.organization-title {
  align-items: center;
  gap: 9px;
  display: flex;
}
.organization-title h3 {
  margin: 0;
  font-size: 15px;
}
.organization-info > p {
  color: #8a8693;
  margin: 5px 0 8px;
  font-size: 12px;
}
.organization-meta {
  color: #8e8996;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 10px;
  display: flex;
}
.crm-status {
  border-radius: 20px;
  padding: 4px 7px;
  font-size: 9px;
  font-weight: 800;
}
.crm-status.pending {
  color: #a16b27;
  background: #fff0d8;
}
.crm-status.confirmed {
  color: #327d62;
  background: #dff5e9;
}
.crm-status.completed {
  color: #5b62a5;
  background: #e9eaff;
}
.detail-button {
  color: #aaa5b1;
  background: 0 0;
  border: 0;
  font-size: 25px;
}
.form-title {
  border-bottom: 1px solid #efedf2;
  align-items: center;
  gap: 12px;
  margin-bottom: 21px;
  padding-bottom: 17px;
  display: flex;
}
.form-title > span {
  background: #fff0e9;
  border-radius: 12px;
  place-items: center;
  width: 43px;
  height: 43px;
  font-size: 21px;
  display: grid;
}
.form-two-columns {
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  display: grid;
}
.crm-field {
  color: #4c4957;
  margin-bottom: 13px;
  font-size: 11px;
  font-weight: 700;
  display: block;
}
.crm-field input,
.crm-field select,
.crm-field textarea {
  color: #2e2c39;
  background: #faf9fc;
  border: 1px solid #dfdce5;
  border-radius: 8px;
  outline: 0;
  width: 100%;
  margin-top: 6px;
  padding: 10px 11px;
  display: block;
}
.crm-field textarea {
  resize: vertical;
  min-height: 70px;
}
.crm-field input:focus,
.crm-field select:focus,
.crm-field textarea:focus {
  border-color: #8169d2;
  box-shadow: 0 0 0 3px #8067d214;
}
.save-organization-button {
  color: #fff;
  background: linear-gradient(135deg, #7a62d1, #6450b8);
  border: 0;
  border-radius: 9px;
  width: 100%;
  padding: 12px;
  font-weight: 800;
}
.save-organization-button:disabled {
  opacity: 0.6;
}
.crm-message {
  color: #6550b8;
  background: #efeaff;
  border-radius: 8px;
  margin: 0 0 13px;
  padding: 10px 11px;
  font-size: 11px;
}
.crm-empty {
  text-align: center;
  color: #8f8a98;
  align-content: center;
  place-items: center;
  min-height: 330px;
  padding: 35px;
  display: grid;
}
.crm-empty > span {
  font-size: 35px;
}
.crm-empty h3 {
  color: #3b3846;
  margin: 12px 0 5px;
}
.crm-empty p {
  margin: 0;
  font-size: 12px;
}
.auth-page {
  grid-template-columns: 1fr 1fr;
  min-height: 100vh;
  display: grid;
}
.intro-panel {
  color: #fff;
  background: radial-gradient(circle at 85% 15%, #50458b 0, #0000 35%), #19172d;
  flex-direction: column;
  padding: 48px 8vw;
  display: flex;
}
.brand {
  align-items: center;
  gap: 11px;
  font-size: 25px;
  font-weight: 800;
  display: flex;
}
.logo-mark {
  color: #fff;
  background: #725fd8;
  border-radius: 11px;
  place-items: center;
  width: 38px;
  height: 38px;
  display: inline-grid;
}
.intro-copy {
  max-width: 540px;
  margin: auto 0;
}
.eyebrow {
  color: #7c69e0;
  letter-spacing: 1.8px;
  margin-bottom: 10px;
  font-size: 12px;
  font-weight: 800;
}
.intro-panel .eyebrow {
  color: #a99bef;
}
.intro-copy h1 {
  letter-spacing: -3px;
  margin: 16px 0;
  font-size: clamp(46px, 5vw, 74px);
  line-height: 1.03;
}
.intro-copy p {
  color: #c1bdcf;
  font-size: 18px;
  line-height: 1.7;
}
.form-panel {
  place-items: center;
  padding: 32px;
  display: grid;
}
.auth-card {
  width: min(410px, 100%);
}
.auth-card h2 {
  margin: 0 0 8px;
  font-size: 34px;
}
.muted {
  color: #85828f;
  margin: 0 0 30px;
  line-height: 1.6;
}
.auth-card label {
  margin: 16px 0 7px;
  font-size: 14px;
  font-weight: 700;
  display: block;
}
.auth-card input {
  color: #242234;
  background: #fff;
  border: 1px solid #dcd9e4;
  border-radius: 9px;
  outline: none;
  width: 100%;
  padding: 13px 14px;
}
.auth-card input:focus {
  border-color: #725fd8;
  box-shadow: 0 0 0 3px #725fd81f;
}
.primary-button {
  color: #fff;
  background: #6d59d4;
  border: 0;
  border-radius: 9px;
  padding: 12px 18px;
  font-weight: 750;
}
.full-button {
  width: 100%;
  margin-top: 22px;
}
.error-message {
  color: #a53842;
  background: #ffebed;
  border-radius: 8px;
  margin-top: 16px;
  padding: 11px 13px;
  font-size: 14px;
}
.switch-text {
  color: #85828f;
  text-align: center;
  margin-top: 22px;
}
.switch-text button {
  color: #6552ca;
  background: 0 0;
  border: 0;
  margin-left: 6px;
  padding: 0;
  font-weight: 800;
}
.mobile-brand {
  display: none;
}
@media (max-width: 1050px) {
  .crm-grid {
    grid-template-columns: 1fr;
  }
  .crm-summary {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 760px) {
  .crm-shell {
    display: block;
  }
  .crm-sidebar {
    width: 100%;
    height: auto;
    padding: 17px 20px;
    position: static;
  }
  .crm-nav,
  .sidebar-profile {
    display: none;
  }
  .crm-main {
    padding: 25px 16px;
  }
  .crm-topbar {
    align-items: flex-start;
  }
  .new-event-button {
    padding: 10px;
    font-size: 0;
  }
  .new-event-button:first-letter {
    font-size: 18px;
  }
  .crm-summary {
    gap: 8px;
  }
  .summary-card {
    padding: 13px;
  }
  .organization-row {
    padding: 15px 13px;
  }
  .section-heading {
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
  }
  .crm-search {
    width: 100%;
  }
  .form-two-columns,
  .auth-page {
    grid-template-columns: 1fr;
  }
  .intro-panel {
    display: none;
  }
  .form-panel {
    min-height: 100vh;
    padding: 24px;
  }
  .mobile-brand {
    color: #6552ca;
    margin-bottom: 45px;
    font-size: 24px;
    font-weight: 800;
    display: block;
  }
}
@media (max-width: 480px) {
  .crm-summary {
    grid-template-columns: 1fr 1fr;
  }
  .summary-symbol {
    width: 35px;
    height: 35px;
  }
  .summary-card strong {
    font-size: 19px;
  }
  .organization-meta {
    gap: 6px;
  }
  .organization-title {
    flex-direction: column;
    align-items: flex-start;
  }
  .crm-topbar h1 {
    font-size: 25px;
  }
}
.mobile-bottom-nav {
  display: none;
}
@media (max-width: 760px) {
  body {
    -webkit-tap-highlight-color: transparent;
    background: #f7f6fa;
  }
  .crm-sidebar {
    z-index: 20;
    height: 66px;
    padding: 12px 16px;
    position: sticky;
    top: 0;
    box-shadow: 0 5px 20px #1714282e;
  }
  .crm-brand {
    padding: 0;
  }
  .crm-logo {
    border-radius: 11px;
    width: 38px;
    height: 38px;
  }
  .crm-brand strong {
    font-size: 19px;
  }
  .crm-brand small {
    font-size: 7px;
  }
  .crm-main {
    padding: 22px 12px calc(96px + env(safe-area-inset-bottom));
  }
  .crm-topbar {
    gap: 12px;
    margin-bottom: 20px;
  }
  .crm-topbar h1 {
    font-size: 25px;
  }
  .crm-topbar > div > p:last-child {
    max-width: 255px;
    font-size: 12px;
    line-height: 1.5;
  }
  .new-event-button {
    display: none;
  }
  .crm-summary {
    grid-template-columns: 1fr 1fr;
    gap: 9px;
    margin-bottom: 14px;
  }
  .summary-card {
    border-radius: 12px;
    min-width: 0;
    padding: 13px 11px;
  }
  .summary-symbol {
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    font-size: 17px;
  }
  .summary-card p {
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 10px;
    overflow: hidden;
  }
  .summary-card strong,
  .summary-card strong.compact-value {
    font-size: 17px;
  }
  .crm-grid {
    flex-direction: column;
    gap: 14px;
    display: flex;
  }
  .organization-list-card,
  .organization-form-card {
    border-radius: 13px;
    width: 100%;
  }
  .section-heading {
    padding: 18px 16px 14px;
  }
  .section-heading h2,
  .form-title h2 {
    font-size: 18px;
  }
  .crm-search {
    min-height: 44px;
  }
  .crm-search input {
    font-size: 16px;
  }
  .organization-row {
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 11px;
    padding: 16px 13px;
  }
  .date-box {
    width: 46px;
    height: 52px;
  }
  .date-box strong {
    font-size: 19px;
  }
  .organization-info {
    min-width: 0;
  }
  .organization-title {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
  .organization-title h3 {
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
    font-size: 15px;
    overflow: hidden;
  }
  .organization-info > p {
    overflow-wrap: anywhere;
    line-height: 1.5;
  }
  .organization-meta {
    gap: 7px;
    line-height: 1.4;
  }
  .detail-button {
    display: none;
  }
  .payment-line {
    flex-direction: column;
    align-items: flex-start;
  }
  .organization-form-card {
    padding: 18px 15px;
    scroll-margin-top: 80px;
  }
  .organization-list-card,
  .crm-summary {
    scroll-margin-top: 80px;
  }
  .form-title {
    margin-bottom: 17px;
  }
  .form-two-columns {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .crm-field {
    margin-bottom: 14px;
    font-size: 12px;
  }
  .crm-field input,
  .crm-field select,
  .crm-field textarea {
    border-radius: 9px;
    min-height: 46px;
    padding: 12px;
    font-size: 16px;
  }
  .crm-field textarea {
    min-height: 92px;
  }
  .remaining-payment {
    min-height: 46px;
    padding: 12px;
  }
  .save-organization-button {
    border-radius: 10px;
    min-height: 50px;
    font-size: 15px;
  }
  .mobile-bottom-nav {
    z-index: 30;
    padding: 7px 10px calc(7px + env(safe-area-inset-bottom));
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    background: #fffffff5;
    border-top: 1px solid #e9e6ee;
    grid-template-columns: repeat(6, 1fr);
    display: grid;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    box-shadow: 0 -8px 30px #28213d1a;
  }
  .mobile-bottom-nav a,
  .mobile-bottom-nav button {
    color: #827d8b;
    background: 0 0;
    border: 0;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 3px;
    min-height: 48px;
    padding: 4px;
    text-decoration: none;
    display: flex;
  }
  .mobile-bottom-nav span {
    font-size: 20px;
    line-height: 1;
  }
  .mobile-bottom-nav small {
    font-size: 9px;
    font-weight: 700;
  }
  .mobile-bottom-nav .mobile-add span {
    color: #fff;
    background: linear-gradient(135deg, #7a62d1, #6450b8);
    border: 4px solid #fff;
    border-radius: 50%;
    place-items: center;
    width: 34px;
    height: 34px;
    margin-top: -17px;
    display: grid;
    box-shadow: 0 5px 14px #6450b84d;
  }
  .mobile-bottom-nav .mobile-add small {
    color: #6550b8;
  }
}
@media (max-width: 360px) {
  .crm-main {
    padding-left: 9px;
    padding-right: 9px;
  }
  .summary-card {
    gap: 7px;
  }
  .summary-symbol {
    flex-basis: 32px;
    width: 32px;
    height: 32px;
  }
}
:root {
  --dgd-ink: #252238;
  --dgd-muted: #817c8d;
  --dgd-purple: #6d56c4;
  --dgd-purple-dark: #5742a9;
  --dgd-purple-soft: #f0ecff;
  --dgd-border: #e7e3ed;
  --dgd-surface: #fffffff0;
  --dgd-shadow: 0 16px 45px #271f4112;
}
body {
  color: var(--dgd-ink);
  background:
    radial-gradient(circle at 76% 0, #e8e1ffa6, #0000 28rem),
    linear-gradient(#fbfaff 0, #f6f4fa 48%, #f8f7fb 100%);
}
button,
a,
input,
select,
textarea {
  transition:
    border-color 0.18s,
    box-shadow 0.18s,
    color 0.18s,
    background-color 0.18s,
    transform 0.18s;
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline-offset: 2px;
  outline: 3px solid #6d56c438;
}
.crm-sidebar {
  background:
    radial-gradient(circle at 14% 8%, #7b63d24d, #0000 15rem),
    linear-gradient(#211d38 0%, #171426 72%);
  border-right: 1px solid #ffffff0f;
  box-shadow: 14px 0 45px #17142817;
}
.crm-brand {
  min-height: 54px;
}
.crm-brand strong {
  letter-spacing: -0.5px;
}
.crm-nav a {
  border: 1px solid #0000;
  font-size: 13px;
  font-weight: 650;
}
.crm-nav a:hover {
  color: #fff;
  background: #ffffff12;
  border-color: #ffffff0f;
  transform: translate(2px);
}
.crm-nav a.active {
  background: linear-gradient(135deg, #7f67d757, #5a45a63d);
  border-color: #b3a3ec2e;
  box-shadow: inset 3px 0 #a994f0;
}
.sidebar-profile {
  margin-left: -4px;
  margin-right: -4px;
  padding: 16px 12px 0;
}
.crm-main {
  width: 100%;
  max-width: 1480px;
  margin: 0 auto;
}
.crm-topbar {
  padding: 4px 2px;
  position: relative;
}
.crm-topbar h1 {
  color: #29253c;
  letter-spacing: -1.25px;
  font-weight: 800;
}
.new-event-button,
.save-organization-button,
.primary-button {
  background: linear-gradient(135deg, #7b62d2, #5945ad);
  box-shadow: 0 11px 28px #664ebc3d;
}
.new-event-button:hover,
.save-organization-button:hover:not(:disabled),
.primary-button:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 15px 34px #664ebc52;
}
.crm-tabs {
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  background: #ffffffc7;
  border-color: #e2ddebd9;
  border-radius: 15px;
  padding: 6px;
  box-shadow: 0 10px 32px #2b22480f;
}
.crm-tabs a {
  border: 1px solid #0000;
  border-radius: 10px;
}
.crm-tabs a:hover {
  color: #5945ad;
  background: #f7f4ff;
}
.summary-card,
.organization-list-card,
.organization-form-card,
.calendar-card {
  background: var(--dgd-surface);
  border-color: var(--dgd-border);
  box-shadow: var(--dgd-shadow);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.summary-card {
  border-radius: 16px;
  position: relative;
  overflow: hidden;
}
.summary-card:after {
  content: "";
  background: radial-gradient(circle, #7057c71c, #0000 68%);
  border-radius: 50%;
  width: 82px;
  height: 82px;
  position: absolute;
  bottom: -36px;
  right: -28px;
}
.summary-card:hover {
  border-color: #ddd6ee;
  transform: translateY(-2px);
  box-shadow: 0 18px 45px #271f411a;
}
.summary-symbol {
  box-shadow: inset 0 0 0 1px #ffffffa6;
}
.organization-list-card,
.organization-form-card,
.calendar-card {
  border-radius: 18px;
  overflow: hidden;
}
.section-heading,
.calendar-header {
  background: linear-gradient(#fff, #fdfcff);
}
.section-heading h2,
.form-title h2,
.calendar-header h2 {
  color: #2c283e;
  letter-spacing: -0.35px;
}
.crm-search {
  background: #f9f7fc;
  border-color: #e4dfeb;
  border-radius: 11px;
}
.organization-row {
  position: relative;
}
.organization-title h3 {
  color: #302c42;
  letter-spacing: -0.15px;
}
.organization-meta span {
  background: #faf9fc;
  border: 1px solid #ece8f0;
  border-radius: 7px;
  padding: 4px 7px;
}
.organization-actions a,
.organization-actions button,
.organization-actions label {
  border-color: #d8d2e2d9;
  border-radius: 9px;
}
.organization-form-card {
  padding: 27px;
}
.form-title > span {
  background: linear-gradient(145deg, #fff0e9, #f5e9ff);
  box-shadow: inset 0 0 0 1px #f0e3ea;
}
.crm-field input,
.crm-field select,
.crm-field textarea {
  background: #fbfafd;
  border-color: #ded9e6;
}
.crm-field input:hover,
.crm-field select:hover,
.crm-field textarea:hover {
  border-color: #cfc7db;
}
.organization-image-field {
  background: linear-gradient(145deg, #faf8ff, #fff);
  border-style: dashed;
  border-color: #d8cfeb;
}
.calendar-day {
  background: #ffffffc2;
}
.calendar-day:hover:not(.outside) {
  background: #faf8ff;
  box-shadow: inset 0 0 0 1px #e7e0fa;
}
.auth-page {
  background: #f8f6fb;
}
.intro-panel {
  background:
    radial-gradient(circle at 78% 18%, #735bca7a, #0000 24rem),
    radial-gradient(circle at 14% 86%, #49388557, #0000 20rem),
    linear-gradient(145deg, #211d38, #161326);
}
.auth-card {
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  background: #ffffffeb;
  border: 1px solid #e8e3ed;
  border-radius: 22px;
  padding: 38px;
  box-shadow: 0 24px 70px #271e3f1f;
}
.auth-card h2 {
  color: #2a263c;
  letter-spacing: -1px;
}
@media (max-width: 760px) {
  body {
    background:
      radial-gradient(circle at 100% 0, #e7dfffbf, #0000 20rem), #f7f5fa;
  }
  .crm-sidebar {
    background:
      radial-gradient(circle at 8% 0, #8167da47, #0000 10rem),
      linear-gradient(100deg, #211d38, #181527);
    border-bottom: 1px solid #ffffff12;
  }
  .crm-main {
    padding-top: 25px;
  }
  .crm-topbar {
    padding: 0 3px;
  }
  .crm-tabs {
    border-radius: 14px;
    margin-left: -2px;
    margin-right: -2px;
  }
  .summary-card,
  .organization-list-card,
  .organization-form-card,
  .calendar-card {
    border-radius: 16px;
    box-shadow: 0 11px 32px #271f4112;
  }
  .summary-card:hover {
    transform: none;
  }
  .organization-form-card {
    padding: 19px 16px;
  }
  .organization-meta span {
    padding: 4px 6px;
  }
  .mobile-bottom-nav {
    border-top-color: #e1dce9eb;
    box-shadow: 0 -12px 38px #271f411f;
  }
  .auth-page {
    background:
      radial-gradient(circle at 100% 0, #e4daffbf, #0000 22rem), #f7f5fa;
  }
  .auth-card {
    border-radius: 19px;
    padding: 28px 22px;
    box-shadow: 0 18px 55px #271e3f1c;
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  :before,
  :after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}
.team-page {
  color: var(--dgd-ink, #252238);
}
.team-heading {
  border: 1px solid var(--dgd-border, #e7e3ed);
  box-shadow: var(--dgd-shadow, 0 16px 45px #271f4112);
  background: linear-gradient(135deg, #fffffff5, #f6f2ffeb);
  border-radius: 18px;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  margin-bottom: 18px;
  padding: 24px 26px;
  display: flex;
}
.team-heading h2 {
  margin: 0 0 6px;
  font-size: 24px;
}
.team-heading > div > p:last-child,
.team-card-title p,
.team-list-title p {
  color: #85808f;
  margin: 0;
  font-size: 12px;
}
.team-summary {
  gap: 8px;
  display: flex;
}
.team-summary span {
  color: #746d80;
  text-align: center;
  background: #fff;
  border: 1px solid #e8e3ee;
  border-radius: 11px;
  min-width: 78px;
  padding: 10px 12px;
  font-size: 10px;
}
.team-summary strong {
  color: #5e49b2;
  margin-bottom: 2px;
  font-size: 19px;
  display: block;
}
.team-permission-note,
.team-message {
  color: #5d5290;
  background: #f1edff;
  border: 1px solid #e2dafe;
  border-radius: 12px;
  margin-bottom: 16px;
  padding: 13px 15px;
  font-size: 12px;
  line-height: 1.5;
}
.team-message.error {
  color: #9c3f49;
  background: #fff0f1;
  border-color: #f2d2d6;
}
.team-layout {
  grid-template-columns: minmax(280px, 0.72fr) minmax(500px, 1.28fr);
  align-items: start;
  gap: 18px;
  display: grid;
}
.team-create-card,
.team-list-card {
  border: 1px solid var(--dgd-border, #e7e3ed);
  box-shadow: var(--dgd-shadow, 0 16px 45px #271f4112);
  background: #fffffff2;
  border-radius: 18px;
  overflow: hidden;
}
.team-create-card {
  padding: 23px;
}
.team-card-title {
  border-bottom: 1px solid #efedf2;
  align-items: center;
  gap: 12px;
  margin-bottom: 21px;
  padding-bottom: 17px;
  display: flex;
}
.team-card-title > span {
  color: #674fbc;
  background: #eee9ff;
  border-radius: 12px;
  place-items: center;
  width: 43px;
  height: 43px;
  font-size: 21px;
  display: grid;
}
.team-card-title h3,
.team-list-title h3,
.team-member h3 {
  margin: 0 0 4px;
}
.team-card-title h3,
.team-list-title h3 {
  font-size: 17px;
}
.team-create-card label {
  color: #4c4957;
  margin-bottom: 14px;
  font-size: 11px;
  font-weight: 750;
  display: block;
}
.team-create-card input,
.team-create-card select,
.team-member-actions select {
  color: #2e2c39;
  background: #fbfafd;
  border: 1px solid #ded9e6;
  border-radius: 9px;
  outline: none;
  width: 100%;
  margin-top: 6px;
  padding: 11px 12px;
}
.team-create-card input:focus,
.team-create-card select:focus,
.team-member-actions select:focus {
  background: #fff;
  border-color: #7d64ce;
  box-shadow: 0 0 0 4px #7057c71a;
}
.team-create-button {
  color: #fff;
  background: linear-gradient(135deg, #7b62d2, #5945ad);
  border: 0;
  border-radius: 10px;
  width: 100%;
  min-height: 45px;
  margin-top: 3px;
  font-weight: 800;
  box-shadow: 0 10px 24px #664ebc33;
}
.team-create-button:disabled {
  cursor: wait;
  opacity: 0.62;
}
.team-create-card > small {
  color: #8a8592;
  margin-top: 11px;
  font-size: 10px;
  line-height: 1.45;
  display: block;
}
.team-list-title {
  border-bottom: 1px solid #efedf2;
  justify-content: space-between;
  align-items: center;
  padding: 21px 23px;
  display: flex;
}
.team-list-title > span {
  color: #684fbd;
  background: #eeeaff;
  border-radius: 10px;
  place-items: center;
  width: 34px;
  height: 34px;
  font-weight: 800;
  display: grid;
}
.team-member {
  border-bottom: 1px solid #f0edf3;
  grid-template-columns: 45px minmax(0, 1fr);
  gap: 13px;
  padding: 18px 22px;
  display: grid;
}
.team-member:last-child {
  border-bottom: 0;
}
.team-member.inactive {
  opacity: 0.68;
  background: #faf9fb;
}
.team-avatar {
  color: #fff;
  background: linear-gradient(145deg, #826bd8, #5c48ae);
  border-radius: 13px;
  place-items: center;
  width: 45px;
  height: 45px;
  font-weight: 850;
  display: grid;
  box-shadow: 0 7px 18px #5e47ae2e;
}
.team-member-info {
  min-width: 0;
}
.team-member-name {
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  display: flex;
}
.team-member h3 {
  font-size: 14px;
}
.team-member-info > p {
  color: #898492;
  text-overflow: ellipsis;
  margin: 0 0 11px;
  font-size: 11px;
  overflow: hidden;
}
.you-badge,
.inactive-badge {
  color: #5f49b0;
  text-transform: uppercase;
  background: #eee9ff;
  border-radius: 20px;
  padding: 3px 7px;
  font-size: 8px;
  font-weight: 850;
}
.inactive-badge {
  color: #91424b;
  background: #ffecef;
}
.team-member-actions {
  grid-template-columns: minmax(110px, 0.8fr) 1fr 0.75fr 0.6fr;
  gap: 7px;
  display: grid;
}
.team-member-actions select,
.team-member-actions button {
  color: #625a70;
  background: #faf9fc;
  border: 1px solid #e1dce7;
  border-radius: 8px;
  min-height: 37px;
  margin: 0;
  padding: 7px 9px;
  font-size: 10px;
  font-weight: 750;
}
.team-member-actions button:hover:not(:disabled) {
  color: #5d48ae;
  background: #f3efff;
  border-color: #d8cff2;
}
.team-member-actions .deactivate {
  color: #9b434d;
  background: #fff2f3;
}
.team-member-actions .activate {
  color: #28785b;
  background: #e9f8f1;
}
.team-member-actions .remove {
  color: #a12f3d;
  background: #fff;
  border-color: #efc9ce;
}
.team-member-actions :disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.team-empty {
  color: #8c8795;
  text-align: center;
  padding: 45px 20px;
  font-size: 12px;
}
.access-blocked-page {
  background: radial-gradient(circle at 80% 10%, #e7dfff, #0000 26rem), #f7f5fa;
  place-items: center;
  min-height: 100vh;
  padding: 24px;
  display: grid;
}
.access-blocked-card {
  text-align: center;
  background: #fffffff0;
  border: 1px solid #e7e1ed;
  border-radius: 22px;
  width: min(440px, 100%);
  padding: 38px;
  box-shadow: 0 24px 70px #271e3f1f;
}
.access-blocked-card img {
  object-fit: cover;
  border-radius: 18px;
  width: 76px;
  height: 76px;
  margin-bottom: 20px;
}
.access-blocked-card h1 {
  margin: 4px 0 10px;
  font-size: 25px;
}
.access-blocked-card > p:not(.crm-eyebrow) {
  color: #817c8d;
  margin: 0 0 22px;
  line-height: 1.6;
}
@media (max-width: 980px) {
  .team-layout {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .team-heading {
    flex-direction: column;
    align-items: flex-start;
    padding: 19px 16px;
  }
  .team-heading h2 {
    font-size: 21px;
  }
  .team-summary {
    width: 100%;
  }
  .team-summary span {
    flex: 1;
    min-width: 0;
    padding: 8px 5px;
  }
  .team-create-card,
  .team-list-card,
  .team-heading {
    border-radius: 16px;
  }
  .team-create-card {
    padding: 19px 16px;
  }
  .team-create-card input,
  .team-create-card select {
    min-height: 46px;
    font-size: 16px;
  }
  .team-member {
    grid-template-columns: 40px minmax(0, 1fr);
    padding: 16px 13px;
  }
  .team-avatar {
    width: 40px;
    height: 40px;
  }
  .team-member-actions {
    grid-template-columns: 1fr 1fr;
  }
  .team-member-actions select {
    grid-column: 1/-1;
    min-height: 43px;
    font-size: 13px;
  }
  .team-member-actions button {
    min-height: 42px;
  }
  .mobile-bottom-nav.with-admin {
    grid-template-columns: repeat(7, 1fr);
    padding-left: 4px;
    padding-right: 4px;
  }
  .mobile-bottom-nav.with-admin a,
  .mobile-bottom-nav.with-admin button {
    padding-left: 1px;
    padding-right: 1px;
  }
  .mobile-bottom-nav.with-admin small {
    font-size: 8px;
  }
}
.startup-logo {
  object-fit: cover;
  border-radius: 24px;
  width: 112px;
  height: 112px;
  animation: 1.2s ease-in-out infinite alternate startup-logo-pulse;
  box-shadow: 0 18px 50px #2a234026;
}
@keyframes startup-logo-pulse {
  to {
    opacity: 0.82;
    transform: scale(1.04);
  }
}
.mobile-top-actions {
  display: none;
}
@media (max-width: 760px) {
  :root {
    --mobile-gutter: 16px;
    --mobile-radius: 20px;
  }
  html {
    background: #f5f3f9;
  }
  body {
    -webkit-font-smoothing: antialiased;
    background:
      radial-gradient(circle at 100% -5%, #dacfffb8, #0000 22rem),
      linear-gradient(#faf9fd 0%, #f5f3f8 58%, #f7f5fa 100%);
    min-height: 100dvh;
  }
  .crm-sidebar {
    height: calc(64px + env(safe-area-inset-top));
    padding: calc(10px + env(safe-area-inset-top)) var(--mobile-gutter) 10px;
    -webkit-backdrop-filter: blur(22px) saturate(1.25);
    backdrop-filter: blur(22px) saturate(1.25);
    background: #1b172ff0;
    border: 0;
    top: 0;
    box-shadow: 0 10px 30px #1b163026;
  }
  .crm-brand {
    gap: 10px;
    min-height: 42px;
  }
  .crm-logo {
    border: 1px solid #ffffff2e;
    width: 38px;
    height: 38px;
    box-shadow: 0 8px 20px #0000003d;
  }
  .crm-brand strong {
    letter-spacing: -0.35px;
    font-size: 18px;
  }
  .crm-brand small {
    color: #b7b0c8;
    letter-spacing: 1.25px;
    margin-top: 2px;
    font-size: 7px;
  }
  .crm-main {
    padding: 22px var(--mobile-gutter) calc(104px + env(safe-area-inset-bottom));
  }
  .crm-topbar {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 12px;
    margin-bottom: 22px;
    padding: 3px 0 0;
    display: grid;
  }
  .crm-topbar .crm-eyebrow {
    letter-spacing: 1.45px;
    margin-bottom: 7px;
    font-size: 9px;
  }
  .crm-topbar h1 {
    color: #211d32;
    letter-spacing: -1.25px;
    margin-bottom: 5px;
    font-size: 29px;
    line-height: 1.08;
  }
  .crm-topbar > div:first-child > p:last-child {
    color: #837e8d;
    max-width: 270px;
    font-size: 12px;
    line-height: 1.5;
  }
  .mobile-top-actions {
    gap: 8px;
    padding-top: 1px;
    display: flex;
  }
  .mobile-top-actions a,
  .mobile-top-actions button {
    color: #6550b8;
    background: #ffffffd6;
    border: 1px solid #e0dae9e6;
    border-radius: 14px;
    place-items: center;
    width: 42px;
    height: 42px;
    padding: 0;
    font-size: 18px;
    text-decoration: none;
    display: grid;
    box-shadow: 0 8px 24px #2f254c14;
  }
  .crm-tabs {
    display: none;
  }
  .crm-summary {
    gap: 10px;
    margin-bottom: 16px;
  }
  .summary-card {
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    background: #ffffffe0;
    border: 1px solid #e7e2eee0;
    border-radius: 18px;
    gap: 10px;
    min-height: 92px;
    padding: 15px 13px;
    box-shadow: 0 12px 34px #2b224312;
  }
  .summary-symbol {
    border-radius: 12px;
    flex-basis: 38px;
    width: 38px;
    height: 38px;
  }
  .summary-card p {
    color: #8c8796;
    letter-spacing: 0.1px;
    margin-bottom: 5px;
    font-size: 9px;
    font-weight: 700;
  }
  .summary-card strong,
  .summary-card strong.compact-value {
    color: #2d293d;
    letter-spacing: -0.45px;
    font-size: 18px;
  }
  .organization-list-card,
  .organization-form-card,
  .calendar-card,
  .team-heading,
  .team-create-card,
  .team-list-card,
  .work-task-heading,
  .work-task-form,
  .work-task-list-card {
    border-radius: var(--mobile-radius);
    border-color: #e5e0ece6;
    box-shadow: 0 14px 38px #281f4014;
  }
  .section-heading {
    gap: 14px;
    padding: 19px 17px 16px;
  }
  .section-heading h2,
  .form-title h2,
  .calendar-header h2 {
    letter-spacing: -0.5px;
    font-size: 19px;
  }
  .section-heading p {
    margin-top: 3px;
    line-height: 1.45;
  }
  .crm-search {
    background: #f7f5fa;
    border-radius: 14px;
    min-height: 48px;
    padding: 0 13px;
  }
  .organization-row {
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 13px;
    padding: 18px 15px;
  }
  .date-box {
    border-radius: 14px;
    width: 48px;
    height: 56px;
    box-shadow: 0 8px 20px #5d46aa1a;
  }
  .organization-title h3 {
    letter-spacing: -0.25px;
    font-size: 16px;
  }
  .crm-status {
    padding: 5px 8px;
  }
  .organization-info > p {
    color: #7f7a89;
    margin: 7px 0 9px;
    font-size: 11px;
  }
  .organization-meta span {
    background: #f8f6fa;
    border-radius: 8px;
    padding: 5px 7px;
  }
  .organization-actions {
    gap: 8px;
    margin-top: 14px;
  }
  .organization-actions a,
  .organization-actions button,
  .organization-actions label {
    border-radius: 12px;
    min-height: 44px;
    font-size: 10px;
  }
  .organization-form-card,
  .team-create-card {
    padding: 20px 17px;
  }
  .crm-field input,
  .crm-field select,
  .crm-field textarea,
  .team-create-card input,
  .team-create-card select {
    background: #faf9fc;
    border-radius: 12px;
    min-height: 50px;
    padding: 13px 14px;
  }
  .save-organization-button,
  .team-create-button,
  .work-task-save {
    border-radius: 14px;
    min-height: 52px;
    box-shadow: 0 12px 26px #5d46b038;
  }
  .calendar-header {
    padding: 20px 17px;
  }
  .calendar-controls button {
    border-radius: 13px;
    width: 42px;
    height: 42px;
  }
  .agenda-item {
    grid-template-columns: 50px minmax(0, 1fr);
    gap: 13px;
    padding: 17px;
  }
  .agenda-date {
    border-radius: 14px;
    width: 48px;
    height: 56px;
  }
  .team-heading {
    padding: 20px 17px;
  }
  .team-member {
    gap: 12px;
    padding: 17px 14px;
  }
  .team-member-actions button,
  .team-member-actions select {
    border-radius: 11px;
    min-height: 44px;
  }
  .mobile-bottom-nav,
  .mobile-bottom-nav.with-admin {
    right: 10px;
    bottom: calc(8px + env(safe-area-inset-bottom));
    -webkit-backdrop-filter: blur(24px) saturate(1.35);
    backdrop-filter: blur(24px) saturate(1.35);
    background: #ffffffe8;
    border: 1px solid #e0dae8e6;
    border-radius: 22px;
    grid-template-columns: repeat(5, 1fr);
    padding: 7px;
    left: 10px;
    box-shadow: 0 16px 42px #231b392e;
  }
  .mobile-bottom-nav a,
  .mobile-bottom-nav button {
    border-radius: 15px;
    min-height: 52px;
  }
  .mobile-bottom-nav a:active,
  .mobile-bottom-nav button:active {
    background: #f1edfa;
    transform: scale(0.96);
  }
  .mobile-bottom-nav span {
    font-size: 19px;
  }
  .mobile-bottom-nav small,
  .mobile-bottom-nav.with-admin small {
    font-size: 9px;
    font-weight: 750;
  }
  .mobile-bottom-nav .mobile-add span {
    border-width: 4px;
    width: 38px;
    height: 38px;
    margin-top: -20px;
    box-shadow: 0 8px 20px #5c44b452;
  }
  .mobile-bottom-nav > :nth-child(6),
  .mobile-bottom-nav > :nth-child(7) {
    display: none;
  }
}
@media (max-width: 390px) {
  :root {
    --mobile-gutter: 13px;
  }
  .crm-topbar h1 {
    font-size: 27px;
  }
  .mobile-top-actions a,
  .mobile-top-actions button {
    width: 40px;
    height: 40px;
  }
  .summary-card {
    gap: 8px;
    padding: 13px 10px;
  }
}
.crm-brand > div {
  display: none;
}
.crm-logo {
  object-fit: cover;
  object-position: center 52%;
  background: #fff;
  border: 0;
  border-radius: 12px;
  width: 178px;
  height: 58px;
  padding: 0;
  box-shadow: 0 10px 28px #0000002e;
}
.brand {
  display: block;
}
.brand > span {
  display: none;
}
.brand-logo {
  object-fit: cover;
  object-position: center 52%;
  background: #fff;
  border: 0;
  border-radius: 16px;
  width: 260px;
  height: 96px;
  box-shadow: 0 18px 42px #0000002e;
}
.mobile-brand img {
  object-fit: cover;
  object-position: center 52%;
  background: #fff;
  border-radius: 14px;
  width: 210px;
  height: 74px;
  box-shadow: 0 12px 30px #2e23451f;
}
.startup-logo {
  object-fit: cover;
  object-position: center 52%;
  background: #fff;
  border-radius: 18px;
  width: min(320px, 78vw);
  height: 118px;
}
.access-blocked-card img {
  object-fit: cover;
  object-position: center 52%;
  background: #fff;
  border-radius: 16px;
  width: min(290px, 100%);
  height: 108px;
  margin-bottom: 24px;
}
@media (max-width: 760px) {
  .crm-brand {
    min-height: 42px;
  }
  .crm-logo {
    border: 0;
    border-radius: 10px;
    width: 154px;
    height: 44px;
  }
  .mobile-brand {
    justify-content: center;
    margin-bottom: 34px;
  }
  .mobile-brand img {
    width: min(230px, 74vw);
    height: 82px;
  }
}
:root {
  --ink: #272231;
  --muted: #8b8491;
  --wine: #9a5d57;
  --wine-dark: #75433f;
  --blush: #f8ece9;
  --line: #e9e2e6;
  --surface: #ffffffeb;
}
body {
  background:
    radial-gradient(circle at 85% 0, #f8e9e6 0, #0000 28%),
    linear-gradient(145deg, #f8f6f8, #f2eff4);
}
.crm-sidebar {
  background:
    radial-gradient(circle at 20% 5%, #5e435b 0, #0000 28%),
    linear-gradient(#2c2535, #1e1928 78%);
  box-shadow: 18px 0 45px #261b291f;
}
.crm-brand {
  border-bottom: 1px solid #ffffff14;
  padding: 5px 6px 22px;
}
.crm-brand strong {
  letter-spacing: 1px;
  font-family: Georgia, serif;
  font-size: 25px;
}
.crm-logo {
  background: #fff;
  border: 1px solid #ffffff73;
  border-radius: 15px;
  width: 46px;
  height: 46px;
  box-shadow: 0 10px 28px #00000038;
}
.crm-nav {
  gap: 8px;
  margin-top: 29px;
}
.crm-nav a {
  color: #bdb3c2;
  border: 1px solid #0000;
  gap: 12px;
  min-height: 46px;
  padding: 12px 14px;
  font-size: 12px;
  font-weight: 700;
  position: relative;
}
.crm-nav a span {
  place-items: center;
  width: 24px;
  display: grid;
}
.crm-nav a svg {
  stroke-width: 1.8px;
  width: 18px;
  height: 18px;
}
.crm-nav a:hover,
.crm-nav a.active {
  color: #fff;
  background: linear-gradient(135deg, #ffffff1f, #ffffff0f);
  border-color: #ffffff17;
  box-shadow: 0 9px 24px #0000001a;
}
.crm-nav a.active:before {
  content: "";
  background: #d8a39b;
  border-radius: 4px;
  width: 3px;
  height: 22px;
  position: absolute;
  left: -5px;
}
.sidebar-profile {
  background: #ffffff0a;
  border: 1px solid #ffffff12;
  border-radius: 14px;
  margin: auto -2px 0;
  padding: 15px 10px 5px;
}
.profile-avatar {
  background: linear-gradient(145deg, #c78c83, #90514c);
  box-shadow: 0 7px 17px #00000038;
}
.sidebar-profile button svg {
  width: 16px;
}
.crm-main {
  max-width: 1500px;
  padding-top: 34px;
}
.crm-topbar {
  padding: 5px 2px 3px;
}
.crm-topbar h1 {
  color: var(--ink);
  letter-spacing: -1.25px;
  font-size: 32px;
  font-weight: 750;
}
.crm-eyebrow {
  color: var(--wine);
}
.new-event-button {
  background: linear-gradient(135deg, #a8665f, #804a46);
  border: 1px solid #ffffff40;
  border-radius: 12px;
  align-items: center;
  gap: 8px;
  padding: 13px 18px;
  display: flex;
  box-shadow:
    0 11px 26px #84484340,
    inset 0 1px #ffffff38;
}
.crm-tabs {
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  background: #ffffffb8;
  border-color: #ffffffd9;
  border-radius: 15px;
  gap: 7px;
  padding: 6px;
  box-shadow: 0 12px 38px #31253712;
}
.crm-tabs a {
  color: #7f7682;
  border: 1px solid #0000;
  border-radius: 10px;
  gap: 8px;
  min-height: 42px;
}
.crm-tabs a span {
  place-items: center;
  display: grid;
}
.crm-tabs a.active {
  color: #7f4945;
  background: linear-gradient(145deg, #fff, #f8ebe8);
  border-color: #ead5d1;
  box-shadow: 0 7px 18px #8f504a1c;
}
.crm-summary {
  gap: 16px;
}
.summary-card {
  background: linear-gradient(145deg, #fff, #fcfafc);
  border: 1px solid #ffffffe6;
  border-radius: 17px;
  padding: 20px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 14px 38px #2d213312;
}
.summary-card:before {
  content: "";
  background: radial-gradient(circle, #ae70671a, #0000 68%);
  width: 80px;
  height: 80px;
  position: absolute;
  top: -30px;
  right: -22px;
}
.summary-symbol {
  border-radius: 14px;
  width: 45px;
  height: 45px;
}
.organization-list-card,
.organization-form-card,
.calendar-card,
.work-task-panel,
.team-panel {
  background: var(--surface);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  border-color: #ffffffe6;
  box-shadow: 0 18px 50px #2c1f3114;
}
.section-heading {
  background: linear-gradient(#fff, #fdfafb);
  padding: 24px 25px;
}
.section-heading h2,
.form-title h2 {
  color: var(--ink);
  letter-spacing: -0.55px;
  font-size: 20px;
}
.crm-search {
  background: #f8f5f7;
  border-color: #e7dfe4;
  border-radius: 11px;
  height: 40px;
}
.crm-search:focus-within {
  background: #fff;
  border-color: #ba817a;
  box-shadow: 0 0 0 4px #a8665f1a;
}
.organization-row {
  padding-top: 20px;
  padding-bottom: 20px;
}
.organization-row:hover {
  background: linear-gradient(90deg, #fff, #fdf8f7);
}
.date-box {
  background: linear-gradient(145deg, #f8e9e6, #f2dcd8);
  border: 1px solid #ead0cc;
  box-shadow: inset 0 1px #fff;
}
.date-box strong {
  color: #8e504b;
}
.organization-title h3 {
  color: var(--ink);
  font-size: 16px;
}
.organization-actions a,
.organization-actions button {
  border: 1px solid #0000;
  border-radius: 9px;
  gap: 6px;
  min-height: 34px;
  padding: 7px 10px;
  font-weight: 750;
  transition:
    transform 0.18s,
    box-shadow 0.18s;
}
.organization-actions a:hover,
.organization-actions button:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 14px #31233517;
}
.organization-actions svg {
  stroke-width: 2px;
  width: 14px;
  height: 14px;
}
.share-pdf-action {
  background: linear-gradient(135deg, #379b70, #267b57);
  box-shadow: 0 5px 12px #2d8f6329;
}
.save-organization-button {
  background: linear-gradient(135deg, #a4635d, #7b4542);
  border-radius: 11px;
  min-height: 45px;
  box-shadow: 0 10px 22px #84484338;
}
.crm-field input,
.crm-field select,
.crm-field textarea {
  background: #faf8fa;
  border-color: #e5dee3;
  border-radius: 10px;
  min-height: 42px;
}
.crm-field input:focus,
.crm-field select:focus,
.crm-field textarea:focus {
  background: #fff;
  border-color: #b87871;
  box-shadow: 0 0 0 4px #a8665f17;
}
@media (max-width: 760px) {
  body {
    background: linear-gradient(#f8f4f6, #f2eff4);
  }
  .crm-sidebar {
    background: linear-gradient(135deg, #302738, #211b29);
    box-shadow: 0 8px 26px #1f17232e;
  }
  .crm-brand {
    border: 0;
    padding: 0;
  }
  .crm-main {
    padding-top: 21px;
  }
  .crm-topbar h1 {
    font-size: 27px;
  }
  .crm-tabs {
    border-radius: 14px;
    top: 70px;
  }
  .crm-tabs a {
    min-width: 50px;
    padding: 8px 11px;
  }
  .crm-tabs a span svg {
    width: 17px;
    height: 17px;
  }
  .summary-card {
    border-radius: 15px;
    min-height: 87px;
    padding: 14px 12px;
  }
  .summary-symbol {
    width: 38px;
    height: 38px;
  }
  .organization-list-card,
  .organization-form-card,
  .calendar-card {
    border-radius: 18px;
  }
  .organization-actions a,
  .organization-actions button {
    min-height: 38px;
  }
  .mobile-bottom-nav svg {
    stroke-width: 2px;
    width: 19px;
    height: 19px;
  }
  .mobile-bottom-nav .mobile-add span {
    box-shadow: 0 8px 22px #914f4957;
  }
  .mobile-top-actions svg {
    width: 18px;
    height: 18px;
  }
}

/* Son mobil uyumluluk katmanı — eski ve yeni iPhone'larda ortak görünüm */
@media (max-width: 430px) {
  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  body { min-width: 320px; overflow-x: hidden; }
  .crm-main {
    width: 100%; min-width: 0;
    padding: 18px 14px calc(104px + env(safe-area-inset-bottom));
  }
  .crm-topbar, .finance-page, .finance-summary,
  .organization-list-card, .organization-form-card, .calendar-card {
    min-width: 0; max-width: 100%;
  }
  .crm-topbar h1 { font-size: 25px; line-height: 1.12; }
  .crm-tabs {
    width: 100%; max-width: 100%; overflow-x: auto; scrollbar-width: none;
  }
  .crm-tabs::-webkit-scrollbar { display: none; }
  .crm-tabs a { flex: 0 0 auto; min-width: 48px; padding: 8px 9px; }
  .finance-page-heading { padding: 20px 17px; border-radius: 18px; }
  .finance-page-heading h2 { font-size: 23px; line-height: 1.15; }
  .finance-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px;
  }
  .finance-summary .summary-card,
  .finance-summary .summary-card:nth-child(n) {
    grid-column: auto; min-width: 0; min-height: 96px;
    padding: 13px 11px; border-radius: 16px;
  }
  .finance-summary .summary-symbol {
    width: 36px; height: 36px; flex: 0 0 36px;
  }
  .finance-summary .summary-card p { font-size: 10px; line-height: 1.25; }
  .finance-summary .summary-card strong.compact-value {
    max-width: 100%; font-size: clamp(15px, 4.4vw, 19px);
    line-height: 1.1; overflow-wrap: anywhere;
  }
  .mobile-bottom-nav, .mobile-bottom-nav.with-admin {
    right: 10px; bottom: calc(8px + env(safe-area-inset-bottom));
    left: 10px; width: auto; max-width: none; padding-bottom: 2px;
  }
  .mobile-bottom-nav a, .mobile-bottom-nav button { min-width: 0; }
  .mobile-bottom-nav small, .mobile-bottom-nav.with-admin small {
    max-width: 58px; font-size: 9px; white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis;
  }
}
@media (max-width: 375px) {
  .crm-main { padding-right: 11px; padding-left: 11px; }
  .finance-summary { gap: 8px; }
  .finance-summary .summary-card,
  .finance-summary .summary-card:nth-child(n) { padding: 12px 9px; }
}

/* Muhasebe mobil sıkı yerleşim — geniş/boş kartları kaldır */
@media (max-width: 760px) {
  .finance-page {
    gap: 12px;
  }

  .finance-page-heading {
    min-height: 0;
    padding: 16px 17px;
  }

  .finance-page-heading p {
    margin-bottom: 4px;
  }

  .finance-page-heading h2 {
    margin-bottom: 4px;
  }

  .finance-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin: 0;
  }

  .finance-summary .summary-card,
  .finance-summary .summary-card:nth-child(n) {
    grid-column: auto;
    width: auto;
    min-width: 0;
    min-height: 88px;
    height: 88px;
    gap: 9px;
    padding: 11px 10px;
  }

  .finance-summary .summary-symbol {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
  }

  .finance-summary .summary-card > div {
    min-width: 0;
  }

  .finance-summary .summary-card p {
    margin: 0 0 3px;
  }

  .finance-summary .summary-card:nth-child(5),
  .finance-summary .summary-card:nth-child(8) {
    color: var(--ink);
    background: linear-gradient(145deg, #fffefa, #f3eadc);
  }

  .finance-summary .summary-card:nth-child(5) p,
  .finance-summary .summary-card:nth-child(8) p {
    color: #888291;
  }

  .finance-summary .summary-card:nth-child(5) strong.compact-value,
  .finance-summary .summary-card:nth-child(8) strong.compact-value {
    color: #182033;
  }

  .finance-summary .summary-card:nth-child(5) .summary-symbol,
  .finance-summary .summary-card:nth-child(8) .summary-symbol {
    color: #fff;
    background: linear-gradient(145deg, #d18a68, #ae6343);
  }
}