/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Daisy overrides */

.label {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}

.card-bordered > .overflow-x-auto > .table tbody tr:last-child {
  border-bottom: 0;
}

/* EveryLayout - Grid */

.l-grid {
  display: grid;
}

@supports (width: min(1rem, 100%)) {
  .l-grid-40 { grid-template-columns: repeat(auto-fit, minmax(min(10rem, 100%), 1fr)); }
  .l-grid-44 { grid-template-columns: repeat(auto-fit, minmax(min(11rem, 100%), 1fr)); }
  .l-grid-48 { grid-template-columns: repeat(auto-fit, minmax(min(12rem, 100%), 1fr)); }
  .l-grid-52 { grid-template-columns: repeat(auto-fit, minmax(min(13rem, 100%), 1fr)); }
  .l-grid-56 { grid-template-columns: repeat(auto-fit, minmax(min(14rem, 100%), 1fr)); }
  .l-grid-60 { grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); }
  .l-grid-64 { grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr)); }
  .l-grid-72 { grid-template-columns: repeat(auto-fit, minmax(min(18rem, 100%), 1fr)); }
  .l-grid-80 { grid-template-columns: repeat(auto-fit, minmax(min(20rem, 100%), 1fr)); }
  .l-grid-96 { grid-template-columns: repeat(auto-fit, minmax(min(24rem, 100%), 1fr)); }
}

/* Custom components */

.form-controls { /* TW: .flex.flex-wrap.gap-4 */
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.form-control-full { flex: 1 1 clamp(28ch, 100%, 100%); }

.form-control-1\/3 { flex: 1 1 clamp(28ch, calc(33.3333% - 1rem), 100%); }
.form-control-2\/3 { flex: 1 1 clamp(28ch, calc(66.6666% - 0.5rem), 100%); }

.form-control-1\/4 { flex: 1 1 clamp(28ch, calc(25% - 1rem), 100%); }
.form-control-2\/4,
.form-control-1\/2 { flex: 1 1 clamp(28ch, calc(50% - 0.5rem), 100%); }
.form-control-3\/4 { flex: 1 1 clamp(28ch, calc(75% - 0.5rem), 100%); }