/* ROKODIL — page-account.css — личный кабинет, авторизация */

/* ===================== AUTH / LOGIN (Figma 336:4259) ===================== */
.auth-page { display:flex; width:100vw; height:100vh; max-height:100vh; overflow:hidden; background:#FFFFFF; font-family:'Inter',sans-serif; position:fixed; inset:0; z-index:999; }
.auth-left { flex:1; min-width:0; height:100vh; max-height:100vh; overflow-y:auto; display:flex; flex-direction:column; align-items:center; padding:60px 40px; background:#FFFFFF; box-sizing:border-box; }
.auth-left::-webkit-scrollbar { width:4px; }
.auth-left::-webkit-scrollbar-track { background:transparent; }
.auth-left::-webkit-scrollbar-thumb { background:#9F9F9F; border-radius:4px; }
.auth-left::-webkit-scrollbar-thumb:hover { background:#006C66; }
.auth-form-wrap { width:100%; max-width:408px; margin:auto 0; }
.auth-logo { margin-bottom:48px; }
.auth-title { font-family:'Oswald',sans-serif; font-weight:700; font-size:32px; line-height:46px; color:#252B2B; margin:0 0 8px 0; }
.auth-sub { font-family:'Inter',sans-serif; font-size:16px; line-height:26px; color:#555B5C; margin:0 0 32px 0; }

.auth-tabs { display:flex; gap:4px; background:#F5F5F5; border-radius:8px; padding:4px; margin-bottom:24px; box-sizing:border-box; }
.auth-tab { flex:1; height:40px; border:none; background:transparent; border-radius:4px; font-family:'Inter',sans-serif; font-weight:500; font-size:14px; color:#979E9F; cursor:pointer; transition:all .15s ease; display:flex; align-items:center; justify-content:center; }
.auth-tab.is-active { background:#FFFFFF; color:#252B2B; box-shadow:0 1px 3px rgba(0,0,0,0.1); }

.auth-field { position:relative; margin-bottom:16px; }
.auth-field .input { width:100%; height:48px; padding:0 16px 0 44px; border:1px solid #E3E5E6; border-radius:4px; font-family:'Inter',sans-serif; font-size:14px; color:#252B2B; background:#fff; box-sizing:border-box; }
.auth-field .input::placeholder { color:#979E9F; }
.auth-field .input:focus { border-color:#006C66; outline:none; }
.auth-field__icon { position:absolute; left:16px; top:calc(100% - 24px); transform:translateY(-50%); width:18px; height:18px; color:#979E9F; pointer-events:none; display:flex; align-items:center; justify-content:center; }
.auth-field__icon svg { width:18px; height:18px; }
.auth-field__toggle-pass { position:absolute; right:16px; top:calc(100% - 24px); transform:translateY(-50%); width:18px; height:18px; color:#979E9F; cursor:pointer; background:none; border:none; padding:0; display:flex; align-items:center; justify-content:center; }
.auth-field__toggle-pass svg { width:18px; height:18px; }

.auth-btn--primary { width:100%; height:48px; background:#006C66; border-radius:4px; color:#FFFFFF; font-family:'Inter',sans-serif; font-size:16px; font-weight:400; border:none; cursor:pointer; transition:opacity .15s ease; margin-top:8px; display:inline-flex; align-items:center; justify-content:center; text-decoration:none; }
.auth-btn--primary:hover { opacity:.92; }
.auth-btn--secondary { width:100%; height:48px; background:#FFFFFF; border:1px solid #006C66; border-radius:4px; color:#006C66; font-family:'Inter',sans-serif; font-size:16px; font-weight:400; cursor:pointer; transition:background .15s ease; margin-top:12px; display:inline-flex; align-items:center; justify-content:center; text-decoration:none; }
.auth-btn--secondary:hover { background:rgba(0, 108, 102, 0.04); }

.auth-switch { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:24px; font-family:'Inter',sans-serif; font-size:14px; color:#979E9F; }
.auth-switch a, .auth-switch button { color:#006C66; font-weight:500; text-decoration:none; cursor:pointer; background:none; border:none; padding:0; font-family:inherit; font-size:inherit; }
.auth-switch a:hover, .auth-switch button:hover { text-decoration:underline; }

.auth-right { flex:1; min-width:0; height:100vh; max-height:100vh; position:relative; background:url('../img/auth/auth-bg.png') no-repeat center center / cover; display:flex; align-items:center; justify-content:center; padding:40px; box-sizing:border-box; overflow:hidden; }
.auth-right::before { content:''; position:absolute; inset:0; background:rgba(0, 0, 0, 0.4); }
.auth-glass-card { position:relative; z-index:2; width:100%; max-width:470px; background:rgba(0, 0, 0, 0.15); border:1px solid rgba(255, 255, 255, 0.15); backdrop-filter:blur(15px); -webkit-backdrop-filter:blur(15px); border-radius:12px; padding:48px 40px; box-sizing:border-box; text-align:center; color:#FFFFFF; }
.auth-pill { display:inline-flex; align-items:center; gap:8px; background:rgba(120, 169, 98, 0.14); border-radius:100px; padding:6px 16px; font-family:'Inter',sans-serif; font-size:14px; font-weight:600; color:#78A962; margin-bottom:24px; }
.auth-glass-title { font-family:'Oswald',sans-serif; font-weight:700; font-size:36px; line-height:46px; color:#FFFFFF; margin:0 0 16px 0; }
.auth-glass-sub { font-family:'Inter',sans-serif; font-size:16px; line-height:26px; color:#D1D5DC; margin:0 0 36px 0; }
.auth-stats { display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; }
.auth-stat-item { background:rgba(255, 255, 255, 0.1); border:1px solid rgba(255, 255, 255, 0.1); border-radius:8px; padding:16px 8px; text-align:center; box-sizing:border-box; }
.auth-stat-num { font-family:'Oswald',sans-serif; font-weight:700; font-size:24px; line-height:32px; color:#FFFFFF; display:block; }
.auth-stat-lbl { font-family:'Inter',sans-serif; font-size:14px; line-height:20px; color:rgba(255, 255, 255, 0.6); display:block; margin-top:4px; }

.auth-code-inputs { display:flex; gap:12px; justify-content:center; margin:24px 0; }
.auth-code-input { width:52px; height:56px; text-align:center; font-family:'Oswald',sans-serif; font-size:28px; font-weight:700; border:1px solid #E3E5E6; border-radius:8px; background:#FFFFFF; color:#252B2B; box-sizing:border-box; }
.auth-code-input:focus { border-color:#006C66; outline:none; }
.auth-back-btn { display:inline-flex; align-items:center; gap:8px; background:none; border:none; padding:0; font-family:'Inter',sans-serif; font-size:14px; font-weight:500; color:#979E9F; cursor:pointer; margin-bottom:24px; }
.auth-back-btn:hover { color:#006C66; }
.auth-label { display:block; font-family:'Inter',sans-serif; font-weight:400; font-size:13px; line-height:15px; color:#252B2B; margin-bottom:8px; }
.auth-consents { display:flex; flex-direction:column; gap:12px; margin-top:20px; margin-bottom:8px; }
.auth-consents .consent-group__text { font-size:12px; line-height:20px; color:#555B5C; }
.auth-consents .consent-group__box { width:16px; height:16px; }


.auth-field--select .auth-field__input-wrap { position:relative; width:100%; }
.input--select { appearance:none; -webkit-appearance:none; padding-right:40px; cursor:pointer; background:#FFFFFF; width:100%; }
.auth-field__chevron { position:absolute; right:16px; top:50%; transform:translateY(-50%); pointer-events:none; color:#979E9F; display:flex; align-items:center; }

.auth-field-upload { width:100%; margin-bottom:20px; }
.file-dropzone { background:#F9FAFB; border:2px dashed #E5E7EB; border-radius:4px; padding:24px 16px; text-align:center; cursor:pointer; transition:border-color 0.2s, background-color 0.2s; box-sizing:border-box; margin-top:8px; }
.file-dropzone:hover, .file-dropzone.is-dragover { border-color:#006C66; background:#F0FDF4; }
.file-dropzone__icon { margin-bottom:8px; display:flex; justify-content:center; }
.file-dropzone__title { font-family:'Inter',sans-serif; font-weight:500; font-size:14px; color:#4A5565; display:block; margin-bottom:4px; }
.file-dropzone__hint { font-family:'Inter',sans-serif; font-size:12px; color:#99A1AF; display:block; }
.file-dropzone__selected { display:flex; align-items:center; justify-content:center; gap:8px; font-size:14px; color:#252B2B; word-break:break-all; }
.file-dropzone__filename { font-family:'Inter',sans-serif; font-weight:500; font-size:14px; color:#006C66; }
.file-dropzone__remove { background:none; border:none; color:#979E9F; font-size:20px; line-height:1; cursor:pointer; padding:0 4px; }
.file-dropzone__remove:hover { color:#E53E3E; }

.auth-notice-box { background:#FFFBEB; border:1px solid #FEF3C6; border-radius:4px; padding:16px; display:flex; gap:12px; align-items:flex-start; margin-top:20px; margin-bottom:12px; box-sizing:border-box; }
.auth-notice-box__icon { flex-shrink:0; display:flex; align-items:center; margin-top:2px; }
.auth-notice-box__text { font-family:'Inter',sans-serif; font-size:12px; line-height:19.5px; color:#BB4D00; }
.auth-identifier-display { display:flex; align-items:center; gap:8px; margin-bottom:24px; margin-top:-8px; }
.auth-identifier-val { font-family:'Inter',sans-serif; font-size:16px; line-height:26px; color:#252B2B; word-break:break-all; }
.auth-identifier-edit { background:none; border:none; padding:0; color:#979E9F; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:color 0.15s; }
.auth-identifier-edit:hover { color:#006C66; }

.auth-forgot-pass-wrap { display:flex; justify-content:flex-end; margin-top:8px; margin-bottom:20px; }
.auth-forgot-pass-btn { background:none; border:none; padding:0; font-family:'Inter',sans-serif; font-weight:500; font-size:14px; line-height:20px; color:#006C66; cursor:pointer; }
.auth-forgot-pass-btn:hover { text-decoration:underline; }
.input.input--error { border-color:#D15E5D !important; }
.auth-field__clear { position:absolute; right:14px; top:50%; transform:translateY(-50%); width:22px; height:22px; border-radius:50%; background:#F5F5F5; border:none; color:#979E9F; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.15s ease; }
.auth-field__clear:hover { background:#E5E7EB; color:#252B2B; }

.auth-error-notice { background:rgba(198, 1, 0, 0.04); border:1px solid rgba(198, 1, 0, 0.15); border-radius:4px; padding:14px 16px; display:flex; gap:12px; align-items:flex-start; margin-top:16px; margin-bottom:16px; box-sizing:border-box; }
.auth-error-notice__icon { flex-shrink:0; margin-top:2px; display:flex; align-items:center; }
.auth-error-notice__title { font-family:'Inter',sans-serif; font-weight:500; font-size:12px; line-height:20px; color:#C60100; margin-bottom:2px; }
.auth-error-notice__sub { font-family:'Inter',sans-serif; font-size:12px; line-height:18px; color:#979E9F; }

@media (max-width:1024px) { .auth-right { display:none; } }
/* ===== Password screen (336:4631) + error (336:5661) + recovery modals ===== */
.auth-email-display { display:flex; align-items:center; justify-content:space-between; width:100%; height:48px; padding:0 16px; border:1px solid #E3E5E6; border-radius:4px; background:#F9F9F9; box-sizing:border-box; margin-bottom:24px; }
.auth-email-display__text { font-family:'Inter',sans-serif; font-size:14px; line-height:20px; color:#252B2B; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.auth-email-display__edit { flex-shrink:0; background:none; border:none; cursor:pointer; color:#979E9F; padding:0 0 0 12px; display:flex; }
.auth-email-display__edit:hover { color:#006C66; }

.auth-forgot-wrap { width:100%; display:flex; justify-content:flex-end; margin:-4px 0 16px; }
.auth-forgot { background:none; border:none; cursor:pointer; padding:0; font-family:'Inter',sans-serif; font-weight:500; font-size:14px; line-height:20px; color:#006C66; }
.auth-forgot:hover { text-decoration:underline; }

.auth-error-box { display:flex; align-items:flex-start; gap:12px; width:100%; background:rgba(198, 1, 0, 0.04); border-radius:4px; padding:15px 16px; box-sizing:border-box; margin-top:4px; margin-bottom:16px; }
.auth-error-box__icon { flex-shrink:0; color:#C60100; margin-top:1px; }
.auth-error-box__title { font-family:'Inter',sans-serif; font-weight:500; font-size:12px; line-height:20px; color:#C60100; margin-bottom:2px; }
.auth-error-box__text { font-family:'Inter',sans-serif; font-size:12px; line-height:20px; color:#979E9F; }
.auth-field.has-error .input { border-color:#D15E5D; }

/* Auth modals (recovery + sent) */
.auth-modal { position:fixed; inset:0; z-index:1000; display:none; align-items:center; justify-content:center; padding:20px; }
.auth-modal.is-open { display:flex; }
.auth-modal__overlay { position:absolute; inset:0; background:rgba(0,0,0,0.5); backdrop-filter:blur(5px); z-index:1; }
.auth-modal__dialog { position:relative; z-index:2; width:420px; max-width:100%; background:#FFFFFF; border-radius:12px; box-shadow:0px 4px 6px -4px rgba(0,0,0,0.1), 0px 10px 15px -3px rgba(0,0,0,0.1); padding:24px 24px 28px; box-sizing:border-box; }
.auth-modal__close { position:absolute; top:20px; right:20px; background:none; border:none; cursor:pointer; padding:0; font-family:'Inter',sans-serif; font-weight:500; font-size:14px; color:#006C66; }
.auth-modal__close:hover { text-decoration:underline; }
.auth-modal__title { font-family:'Oswald',sans-serif; font-weight:500; font-size:24px; line-height:32px; color:#252B2B; margin:0 0 8px; text-align:center; }
.auth-modal__sub { font-family:'Inter',sans-serif; font-size:14px; line-height:20px; color:#979E9F; text-align:center; margin:0 0 20px; }
.auth-modal__icon { width:64px; height:64px; border-radius:50%; background:rgba(0,108,102,0.08); display:flex; align-items:center; justify-content:center; color:#006C66; margin:0 auto 16px; }
.auth-modal__email { font-family:'Inter',sans-serif; font-weight:500; font-size:14px; line-height:24px; color:#252B2B; text-align:center; margin:0 0 24px; }
.auth-modal__field { position:relative; margin-bottom:16px; }
.auth-modal__field .auth-field__icon { position:absolute; left:16px; top:50%; transform:translateY(-50%); color:#979E9F; pointer-events:none; }
.auth-modal__field input { width:100%; height:48px; padding:0 16px 0 44px; border:1px solid #E3E5E6; border-radius:4px; font-family:'Inter',sans-serif; font-size:14px; color:#252B2B; box-sizing:border-box; background:#fff; }
.auth-modal__field input:focus { border-color:#006C66; outline:none; }
.auth-modal__consent { margin-bottom:20px; }
.auth-modal__btn { width:100%; height:48px; background:#006C66; color:#fff; border:none; border-radius:4px; font-family:'Inter',sans-serif; font-weight:500; font-size:14px; cursor:pointer; }
.auth-modal__btn:hover { background:#005550; }
.auth-modal__btn:disabled { opacity:0.6; cursor:not-allowed; }
/* ===================== MY ACCOUNT DASHBOARD (Figma 230:2223) ===================== */
.account-page { background:#FAFAFA; padding:40px 0 80px; min-height:calc(100vh - 118px); box-sizing:border-box; }
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content,
.woocommerce-account .account-content { float:none !important; width:100% !important; margin:0 !important; padding:0 !important; }

.account-layout { display:flex !important; flex-direction:row !important; gap:40px !important; align-items:flex-start !important; max-width:1398px !important; width:100% !important; margin:0 auto !important; box-sizing:border-box !important; }
.account-sidebar { width:280px !important; flex-shrink:0 !important; background:#FFFFFF; border:1px solid rgba(0, 0, 0, 0.06); border-radius:8px; display:flex; flex-direction:column; overflow:hidden; min-height:600px; box-sizing:border-box !important; }
.account-main-wrap { flex:1 !important; min-width:0 !important; max-width:1078px !important; width:100% !important; box-sizing:border-box !important; }
.woocommerce-MyAccount-content { float:none !important; width:100% !important; margin:0 !important; padding:0 !important; }
.account-main-card { width:100% !important; max-width:1078px !important; background:#FFFFFF; border:1px solid rgba(0, 0, 0, 0.06); border-radius:8px; padding:40px; min-height:600px; box-sizing:border-box !important; display:flex; flex-direction:column; }
.account-user-card { padding:20px; display:flex; align-items:center; gap:12px; border-bottom:1px solid rgba(0, 0, 0, 0.06); }
.account-user-avatar { width:44px; height:44px; background:#006C66; border-radius:4px; color:#FFFFFF; font-family:'Inter',sans-serif; font-weight:700; font-size:16px; display:flex; align-items:center; justify-content:center; flex-shrink:0; text-transform:uppercase; }
.account-user-info { display:flex; flex-direction:column; gap:4px; min-width:0; }
.account-user-name { font-family:'Inter',sans-serif; font-weight:600; font-size:14px; line-height:20px; color:#101828; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.account-user-badge { display:inline-flex; align-items:center; gap:6px; background:rgba(0, 108, 102, 0.06); border-radius:12px; padding:2px 8px; font-family:'Inter',sans-serif; font-weight:500; font-size:12px; line-height:16px; color:#006C66; width:fit-content; }
.account-user-badge::before { content:''; width:6px; height:6px; background:#006C66; border-radius:50%; display:inline-block; }

.account-nav { padding:16px 12px; display:flex; flex-direction:column; gap:4px; }
.account-nav__title { font-family:'Inter',sans-serif; font-size:12px; font-weight:400; line-height:15px; color:#99A1AF; text-transform:uppercase; padding:0 12px 8px 12px; }
.account-nav__link { display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:18px; font-family:'Inter',sans-serif; font-weight:500; font-size:14px; line-height:20px; color:#6A7282; text-decoration:none; transition:all 0.15s ease; position:relative; }
.account-nav__link svg { width:18px; height:18px; color:#979E9F; transition:color 0.15s ease; }
.account-nav__link:hover { background:rgba(0, 108, 102, 0.04); color:#006C66; }
.account-nav__link:hover svg { color:#006C66; }
.account-nav__link.is-active { background:rgba(0, 108, 102, 0.06); color:#006C66; border-radius:4px; }
.account-nav__link.is-active svg { color:#006C66; }
.account-nav__link.is-active::after { content:''; position:absolute; right:12px; width:6px; height:6px; background:#006C66; border-radius:50%; }

.account-sidebar__footer { padding:12px 12px 20px 12px; border-top:1px solid rgba(0, 0, 0, 0.06); margin-top:auto; }
.account-logout-btn { display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:18px; font-family:'Inter',sans-serif; font-weight:500; font-size:14px; line-height:20px; color:#6A7282; text-decoration:none; transition:all 0.15s ease; width:100%; border:none; background:none; cursor:pointer; }
.account-logout-btn svg { width:18px; height:18px; color:#979E9F; }
.account-logout-btn:hover { background:rgba(229, 62, 62, 0.06); color:#E53E3E; }
.account-logout-btn:hover svg { color:#E53E3E; }

/* Main Card */
/* Main Card (see above) */
.account-main-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:32px; flex-wrap:wrap; gap:16px; }
.account-main-title { font-family:'Inter',sans-serif; font-weight:700; font-size:24px; line-height:32px; color:#252B2B; margin:0; }

.account-filter-wrap { display:flex; align-items:center; gap:8px; }
.account-filter-label { font-family:'Inter',sans-serif; font-size:13px; color:#979E9F; }
.account-filter-select-wrap { position:relative; width:210px; height:38px; }
.account-filter-select { width:100%; height:38px; background:#F5F5F5; border:none; border-radius:4px; padding:0 32px 0 38px; font-family:'Inter',sans-serif; font-size:13px; color:#252B2B; cursor:pointer; appearance:none; -webkit-appearance:none; box-sizing:border-box; }
.account-filter-icon-cal { position:absolute; left:14px; top:50%; transform:translateY(-50%); width:16px; height:16px; color:#979E9F; pointer-events:none; }
.account-filter-icon-arrow { position:absolute; right:12px; top:50%; transform:translateY(-50%); width:16px; height:16px; color:#979E9F; pointer-events:none; opacity:0.5; }

/* Empty State */
.account-empty-state { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:60px 20px; margin:auto; width:100%; max-width:480px; box-sizing:border-box; }
.account-empty-illustration { margin-bottom:24px; display:flex; justify-content:center; }
.account-empty-title { font-family:'Inter',sans-serif; font-weight:600; font-size:18px; line-height:26px; color:#252B2B; margin:0 0 8px 0; }
.account-empty-sub { font-family:'Inter',sans-serif; font-size:16px; line-height:26px; color:#555B5C; margin:0 0 24px 0; }
.account-empty-btn { width:250px; height:48px; background:#006C66; border-radius:4px; color:#FFFFFF; font-family:'Inter',sans-serif; font-size:16px; font-weight:400; border:none; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; text-decoration:none; transition:opacity 0.15s ease; }
.account-empty-btn:hover { opacity:0.92; }

@media (max-width:992px) {
  .account-layout { grid-template-columns:1fr; }
  .account-main-card { padding:24px; }
}




/* ===================== PROFILE EDIT FORM (Figma 230:2409) ===================== */

/* Profile Cards (White Panels) */
.profile-card {
  background: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  padding: 40px;
  margin-bottom: 12px;
  box-sizing: border-box;
}

.profile-card__title {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
  color: #252B2B;
  margin: 0 0 24px 0;
}

/* Profile Notices */
.profile-notice {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px;
  border-radius: 4px;
  margin-bottom: 24px;
  box-sizing: border-box;
}

.profile-notice svg {
  flex-shrink: 0;
  margin-top: 2px;
}

.profile-notice p {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  line-height: 20px;
  margin: 0;
}

.profile-notice--success {
  background: #E8FAF0;
  border: 1px solid rgba(57, 211, 83, 0.19);
}

.profile-notice--success p {
  color: #1A7A30;
}

.profile-notice--success svg {
  color: #1A7A30;
}

.profile-notice--warning {
  background: #FFFBEB;
  border: 1px solid #FEF3C6;
}

.profile-notice--warning p {
  color: #BB4D00;
  font-size: 12px;
  line-height: 19.5px;
}

.profile-notice--warning svg {
  color: #BB4D00;
}

.profile-notice--password {
  margin-top: 16px;
  margin-bottom: 16px;
}

/* Profile Fields */
.profile-fields-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 31px;
  margin-bottom: 24px;
}

.profile-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.profile-field__label {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 15px;
  color: #252B2B;
}

.profile-input-wrap {
  position: relative;
  width: 100%;
}

.profile-input-wrap__icon {
  position: absolute;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  color: #979E9F;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.profile-input-wrap__icon svg {
  width: 18px;
  height: 18px;
}

.profile-input {
  width: 100%;
  height: 48px;
  padding: 0 48px 0 45px;
  border: 1px solid #E3E5E6;
  border-radius: 4px;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  line-height: 20px;
  color: #252B2B;
  background: #FFFFFF;
  box-sizing: border-box;
  transition: border-color 0.15s ease;
}

.profile-input::placeholder {
  color: #979E9F;
}

.profile-input:focus {
  border-color: #006C66;
  outline: none;
}

.profile-input-wrap__toggle {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #979E9F;
  transition: color 0.15s ease;
}

.profile-input-wrap__toggle:hover {
  color: #006C66;
}

.profile-input-wrap__toggle svg {
  width: 20px;
  height: 20px;
}

/* Profile Buttons */
.profile-btn {
  height: 48px;
  border-radius: 4px;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  border: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-decoration: none;
  transition: opacity 0.15s ease;
  box-sizing: border-box;
}

.profile-btn--primary {
  width: 250px;
  background: #006C66;
  color: #FFFFFF;
}

.profile-btn--primary:hover {
  opacity: 0.92;
}

.profile-btn--primary:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

/* Profile Addresses */
.profile-address {
  position: relative;
  padding: 24px;
  border: 1px solid #F5F5F5;
  border-radius: 4px;
  margin-bottom: 12px;
  box-sizing: border-box;
}

.profile-address--primary {
  border-color: #006C66;
}

.profile-address__header {
  display: flex;
  align-items: flex-start;
  gap: 26px;
}

.profile-address__radio {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
}

.profile-address__meta {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.profile-address__badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 4px;
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 12px;
  line-height: 16px;
  width: fit-content;
}

.profile-address--primary .profile-address__badge {
  background: #DCFCE7;
  color: #166534;
}

.profile-address__name {
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 20px;
  color: #242627;
}

.profile-address__phone {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  line-height: 20px;
  color: #252B2B;
}

.profile-address__text {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  line-height: 20px;
  color: #252B2B;
}

.profile-address__actions {
  position: absolute;
  top: 24px;
  right: 24px;
  display: flex;
  gap: 10px;
}

.profile-address__action {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #F9F9F9;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s ease;
}

.profile-address__action:hover {
  background: #E5E7EB;
}

.profile-address__action svg {
  width: 20px;
  height: 20px;
}

/* Add Address Button */
.profile-add-address {
  width: 100%;
  height: 48px;
  background: #F5F5F5;
  border: none;
  border-radius: 4px;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  line-height: 20px;
  color: #252B2B;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: background 0.15s ease;
  box-sizing: border-box;
}

.profile-add-address:hover {
  background: #E5E7EB;
}

.profile-add-address svg {
  width: 12px;
  height: 12px;
}

/* Empty Address State */
.profile-address-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 40px 20px;
}

.profile-address-empty__img {
  margin-bottom: 24px;
}

.profile-address-empty__title {
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 18px;
  line-height: 26px;
  color: #252B2B;
  margin: 0 0 8px 0;
}

.profile-address-empty__sub {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  line-height: 26px;
  color: #555B5C;
  margin: 0 0 24px 0;
}

.profile-address-empty__btn {
  width: 250px;
}

/* ===================== ADDRESS DRAWER (Figma 230:3190) ===================== */

.address-drawer-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 998;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.address-drawer-overlay.is-active {
  opacity: 1;
  visibility: visible;
}

.address-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  max-width: 520px;
  background: #FFFFFF;
  z-index: 999;
  transform: translateX(100%);
  transition: transform 0.3s ease;
  overflow-y: auto;
  box-shadow: -4px 0 24px rgba(0, 0, 0, 0.12);
}

.address-drawer.is-open {
  transform: translateX(0);
}

.address-drawer__inner {
  padding: 32px 24px;
  position: relative;
}

.address-drawer__close {
  position: absolute;
  top: 32px;
  right: 24px;
  width: 32px;
  height: 32px;
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #6A7282;
  border-radius: 4px;
  transition: background 0.15s ease;
}

.address-drawer__close:hover {
  background: #F5F5F5;
}

.address-drawer__close svg {
  width: 16px;
  height: 16px;
}

.address-drawer__title {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
  color: #252B2B;
  margin: 0 0 32px 0;
  padding-right: 48px;
}

.address-drawer__form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.address-drawer__field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.address-drawer__field--sm {
  flex: 1;
}

.address-drawer__label {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 15px;
  color: #252B2B;
}

.address-drawer__input-box {
  position: relative;
  width: 100%;
}

.address-drawer__input {
  width: 100%;
  height: 48px;
  padding: 0 16px;
  border: 1px solid #E3E5E6;
  border-radius: 4px;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  line-height: 20px;
  color: #252B2B;
  background: #FFFFFF;
  box-sizing: border-box;
  transition: border-color 0.15s ease;
}

.address-drawer__input--icon {
  padding-left: 45px;
}

.address-drawer__input--select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 40px;
  cursor: pointer;
  background-image: none;
}

.address-drawer__input::placeholder {
  color: #979E9F;
}

.address-drawer__input:focus {
  border-color: #006C66;
  outline: none;
}

.address-drawer__icon {
  position: absolute;
  width: 18px;
  height: 18px;
  color: #979E9F;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.address-drawer__icon:not(.address-drawer__icon--right) {
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
}

.address-drawer__icon--right {
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
}

.address-drawer__icon svg {
  width: 100%;
  height: 100%;
}

.address-drawer__row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

/* Toggle Switch */
.address-drawer__toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px;
  background: #F9FAFB;
  border-radius: 4px;
}

.address-drawer__toggle-text {
  flex: 1;
}

.address-drawer__toggle-label {
  font-family: 'Inter', sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
  color: #252B2B;
  margin-bottom: 4px;
}

.address-drawer__toggle-caption {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  line-height: 18px;
  color: #6A7282;
}

.toggle-switch {
  position: relative;
  display: inline-block;
  width: 44px;
  height: 24px;
  flex-shrink: 0;
}

.toggle-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.toggle-switch__slider {
  position: absolute;
  inset: 0;
  background: #E5E7EB;
  border-radius: 24px;
  transition: background 0.2s ease;
  cursor: pointer;
}

.toggle-switch__slider::before {
  content: '';
  position: absolute;
  width: 18px;
  height: 18px;
  left: 3px;
  top: 3px;
  background: #FFFFFF;
  border-radius: 50%;
  transition: transform 0.2s ease;
}

.toggle-switch input:checked + .toggle-switch__slider {
  background: #006C66;
}

.toggle-switch input:checked + .toggle-switch__slider::before {
  transform: translateX(20px);
}

/* Drawer Footer */
.address-drawer__footer {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid #E5E7EB;
}

.address-drawer__btn {
  width: 100%;
  height: 48px;
  border-radius: 4px;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s ease;
  box-sizing: border-box;
}

.address-drawer__btn--save {
  background: #006C66;
  color: #FFFFFF;
  border: none;
}

.address-drawer__btn--save:hover {
  opacity: 0.92;
}

.address-drawer__btn--save:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.address-drawer__btn--cancel {
  background: #FFFFFF;
  color: #6A7282;
  border: 1px solid #E5E7EB;
}

.address-drawer__btn--cancel:hover {
  background: #F9FAFB;
}

/* ===================== RESPONSIVE ===================== */

@media (max-width: 768px) {
  .profile-fields-row {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  
  .profile-card {
    padding: 24px;
  }
  
  .address-drawer {
    max-width: 100%;
  }
  
  .address-drawer__row {
    grid-template-columns: 1fr;
  }
}

/* ===================== WISHLIST (Figma 230:1770, 230:2033) ===================== */
.wishlist { padding: 0; background: #FFFFFF; border: 1px solid rgba(0, 0, 0, 0.06); border-radius: 8px; overflow: hidden; }
.wishlist__head {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 40px 40px 20px;
  border-bottom: 1px solid #F5F5F5;
  flex-wrap: wrap;
}
.wishlist__title {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
  color: #252B2B;
  margin: 0;
}
.wishlist__sort-label {
  margin-left: auto;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  line-height: 16px;
  color: #979E9F;
}
.wishlist__sort {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 38px;
  padding: 0 14px;
  background: #F5F5F5;
  border-radius: 4px;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  line-height: 16px;
  color: #252B2B;
}
.wishlist__clear {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 38px;
  padding: 0 16px;
  background: rgba(198, 1, 0, 0.03);
  border: none;
  border-radius: 4px;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  line-height: 18px;
  color: #C60100;
  cursor: pointer;
}
.wishlist__clear:hover { background: rgba(198, 1, 0, 0.08); }

.wishlist__list { padding: 12px 40px 40px; }

/* Favorite product card (998x180 in Figma) */
.fav-card {
  display: grid;
  grid-template-columns: 140px 1fr auto auto auto;
  align-items: center;
  gap: 20px;
  padding: 20px;
  border-bottom: 1px solid #F5F5F5;
}
.fav-card:last-child { border-bottom: none; }
.fav-card__img {
  width: 140px;
  height: 140px;
  background: #F9F9F9;
  border-radius: 8px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.fav-card__img img { width: 100%; height: 100%; object-fit: contain; padding: 8px; }
.fav-card__main { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.fav-card__badge {
  width: fit-content;
  padding: 4px 10px;
  border-radius: 999px;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  line-height: 14px;
}
.fav-card__badge--hit { background: #C60100; color: #fff; }
.fav-card__badge--sale { background: #252B2B; color: #fff; }
.fav-card__title {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: #252B2B;
  margin: 0;
}
.fav-card__title a { color: inherit; text-decoration: none; }
.fav-card__title a:hover { text-decoration: underline; }
.fav-card__rating { display: flex; align-items: center; gap: 6px; }
.fav-card__stars { display: inline-flex; gap: 2px; color: #FFB800; }
.fav-card__score { font-family: 'Inter', sans-serif; font-weight: 500; font-size: 13px; color: #555B5C; }
.fav-card__price-row { display: flex; align-items: baseline; gap: 10px; margin-top: 4px; }
.fav-card__price { font-family: 'Inter', sans-serif; font-weight: 700; font-size: 20px; line-height: 26px; color: #252B2B; }
.fav-card__price-old { font-family: 'Inter', sans-serif; font-size: 14px; line-height: 20px; color: #979E9F; text-decoration: line-through; }
.fav-card__cart {
  min-width: 160px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 16px;
  background: #006C66;
  color: #fff;
  border-radius: 4px;
  font-family: 'Inter', sans-serif;
  font-weight: 500;
  font-size: 14px;
  text-decoration: none;
}
.fav-card__cart:hover { background: #005550; }
.fav-card__action {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #F9F9F9;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #555B5C;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.fav-card__action:hover { background: #EAEAEA; }
.fav-card__remove:hover { background: rgba(198, 1, 0, 0.08); color: #C60100; }

/* Empty state (Figma 230:2033) */
.wishlist__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 80px 20px 100px;
}
.wishlist__empty-img { margin-bottom: 24px; max-width: 350px; width: 100%; }
.wishlist__empty-img img { display: block; width: 100%; height: auto; }
.wishlist__empty-title { font-family: 'Inter', sans-serif; font-weight: 600; font-size: 18px; line-height: 26px; color: #252B2B; margin: 0 0 8px; }
.wishlist__empty-text { font-family: 'Inter', sans-serif; font-size: 16px; line-height: 26px; color: #555B5C; margin: 0 0 28px; max-width: 540px; }
.wishlist__empty-btn {
  min-width: 250px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 15px;
  background: #006C66;
  color: #fff;
  border-radius: 4px;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  text-decoration: none;
}
.wishlist__empty-btn:hover { background: #005550; }

@media (max-width: 1024px) {
  .fav-card { grid-template-columns: 110px 1fr; grid-template-areas: 'img main' 'img actions'; row-gap: 12px; }
  .fav-card__img { grid-area: img; width: 110px; height: 110px; }
  .fav-card__main { grid-area: main; }
  .fav-card__cart { grid-area: actions; }
  .fav-card__compare, .fav-card__remove { display: none; }
}
