/* Apply this class at root: <div class="clean-ui"> */

.clean-ui {
  --radius: 14px;
  --radius-sm: 10px;
}

  /* 🧱 Core surfaces */
  .clean-ui .mud-paper,
  .clean-ui .mud-card,
  .clean-ui .mud-dialog {
    border-radius: var(--radius) !important;
  }

  /* 🧩 Buttons */
  .clean-ui .mud-button-root {
    border-radius: var(--radius-sm) !important;
    text-transform: none;
    font-weight: 600;
  }

  /* 📝 Inputs */
  .clean-ui .mud-input-control,
  .clean-ui .mud-input,
  .clean-ui .mud-input-outlined,
  .clean-ui .mud-input-filled {
    border-radius: var(--radius) !important;
  }

  /* Fix outlined border radius */
  .clean-ui .mud-input-outlined-border {
    border-radius: var(--radius) !important;
  }

  /* 📦 Tables */
  .clean-ui .mud-table {
    border-radius: var(--radius) !important;
    overflow: hidden;
  }

  /* 🧭 AppBar & Drawer */
  .clean-ui .mud-appbar {
    border-radius: 0 0 var(--radius) var(--radius);
  }

  .clean-ui .mud-drawer {
    /*border-radius: 0 var(--radius) var(--radius) 0;*/
  }

  /* 🏷 Chips */
  .clean-ui .mud-chip {
    border-radius: 999px;
  }

  /* 🧊 Remove harsh Material feel */
  .clean-ui .mud-paper,
  .clean-ui .mud-card {
    border: 1px solid #e5e7eb;
  }

  /* ✨ Subtle hover polish */
  .clean-ui .mud-button-root:hover {
    filter: brightness(0.97);
  }