/*
 * Application-wide styles loaded after Tailwind/DaisyUI.
 * Prefer Tailwind utilities in templates; use this file for layout rules
 * that are awkward to express as utilities.
 */

.clipboard-fallback-textarea {
  position: fixed;
  left: -9999px;
  opacity: 0;
}

.auth-captcha {
  width: 100%;
  overflow: hidden;
  min-width: 0;
}

/* Centre the fixed-width hCaptcha iframe within its full-width container. */
.h-captcha {
  display: flex;
  justify-content: center;
}

.auth-captcha .h-captcha {
  width: 100%;
  max-width: 100%;
}

.h-captcha-spinner {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 78px;
}

.auth-form-card .fieldset {
  min-width: 0;
}

.auth-form-card .fieldset > * {
  min-width: 0;
}

.auth-form-card .fieldset div.label {
  display: block;
  white-space: normal;
}

.auth-form-card .input {
  max-width: 100%;
}

.period-stats .stat:not(:last-child) {
  border-inline-end: none;
}

/* DetailsTableComponent — theme-agnostic, usable in any layout (not admin-only). */
.details-table {
  border-collapse: collapse;
}

.details-table tbody tr {
  border-bottom: 1px solid color-mix(in oklch, var(--color-base-content) 20%, transparent);
}

.details-table tbody tr.bg-base-200 {
  border-bottom: 2px solid color-mix(in oklch, var(--color-base-content) 20%, transparent);
}

.details-table tbody td,
.details-table tbody th {
  border-top: none;
  border-left: none;
  border-right: none;
  padding: 0.5rem 1rem;
}

/* SearchFormComponent / IndexToolbarComponent — theme-agnostic, usable in any layout. */
.search-form {
  width: 100%;
}

.search-form .join {
  width: 100%;
  min-width: 0;
}

@media (min-width: 40rem) {
  .search-form .join {
    min-width: 14rem;
  }
}

.pagination-search-row .pagination-search-row__pagination {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  margin: 0;
  padding: 0;
}

.pagination-search-row .search-form {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  max-width: 100%;
}

@media (min-width: 40rem) {
  .pagination-search-row .search-form {
    flex: 1 1 14rem;
    min-width: 14rem;
  }
}

.pagination-search-row .search-form .join {
  min-width: 6rem;
}