@import "tailwindcss/theme";
@import "tailwindcss/utilities";

@source "../.././*.php";
@source "../../admin/**/*.php";
@source "../../includes/**/*.php";
@source "../../assets/**/*.js";

@layer components {
  .afb-admin-shell {
    @apply w-full my-6 p-4 md:p-6 rounded-2xl border border-slate-200 bg-slate-50 shadow-sm;
    margin-bottom: 2rem;
  }

  .afb-admin-hero {
    @apply rounded-2xl p-5 md:p-6 bg-white text-slate-900 border border-slate-700;
  }

  .afb-admin-card {
    @apply rounded-xl border border-slate-200 bg-white shadow-sm;
  }

  .afb-admin-card-pad {
    @apply p-4 md:p-5;
  }

  .afb-builder-item {
    @apply rounded-xl border border-slate-200 bg-white shadow-sm overflow-hidden;
  }

  .afb-builder-item-header {
    @apply flex items-center gap-3 px-4 py-3 bg-slate-50 border-b border-slate-200;
  }

  .afb-builder-item-body {
    @apply p-4 md:p-5 space-y-4;
  }

  .afb-builder-item.is-collapsed .afb-builder-item-body {
    @apply hidden;
  }

  .afb-handle {
    @apply inline-flex items-center justify-center h-8 w-8 rounded-lg border border-slate-200 bg-white text-slate-500;
  }

  .afb-item-title {
    @apply text-sm font-semibold text-slate-900;
  }

  .afb-item-subtitle {
    @apply text-xs text-slate-500;
  }

  .afb-item-flags {
    @apply mt-1 text-[11px] text-slate-500 truncate;
  }

  .afb-item-flags .is-empty {
    @apply text-slate-400;
  }

  .afb-chip {
    @apply inline-flex items-center rounded-md border px-2 py-0.5 text-[11px] font-medium;
  }

  .afb-chip-field {
    @apply bg-slate-50 text-slate-700 border-slate-200;
  }

  .afb-chip-paragraph {
    @apply bg-blue-50 text-blue-700 border-blue-200;
  }

  .afb-chip-section {
    @apply bg-amber-50 text-amber-800 border-amber-200;
  }

  .afb-admin-btn {
    @apply inline-flex items-center justify-center gap-2 h-9 px-3 rounded-lg text-sm font-medium border border-slate-300 bg-white text-slate-800 hover:bg-slate-50;
  }

  .afb-admin-btn-primary {
    @apply inline-flex items-center justify-center gap-2 h-9 px-3 rounded-lg text-sm font-medium bg-slate-900 text-white hover:bg-slate-800;
  }

  .afb-admin-input,
  .afb-admin-textarea,
  .afb-admin-select {
    @apply w-full rounded-lg border border-slate-300 bg-white text-sm text-slate-900;
  }

  .afb-admin-input,
  .afb-admin-select {
    @apply h-10 px-3;
  }

  .afb-admin-textarea {
    @apply p-3;
  }

  .afb-admin-check {
    @apply h-4 w-4 rounded border-slate-300;
  }

  .afb-admin-kbd {
    @apply inline-block px-1.5 py-0.5 rounded bg-slate-100 border border-slate-200 text-[11px] text-slate-600;
  }
}

#field-available .afb-builder-item {
  @apply bg-slate-50 border-slate-200;
}

#field-sortable .afb-builder-item[data-kind="section"] {
  border-color: #fcd9b6;
  background: #fffaf3;
}

#field-sortable .afb-builder-item[data-kind="section"] .afb-builder-item-header {
  background: #fff3e3;
  border-bottom-color: #fcd9b6;
}

#field-sortable .afb-builder-item[data-kind="section"] .afb-handle {
  border-color: #fcd9b6;
  background: #ffffff;
  color: #b45309;
}

#field-sortable .afb-builder-item[data-kind="section"] .afb-item-subtitle,
#field-sortable .afb-builder-item[data-kind="section"] .afb-item-flags {
  color: #9a3412;
}

#field-sortable .afb-builder-item.is-under-collapsed-section {
  display: none;
}

#field-available .afb-builder-item-body {
  display: none;
}

#field-available .afb-collapse-toggle,
#field-available .remove-builder-item {
  display: none;
}

#field-sortable .afb-add-to-form {
  display: none;
}

#field-available .afb-add-to-form {
  display: inline-flex;
}

#field-available .afb-handle {
  opacity: 0.5;
}

#field-sortable .afb-builder-item .afb-collapse-toggle {
  border-color: #86efac;
  background: #f0fdf4;
  color: #166534;
}

#field-sortable .afb-builder-item .afb-collapse-toggle:hover {
  background: #dcfce7;
}

#field-sortable .afb-builder-item .remove-builder-item {
  border-color: #fecaca;
  background: #fef2f2;
  color: #991b1b;
}

