/* === WG-ACCOUNT-V9 ===
   WG Group — Личный кабинет v9 FINAL
   Все стили изолированы через body.wlk-page / .wlk-root
*/

/* ─── Reset ─────────────────────────────────────────────────────────────── */
body.wlk-page { margin:0; padding:0; background:#F4F6F9; color:#1a2332;
    font-family:'Nunito Sans',system-ui,-apple-system,sans-serif;
    font-size:15px; line-height:1.6; }
body.wlk-page *,body.wlk-page *::before,body.wlk-page *::after { box-sizing:border-box; }
body.wlk-page a { text-decoration:none; color:inherit; }
body.wlk-page img { max-width:100%; display:block; }

/* ─── Fallback Header ───────────────────────────────────────────────────── */
.wlk-hdr-fb { background:#0f1e33; box-shadow:0 2px 16px rgba(0,0,0,.3);
    position:sticky; top:0; z-index:100; }
.wlk-hdr-fb-in { max-width:1280px; margin:0 auto; padding:14px 24px;
    display:flex; align-items:center; justify-content:space-between; gap:16px; }
.wlk-hdr-logo { display:flex; align-items:center; gap:9px;
    font-family:'Manrope',sans-serif; font-weight:800; font-size:1.1rem; color:#fff; }
.wlk-hdr-badge { display:inline-flex; align-items:center; justify-content:center;
    width:34px; height:34px; border-radius:8px; background:#E8792B;
    color:#fff; font-weight:900; font-size:.9rem; }
.wlk-hdr-nav { display:flex; gap:20px; }
.wlk-hdr-nav a { color:rgba(255,255,255,.8); font-size:.88rem; transition:color .2s; }
.wlk-hdr-nav a:hover { color:#fff; }

/* ─── Fallback Footer ───────────────────────────────────────────────────── */
.wlk-ftr-fb { background:#0f1e33; padding:20px 24px; margin-top:40px; }
.wlk-ftr-fb-in { max-width:1280px; margin:0 auto; display:flex; gap:16px;
    align-items:center; justify-content:space-between; flex-wrap:wrap;
    font-size:.82rem; color:rgba(255,255,255,.5); }
.wlk-ftr-fb-in a { color:rgba(255,255,255,.6); }
.wlk-ftr-fb-in a:hover { color:#E8792B; }

/* ─── Root ──────────────────────────────────────────────────────────────── */
.wlk-root { max-width:1280px; margin:0 auto; padding:28px 20px 60px; }

/* ─── AUTH ──────────────────────────────────────────────────────────────── */
.wlk-auth { display:flex; justify-content:center;
    min-height:calc(100vh - 200px); align-items:flex-start; padding:32px 0; }
.wlk-auth-box { background:#fff; border-radius:16px; border:1px solid #e0e6ef;
    box-shadow:0 4px 32px rgba(27,54,93,.08);
    padding:40px 44px; width:100%; max-width:460px;
    display:flex; flex-direction:column; gap:6px; }
.wlk-auth-logo { display:flex; align-items:center; gap:10px;
    font-family:'Manrope',sans-serif; font-weight:800; font-size:1.3rem;
    color:#1B365D; margin-bottom:14px; }
.wlk-logo-ico { width:44px; height:44px; border-radius:10px;
    background:linear-gradient(135deg,#1B365D,#E8792B);
    display:flex; align-items:center; justify-content:center;
    color:#fff; font-weight:900; font-size:1rem; }
.wlk-auth-h { font-family:'Manrope',sans-serif; font-size:1.4rem;
    font-weight:800; color:#1B365D; margin:8px 0 4px; }
.wlk-auth-sub { color:#5a6a7e; font-size:.88rem; margin:0 0 18px; }
.wlk-auth-links { display:flex; gap:10px; justify-content:center;
    flex-wrap:wrap; font-size:.82rem; color:#5a6a7e; margin-top:6px; }
.wlk-auth-links a { color:#1B365D; font-weight:600; }
.wlk-auth-links a:hover { color:#E8792B; }

/* ─── Forms ─────────────────────────────────────────────────────────────── */
.wlk-form { display:flex; flex-direction:column; gap:14px; }
.wf { display:flex; flex-direction:column; gap:5px; }
.wf label { font-size:.82rem; font-weight:700; color:#374151; }
.wf label em { color:#E8792B; font-style:normal; margin-left:2px; }
.wf input[type="text"],.wf input[type="email"],.wf input[type="tel"],
.wf input[type="password"],.wlk-card input[type="text"],
.wlk-card input[type="email"],.wlk-card input[type="tel"],
.wlk-card input[type="password"] {
    width:100%; padding:10px 14px; border:1.5px solid #dce1e8;
    border-radius:8px; font-family:inherit; font-size:.92rem;
    color:#1a2332; background:#fff;
    transition:border-color .2s,box-shadow .2s; outline:none; }
.wf input:hover { border-color:#aab4c2; }
.wf input:focus,.wlk-card input:focus { border-color:#1B365D;
    box-shadow:0 0 0 3px rgba(27,54,93,.1); }
/* FIX #10: keyboard navigation */
.wf input:focus-visible,.wlk-card input:focus-visible {
    border-color:#E8792B; box-shadow:0 0 0 3px rgba(232,121,43,.18); }
.wf-pw { position:relative; }
.wf-pw input { padding-right:42px; }
.wf-eye { position:absolute; right:10px; top:50%; transform:translateY(-50%);
    background:none; border:none; cursor:pointer; font-size:1rem;
    opacity:.4; transition:opacity .2s; padding:2px; line-height:1; }
.wf-eye:hover { opacity:.8; }
/* FIX #10: focus-visible on buttons */
.wf-eye:focus-visible,button:focus-visible,a:focus-visible {
    outline:2px solid #E8792B; outline-offset:2px; border-radius:4px; }
.wf-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.wf-cb { display:flex; align-items:flex-start; gap:9px; cursor:pointer;
    font-size:.82rem; color:#374151; line-height:1.4; }
.wf-cb input[type="checkbox"] { width:17px; height:17px; flex-shrink:0;
    margin-top:2px; accent-color:#1B365D; cursor:pointer; }
.wf-str { display:grid; grid-template-columns:repeat(4,1fr); gap:4px;
    height:4px; margin-top:5px; }
.wf-str span { background:#dce1e8; border-radius:2px;
    transition:background .25s; }
.wf-str-t { font-size:.74rem; font-weight:700; min-height:16px;
    transition:color .25s; }
.wf-section-h { font-family:'Manrope',sans-serif; font-weight:800;
    font-size:.92rem; color:#1B365D; display:flex;
    align-items:center; gap:10px; }
.wf-section-h small { font-weight:400; font-size:.78rem; color:#5a6a7e; }

/* ─── Buttons ───────────────────────────────────────────────────────────── */
.btn-accent { display:inline-flex; align-items:center; justify-content:center;
    gap:6px; padding:11px 22px; background:#E8792B; color:#fff;
    border-radius:9px; font-weight:700; font-size:.9rem; border:none;
    cursor:pointer; transition:background .2s,transform .1s; white-space:nowrap; }
.btn-accent:hover { background:#d16820; color:#fff; }
.btn-accent:active { transform:scale(.98); }
.btn-accent:disabled { background:#aab4c2; cursor:not-allowed; transform:none; }
.btn-ghost { display:inline-flex; align-items:center; justify-content:center;
    gap:6px; padding:10px 20px; background:#fff; color:#1B365D;
    border:1.5px solid #dce1e8; border-radius:9px; font-weight:700;
    font-size:.9rem; cursor:pointer; transition:all .2s; }
.btn-ghost:hover { border-color:#1B365D; }
.btn-ghost:disabled { opacity:.5; cursor:not-allowed; }
.btn-navy { display:inline-flex; align-items:center; justify-content:center;
    gap:6px; padding:10px 20px; background:#1B365D; color:#fff;
    border-radius:9px; font-weight:700; font-size:.9rem; cursor:pointer;
    border:none; transition:background .2s; }
.btn-navy:hover { background:#142a4a; color:#fff; }
.btn-wa { display:inline-flex; align-items:center; justify-content:center;
    gap:6px; padding:10px 20px; background:#25d366; color:#fff;
    border-radius:9px; font-weight:700; font-size:.9rem;
    cursor:pointer; border:none; transition:background .2s; }
.btn-wa:hover { background:#1ab053; color:#fff; }
.btn-danger { border-color:#e74c3c; color:#e74c3c; }
.btn-danger:hover { background:#e74c3c; color:#fff; }
.btn-sm { padding:7px 14px; font-size:.82rem; }
.btn-full { width:100%; }
.btn-w { width:100%; }

/* FIX #13: Loading spinner */
.wlk-spin {
    display:inline-block; width:14px; height:14px;
    border:2px solid rgba(255,255,255,.4);
    border-top-color:#fff; border-radius:50%;
    animation:wlkSpin .7s linear infinite; }
@keyframes wlkSpin { to { transform:rotate(360deg); } }

/* ─── Alerts ────────────────────────────────────────────────────────────── */
.alert-err { padding:12px 16px; background:#fef2f2; border:1px solid #fecaca;
    border-radius:8px; color:#dc2626; font-size:.88rem; }
.alert-ok  { padding:12px 16px; background:#f0fdf4; border:1px solid #bbf7d0;
    border-radius:8px; color:#16a34a; font-size:.88rem; }
.alert-info { padding:12px 16px; background:#eff6ff; border:1px solid #bfdbfe;
    border-radius:8px; color:#1d4ed8; font-size:.88rem; }
.alert-152 { padding:10px 14px; background:#f0fdf4; border:1px solid #bbf7d0;
    border-radius:8px; font-size:.78rem; color:#166534; }
.alert-152 a { color:#15803d; text-decoration:underline; }

/* ─── Cabinet layout ────────────────────────────────────────────────────── */
.wlk-wrap { display:grid; grid-template-columns:260px 1fr; gap:24px;
    align-items:start; }

/* ─── Sidebar ───────────────────────────────────────────────────────────── */
.wlk-sb { background:#fff; border-radius:16px; border:1px solid #e0e6ef;
    box-shadow:0 2px 16px rgba(27,54,93,.06);
    overflow:hidden; position:sticky; top:80px; }
.wlk-sb-user { padding:22px 20px 16px; border-bottom:1px solid #f0f2f5;
    display:flex; align-items:center; gap:14px; }
.wlk-av { width:46px; height:46px; border-radius:12px;
    background:linear-gradient(135deg,#1B365D,#E8792B);
    display:flex; align-items:center; justify-content:center;
    color:#fff; font-family:'Manrope',sans-serif;
    font-weight:900; font-size:1.2rem; flex-shrink:0; }
.wlk-sb-ud { min-width:0; }
.wlk-sb-name { font-weight:800; font-size:.92rem; color:#1B365D;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.wlk-sb-email { font-size:.75rem; color:#5a6a7e;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.wlk-role-badge { display:inline-block; padding:2px 8px; border-radius:20px;
    font-size:.7rem; font-weight:700; margin-top:4px; }
.wlk-role-b2b { background:#dbeafe; color:#1d4ed8; }
.wlk-role-pnd { background:#fef3c7; color:#92400e; }
.wlk-nav { display:flex; flex-direction:column; padding:10px 0; }
.wlk-nav-a { display:flex; align-items:center; gap:10px;
    padding:11px 20px; font-size:.88rem; font-weight:600; color:#5a6a7e;
    transition:all .2s; position:relative; }
.wlk-nav-a:hover { background:#f4f6f9; color:#1B365D; }
.wlk-nav-a.active { background:#eff6ff; color:#1B365D; font-weight:800;
    border-right:3px solid #1B365D; }
.wlk-nav-ic { width:20px; text-align:center; font-size:1rem; }
.wlk-nav-badge { margin-left:auto; background:#E8792B; color:#fff;
    border-radius:10px; padding:1px 7px; font-size:.72rem; font-weight:700; }
.wlk-nav-b2b { color:#16a34a; font-size:.84rem; }
.wlk-nav-out { color:#e74c3c; }
.wlk-nav-out:hover { background:#fef2f2; color:#c0392b; }
.wlk-sb-mgr { padding:16px 20px; border-top:1px solid #f0f2f5;
    display:flex; flex-direction:column; gap:8px; }
.wlk-sb-mgr-label { font-size:.72rem; color:#5a6a7e; text-transform:uppercase;
    letter-spacing:.05em; }
.wlk-sb-mgr-name { font-weight:800; font-size:.88rem; color:#1B365D; }

/* ─── Main ──────────────────────────────────────────────────────────────── */
.wlk-main { min-width:0; display:flex; flex-direction:column; gap:20px; }
.wlk-section-head { margin-bottom:4px; }
.wlk-section-head h2 { font-family:'Manrope',sans-serif; font-size:1.35rem;
    font-weight:800; color:#1B365D; margin:0 0 4px; }
.wlk-section-head p { color:#5a6a7e; font-size:.88rem; margin:0; }

/* ─── Cards ─────────────────────────────────────────────────────────────── */
.wlk-card { background:#fff; border-radius:14px; border:1px solid #e0e6ef;
    box-shadow:0 2px 12px rgba(27,54,93,.05); overflow:hidden; }
.wlk-card-head { padding:14px 20px; border-bottom:1px solid #f0f2f5;
    font-family:'Manrope',sans-serif; font-weight:800;
    font-size:.92rem; color:#1B365D; display:flex;
    align-items:center; justify-content:space-between; }
.wlk-card-more { font-size:.8rem; font-weight:600; color:#E8792B; }
.wlk-card-more:hover { text-decoration:underline; }
.wlk-head-danger { color:#e74c3c; border-color:#fecaca; background:#fef2f2; }

/* ─── Stats ─────────────────────────────────────────────────────────────── */
.wlk-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.wlk-stat { background:#fff; border-radius:12px; border:1px solid #e0e6ef;
    padding:18px 16px; display:flex; flex-direction:column;
    align-items:center; gap:6px; text-align:center;
    box-shadow:0 2px 8px rgba(27,54,93,.04); }
.wlk-stat-cta { cursor:pointer; transition:all .2s; }
.wlk-stat-cta:hover { border-color:#E8792B;
    box-shadow:0 4px 16px rgba(232,121,43,.12); transform:translateY(-2px); }
.wlk-stat-ic { width:40px; height:40px; border-radius:10px;
    display:flex; align-items:center; justify-content:center; font-size:1.1rem; }
.wlk-stat-v { font-family:'Manrope',sans-serif; font-size:1.6rem;
    font-weight:800; color:#1B365D; }
.wlk-stat-l { font-size:.78rem; color:#5a6a7e; }

/* ─── Orders ────────────────────────────────────────────────────────────── */
.wlk-order-wrap { border-bottom:1px solid #f0f2f5; }
.wlk-order-wrap:last-child { border-bottom:none; }
.wlk-order-head { display:flex; align-items:center; justify-content:space-between;
    padding:16px 20px; cursor:pointer; gap:12px;
    transition:background .15s; user-select:none; }
.wlk-order-head:hover { background:#f9fafb; }
.wlk-order-head:focus-visible { outline:2px solid #E8792B; outline-offset:-2px; }
.wlk-order-l { display:flex; align-items:center; gap:14px; flex-wrap:wrap; min-width:0; }
.wlk-order-r { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.wlk-order-num  { font-weight:800; font-size:.9rem; color:#1B365D; }
.wlk-order-date { font-size:.8rem; color:#5a6a7e; }
.wlk-order-items { font-size:.8rem; color:#5a6a7e;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:200px; }
.wlk-order-total { font-weight:800; color:#1B365D; font-size:.92rem; }
.wlk-chevron { font-size:.7rem; color:#5a6a7e; transition:transform .2s; }
.wlk-order-body { display:none; padding:0 20px 20px; }
.wlk-order-body.open { display:block; }

/* Timeline */
.wlk-tl { display:flex; align-items:flex-start; gap:0; margin-bottom:20px;
    overflow-x:auto; padding-bottom:4px; }
.wlk-tl-s { display:flex; flex-direction:column; align-items:center;
    flex:1; min-width:64px; position:relative; }
.wlk-tl-d { width:34px; height:34px; border-radius:50%;
    background:#e0e6ef; display:flex; align-items:center;
    justify-content:center; font-size:.9rem; color:#5a6a7e;
    transition:all .2s; z-index:1; position:relative; }
.wlk-tl-l { font-size:.7rem; color:#5a6a7e; margin-top:6px; text-align:center; }
.wlk-tl-s.done .wlk-tl-d  { background:#2eac6b; color:#fff; }
.wlk-tl-s.active .wlk-tl-d { background:#1B365D; color:#fff;
    box-shadow:0 0 0 3px rgba(27,54,93,.15); }
.wlk-tl-s.active .wlk-tl-l { font-weight:700; color:#1B365D; }
.wlk-tl-line { position:absolute; top:17px; left:50%; width:100%;
    height:2px; background:#e0e6ef; z-index:0; }
.wlk-tl-s.done .wlk-tl-line { background:#2eac6b; }

/* Order items */
.wlk-oit { border:1px solid #f0f2f5; border-radius:8px; overflow:hidden; }
.wlk-oit-head { display:grid; grid-template-columns:1fr 80px 100px 100px;
    padding:8px 14px; background:#f9fafb; font-size:.75rem;
    font-weight:700; color:#5a6a7e; }
.wlk-oit-row  { display:grid; grid-template-columns:1fr 80px 100px 100px;
    padding:10px 14px; border-top:1px solid #f0f2f5;
    font-size:.84rem; align-items:center; gap:4px; }
.wlk-oit-name { display:flex; align-items:center; gap:8px; }
.wlk-oit-name img { width:36px; height:36px; border-radius:6px;
    object-fit:cover; flex-shrink:0; }
.wlk-oit-sum { font-weight:800; }
.wlk-oit-disc { background:#fef2f2; }
.wlk-order-foot { display:flex; justify-content:space-between;
    align-items:flex-start; margin-top:16px; gap:12px; flex-wrap:wrap; }
.wlk-order-total-line { font-size:.95rem; font-weight:700; color:#1B365D; }
.wlk-order-meta { font-size:.8rem; color:#5a6a7e; margin-top:4px; }
.wlk-order-btns { display:flex; gap:8px; flex-wrap:wrap; }
.wlk-badge { display:inline-block; padding:3px 10px; border-radius:20px;
    font-size:.72rem; font-weight:700; color:#fff; }

/* ─── Leads ─────────────────────────────────────────────────────────────── */
.wlk-lead-row { display:flex; align-items:center; justify-content:space-between;
    padding:14px 20px; border-bottom:1px solid #f0f2f5;
    gap:12px; flex-wrap:wrap; }
.wlk-lead-row:last-child { border-bottom:none; }
.wlk-lead-row:hover { background:#f9fafb; }
.wlk-lead-num  { font-weight:800; font-size:.88rem; color:#1B365D; margin-right:10px; }
.wlk-lead-date { font-size:.8rem; color:#5a6a7e; margin-right:10px; }
.wlk-lead-name { font-size:.88rem; }
.wlk-lead-comm { display:block; font-size:.78rem; color:#5a6a7e; margin-top:3px; }

/* ─── Wishlist ──────────────────────────────────────────────────────────── */
.wlk-wish-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.wlk-wish-card { background:#fff; border-radius:12px; border:1px solid #e0e6ef;
    overflow:hidden; transition:box-shadow .2s; }
.wlk-wish-card:hover { box-shadow:0 4px 20px rgba(27,54,93,.1); }
.wlk-wish-img { display:block; aspect-ratio:4/3; overflow:hidden;
    background:#f4f6f9; }
.wlk-wish-img img { width:100%; height:100%; object-fit:cover;
    transition:transform .3s; }
.wlk-wish-card:hover .wlk-wish-img img { transform:scale(1.03); }
.wlk-wish-body { padding:14px 16px; }
.wlk-wish-name { display:block; font-weight:700; font-size:.88rem;
    color:#1B365D; margin-bottom:6px; line-height:1.3; }
.wlk-wish-name:hover { color:#E8792B; }
.wlk-wish-price { font-weight:800; color:#E8792B; margin-bottom:12px; }
.wlk-wish-actions { display:flex; gap:8px; }

/* ─── Profile ───────────────────────────────────────────────────────────── */
.wlk-pd-row { display:flex; justify-content:space-between; align-items:center;
    padding:10px 0; border-bottom:1px solid #f0f2f5;
    font-size:.88rem; }
.wlk-pd-row:last-of-type { border:none; }
.wlk-pd-note { font-size:.8rem; color:#5a6a7e; margin:0; line-height:1.5; }
.wlk-card-pd { border-color:#fecaca; }

/* ─── Details ───────────────────────────────────────────────────────────── */
.wlk-detail-row { display:flex; justify-content:space-between; align-items:center;
    padding:12px 20px; border-bottom:1px solid #f0f2f5;
    font-size:.88rem; }
.wlk-detail-row:last-child { border:none; }

/* ─── Empty state ───────────────────────────────────────────────────────── */
.wlk-empty { text-align:center; padding:48px 24px; }
.wlk-empty-ic { font-size:3rem; margin-bottom:16px; opacity:.4; }
.wlk-empty h3 { font-family:'Manrope',sans-serif; font-size:1.1rem;
    font-weight:800; color:#1B365D; margin:0 0 8px; }
.wlk-empty p { color:#5a6a7e; font-size:.88rem; margin:0 0 20px; }

/* ─── Responsive ────────────────────────────────────────────────────────── */
@media (max-width:1024px) {
    .wlk-wrap { grid-template-columns:220px 1fr; gap:16px; }
    .wlk-wish-grid { grid-template-columns:repeat(2,1fr); }
    .wlk-stats { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:768px) {
    .wlk-root { padding:16px 12px 40px; }
    .wlk-wrap { grid-template-columns:1fr; }
    .wlk-sb { position:static; }
    .wlk-nav { flex-direction:row; overflow-x:auto; padding:6px 12px;
        gap:4px; scrollbar-width:none; }
    .wlk-nav::-webkit-scrollbar { display:none; }
    .wlk-nav-a { flex-direction:column; gap:3px; padding:8px 12px;
        font-size:.75rem; white-space:nowrap; border-right:none; }
    .wlk-nav-a.active { border-right:none; border-bottom:3px solid #1B365D; }
    .wlk-sb-user { padding:16px; }
    .wlk-sb-mgr { display:none; }
    .wlk-stats { grid-template-columns:repeat(2,1fr); }
    .wlk-oit-head,.wlk-oit-row { grid-template-columns:1fr 50px 80px 80px; }
    .wlk-auth-box { padding:28px 20px; }
    .wf-row { grid-template-columns:1fr; }
}
@media (max-width:480px) {
    .wlk-wish-grid { grid-template-columns:1fr 1fr; }
    .wlk-order-items { display:none; }
    .wlk-oit-head,.wlk-oit-row { grid-template-columns:1fr 50px 80px; }
    .wlk-oit-head span:nth-child(3),
    .wlk-oit-row span:nth-child(3) { display:none; }
    .wlk-stats { grid-template-columns:repeat(2,1fr); }
    .wlk-auth-box { padding:24px 16px; }
}

/* === END WG-ACCOUNT-V9 === */