/* ==========================================================================
   MY PROFILE & ACCOUNT DASHBOARD STYLES (ISOLATED NAMESPACE: prf-*)
   ========================================================================== */

/* Profile Header / Banner */
.prf-hero-section {
  padding: 30px 0 20px;
  background-color: var(--color-white);
}

.prf-hero-box {
  background: #FAF6F0;
  border: 1px solid #EAE2D8;
  border-radius: 16px;
  padding: 32px;
}

.prf-avatar-wrap {
  position: relative;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  border: 3px solid #ffffff;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  flex-shrink: 0;
}

.prf-avatar-img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}

.prf-avatar-upload-btn {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #000000;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  cursor: pointer;
  border: 2px solid #ffffff;
  transition: background 0.2s ease;
}

.prf-avatar-upload-btn:hover {
  background: var(--color-primary, var(--color-primary));
}

.prf-user-name {
  font-family: 'Playfair Display', serif;
  font-size: 26px;
  font-weight: 600;
  color: #222222;
  margin-bottom: 4px;
}

.prf-user-email {
  font-family: var(--font-body);
  font-size: 14px;
  color: #666666;
}

/* Sidebar Navigation */
.prf-sidebar-card {
  background: #FAF6F0;
  border: 1px solid #EAE2D8;
  border-radius: 12px;
  padding: 20px 16px;
}

.prf-nav-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.prf-nav-item {
  margin-bottom: 6px;
}

.prf-nav-item:last-child {
  margin-bottom: 0;
}

.prf-nav-link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  border-radius: 8px;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  color: #444444;
  text-decoration: none !important;
  transition: all 0.2s ease;
}

.prf-nav-link i {
  font-size: 16px;
  color: #888888;
  width: 20px;
  text-align: center;
  transition: color 0.2s ease;
}

.prf-nav-link:hover {
  background: #ffffff;
  color: #222222;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
}

.prf-nav-link:hover i {
  color: var(--color-primary, var(--color-primary));
}

.prf-nav-link.active {
  background: #000000;
  color: #ffffff !important;
}

.prf-nav-link.active i {
  color: #ffffff !important;
}

/* Profile Form & Content Box */
.prf-content-card {
  background: #ffffff;
  border: 1px solid #EAEAEA;
  border-radius: 12px;
  padding: 32px 36px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03);
}

@media (max-width: 575px) {
  .prf-content-card {
    padding: 20px;
  }
}

.prf-card-header {
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px dashed #E5DCD0;
}

.prf-card-title {
  font-family: var(--font-body);
  font-size: 20px;
  font-weight: 600;
  color: #222222;
  margin-bottom: 4px;
}

.prf-card-subtitle {
  font-size: 13.5px;
  color: #777777;
  margin: 0;
}