#field-sortable .afb-builder-item .remove-builder-item:hover {
  background: #fee2e2;
}

.afb-builder-item-header .afb-add-to-form,
.afb-builder-item-header .afb-collapse-toggle,
.afb-builder-item-header .afb-duplicate-item,
.afb-builder-item-header .remove-builder-item,
.afb-builder-item-header .afb-move-section-up,
.afb-builder-item-header .afb-move-section-down {
  --afb-icon-plus: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='white'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M12%205v14M5%2012h14'/%3E%3C/svg%3E");
  --afb-icon-chevron-down: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='white'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M6%209l6%206%206-6'/%3E%3C/svg%3E");
  --afb-icon-chevron-up: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='white'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M18%2015l-6-6-6%206'/%3E%3C/svg%3E");
  --afb-icon-arrow-up: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='white'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M12%205l-5%205M12%205l5%205M12%205v14'/%3E%3C/svg%3E");
  --afb-icon-arrow-down: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='white'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M12%2019l-5-5M12%2019l5-5M12%205v14'/%3E%3C/svg%3E");
  --afb-icon-duplicate: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='white'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='8'%20y='8'%20width='10'%20height='10'%20rx='2'/%3E%3Cpath%20d='M6%2014H5a2%202%200%200%201-2-2V5a2%202%200%200%201%202-2h7a2%202%200%200%201%202%202v1'/%3E%3C/svg%3E");
  --afb-icon-xmark: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='white'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M6%206l12%2012M18%206l-12%2012'/%3E%3C/svg%3E");
  position: relative;
  width: 38px;
  min-width: 38px;
  padding: 0;
  gap: 0;
  font-size: 0;
  line-height: 0;
}

.afb-builder-item-header .afb-move-section-up:disabled,
.afb-builder-item-header .afb-move-section-down:disabled {
  opacity: 0.45;
}

.afb-builder-item-header .afb-add-to-form::before,
.afb-builder-item-header .afb-collapse-toggle::before,
.afb-builder-item-header .afb-duplicate-item::before,
.afb-builder-item-header .remove-builder-item::before,
.afb-builder-item-header .afb-move-section-up::before,
.afb-builder-item-header .afb-move-section-down::before,
.afb-add-block-action::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 18px;
  height: 18px;
  background-color: currentColor;
  -webkit-mask-image: var(--afb-btn-icon);
  mask-image: var(--afb-btn-icon);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 18px 18px;
  mask-size: 18px 18px;
}

.afb-builder-item-header .afb-add-to-form::before {
  --afb-btn-icon: var(--afb-icon-plus);
}

.afb-builder-item-header .afb-move-section-up::before {
  --afb-btn-icon: var(--afb-icon-arrow-up);
}

.afb-builder-item-header .afb-move-section-down::before {
  --afb-btn-icon: var(--afb-icon-arrow-down);
}

.afb-builder-item.is-collapsed .afb-builder-item-header .afb-collapse-toggle::before {
  --afb-btn-icon: var(--afb-icon-chevron-down);
}

.afb-builder-item:not(.is-collapsed) .afb-builder-item-header .afb-collapse-toggle::before {
  --afb-btn-icon: var(--afb-icon-chevron-up);
}

.afb-builder-item-header .afb-duplicate-item::before {
  --afb-btn-icon: var(--afb-icon-duplicate);
}

.afb-builder-item-header .remove-builder-item::before {
  --afb-btn-icon: var(--afb-icon-xmark);
}

.afb-add-block {
  width: 100%;
  text-align: left;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "title action"
    "sub action";
  gap: 2px 10px;
  border: 1px solid #cbd5e1;
  border-radius: 12px;
  background: #f8fafc;
  padding: 10px 12px;
  cursor: pointer;
}

.afb-add-block:hover {
  background: #f1f5f9;
}

.afb-add-block-title {
  grid-area: title;
  font-size: 13px;
  font-weight: 600;
  color: #0f172a;
}

.afb-add-block-sub {
  grid-area: sub;
  font-size: 11px;
  color: #64748b;
}

.afb-add-block-action {
  --afb-icon-plus: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='white'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M12%205v14M5%2012h14'/%3E%3C/svg%3E");
  --afb-btn-icon: var(--afb-icon-plus);
  grid-area: action;
  position: relative;
  align-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  min-width: 36px;
  width: 36px;
  border: 1px solid #94a3b8;
  border-radius: 9px;
  background: #fff;
  color: #0f172a;
  font-size: 0;
  line-height: 0;
  padding: 0;
}

.afb-add-block-action::before {
  -webkit-mask-size: 17px 17px;
  mask-size: 17px 17px;
}

.afb-flow-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr;
}

