/* =========================================================
   SANJOG — FINAL MODERN LIGHT UI
   Visual-only layer. Existing APIs/JS remain compatible.
   ========================================================= */
:root{
  --sj-red:#b51e3d;
  --sj-red-dark:#86152d;
  --sj-pink:#fde8ed;
  --sj-pink-2:#fff4f6;
  --sj-gold:#d6a13b;
  --sj-gold-light:#f7e5b6;
  --sj-cream:#fffaf8;
  --sj-white:#ffffff;
  --sj-ink:#2d2024;
  --sj-muted:#786b70;
  --sj-line:#efd9df;
  --sj-shadow:0 18px 55px rgba(116,25,47,.10);
  --sj-radius:22px;
}
*{box-sizing:border-box}
body{background:linear-gradient(180deg,#fffafa 0,#fff5f6 50%,#fffaf8 100%)!important;color:var(--sj-ink)!important}
a{color:var(--sj-red)}
button,input,select,textarea{font:inherit}
.site-header{
  background:rgba(255,255,255,.94)!important;
  border-bottom:1px solid var(--sj-line)!important;
  box-shadow:0 5px 24px rgba(100,25,45,.06)!important;
  backdrop-filter:blur(16px);
}
.site-header .container{min-height:82px!important}
.brand-logo{height:58px!important;width:190px!important;max-width:190px!important;object-fit:contain!important}
.brand-mark,.brand-name{display:none!important}
.main-nav a{border-radius:999px!important;padding:11px 18px!important;color:#3a292e!important}
.main-nav a:hover,.main-nav a.active{background:var(--sj-pink)!important;color:var(--sj-red)!important}
.header-actions .user-chip{background:var(--sj-pink-2)!important;border:1px solid var(--sj-line)!important;color:var(--sj-red-dark)!important}
.btn{border-radius:999px!important;padding:12px 20px!important;font-weight:700!important;transition:.25s ease!important}
.btn-primary,.btn.wine{background:linear-gradient(135deg,#c32649,#9f1734)!important;color:#fff!important;border:0!important;box-shadow:0 9px 22px rgba(181,30,61,.18)!important}
.btn-primary:hover,.btn.wine:hover{transform:translateY(-2px)!important}
.btn-outline{background:#fff!important;border:1px solid #d96b82!important;color:var(--sj-red)!important}
.btn-gold{background:linear-gradient(135deg,#e5b84f,#c8942d)!important;color:#422b0b!important;border:0!important}
.btn-ghost{background:transparent!important;border:0!important;color:var(--sj-red)!important}

/* DASHBOARD */
.dashboard-shell{display:grid!important;grid-template-columns:255px minmax(0,1fr)!important;min-height:calc(100vh - 82px)!important;max-width:1500px;margin:0 auto}
.dash-sidebar{
  position:sticky!important;top:82px!important;height:calc(100vh - 82px)!important;
  background:linear-gradient(180deg,#fff,#fff7f8)!important;
  border-right:1px solid var(--sj-line)!important;
  padding:24px 16px!important;box-shadow:10px 0 35px rgba(130,30,55,.05)!important
}
.dash-user{background:linear-gradient(135deg,#fff0f3,#fff9ef)!important;border:1px solid var(--sj-line)!important;border-radius:20px!important;padding:18px!important;margin-bottom:18px!important}
.dash-user strong{color:var(--sj-red-dark)!important;font-size:17px!important}
.dash-user span{color:var(--sj-gold)!important}
.dash-nav button{
  width:100%!important;text-align:left!important;border:0!important;background:transparent!important;
  color:#4d3a40!important;border-radius:14px!important;padding:13px 15px!important;margin:3px 0!important;
  cursor:pointer!important;font-weight:700!important;transition:.2s!important
}
.dash-nav button:hover{background:#fff0f3!important;color:var(--sj-red)!important}
.dash-nav button.active{background:linear-gradient(135deg,#c32649,#a01836)!important;color:#fff!important;box-shadow:0 8px 20px rgba(181,30,61,.16)!important}
.dash-main{padding:42px 46px 70px!important;background:transparent!important}
.dash-panel{display:none!important;background:transparent!important;border:0!important;padding:0!important}
.dash-panel.active{display:block!important;animation:sjFade .45s ease both!important}
.dash-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px!important}
.dash-head h1,.dash-head h2{font-size:clamp(30px,4vw,48px)!important;margin:0!important;color:var(--sj-red-dark)!important}
.dash-head p{color:var(--sj-muted)!important;margin:7px 0 0!important}
.dash-extra{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px!important;margin-bottom:20px!important}
.mini-card{background:#fff!important;border:1px solid var(--sj-line)!important;border-radius:20px!important;padding:20px!important;box-shadow:var(--sj-shadow)!important}
.mini-card:before{content:"";display:block;width:34px;height:4px;border-radius:5px;background:linear-gradient(90deg,var(--sj-red),var(--sj-gold));margin-bottom:16px}
.mini-card strong{color:var(--sj-red-dark)!important;font-size:28px!important}
.form-card{
 background:#fff!important;border:1px solid var(--sj-line)!important;border-radius:22px!important;
 padding:26px!important;margin:18px 0!important;box-shadow:var(--sj-shadow)!important
}
.form-card h3{color:var(--sj-red-dark)!important;font-size:21px!important}
.form-grid{gap:17px!important}
.field-block label{color:#573f46!important;font-weight:700!important}
.field-block input,.field-block select,.field-block textarea{
 background:#fff!important;border:1px solid #e9cfd6!important;border-radius:13px!important;padding:13px 14px!important
}
.field-block input:focus,.field-block select:focus,.field-block textarea:focus{outline:none!important;border-color:#d34e6a!important;box-shadow:0 0 0 4px rgba(211,78,106,.10)!important}
.photo-grid img,.photo-item img{border-radius:16px!important;box-shadow:0 8px 24px rgba(80,20,35,.12)!important}
.profile-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:20px!important}
.profile-card{background:#fff!important;border:1px solid var(--sj-line)!important;border-radius:22px!important;overflow:hidden!important;box-shadow:var(--sj-shadow)!important;animation:sjFade .5s ease both!important}
.profile-card:hover{transform:translateY(-7px)!important;box-shadow:0 25px 65px rgba(100,20,40,.16)!important}
.profile-card .profile-photo{min-height:280px!important;background-size:cover;background-position:center top;object-fit:cover;object-position:center top}
.profile-card .profile-photo img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center top!important}
.notification-item{background:#fff!important;border:1px solid var(--sj-line)!important;border-radius:18px!important;padding:18px!important;margin:10px 0!important;box-shadow:0 10px 30px rgba(100,20,40,.06)!important}
.notification-item.unread{background:linear-gradient(90deg,#fff0f3,#fff)!important;border-left:4px solid var(--sj-red)!important}
.chat-shell{background:#fff!important;border:1px solid var(--sj-line)!important;border-radius:22px!important;overflow:hidden!important;box-shadow:var(--sj-shadow)!important}
.chat-list{background:#fff8f9!important;border-right:1px solid var(--sj-line)!important}
.chat-item{border-bottom:1px solid var(--sj-line)!important;padding:16px!important}
.price-card{background:#fff!important;border:1px solid var(--sj-line)!important;border-radius:22px!important;box-shadow:var(--sj-shadow)!important}
.match-badge{background:var(--sj-pink)!important;color:var(--sj-red)!important}
.table-wrap{background:#fff!important;border:1px solid var(--sj-line)!important;border-radius:18px!important;box-shadow:var(--sj-shadow)!important}

/* PROFILE */
.profile-detail{
 display:grid!important;grid-template-columns:minmax(300px,440px) minmax(0,1fr)!important;gap:42px!important;
 background:#fff!important;border:1px solid var(--sj-line)!important;border-radius:28px!important;
 padding:28px!important;box-shadow:0 25px 80px rgba(100,20,40,.12)!important
}
.profile-detail h1{font-size:clamp(34px,4vw,58px)!important;color:var(--sj-red-dark)!important}
.main-photo{height:500px!important;max-height:none!important;border-radius:24px!important;box-shadow:0 20px 55px rgba(80,20,35,.16)!important;border:6px solid #fff!important}
.gallery img{border:3px solid #fff!important;border-radius:13px!important;box-shadow:0 5px 15px rgba(80,20,35,.10)!important}
.profile-tags span{background:var(--sj-pink)!important;color:var(--sj-red-dark)!important;border-radius:999px!important;padding:8px 13px!important}
.feature-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important}
.feature-grid>div{background:#fff9f9!important;border:1px solid var(--sj-line)!important;border-radius:16px!important;padding:17px!important}
.feature-grid b{color:var(--sj-red)!important}
.contact-card{background:linear-gradient(135deg,#fff1f4,#fff8eb)!important;border:1px solid var(--sj-line)!important;border-radius:18px!important;padding:18px!important}
.action-row{margin:22px 0!important}

/* ADMIN */
body.admin-page{background:linear-gradient(180deg,#fffafa,#fff5f6)!important}
.admin-page header{height:82px!important;background:rgba(255,255,255,.96)!important;border-bottom:1px solid var(--sj-line)!important;box-shadow:0 5px 24px rgba(100,25,45,.06)!important}
.admin-page .brand{display:flex!important;align-items:center!important;gap:12px!important}
.admin-page .brand-logo{height:54px!important;width:175px!important;object-fit:contain!important}
.admin-page main{max-width:1500px!important;padding:42px 5% 70px!important}
.admin-page h1{font-size:48px!important;color:var(--sj-red-dark)!important}
.admin-page .sub{color:var(--sj-muted)!important}
.admin-page .stats{grid-template-columns:repeat(4,1fr)!important;gap:18px!important}
.admin-page .stat{
 background:#fff!important;border:1px solid var(--sj-line)!important;border-radius:20px!important;
 padding:22px!important;box-shadow:var(--sj-shadow)!important;position:relative;overflow:hidden
}
.admin-page .stat:after{content:"";position:absolute;right:-25px;top:-25px;width:85px;height:85px;border-radius:50%;background:var(--sj-pink)}
.admin-page .stat label{color:var(--sj-muted)!important;position:relative;z-index:1}
.admin-page .stat b{font-size:32px!important;color:var(--sj-red-dark)!important;position:relative;z-index:1}
.admin-page .tabs{background:#fff;border:1px solid var(--sj-line);border-radius:999px;padding:6px;width:max-content;box-shadow:0 8px 25px rgba(100,20,40,.06)}
.admin-page .tab{border:0!important;border-radius:999px!important;background:transparent!important;color:#5b464c!important}
.admin-page .tab.active{background:linear-gradient(135deg,#c32649,#a01836)!important;color:#fff!important}
.admin-page .panel{background:#fff!important;border:1px solid var(--sj-line)!important;border-radius:24px!important;padding:26px!important;box-shadow:var(--sj-shadow)!important}
.admin-page .panel h2{font-size:28px!important;color:var(--sj-red-dark)!important}
.admin-page .toolbar{background:#fff7f8;padding:12px;border-radius:16px}
.admin-page .toolbar input,.admin-page .toolbar select,.admin-page .field input,.admin-page .field select{
 border:1px solid #e9cfd6!important;border-radius:12px!important;background:#fff!important;padding:12px!important
}
.admin-page .table{min-width:1050px!important}
.admin-page .table th{background:#fff0f3!important;color:var(--sj-red-dark)!important}
.admin-page .table td{border-bottom:1px solid #f1e1e5!important}
.admin-page .card{background:#fff9fa!important;border:1px solid var(--sj-line)!important;border-radius:18px!important}
.admin-page .modal .box{background:#fff!important;border:1px solid var(--sj-line)!important;box-shadow:0 30px 90px rgba(70,15,30,.18)!important}

/* animation */
@keyframes sjFade{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}

@media(max-width:1050px){
 .dashboard-shell{display:block!important;width:100%!important}
 .dash-main{padding:24px 16px!important}
 .profile-grid{grid-template-columns:repeat(2,1fr)!important}
 .admin-page .stats{grid-template-columns:repeat(2,1fr)!important}
}
@media(max-width:760px){
 .dashboard-shell{display:block!important;width:100%!important}
 .dash-sidebar{position:relative!important;top:auto!important;height:auto!important;border-right:0!important;border-bottom:1px solid var(--sj-line)!important}
 .dash-nav{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:4px!important}
 .dash-main{padding:25px 16px!important}
 .dash-extra{grid-template-columns:1fr!important}
 .profile-grid{grid-template-columns:1fr!important}
 .profile-detail{grid-template-columns:1fr!important;padding:18px!important}
 .main-photo{height:auto!important;max-height:500px!important}
 .feature-grid{grid-template-columns:1fr!important}
 .admin-page main{padding:28px 16px!important}
 .admin-page .stats{grid-template-columns:1fr!important}
 .admin-page .tabs{width:100%;overflow:auto}
}

.password-rules{display:flex;gap:14px;flex-wrap:wrap;margin-top:8px;font-size:12px;color:#a23b52}.password-rules span.ok{color:#177245;font-weight:800}.password-rules span{transition:.2s}