.prf-label {
  font-family: var(--font-body);
  font-size: 12.5px;
  font-weight: 600;
  color: #444444;
  margin-bottom: 6px;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.prf-input {
  background: #ffffff !important;
  border: 1px solid #EAE2D8 !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  font-size: 14px !important;
  color: #222222 !important;
  width: 100%;
  box-shadow: none !important;
  transition: border-color 0.2s ease;
}

.prf-input:focus {
  border-color: var(--color-primary) !important;
  outline: none !important;
}

.prf-input:read-only {
  background: #f8f9fa !important;
  color: #777777 !important;
}

.prf-submit-btn {
  background: #000000;
  color: #ffffff !important;
  padding: 14px 28px;
  border-radius: 8px;
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  border: none;
  cursor: pointer;
  transition: background 0.2s ease;
}

.prf-submit-btn:hover {
  background: var(--color-primary, var(--color-primary));
  color: #ffffff !important;
}

/* intl-tel-input (Phone Number Field) Fixes */
.phone-input-w-100 {
  width: 100% !important;
}

.phone-input-w-100 .iti,
.iti {
  width: 100% !important;
  display: block !important;
  position: relative !important;
}

.iti input,
.iti input.form-control,
.iti input.prf-input,
.iti input.chk-input {
  width: 100% !important;
}

.iti--separate-dial-code input,
.iti--separate-dial-code input.form-control,
.iti--separate-dial-code input.prf-input,
.iti--separate-dial-code input.chk-input {
  padding-left: 95px !important;
}

.iti--allow-dropdown input:not(.iti--separate-dial-code input),
.iti--allow-dropdown input.form-control:not(.iti--separate-dial-code input),
.iti--allow-dropdown input.prf-input:not(.iti--separate-dial-code input),
.iti--allow-dropdown input.chk-input:not(.iti--separate-dial-code input) {
  padding-left: 54px !important;
}

.iti__selected-flag {
  border-radius: 8px 0 0 8px !important;
  padding: 0 10px 0 12px !important;
  background-color: transparent !important;
}

.iti__selected-dial-code {
  font-family: var(--font-body, sans-serif) !important;
  font-size: 18px !important;
  font-weight: 500 !important;
  color: #333333 !important;
  margin-left: 6px !important;
}

.iti__country-list {
  z-index: 99999 !important;
  max-width: 360px !important;
  border-radius: 8px !important;
  border: 1px solid #EAE2D8 !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12) !important;
  font-family: var(--font-body, sans-serif) !important;
  font-size: 13.5px !important;
}

/* ==========================================================================
   MOBILE & TABLET RESPONSIVE ORDERS STYLES
   ========================================================================== */
.prf-mobile-order-card {
  background: #ffffff;
  border: 1px solid #EAE2D8;
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  transition: all 0.2s ease;
}

.prf-mobile-order-card:hover {
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
  border-color: var(--color-primary);
}

.prf-mobile-order-label {
  display: block;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #888888;
  margin-bottom: 2px;
}

.prf-mobile-order-num {
  font-family: var(--font-body, sans-serif);
  font-weight: 700;
  font-size: 14px;
  color: #222222;
  word-break: break-all;
}

.prf-mobile-order-date {
  font-size: 12px;
  color: #666666;
  background: #FAF6F0;
  border: 1px solid #EAE2D8;
  padding: 4px 8px;
  border-radius: 6px;
  white-space: nowrap;
}

.prf-mobile-order-price {
  font-weight: 700;
  font-size: 16px;
  color: #222222;
  display: block;
}

.prf-orders-mobile-list {
  margin-top: 8px;
}

/* Tablet & Mobile responsive tweaks */
@media (max-width: 991.98px) {
  .prf-hero-section {
    padding: 20px 0 10px;
  }

  .prf-hero-box {
    padding: 20px 16px;
  }

  .prf-sidebar-card {
    margin-bottom: 10px;
  }

  .prf-content-card {
    padding: 20px 16px;
  }

  .prf-main-section {
    padding-bottom: 80px !important;
  }
}

@media (max-width: 575.98px) {
  .prf-hero-box {
    text-align: center;
    justify-content: center;
    flex-direction: column;
  }

  .prf-avatar-wrap {
    margin: 0 auto;
  }

  .prf-user-name {
    font-size: 22px;
  }

  .prf-user-email {
    font-size: 12.5px;
  }

  .prf-card-title {
    font-size: 18px;
  }

  .prf-card-subtitle {
    font-size: 12.5px;
  }
}

/* ==========================================================================
   HIGH CONTRAST & VISIBILITY ENHANCEMENTS FOR PROFILE PAGES
   ========================================================================== */

/* Readonly & Active Inputs */
.prf-input:read-only {
  background: #f4f5f7 !important;
  color: #111111 !important;
  font-weight: 600 !important;
  border-color: #cccccc !important;
}

.prf-input {
  color: #111111 !important;
  font-weight: 500 !important;
}

.prf-label {
  color: #222222 !important;
  font-weight: 700 !important;
}

/* Action Buttons & Focus State Enhancements */
.btn-dark,
a.btn-dark,
button.btn-dark,
.site-btn,
.site-btn.sb-dark,
.prf-submit-btn {
  background-color: #111111 !important;
  color: #ffffff !important;
  border: 1px solid #111111 !important;
  transition: all 0.2s ease-in-out !important;
  text-decoration: none !important;
}

.btn-dark:hover,
.btn-dark:focus,
.btn-dark:active,
.btn-dark:focus-visible,
a.btn-dark:hover,
a.btn-dark:focus,
a.btn-dark:active,
a.btn-dark:focus-visible,
button.btn-dark:hover,
button.btn-dark:focus,
button.btn-dark:active,
button.btn-dark:focus-visible,
.site-btn:hover,
.site-btn:focus,
.site-btn:active,
.prf-submit-btn:hover,
.prf-submit-btn:focus,
.prf-submit-btn:active {
  background-color: var(--color-primary) !important;
  color: #ffffff !important;
  border-color: var(--color-primary) !important;
  box-shadow: 0 4px 12px rgba(183, 121, 22, 0.35) !important;
  outline: none !important;
}

.btn-outline-dark,
a.btn-outline-dark,
button.btn-outline-dark {
  background-color: #ffffff !important;
  color: #111111 !important;
  border: 1.5px solid #111111 !important;
  font-weight: 600 !important;
  transition: all 0.2s ease-in-out !important;
  text-decoration: none !important;
}

.btn-outline-dark:hover,
.btn-outline-dark:focus,
.btn-outline-dark:active,
.btn-outline-dark:focus-visible,
a.btn-outline-dark:hover,
a.btn-outline-dark:focus,
a.btn-outline-dark:active,
a.btn-outline-dark:focus-visible,
button.btn-outline-dark:hover,
button.btn-outline-dark:focus,
button.btn-outline-dark:active,
button.btn-outline-dark:focus-visible {
  background-color: #111111 !important;
  color: #ffffff !important;
  border-color: #111111 !important;
  box-shadow: 0 4px 12px rgba(17, 17, 17, 0.2) !important;
  outline: none !important;
}

.btn-outline-success,
a.btn-outline-success,
.ratingButton {
  background-color: #ffffff !important;
  color: #198754 !important;
  border: 1.5px solid #198754 !important;
  font-weight: 600 !important;
  transition: all 0.2s ease-in-out !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

.btn-outline-success:hover,
.btn-outline-success:focus,
.btn-outline-success:active,
.btn-outline-success:focus-visible,
a.btn-outline-success:hover,
a.btn-outline-success:focus,
a.btn-outline-success:active,
a.btn-outline-success:focus-visible,
.ratingButton:hover,
.ratingButton:focus,
.ratingButton:active {
  background-color: #198754 !important;
  color: #ffffff !important;
  border-color: #198754 !important;
  box-shadow: 0 4px 12px rgba(25, 135, 84, 0.25) !important;
  outline: none !important;
}

.prf-reset-btn {
  background-color: #ffffff !important;
  color: #222222 !important;
  border: 1px solid #222222 !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  transition: all 0.2s ease-in-out !important;
}

.prf-reset-btn:hover,
.prf-reset-btn:focus,
.prf-reset-btn:active {
  background-color: #222222 !important;
  color: #ffffff !important;
  border-color: #222222 !important;
  box-shadow: 0 4px 12px rgba(34, 34, 34, 0.2) !important;
  outline: none !important;
}

.prf-back-link {
  color: #111111 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: color 0.2s ease;
}

.prf-back-link:hover {
  color: var(--color-primary) !important;
}

/* High Contrast Table & Header Styling */
.prf-content-card table thead,
.table-responsive table thead {
  background-color: #222222 !important;
  color: #ffffff !important;
}

.prf-content-card table thead th,
.table-responsive table thead th {
  color: #ffffff !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  font-size: 12.5px !important;
  letter-spacing: 0.5px !important;
  border-bottom: none !important;
  background-color: #222222 !important;
}

.prf-content-card table tbody td,
.table-responsive table tbody td {
  color: #222222 !important;
  font-weight: 500 !important;
}

.prf-content-card table tbody td .text-muted,
.prf-content-card table tbody td .small {
  color: #555555 !important;
  font-weight: 500 !important;
}

/* Badges & Status Indicators */
.prf-content-card .badge.bg-dark {
  background-color: #222222 !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

.prf-content-card .badge.bg-success {
  background-color: #198754 !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

.prf-content-card .badge.bg-secondary {
  background-color: #495057 !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

.prf-badge-rated {
  background-color: #d1e7dd !important;
  color: #0f5132 !important;
  border: 1px solid #badbcc !important;
  font-weight: 600 !important;
  padding: 6px 12px !important;
}

/* Datepicker High Contrast Popup Styles */
.datepicker {
  z-index: 99999 !important;
  background-color: #ffffff !important;
  border: 1px solid #cccccc !important;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15) !important;
  border-radius: 8px !important;
  padding: 10px !important;
}

.datepicker table tr td,
.datepicker table tr th {
  color: #222222 !important;
  font-weight: 600 !important;
}

.datepicker table tr td.active,
.datepicker table tr td.active:hover,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active.disabled:hover {
  background-color: #000000 !important;
  background-image: none !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  border-radius: 6px !important;
}

.datepicker table tr td.today {
  background-color: #FAF6F0 !important;
  background-image: none !important;
  color: #000000 !important;
  font-weight: 700 !important;
  border: 1px solid var(--color-primary) !important;
  border-radius: 6px !important;
}

.datepicker table tr td.day:hover {
  background-color: #f0f0f0 !important;
  color: #000000 !important;
  border-radius: 6px !important;
}

/* Pagination High Contrast Styles */
.pagination .page-link,
.page-link.tailwind-css {
  color: #222222 !important;
  background-color: #ffffff !important;
  border: 1px solid #cccccc !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  margin: 0 2px !important;
  padding: 8px 14px !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}

.pagination .page-item.active .page-link,
.pagination .page-item.active .page-link.tailwind-css {
  color: #ffffff !important;
  background-color: #000000 !important;
  border-color: #000000 !important;
  font-weight: 700 !important;
}

.pagination .page-link:hover {
  color: #ffffff !important;
  background-color: #222222 !important;
  border-color: #222222 !important;
}

.pagination .page-item.disabled .page-link,
.pagination .page-item.disabled .page-link.tailwind-css {
  color: #888888 !important;
  background-color: #f8f9fa !important;
  border-color: #e0e0e0 !important;
  opacity: 0.7 !important;
  cursor: not-allowed !important;
}

/* Card Stat Boxes High Contrast */
.prf-stat-box {
  background: #FAF6F0;
  border: 1px solid #EAE2D8;
  border-radius: 10px;
  padding: 16px;
}

.prf-stat-box .text-muted {
  color: #555555 !important;
  font-weight: 600 !important;
}