@media (min-width: 1024px) {
  .afb-flow-grid {
    grid-template-columns: 440px minmax(0, 1fr);
  }
}

#wpcontent .wrap h1.afb-hide-default-title {
  display: none;
}

#wpbody-content {
  padding-bottom: 0;
}

#wpfooter {
  position: static;
  margin-top: 1rem;
}

/* ── Page toolbar ───────────────────────────────────────── */
.afb-page-toolbar {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 14px 20px;
  border-bottom: 1px solid #e2e8f0;
  flex-wrap: wrap;
}

.afb-toolbar-project {
  flex-shrink: 0;
  padding-right: 1.25rem;
  border-right: 1px solid #e2e8f0;
}

.afb-toolbar-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #94a3b8;
  margin: 0 0 2px;
}

.afb-toolbar-title {
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
  margin: 0;
  white-space: nowrap;
}

.afb-toolbar-form-title {
  flex: 1 1 200px;
  min-width: 0;
}

.afb-toolbar-input-label {
  display: block;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #94a3b8;
  margin: 0 0 4px;
}

.afb-toolbar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  margin-left: auto;
}

.afb-toolbar-count {
  font-size: 12px;
  color: #64748b;
  padding-right: 12px;
  border-right: 1px solid #e2e8f0;
  margin-right: 4px;
  white-space: nowrap;
}

.afb-toolbar-count strong {
  font-weight: 700;
  color: #0f172a;
}

/* ── Flag toggle checkboxes ─────────────────────────────── */
.afb-flag-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #fff;
  font-size: 13px;
  font-weight: 500;
  color: #475569;
  cursor: pointer;
  user-select: none;
  transition: border-color 0.12s, background 0.12s, color 0.12s;
}
.afb-flag-toggle:hover {
  background: #f8fafc;
  border-color: #cbd5e1;
}
.afb-flag-toggle:has(input:checked) {
  background: #eff6ff;
  border-color: #93c5fd;
  color: #1d4ed8;
}

/* ── Conditions section ──────────────────────────────────── */
.afb-cond-section {
  border-radius: 12px;
  border: 1px solid #fde68a;
  background: #fffbeb;
  overflow: hidden;
}
.afb-cond-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 14px;
  background: #fef9c3;
  border-bottom: 1px solid #fde68a;
}
.afb-cond-header-title {
  display: flex;
  align-items: center;
  gap: 6px;
}
.afb-cond-header-title svg {
  color: #b45309;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
}
.afb-cond-header-title span {
  font-size: 13px;
  font-weight: 600;
  color: #92400e;
}
.afb-cond-header-controls {
  display: flex;
  align-items: center;
  gap: 8px;
}
.afb-cond-logic-select {
  height: 30px;
  padding: 0 8px;
  border-radius: 6px;
  border: 1px solid #fcd34d;
  background: #fff;
  font-size: 12px;
  color: #44403c;
  min-width: 100px;
}
.afb-cond-add-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 30px;
  padding: 0 12px;
  border-radius: 6px;
  border: 1px solid #f59e0b;
  background: #f59e0b;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.afb-cond-add-btn:hover {
  background: #d97706;
  border-color: #d97706;
}

.afb-cond-header-controls .afb-section-toggle {
  height: 30px;
  padding: 0 10px;
  border-radius: 6px;
  border: 1px solid #fcd34d;
  background: #fff;
  color: #92400e;
  font-size: 12px;
}

.afb-cond-header-controls .afb-section-toggle:hover {
  background: #fffbeb;
}

.afb-cond-body {
  padding: 12px 14px;
}

/* ── Shared collapsible section state ───────────────────── */
.afb-collapsible-section .afb-collapsible-body {
  display: none;
}

.afb-collapsible-section.is-expanded .afb-collapsible-body {
  display: block;
}

/* Individual condition rule card */
.afb-cond-rule-card {
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #fff;
  padding: 10px 12px;
}
.afb-cond-values-wrap {
  display: flex;
  flex-direction: column;
}

/* Expected values multi-select */
.expected-value-dropdown {
  width: 100%;
  border-radius: 8px;
  border: 1px solid #cbd5e1;
  background: #fff;
  font-size: 13px;
  color: #0f172a;
  min-height: 88px;
  padding: 4px;
}

/* Condition remove button (icon-only) */
.afb-cond-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 28px;
  width: 28px;
  padding: 0;
  border-radius: 6px;
  border: 1px solid #fecaca;
  background: #fef2f2;
  color: #dc2626;
  font-size: 0;
  line-height: 0;
  cursor: pointer;
  position: relative;
}
.afb-cond-remove:hover {
  background: #fee2e2;
  border-color: #f87171;
}
.afb-cond-remove::before {
  content: '';
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  width: 14px; height: 14px;
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6l12 12M18 6l-12 12'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6l12 12M18 6l-12 12'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
  -webkit-mask-size: 14px; mask-size: 14px;
}

