/*
 * 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%); }

.input-checkout,
.select-checkout {
  color: rgb(31 41 55 / var(--tw-text-opacity, 1));
  background-color: var(--fallback-sc,oklch(var(--sc)/1));
  line-height: 1rem;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

.input-checkout:focus,
.select-checkout:focus {
  outline-offset: 1px;
  outline-color: var(--fallback-n,oklch(var(--n)/.8));
  z-index: 2;
}

.input-checkout.input-error,
.select-checkout.select-error {
  z-index: 1
}

.input-checkout.input-error:focus,
.select-checkout.select-error:focus {
  --tw-border-opacity: 1;
  border-color: var(--fallback-er, oklch(var(--er) / var(--tw-border-opacity)));
  outline-color: var(--fallback-er, oklch(var(--er) / 1));
  z-index: 2;
}

.join .join-item.join-item-rounded-es:first-child:not(:last-child),
.join :first-child:not(:last-child) .join-item.join-item-rounded-es {
  border-start-start-radius: 0;
  border-start-end-radius: 0;
  border-end-start-radius: inherit;
  border-end-end-radius: 0;
}

.join .join-item.join-item-rounded-ee:last-child:not(:first-child),
.join :last-child:not(:first-child) .join-item.join-item-rounded-ee {
  border-start-start-radius: 0;
  border-start-end-radius: 0;
  border-end-start-radius: 0;
  border-end-end-radius: inherit;
}

.join .join-item.join-item-rounded-none.join-item-rounded-none.join-item-rounded-none {
  border-start-start-radius: 0;
  border-start-end-radius: 0;
  border-end-start-radius: 0;
  border-end-end-radius: 0;
}