/*
 * Aperina Address Book — address list and form (My Account), address picker (Checkout block).
 * Uses the Aperina theme's role tokens, with fallbacks so it works under any theme.
 */

/* =========================================================
   Address list
   ========================================================= */
.address-book__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3, 12px) var(--space-4, 16px); margin-block-end: var(--space-5, 20px); }
.address-book__intro { margin: 0; max-width: 44ch; font-size: var(--text-small, 0.9375rem); color: var(--text-muted, #6B6159); }
.address-book__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3, 12px); }
@media (min-width: 768px) { .address-book__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4, 16px); } }

.address-card { display: flex; flex-direction: column; gap: 2px; padding: var(--space-4, 16px) var(--space-5, 20px) var(--space-3, 12px); background: var(--bg-raised, #F7F3EE); border: 1px solid var(--border, #D1C7BD); }
.address-card.is-default { border-color: var(--primary, #72383D); box-shadow: inset 0 0 0 1px var(--primary, #72383D); }
.address-card__head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2, 8px); margin-block-end: var(--space-1, 4px); }
.address-card__label { margin: 0; font-size: var(--text-title, 1.25rem); font-weight: 600; line-height: 1.6; }
.address-card__badge { padding-inline: var(--space-3, 12px); border-radius: var(--radius-pill, 999px); background: var(--accent-tint, #E7D8D5); color: var(--on-accent-tint, #72383D); font-size: var(--text-micro, 0.75rem); font-weight: 500; line-height: 1.9; }
.address-card__line { margin: 0; font-size: var(--text-small, 0.9375rem); line-height: 1.9; }
.address-card__meta { margin: 0; font-size: var(--text-caption, 0.8125rem); line-height: 1.8; color: var(--text-muted, #6B6159); }
.address-card__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1, 4px) var(--space-4, 16px); margin-block-start: auto; padding-block-start: var(--space-3, 12px); }
.address-card__actions form { margin: 0; }
.address-card .address-card__edit { min-height: 44px; padding-inline: var(--space-5, 20px); }
.address-card__link {
  min-height: 44px; padding: 0 var(--space-1, 4px); border: 0; background: none; color: var(--text, #322D29);
  font: inherit; font-size: var(--text-label, 0.875rem); font-weight: 500; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.45em; cursor: pointer;
}
.address-card__link:hover { text-decoration-thickness: 2px; }
.address-card__link--danger { color: var(--error, #A1302A); }
.address-card__link:focus-visible { outline: 2px solid var(--focus-ring, #72383D); outline-offset: 2px; }

.address-book__empty { display: grid; justify-items: center; gap: var(--space-2, 8px); padding: var(--space-10, 40px) var(--space-4, 16px); text-align: center; border: 1px dashed var(--border-strong, #8A7E73); }
.address-book__empty svg { width: 40px; height: 40px; fill: none; stroke: var(--text-muted, #6B6159); stroke-width: 1.2; stroke-linejoin: round; }
.address-book__empty-title { margin: 0; font-size: var(--text-title, 1.25rem); font-weight: 600; }
.address-book__empty-text { margin: 0; max-width: 40ch; font-size: var(--text-small, 0.9375rem); color: var(--text-muted, #6B6159); }

/* =========================================================
   Address form: 6-column grid (full 6, half 3 from 640px, third 2)
   ========================================================= */
.address-form { max-width: 720px; }
.address-form__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--space-4, 16px) var(--space-3, 12px); }
.address-form__field { grid-column: span 6; display: grid; align-content: start; gap: 6px; margin: 0; }
.address-form__field--third { grid-column: span 2; }
@media (min-width: 640px) { .address-form__field--half { grid-column: span 3; } }
.address-form__field label { font-size: var(--text-label, 0.875rem); font-weight: 500; line-height: 1.6; }
.address-form__optional { font-weight: 400; color: var(--text-muted, #6B6159); }
.address-form :is(input[type="text"], input[type="tel"], select, textarea) {
  width: 100%; min-height: 48px; padding: 10px var(--space-4, 16px); border: 1px solid var(--border-strong, #8A7E73); border-radius: var(--radius-field, 8px);
  background-color: var(--bg-raised, #F7F3EE); color: var(--text, #322D29); font: inherit; font-size: var(--text-body, 1rem);
}
.address-form textarea { resize: vertical; line-height: 1.9; }
.address-form :is(input, select, textarea)::placeholder { color: var(--text-subtle, #8A7E73); }
.address-form :is(input, select, textarea):focus { border-color: var(--text, #322D29); box-shadow: 0 0 0 3px color-mix(in oklab, var(--focus-ring, #72383D) 22%, transparent); outline: none; }
.address-form__field.has-error :is(input, select, textarea) { border-color: var(--error, #A1302A); }
.address-form__hint { font-size: var(--text-caption, 0.8125rem); color: var(--text-muted, #6B6159); }
.address-form__error { font-size: var(--text-caption, 0.8125rem); line-height: 1.7; color: var(--error, #A1302A); }
.address-form__check { display: flex; align-items: center; gap: var(--space-2, 8px); min-height: 44px; margin-block: var(--space-4, 16px) 0; font-size: var(--text-small, 0.9375rem); cursor: pointer; }
.address-form__check input { width: 20px; height: 20px; margin: 0; accent-color: var(--primary, #72383D); }
.address-form__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3, 12px) var(--space-5, 20px); margin-block-start: var(--space-5, 20px); }
.address-form__cancel { color: var(--text-muted, #6B6159); font-size: var(--text-label, 0.875rem); }

/* =========================================================
   Checkout: picker (choice cards) replaces the delivery form when the customer has addresses
   ========================================================= */
.has-address-book .wc-block-checkout__shipping-fields { display: none; }
.address-picker { min-width: 0; margin: 0 0 var(--space-8, 32px); padding: 0; border: 0; }
.address-picker__title { padding: 0; margin-block-end: var(--space-3, 12px); font-size: var(--text-title, 1.25rem); font-weight: 600; line-height: 1.6; }
.address-picker__list { display: grid; gap: var(--space-2, 8px); }
.address-picker__option {
  display: flex; align-items: flex-start; gap: var(--space-2, 8px); padding: var(--space-3, 12px) var(--space-4, 16px);
  border: 1px solid var(--border-strong, #8A7E73); border-radius: var(--radius-field, 8px); background: var(--bg-raised, #F7F3EE);
  transition: background-color var(--dur-base, 240ms) var(--ease-out, ease), border-color var(--dur-base, 240ms) var(--ease-out, ease);
}
.address-picker__option:hover { border-color: var(--text, #322D29); }
.address-picker__option.is-selected { background: var(--accent-tint, #E7D8D5); border-color: var(--primary, #72383D); box-shadow: inset 0 0 0 1px var(--primary, #72383D); }
.address-picker__choice { flex: 1; display: flex; align-items: flex-start; gap: var(--space-3, 12px); min-width: 0; cursor: pointer; }
.address-picker__choice input { flex: none; width: 20px; height: 20px; margin: 5px 0 0; accent-color: var(--primary, #72383D); }
.address-picker__text { display: grid; gap: 2px; min-width: 0; }
.address-picker__label { font-size: var(--text-body, 1rem); font-weight: 600; line-height: 1.7; }
.address-picker__line { font-size: var(--text-small, 0.9375rem); line-height: 1.8; }
.address-picker__meta { font-size: var(--text-caption, 0.8125rem); line-height: 1.7; color: var(--text-muted, #6B6159); }
.address-picker__option:has(input:focus-visible) { outline: 2px solid var(--focus-ring, #72383D); outline-offset: 2px; }
.address-picker__edit, .address-picker__add {
  display: inline-flex; align-items: center; min-height: 44px; color: var(--link, #72383D);
  font-size: var(--text-label, 0.875rem); font-weight: 500; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.45em;
}
.address-picker__edit { padding-inline: var(--space-2, 8px); }
.address-picker__add { margin-block-start: var(--space-2, 8px); }
.address-picker__actions { flex: none; display: flex; flex-direction: column; align-items: flex-end; justify-content: center; }
.address-picker__map {
  min-height: 44px; padding-inline: var(--space-2, 8px); border: 0; background: none; color: var(--link, #72383D); font: inherit;
  font-size: var(--text-label, 0.875rem); font-weight: 500; text-decoration: underline; text-decoration-thickness: 1px;
  text-underline-offset: 0.45em; white-space: nowrap; cursor: pointer;
}
.address-picker__map:hover { text-decoration-thickness: 2px; }
.address-picker__map:focus-visible { outline: 2px solid var(--focus-ring, #72383D); outline-offset: 2px; }

/* Whether the courier has a point for this address. */
.address-picker__point {
  display: flex; align-items: center; gap: var(--space-1, 4px); margin-block-start: 2px;
  font-size: var(--text-caption, 0.8125rem); line-height: 1.7; color: var(--text-muted, #6B6159);
}
.address-picker__point.is-set { color: var(--success, #4F6B45); }
.address-picker__tick { flex: none; width: 15px; height: 15px; }

/* =========================================================
   Checkout: «موقعیت روی نقشه» (assets/point.js)
   ========================================================= */
.address-point {
  display: grid; gap: var(--space-3, 12px); margin: 0 0 var(--space-8, 32px); padding: var(--space-4, 16px);
  border: 1px solid var(--border, #D1C7BD); border-radius: var(--radius-field, 8px); background: var(--bg-raised, #F7F3EE);
}
.address-point__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2, 8px); }
.address-point__title { margin: 0; font-size: var(--text-title, 1.25rem); font-weight: 600; line-height: 1.6; }
.address-point__toggle {
  min-height: 44px; padding: 0; border: 0; background: none; color: var(--link, #72383D); font: inherit;
  font-size: var(--text-label, 0.875rem); font-weight: 500; text-decoration: underline; text-decoration-thickness: 1px;
  text-underline-offset: 0.45em; cursor: pointer;
}
.address-point__toggle:hover { text-decoration-thickness: 2px; }
.address-point__toggle:focus-visible { outline: 2px solid var(--focus-ring, #72383D); outline-offset: 2px; }
.address-point__lead { margin: 0; font-size: var(--text-small, 0.9375rem); line-height: 1.9; color: var(--text-muted, #6B6159); }
.address-point__done { display: flex; align-items: center; gap: var(--space-2, 8px); margin: 0; font-size: var(--text-small, 0.9375rem); line-height: 1.9; }
.address-point__tick { flex: none; width: 20px; height: 20px; color: var(--success, #4F6B45); }
.address-point__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3, 12px); }
.address-point__confirm {
  min-height: 48px; padding-inline: var(--space-6, 24px); border: 1px solid var(--primary, #72383D); border-radius: var(--radius-cta, 14px);
  background: var(--primary, #72383D); color: var(--on-primary, #FCF8F3); font: inherit; font-size: var(--text-label, 0.875rem);
  font-weight: 600; cursor: pointer; transition: background-color var(--dur-base, 240ms) var(--ease-out, ease);
}
.address-point__confirm:hover:not([disabled]) { background: var(--primary-hover, #5B2C30); border-color: var(--primary-hover, #5B2C30); }
.address-point__confirm[disabled] { opacity: 0.45; cursor: default; }
.address-point__confirm:focus-visible { outline: 2px solid var(--focus-ring, #72383D); outline-offset: 2px; }
.address-point__state { font-size: var(--text-caption, 0.8125rem); color: var(--text-muted, #6B6159); }
.address-point__error { margin: 0; font-size: var(--text-caption, 0.8125rem); line-height: 1.7; color: var(--error, #A1302A); }
@media (min-width: 768px) { .address-point .aperina-map { height: 280px; } }

/* The address form's map sits in the grid like any other field. */
.address-form__legend { font-size: var(--text-label, 0.875rem); font-weight: 500; line-height: 1.6; }
.address-form__map-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2, 8px) var(--space-3, 12px); }
.address-form__map-confirm {
  min-height: 44px; padding-inline: var(--space-5, 20px); border: 1px solid var(--border-strong, #8A7E73);
  border-radius: var(--radius-cta, 14px); background: var(--bg, #FCF8F3); color: var(--text, #322D29); font: inherit;
  font-size: var(--text-label, 0.875rem); font-weight: 500; cursor: pointer;
}
.address-form__map-confirm:hover { border-color: var(--text, #322D29); }
.address-form__map-confirm:focus-visible { outline: 2px solid var(--focus-ring, #72383D); outline-offset: 2px; }
.address-form__map-state { font-size: var(--text-caption, 0.8125rem); color: var(--success, #4F6B45); }
.address-form__field.has-error .aperina-map { border-color: var(--error, #A1302A); }

/* «محدوده‌ی فروش» (includes/area.php): where the shop delivers, said once above the address fields. */
.checkout-area-note { margin: 0 0 var(--space-4); font-size: var(--text-caption); line-height: var(--lh-caption); color: var(--text-muted); }