/* ── Visible options select wrapper ──────────────────────── */
.afb-visible-options-wrap {
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  overflow: hidden;
  background: #fff;
}
.afb-visible-options-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 7px 10px;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}
.afb-visible-options-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #64748b;
}
.afb-visible-options-actions {
  display: flex;
  gap: 6px;
}

.afb-visible-options-actions-body {
  justify-content: flex-end;
  padding: 8px 8px 0;
}
.afb-visible-options-btn {
  font-size: 11px;
  padding: 2px 8px;
  height: 22px;
  border-radius: 4px;
  border: 1px solid #e2e8f0;
  background: #fff;
  color: #475569;
  cursor: pointer;
}
.afb-visible-options-btn:hover {
  background: #f1f5f9;
}
.afb-visible-options-wrap select {
  display: block;
  width: 100%;
  border: none !important;
  border-radius: 0 !important;
  background: #fff;
  padding: 6px 8px;
  font-size: 13px;
}

/* ── Option mapping section ──────────────────────────────── */
.afb-optmap-section {
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #fff;
  overflow: hidden;
}

.afb-optmap-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 10px;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.afb-optmap-toolbar > label {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #64748b !important;
  margin-bottom: 0 !important;
}

.afb-optmap-body .afb-admin-select:not(.afb-option-filter-allowed) {
  margin: 10px 10px 0;
  width: calc(100% - 20px);
}

.afb-optmap-body .afb-option-filter-rows {
  padding: 8px 10px;
}

.afb-optmap-body > p {
  padding: 0 10px;
  margin-bottom: 10px !important;
}

/* Option filter rows */
.afb-option-filter-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  gap: 8px;
  align-items: start;
  padding: 8px;
  border-radius: 6px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  margin-bottom: 6px;
}
.afb-option-filter-row:last-child {
  margin-bottom: 0;
}

.afb-add-block-toggle { cursor: default; }
.afb-add-block-action-toggle { gap: 8px; min-width: unset; padding: 0 12px; }
.afb-add-block-action-toggle .afb-admin-check { margin: 0; }

.expected-value-dropdown {
  @apply w-full rounded-lg border border-slate-200 bg-white text-sm text-slate-900;
  height: auto;
  min-height: 80px;
  max-height: 164px;
  overflow-y: auto;
  padding: 4px;
  outline: none;
}

.expected-value-dropdown:focus {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12);
}

.expected-value-dropdown option {
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 13px;
  color: #0f172a;
  cursor: pointer;
  line-height: 1.5;
}

.expected-value-dropdown option:checked {
  /* linear-gradient trick keeps blue bg in all browsers */
  background: linear-gradient(0deg, #2563eb 0%, #2563eb 100%);
  color: #fff;
}

/* ── Field body layout polish ───────────────────────────── */
.afb-builder-item-body .afb-flags-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 20px;
}

.afb-builder-item-body .afb-flags-row label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #334155;
  cursor: pointer;
}

/* Paragraph editor preview styles.
   Tailwind/util resets can flatten list and heading defaults, so define them explicitly here. */
.afb-paragraph-wysiwyg {
  line-height: 1.6;
}

.afb-paragraph-wysiwyg p {
  margin: 0 0 0.55em;
}

.afb-paragraph-wysiwyg p:last-child {
  margin-bottom: 0;
}

.afb-paragraph-wysiwyg strong,
.afb-paragraph-wysiwyg b {
  font-weight: 700;
}

.afb-paragraph-wysiwyg h1,
.afb-paragraph-wysiwyg h2,
.afb-paragraph-wysiwyg h3,
.afb-paragraph-wysiwyg h4,
.afb-paragraph-wysiwyg h5,
.afb-paragraph-wysiwyg h6 {
  margin: 0.65em 0 0.35em;
  font-weight: 700;
  line-height: 1.3;
  color: #0f172a;
}

.afb-paragraph-wysiwyg h1 { font-size: 1.55rem; }
.afb-paragraph-wysiwyg h2 { font-size: 1.35rem; }
.afb-paragraph-wysiwyg h3 { font-size: 1.15rem; }
.afb-paragraph-wysiwyg h4 { font-size: 1.05rem; }
.afb-paragraph-wysiwyg h5,
.afb-paragraph-wysiwyg h6 { font-size: 1rem; }

.afb-paragraph-wysiwyg ul,
.afb-paragraph-wysiwyg ol {
  margin: 0.55em 0 0.75em;
  padding-left: 1.45em;
}

.afb-paragraph-wysiwyg ul {
  list-style: disc outside;
}

.afb-paragraph-wysiwyg ol {
  list-style: decimal outside;
}

.afb-paragraph-wysiwyg li {
  margin: 0.2em 0;
}
