/**
 * Bejou — load last so rectangular UI is 1px even when core page CSS
 * (account.css, page-title-bar, legal, etc.) defines larger radii.
 * Circles stay 50%.
 */
:root {
  --sf-radius: 1px;
  --bs-border-radius: 1px;
  --bs-border-radius-sm: 1px;
  --bs-border-radius-lg: 1px;
  --bs-border-radius-xl: 1px;
  --bs-border-radius-2xl: 1px;
  --bs-border-radius-pill: 1px;
  --bs-btn-border-radius: 1px;
}

.account-page .form-control,
.account-page .form-select,
.account-page input,
.account-page textarea,
.account-page select,
.account-page .btn,
.account-page button,
.account-hub-page .form-control,
.account-hub-page .btn,
.account-hub-page button,
.account-flash,
.account-nav a,
.account-card,
.account-panel,
.account-order-card,
.account-thumb,
.account-avatar-upload,
.page-title-bar,
.form-control,
.form-select,
.modal-content,
.dropdown-menu,
.alert,
.card,
.badge:not(.rounded-circle),
.list-group-item,
.input-group-text,
.pagination .page-link,
.toast,
.popover,
.tooltip-inner {
  border-radius: 1px !important;
}

.rounded-pill,
.rounded-5,
.rounded-4,
.rounded-3,
.rounded-2,
.rounded-1 {
  border-radius: 1px !important;
}

.rounded-circle,
.shop-count,
.header-area .header-action-area .shop-button-group .shop-button-item .shop-button .shop-count,
.owl-theme .owl-dots .owl-dot span,
.swiper-pagination-bullet,
.fancybox-loading,
.slick-dots li button,
.product-color-list .color-item,
.product-color-list .color-item a,
.product-color-list .color-item span,
.pro-color-list .color-list-item,
.pro-color-list li a,
.color-list li a,
.scroll-to-top,
.scroll-to-top .scroll-icon,
.bejou-whatsapp,
.account-page .rounded-circle {
  border-radius: 50% !important;
}

/*
 * Signup phone: match checkout phone-combo exactly.
 * Loaded after storefront-auth.css so the old 2-col .sf-auth__phone grid cannot win.
 */
.sf-auth-page .sf-auth__phone {
  display: block !important;
  grid-template-columns: none !important;
  gap: 0 !important;
}

.sf-auth-page .bejou-phone-picker {
  margin-bottom: 16px;
}

.sf-auth-page .bejou-phone-picker .account-phone-combo-inner {
  border: 0.5px solid rgba(142, 143, 144, 0.6);
  border-radius: 1px;
  background-color: #fff;
  min-height: 52px;
  padding: 18px 20px 12px 16px;
  box-shadow: none;
}

.sf-auth-page .bejou-phone-picker:focus-within .account-phone-combo-inner,
.sf-auth-page .bejou-phone-picker.is-open .account-phone-combo-inner {
  border-color: #a08f72;
  box-shadow: 0 0 0 1px rgba(160, 143, 114, 0.25);
}

.sf-auth-page .bejou-phone-picker.is-invalid .account-phone-combo-inner {
  border-color: #c0392b;
}

.sf-auth-page .bejou-phone-picker .account-phone-combo-label {
  top: 0;
  left: 22px;
  transform: translateY(-50%) scale(0.86);
  font-size: 14px;
  color: var(--dark-accent-gold, #8f7858);
}

.sf-auth-page .bejou-phone-picker:focus-within .account-phone-combo-label {
  color: #8b7658;
}

.sf-auth-page .bejou-phone-picker .account-phone-combo-number,
.sf-auth-page .bejou-phone-picker .bejou-phone-picker__dial {
  font-size: 14px;
  font-weight: 400;
  color: #111;
}

.sf-auth-page .bejou-phone-picker .account-phone-combo-flag {
  width: 22px;
  height: 16px;
  border-radius: 1px;
}

.sf-auth-page .bejou-phone-picker .account-phone-combo-chevron {
  position: static;
  transform: none;
  flex-shrink: 0;
}