@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");
:root{--ink:#052d28;--mint:#00ffd0;--paper:#fbfdfc;--white:#fff;--line:#e6ece9;--soft:#f2f6f4;--muted:#71807b;--shadow:0 18px 50px rgba(5,45,40,.08);--radius:24px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Inter",ui-sans-serif,system-ui,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}img{max-width:100%;display:block}.shell{width:min(1180px,calc(100% - 40px));margin:0 auto}.hidden{display:none!important}.topbar{position:sticky;top:0;z-index:30;background:rgba(251,253,252,.86);backdrop-filter:blur(18px);border-bottom:1px solid rgba(5,45,40,.07)}.nav-inner{height:78px;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{display:flex;align-items:center;gap:2px;min-width:max-content}.brand-logo{width:92px;height:92px;object-fit:contain;flex:none}.brand-copy{display:flex;flex-direction:column;line-height:1.02}.brand-copy strong{letter-spacing:.08em;font-size:15px;font-weight:800}.brand-copy .brand-local{font-weight:400}.brand-copy small{font-size:10px;color:var(--muted);margin-top:4px}.nav-links{display:flex;gap:28px;margin-left:auto}.nav-links a{font-size:13px;color:#53625e;padding:9px 0}.nav-links a.active,.nav-links a:hover{color:var(--ink)}.nav-actions{display:flex;align-items:center;gap:10px}.ghost-btn,.outline-btn,.dark-btn,.filter-btn,.search-submit{border:0;border-radius:14px;padding:11px 16px;font-weight:650;font-size:13px;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.2s ease}.ghost-btn{background:transparent;color:var(--ink)}.ghost-btn:hover{background:var(--soft)}.outline-btn{background:var(--white);color:var(--ink);border:1px solid var(--line)}.outline-btn:hover{transform:translateY(-1px);border-color:#cfdad5}.dark-btn{background:var(--ink);color:#fff;box-shadow:0 8px 20px rgba(5,45,40,.14)}.dark-btn:hover{transform:translateY(-1px);box-shadow:0 12px 24px rgba(5,45,40,.18)}.logout-btn{border:0;background:transparent;color:#7a8681;font-weight:600;font-size:12px;padding:9px 4px;display:inline-flex;align-items:center;gap:7px}.logout-btn:hover{color:var(--ink)}.logout-btn svg{width:15px;height:15px}.link-btn{white-space:nowrap}.full{width:100%}.hero{position:relative;overflow:hidden;padding:72px 0 28px;background:linear-gradient(180deg,#eefaf6 0%,#f7fbf9 55%,var(--paper) 100%)}.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 5%,rgba(0,255,208,.16),transparent 38%);pointer-events:none}.hero-inner{position:relative;text-align:center}.hero-orb{position:absolute;border-radius:999px;filter:blur(2px);pointer-events:none}.orb-one{width:320px;height:320px;left:-170px;top:80px;background:rgba(0,255,208,.08)}.orb-two{width:260px;height:260px;right:-140px;top:220px;background:rgba(5,45,40,.05)}.hero h1{font-size:clamp(48px,6.2vw,82px);line-height:.95;letter-spacing:-.055em;margin:25px 0 18px;font-weight:780}.hero h1 span{font-style:normal;color:var(--ink);position:relative}.hero h1 span:after{content:"";position:absolute;left:0;right:0;height:8px;background:var(--mint);bottom:5px;z-index:-1;border-radius:99px}.hero-copy{max-width:680px;margin:0 auto;color:#61706c;font-size:17px;line-height:1.7}.search-wrap{max-width:980px;margin:38px auto 0;position:relative;z-index:4}.search-bar{display:grid;grid-template-columns:1.55fr .9fr auto 58px;align-items:center;gap:8px;padding:9px;background:rgba(255,255,255,.97);border:1px solid rgba(5,45,40,.09);border-radius:22px;box-shadow:0 22px 60px rgba(5,45,40,.13);text-align:left}.search-input-wrap,.location-wrap{display:flex;align-items:center;gap:11px;padding:0 13px;height:52px}.search-input-wrap svg,.location-wrap svg{width:18px;height:18px;color:#76857f;flex:none}.search-input-wrap input{width:100%;border:0;outline:0;background:transparent;font-size:15px;color:var(--ink)}.location-wrap{border-left:1px solid var(--line)}.location-wrap select{border:0;outline:0;background:transparent;width:100%;color:#5e6e68;font-size:14px}.filter-btn{height:52px;background:var(--soft);color:var(--ink)}.filter-btn:hover{background:#e9f0ed}.filter-count{min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:var(--mint);display:inline-flex;align-items:center;justify-content:center;font-size:11px}.search-submit{width:52px;height:52px;padding:0;background:var(--ink);color:#fff;border-radius:17px}.search-submit svg{width:19px}.filter-panel{margin:10px auto 0;padding:16px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);display:grid;grid-template-columns:repeat(3,1fr);gap:12px;text-align:left}.filter-panel label{font-size:11px;color:#65746e;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.filter-panel select{width:100%;margin-top:7px;padding:12px 12px;border:1px solid var(--line);border-radius:12px;background:#fbfdfc;color:var(--ink);outline:0}.hero-note{margin:22px auto 0;display:flex;justify-content:center;align-items:center;gap:12px;color:#75827f;font-size:12px}.hero-note strong{color:var(--ink)}.note-divider{width:4px;height:4px;border-radius:99px;background:var(--mint)}.results-section{padding:30px 0 90px}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:28px}.section-head h2,.how-grid h2,.pro-cta h2{font-size:clamp(32px,4vw,48px);line-height:1.05;letter-spacing:-.045em;margin:9px 0 0}.results-meta{display:flex;gap:10px;align-items:center;color:#6c7b76;font-size:12px}.random-pill{display:inline-flex;gap:7px;align-items:center;border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 11px}.random-pill svg{width:14px}.cards-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.pro-card{border:1px solid var(--line);background:#fff;border-radius:22px;overflow:hidden;transition:.22s ease;box-shadow:0 9px 28px rgba(5,45,40,.035)}.pro-card:hover{transform:translateY(-5px);box-shadow:0 22px 50px rgba(5,45,40,.09)}.card-link{display:block;height:100%}.card-media{height:112px;padding:16px;display:flex;justify-content:space-between;align-items:flex-start;background:linear-gradient(145deg,#eaf8f4,#f7fbf9)}.avatar{width:58px;height:58px;border-radius:18px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;letter-spacing:.03em;font-size:17px;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}.verified-badge{display:inline-flex;align-items:center;gap:5px;background:rgba(255,255,255,.86);border:1px solid rgba(5,45,40,.08);padding:7px 9px;border-radius:999px;font-size:10px;font-weight:700;color:#456059}.verified-badge svg{width:13px;height:13px}.verified-badge.small{padding:6px 8px}.card-body{padding:17px 17px 14px}.card-body h3{font-size:19px;letter-spacing:-.02em;margin:0}.role{margin:6px 0 13px;color:#60706a;font-size:13px}.location-line{margin:0;display:flex;align-items:center;gap:6px;color:#77837f;font-size:12px}.location-line svg{width:14px;height:14px}.stats-row{display:flex;gap:16px;align-items:center;margin-top:16px;font-size:12px;color:#5c6c66}.stats-row span{display:inline-flex;align-items:center;gap:6px}.stats-row svg{width:14px;height:14px}.stats-row b{color:var(--ink)}.card-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:15px}.card-tags span,.tag-list span{padding:7px 9px;border-radius:10px;background:#f3f7f5;font-size:11px;color:#5f6e68}.card-footer{display:flex;justify-content:space-between;align-items:center;padding:14px 17px;border-top:1px solid var(--line);font-size:11px;font-weight:750;color:#5f6d67}.arrow-circle{width:30px;height:30px;border-radius:99px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center}.arrow-circle svg{width:14px;height:14px}.demo-card .card-media{background:linear-gradient(145deg,#f3faf8,#fff)}.load-state{display:flex;align-items:center;justify-content:center;gap:9px;padding:28px 0;color:#72817b;font-size:12px}.loading-dot{width:8px;height:8px;border-radius:99px;background:var(--mint);box-shadow:0 0 0 6px rgba(0,255,208,.12);animation:pulse 1s infinite}@keyframes pulse{50%{transform:scale(.65);opacity:.6}}.how-section{padding:108px 0;background:#f1f6f4;border-top:1px solid #e7efeb;border-bottom:1px solid #e7efeb}.how-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px}.how-grid>div:first-child p{max-width:480px;color:#687871;line-height:1.7;margin-top:23px}.steps{display:flex;flex-direction:column;gap:16px}.step{display:grid;grid-template-columns:48px 1fr;gap:20px;padding:22px;background:#fff;border:1px solid var(--line);border-radius:20px}.step>span{font-size:11px;font-weight:800;color:#73827c;padding-top:4px}.step h3{margin:0 0 6px;font-size:18px}.step p{margin:0;color:#6e7c76;font-size:13px;line-height:1.6}.pro-cta{padding:100px 0;background:var(--ink);color:#fff}.pro-cta-inner{display:flex;justify-content:space-between;align-items:end;gap:40px}.pro-cta .pro-cta h2{font-size:clamp(34px,4vw,54px)}.pro-cta p{max-width:560px;color:#bed0cb;line-height:1.7;margin-top:20px}.pro-cta .dark-btn{background:var(--mint);color:var(--ink);box-shadow:none}.overlay{position:fixed;inset:0;background:rgba(5,24,21,.38);backdrop-filter:blur(10px);z-index:100;display:flex;align-items:center;justify-content:center;padding:20px}.auth-card{width:min(440px,100%);background:#fff;border-radius:26px;padding:30px;box-shadow:0 30px 90px rgba(0,0,0,.2);position:relative}.modal-close{position:absolute;top:14px;right:14px;border:0;background:#f2f6f4;width:34px;height:34px;border-radius:99px;display:flex;align-items:center;justify-content:center}.modal-close svg{width:16px}.auth-card h2{font-size:30px;letter-spacing:-.04em;margin:9px 0}.auth-card>p{color:#71807b;font-size:13px;line-height:1.6}.auth-card form{display:flex;flex-direction:column;gap:12px;margin-top:22px}.auth-card label,.editor-form label{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:#6c7a75;font-weight:750}.auth-card input,.auth-card select,.editor-form input,.editor-form select,.editor-form textarea,.add-row select,.inline-form input,.project-form input,.project-form textarea{margin-top:7px;width:100%;border:1px solid var(--line);background:#fbfdfc;border-radius:12px;padding:12px 13px;outline:0;color:var(--ink)}.auth-card input:focus,.editor-form input:focus,.editor-form select:focus,.editor-form textarea:focus,.inline-form input:focus,.project-form input:focus,.project-form textarea:focus{border-color:#b5cbc4;box-shadow:0 0 0 4px rgba(0,255,208,.09)}.auth-error{margin:0;background:#fff2f0;color:#a13e31;padding:10px 11px;border-radius:10px;font-size:12px!important}.text-btn{border:0;background:transparent;color:#315a52;font-size:12px;font-weight:700;display:block;margin:15px auto 0}.dashboard-main,.profile-main{padding:56px 0 100px}.dash-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:32px}.dash-heading h1{font-size:48px;letter-spacing:-.05em;margin:10px 0 8px}.dash-heading p{color:#71807b;margin:0}.dash-grid{display:grid;grid-template-columns:230px 1fr;gap:24px}.side-nav{align-self:start;position:sticky;top:98px;padding:10px;background:#f1f6f4;border:1px solid var(--line);border-radius:18px}.side-link{width:100%;border:0;background:transparent;color:#61716b;display:flex;align-items:center;gap:10px;padding:12px 13px;border-radius:12px;font-weight:700;font-size:12px;text-align:left}.side-link.active,.side-link:hover{background:#fff;color:var(--ink);box-shadow:0 6px 16px rgba(5,45,40,.05)}.side-link svg{width:16px}.dash-panel{display:none}.dash-panel.active{display:block}.stats-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.stat-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px}.stat-card span{display:block;color:#728079;font-size:11px}.stat-card strong{display:block;font-size:30px;letter-spacing:-.04em;margin:8px 0 10px}.stat-card small{display:flex;align-items:center;gap:6px;color:#74817b;font-size:11px}.stat-card small svg{width:13px}.welcome-card{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:-22px;margin-bottom:24px;padding:28px;border:1px solid var(--line);background:linear-gradient(135deg,#f2faf7,#fff);border-radius:22px}.welcome-card h2{font-size:27px;margin:9px 0}.welcome-card p{color:#6b7a74;max-width:560px}.mini-profile{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:17px;padding:10px 12px;min-width:210px}.mini-profile .avatar{width:44px;height:44px;border-radius:14px;font-size:13px}.mini-profile span{display:block;color:#71807b;font-size:11px;margin-top:4px}.dash-panel{background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px}.panel-header{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}.panel-header h2{font-size:29px;letter-spacing:-.04em;margin:8px 0}.panel-header p{color:#71807b;font-size:13px;margin:0}.form-grid.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.editor-form{display:flex;flex-direction:column;gap:15px}.editor-form textarea{resize:vertical}.switch-row{display:flex;align-items:center;gap:10px;text-transform:none!important;letter-spacing:0!important;font-size:13px!important;color:var(--ink)!important;padding:13px;border:1px solid var(--line);border-radius:12px;background:#fbfdfc}.switch-row input{width:18px!important;margin:0!important}.form-actions{display:flex;justify-content:flex-end;align-items:center;gap:14px;margin-top:4px}.save-status{font-size:11px;color:#52736a}.add-row{display:flex;gap:10px;margin-top:20px}.add-row select{margin:0}.editor-chip-list{display:flex;flex-wrap:wrap;gap:8px}.editor-chip{display:inline-flex;align-items:center;gap:7px;padding:8px 10px;border-radius:11px;background:#f2f6f4;font-size:12px}.editor-chip button{border:0;background:transparent;padding:0;display:flex}.editor-chip svg{width:13px}.inline-form,.project-form{display:grid;grid-template-columns:1fr 1.5fr 1fr auto;gap:10px;margin-bottom:18px}.inline-form input,.project-form input,.project-form textarea{margin:0}.project-form{grid-template-columns:1fr 1fr}.project-form textarea{grid-column:1/-1}.project-form .dark-btn{grid-column:1/-1;justify-self:start}.manage-list,.project-list{display:flex;flex-direction:column;gap:10px}
/* PRONET — service cards dashboard */
#serviceList .manage-item{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:14px;
  padding:18px;
  border-radius:18px;
  background:var(--card);
  transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
#serviceList .manage-item:hover{
  border-color:rgba(0,255,208,.32);
  transform:translateY(-1px);
  box-shadow:0 10px 28px rgba(5,45,40,.06);
}
#serviceList .manage-item>div:first-child{
  width:100%;
  min-width:0;
  gap:7px;
}
#serviceList .manage-item>div:first-child strong{
  font-size:15px;
  line-height:1.35;
}
#serviceList .manage-item>div:first-child span{
  display:block;
  width:100%;
  line-height:1.55;
  overflow-wrap:anywhere;
}
#serviceList .service-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  gap:14px;
  padding-top:12px;
  border-top:1px solid var(--line);
}
#serviceList .service-price{
  margin:0;
  font-size:13px;
  font-weight:800;
  white-space:nowrap;
}
#serviceList .service-actions{
  margin-left:auto;
}
html[data-theme="dark"] #serviceList .manage-item:hover{
  box-shadow:0 10px 28px rgba(0,0,0,.18);
}
.manage-item,.project-item{display:flex;justify-content:space-between;align-items:center;gap:20px;border:1px solid var(--line);border-radius:15px;padding:14px}.manage-item>div:first-child{
  display:flex;
  flex-direction:column;
  gap:5px;
  align-items:flex-start;
  text-align:left;
}.manage-item span,.project-copy p{color:#71807b;font-size:12px}.manage-item>div:last-child{display:flex;align-items:center;gap:16px}.icon-danger{border:0;background:#fff1f0;color:#a44a3d;width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center}.icon-danger svg{width:14px}.project-item{align-items:flex-start}.project-thumb{width:92px;height:74px;border-radius:12px;overflow:hidden;background:#edf3f0;display:flex;align-items:center;justify-content:center;flex:none}.project-thumb img{width:100%;height:100%;object-fit:cover}.project-thumb svg{width:20px;color:#8c9993}.project-copy{flex:1}.project-copy strong{display:block}.project-copy p{margin:6px 0;line-height:1.5}.project-copy a{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:750}.project-copy a svg{width:13px}.empty-inline{padding:22px;text-align:center;border:1px dashed #ccd7d2;border-radius:14px;color:#7a8781;font-size:12px}.guard-card{max-width:520px;margin:80px auto;padding:40px;text-align:center;background:#fff;border:1px solid var(--line);border-radius:25px;box-shadow:var(--shadow)}.guard-card>svg{width:36px;height:36px}.guard-card h1{font-size:32px;letter-spacing:-.04em;margin:12px 0}.guard-card p{color:#71807b;line-height:1.6}.guard-card .dark-btn{margin-top:14px}.profile-loading{padding:80px;text-align:center;color:#75827c}.public-profile{background:#fff;border:1px solid var(--line);border-radius:28px;overflow:hidden;box-shadow:var(--shadow)}.profile-cover{height:240px;background:linear-gradient(135deg,#052d28,#0c5c50 50%,#00bfa0);background-size:cover;background-position:center}.profile-head{position:relative;z-index:2;padding:0 30px 28px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:20px;margin-top:0}.profile-avatar-large{width:108px;height:108px;border:6px solid #fff;border-radius:30px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;font-weight:800;font-size:28px;flex:none;margin-top:-54px;position:relative;z-index:3}.profile-avatar-large img{width:100%;height:100%;object-fit:cover}.profile-identity{min-width:0;padding-bottom:4px}.verified-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}.verified-line h1{font-size:38px;line-height:1.04;letter-spacing:-.05em;margin:0;overflow-wrap:anywhere;max-width:100%}.verified-line .verified-badge{background:#effcf8}.profile-identity>p{margin:7px 0 10px;color:#61716b}.profile-location{display:inline-flex;align-items:center;gap:6px;color:#76837e;font-size:12px}.profile-location svg{width:14px}.profile-head>.dark-btn{margin-bottom:5px}.profile-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:26px;padding:0 30px 34px}.profile-main-col{min-width:0}.public-section{padding:30px 0;border-top:1px solid var(--line)}.public-section:first-child{border-top:0}.public-section h2{font-size:26px;letter-spacing:-.04em;margin:8px 0 14px}.public-section>p{color:#687871;line-height:1.8;white-space:pre-line}.tag-list{display:flex;flex-wrap:wrap;gap:8px}.service-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.service-card{border:1px solid var(--line);border-radius:16px;padding:15px}.service-card strong{font-size:14px}.service-card p{font-size:12px;color:#71807b;line-height:1.5}.service-card>b{display:block;margin-top:12px;font-size:12px}.portfolio-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.portfolio-item{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fff}.portfolio-image{height:160px;background:#f0f4f2;display:flex;align-items:center;justify-content:center}.portfolio-image img{width:100%;height:100%;object-fit:cover}.portfolio-image svg{width:24px;color:#83908b}.portfolio-item>div:last-child{padding:13px}.portfolio-item strong{font-size:14px}.portfolio-item p{font-size:12px;color:#71807b;line-height:1.5;margin:6px 0 0}.reviews-list{display:flex;flex-direction:column;gap:10px}.review-item{border:1px solid var(--line);border-radius:16px;padding:15px}.review-top{display:flex;justify-content:space-between;gap:20px;font-size:12px}.review-top span{color:#0e8b72;letter-spacing:2px}.review-item p{font-size:12px;color:#687871;line-height:1.6;margin:8px 0 0}.profile-side{padding-top:30px}.profile-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}.profile-stats div{background:#f4f8f6;border:1px solid var(--line);padding:16px;border-radius:16px}.profile-stats strong{display:block;font-size:25px;letter-spacing:-.04em}.profile-stats span{font-size:11px;color:#728079}.contact-card{margin-top:12px;border:1px solid var(--line);padding:18px;border-radius:18px;background:#f8fbfa}.contact-card h3{font-size:18px;margin:8px 0}.contact-card p{font-size:12px;color:#71807b;line-height:1.55}.contact-card .outline-btn{margin-top:10px}
@media (min-width:981px){.brand-logo{width:60px;height:60px}}@media (max-width:980px){.nav-links{display:none}.cards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.search-bar{grid-template-columns:1fr 1fr auto 58px}.search-input-wrap,.location-wrap{border-left:0}.location-wrap{border-top:1px solid var(--line);grid-column:1/3}.profile-layout,.dash-grid{grid-template-columns:1fr}.side-nav{position:static;display:flex;overflow:auto}.side-link{white-space:nowrap}.stats-cards{grid-template-columns:repeat(2,1fr)}.profile-side{padding-top:0}}
@media (max-width:980px) and (min-width:641px){.profile-head{grid-template-columns:auto minmax(0,1fr);align-items:end}.profile-head>.dark-btn{grid-column:1/-1;justify-self:start}.profile-identity{padding-bottom:4px}}
@media (max-width:640px){.shell{width:min(100% - 24px,1180px)}.nav-inner{height:68px}.brand-copy small{display:none}.nav-actions .ghost-btn{display:none}.nav-actions .dark-btn{padding:10px 12px}.hero{padding:50px 0 38px}.hero h1{font-size:47px}.hero-copy{font-size:14px}.search-bar{grid-template-columns:1fr;gap:7px;border-radius:19px}.search-input-wrap,.location-wrap,.filter-btn{grid-column:1}.search-input-wrap{border-bottom:1px solid var(--line)}.location-wrap{border-top:0}.filter-btn{justify-content:space-between}.search-submit{position:absolute;right:11px;top:11px;width:48px;height:48px}.filter-panel{grid-template-columns:1fr}.hero-note{flex-wrap:wrap;line-height:1.4}.section-head{align-items:start;flex-direction:column}.cards-grid{grid-template-columns:1fr}.results-section{padding-top:56px}.how-grid{gap:40px}.pro-cta-inner{align-items:start;flex-direction:column}.dash-heading{align-items:start;flex-direction:column}.dash-heading h1{font-size:38px}.stats-cards{grid-template-columns:1fr 1fr}.welcome-card{align-items:flex-start;flex-direction:column}.mini-profile{width:100%}.dash-panel{padding:20px}.form-grid.two,.service-grid,.portfolio-grid,.inline-form,.project-form{grid-template-columns:1fr}.panel-header{align-items:start;flex-direction:column}.profile-head{align-items:flex-start;flex-direction:column;padding:0 18px 22px;margin-top:0}.profile-avatar-large{margin-top:-45px}.profile-identity{padding:0}.verified-line h1{font-size:30px}.profile-head>.dark-btn{width:100%;margin-top:5px}.profile-layout{padding:0 18px 22px}.profile-cover{height:180px}.profile-avatar-large{width:90px;height:90px;border-radius:25px}.service-grid{grid-template-columns:1fr}.portfolio-grid{grid-template-columns:1fr}.profile-side{display:block}.profile-stats{grid-template-columns:repeat(3,1fr)}.profile-stats div{padding:12px}.profile-stats strong{font-size:20px}.profile-stats span{font-size:10px}.auth-card{padding:24px}.manage-item{align-items:flex-start;flex-direction:column}.manage-item>div:last-child{width:100%;justify-content:space-between}}

em{font-style:normal}
.media-upload-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.media-uploader{display:flex;align-items:center;gap:14px;padding:14px;border:1px solid var(--line);border-radius:16px;background:#fbfdfc}.media-preview{width:90px;height:76px;border-radius:14px;background:#eef4f1;overflow:hidden;display:flex;align-items:center;justify-content:center;flex:none;color:#81908a}.media-preview.avatar-preview{width:76px;height:76px;border-radius:20px}.media-preview.cover-preview{width:140px;height:54px;border-radius:12px}.media-preview.cover-preview img{width:100%;height:100%;object-fit:cover;object-position:center}.media-preview .placeholder-icon{width:20px}.media-copy{display:flex;flex-direction:column;gap:5px;min-width:0}.media-copy strong{font-size:13px}.media-copy span{font-size:10px;color:#77847f;line-height:1.4}.upload-btn{display:inline-flex;align-items:center;gap:7px;width:max-content;margin-top:4px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);font-size:11px;font-weight:700;cursor:pointer}.upload-btn svg{width:13px;height:13px}.upload-btn input{display:none}
@media (max-width:980px){.media-upload-grid{grid-template-columns:1fr}}
.demo-profile-modal{max-width:520px}.demo-profile-head{display:flex;align-items:center;gap:15px;margin:18px 0}.demo-profile-head h2{margin:0;font-size:28px;letter-spacing:-.04em}.demo-profile-head p{margin:5px 0 9px;color:#687871;font-size:13px}.demo-profile-avatar{width:72px;height:72px;border-radius:22px;overflow:hidden;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;flex:none}.demo-profile-avatar img{width:100%;height:100%;object-fit:cover}.demo-profile-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.demo-profile-stats div{background:#f4f8f6;border:1px solid var(--line);border-radius:15px;padding:14px}.demo-profile-stats strong{display:block;font-size:25px}.demo-profile-stats span{font-size:11px;color:#728079}
.logout-action{background:#fff!important;color:#64716c!important;border-color:var(--line)!important;box-shadow:none!important}
.icon-nav-btn{width:38px;height:38px;border:1px solid var(--line);background:#fff;color:#697770;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.icon-nav-btn svg{width:16px;height:16px}
.icon-nav-btn:hover{background:#f5f8f6;color:var(--ink)}
.role-card{display:flex;align-items:center;gap:16px;border:1px solid var(--line);background:#f6faf8;border-radius:18px;padding:18px 20px}
.role-icon{width:46px;height:46px;border-radius:14px;background:#e4faf4;color:#087765;display:flex;align-items:center;justify-content:center;flex:none}
.role-icon svg{width:21px;height:21px}
.role-card strong{font-size:15px;display:inline-flex;align-items:center;gap:5px}.role-status-icon{width:15px;height:15px;color:#087765;flex:none}.role-card p{color:#71807b;font-size:12px;margin:5px 0 0;line-height:1.5}
.role-note{display:flex;gap:7px;align-items:center;color:#7a8781;font-size:11px;line-height:1.5;margin-top:12px}.role-note svg{width:15px;height:15px;flex:none;margin-top:0}
.hidden{display:none!important}
.profile-card-note{display:flex;align-items:center;gap:8px;font-size:11px;color:#6d7b75;margin-top:8px}
.profile-card-note svg{width:14px}
.contact-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.contact-link{display:flex;align-items:center;gap:11px;padding:13px 14px;border:1px solid var(--line);border-radius:15px;background:#fbfdfc;color:var(--ink)}
.contact-link svg{width:17px;height:17px;color:#07866f;flex:none}.contact-link span{display:flex;flex-direction:column;gap:3px;min-width:0}.contact-link small{font-size:10px;color:#7b8782}.contact-link strong{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.contact-public-section{padding-bottom:0}
.public-section.hidden{display:none}
@media (max-width:640px){.contact-links{grid-template-columns:1fr}}

.profile-key-stats{display:flex;gap:9px;margin-top:14px;flex-wrap:wrap}.profile-key-stats div{min-width:max-content;width:auto;padding:6px 12px;border:1px solid var(--line);border-radius:13px;background:#f5faf8}.profile-key-stats strong{display:block;font-size:17px;line-height:1.05;letter-spacing:-.03em}.profile-key-stats span{display:block;margin-top:1px;font-size:9px;line-height:1.05;color:#71807b}.profile-key-stats svg{width:12px}
@media (max-width:640px){.profile-key-stats{width:100%}.profile-key-stats div{flex:1}.profile-key-stats strong{text-align:center}.profile-key-stats span{text-align:center}}

/* PRONET — vraie messagerie */
.messaging-page{background:#f6f9f7}.messages-main{padding:30px 0 50px}.messages-shell{height:calc(100vh - 138px);min-height:620px;display:grid;grid-template-columns:340px minmax(0,1fr);background:#fff;border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:var(--shadow)}
.messages-sidebar{border-right:1px solid var(--line);display:flex;flex-direction:column;min-width:0}.messages-sidebar-head{padding:22px;border-bottom:1px solid var(--line)}.messages-sidebar-head h1{font-size:27px;letter-spacing:-.04em;margin:7px 0 15px}.messages-search{position:relative}.messages-search svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;color:#82908a}.messages-search input{margin:0;padding-left:38px;border-radius:12px;background:#f6f9f7}
.conversation-list{overflow:auto;flex:1}.conversation-item{width:100%;display:flex;gap:12px;padding:15px 18px;border:0;border-bottom:1px solid #eef2f0;background:#fff;text-align:left;cursor:pointer}.conversation-item:hover{background:#f8fbfa}.conversation-item.active{background:#edf8f4}.conversation-avatar{width:46px;height:46px;border-radius:15px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;overflow:hidden;flex:none}.conversation-avatar img{width:100%;height:100%;object-fit:cover}.conversation-copy{min-width:0;flex:1}.conversation-top{display:flex;justify-content:space-between;gap:10px}.conversation-top strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.conversation-top time{font-size:9px;color:#87928d;white-space:nowrap}.conversation-preview{display:flex;align-items:center;gap:5px;margin-top:5px;color:#75827d;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.conversation-unread{width:7px;height:7px;border-radius:50%;background:#0a9b7e;flex:none}.messages-empty-list{padding:40px 22px;text-align:center;color:#7a8781;font-size:12px}.messages-empty-list svg{width:28px;margin-bottom:10px}
.chat-panel{display:flex;flex-direction:column;min-width:0;background:#fbfdfc}.chat-empty{height:100%;display:flex;align-items:center;justify-content:center;text-align:center;padding:30px;color:#77847f}.chat-empty-inner{max-width:360px}.chat-empty-icon{width:58px;height:58px;border-radius:19px;background:#e8f7f2;color:#07866f;display:flex;align-items:center;justify-content:center;margin:0 auto 16px}.chat-empty-icon svg{width:25px}.chat-empty h2{margin:0 0 8px;font-size:23px;letter-spacing:-.03em;color:var(--ink)}.chat-empty p{font-size:12px;line-height:1.6}
.chat-head{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line);background:#fff}.chat-head-avatar{width:44px;height:44px;border-radius:14px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;font-weight:800;font-size:12px;flex:none}.chat-head-avatar img{width:100%;height:100%;object-fit:cover}.chat-head-copy{min-width:0;flex:1}.chat-head-copy strong{display:block;font-size:14px}.chat-head-copy span{display:block;margin-top:3px;font-size:10px;color:#78847f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-head .icon-nav-btn{display:none}.chat-messages{flex:1;overflow:auto;padding:24px 24px 16px;display:flex;flex-direction:column;gap:8px}.chat-day{text-align:center;color:#89938f;font-size:9px;margin:5px 0 8px}.message-row{display:flex;max-width:78%}.message-row.mine{align-self:flex-end;justify-content:flex-end}.message-bubble{padding:10px 13px;border-radius:17px 17px 17px 5px;background:#eef3f1;color:#25312d;font-size:12px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}.message-row.mine .message-bubble{background:#083d35;color:#fff;border-radius:17px 17px 5px 17px}.message-meta{font-size:8px;color:#8a9590;margin:4px 3px 0}.message-row.mine .message-meta{text-align:right}.chat-composer{padding:12px 16px;border-top:1px solid var(--line);background:#fff}.composer-form{display:flex;align-items:flex-end;gap:8px;background:#f5f8f6;border:1px solid var(--line);border-radius:16px;padding:7px}.composer-form textarea{flex:1;border:0!important;background:transparent!important;box-shadow:none!important;resize:none;min-height:38px;max-height:120px;margin:0!important;padding:8px!important;font:inherit;font-size:12px}.composer-form textarea:focus{outline:0}.composer-send{width:40px;height:40px;border:0;border-radius:12px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;flex:none}.composer-send svg{width:16px}.composer-note{font-size:9px;color:#89938f;padding:6px 4px 0}.messages-loading{text-align:center;padding:35px;color:#84908b;font-size:11px}.side-link-anchor{
  text-decoration:none;
  color:#61716b;
}
.side-link-anchor:hover{
  background:transparent;
  color:#61716b;
  box-shadow:none;
}
@media(max-width:820px){.messages-main{padding:14px 0}.messages-shell{height:calc(100vh - 96px);min-height:560px;grid-template-columns:1fr}.messages-sidebar{display:flex}.chat-panel{display:none}.messages-shell.chat-open .messages-sidebar{display:none}.messages-shell.chat-open .chat-panel{display:flex}.chat-head .icon-nav-btn{display:inline-flex}.message-row{max-width:88%}}
@media(max-width:560px){.messages-sidebar-head{padding:17px}.messages-sidebar-head h1{font-size:24px}.messages-shell{border-radius:18px}.chat-messages{padding:18px 14px 12px}.chat-head{padding:12px 14px}.chat-composer{padding:9px}.topbar .nav-actions .link-btn{font-size:0;padding:10px}.topbar .nav-actions .link-btn svg{margin:0;width:16px}}


/* PRONET — recadrage de photo de profil */
.crop-modal{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:20px}
.crop-modal-backdrop{position:absolute;inset:0;background:rgba(5,24,21,.58);backdrop-filter:blur(12px)}
.crop-modal-card{position:relative;z-index:1;width:min(700px,100%);max-height:min(92vh,820px);overflow:auto;background:#fff;border:1px solid rgba(5,45,40,.08);border-radius:26px;padding:24px;box-shadow:0 34px 100px rgba(0,0,0,.25)}
.crop-modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding-right:42px}
.crop-modal-head h2{font-size:29px;letter-spacing:-.04em;margin:8px 0}
.crop-modal-head p{margin:0;color:#71807b;font-size:12px;line-height:1.6}
.crop-stage{height:min(58vh,540px);min-height:320px;margin-top:20px;border-radius:18px;overflow:hidden;background:#14211e;display:flex;align-items:center;justify-content:center}
.crop-stage img{max-width:100%;display:block}
.crop-stage .cropper-bg{background:#14211e}
.crop-stage .cropper-dashed{border-color:rgba(255,255,255,.55)}
.crop-stage .cropper-line,.crop-stage .cropper-point{background-color:rgba(255,255,255,.9)}
.crop-stage .cropper-view-box{outline:1px solid rgba(255,255,255,.9);outline-color:rgba(255,255,255,.9)}
.crop-controls{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:14px}
.crop-controls span{min-width:100px;text-align:center;color:#6f7d77;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.crop-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
@media(max-width:640px){
  .crop-modal{padding:10px}
  .crop-modal-card{padding:18px;border-radius:20px}
  .crop-modal-head h2{font-size:24px}
  .crop-stage{height:min(58vh,440px);min-height:270px;margin-top:14px}
  .crop-controls .outline-btn{padding:9px 11px;font-size:11px}
  .crop-controls span{min-width:70px;font-size:9px}
  .crop-modal-actions{flex-direction:column-reverse}
  .crop-modal-actions button{width:100%}
}

/* PRONET — compact professional cards */
.pro-card{display:flex;min-height:0}
.pro-card .card-link{display:flex;flex-direction:column;width:100%;height:100%}
.card-top{display:flex;align-items:center;gap:13px;padding:15px 16px 10px}
.card-avatar{width:56px;height:56px;flex:0 0 56px;border-radius:17px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;letter-spacing:.03em;font-size:16px;overflow:hidden}
.card-avatar img{width:100%;height:100%;object-fit:cover}
.card-identity{min-width:0;flex:1}
.card-name-row{display:flex;align-items:center;gap:7px;min-width:0}
.card-name-row h3{font-size:17px;line-height:1.2;letter-spacing:-.02em;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card-verified{width:20px;height:20px;flex:0 0 20px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:var(--accent);background:#e8faf5}
.card-verified svg{width:13px;height:13px}
.pro-card .role{margin:4px 0 0;color:#60706a;font-size:12px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pro-card .card-body{padding:3px 16px 12px}
.pro-card .location-line{font-size:11px;line-height:1.35;gap:5px}
.pro-card .location-line svg{width:13px;height:13px;flex:0 0 13px}
.pro-card .stats-row{margin-top:10px;gap:14px;font-size:11px}
.pro-card .stats-row svg{width:13px;height:13px}
.pro-card .card-tags{gap:5px;margin-top:10px;max-height:27px;overflow:hidden}
.pro-card .card-tags span{padding:5px 7px;border-radius:8px;font-size:10px;line-height:1.1}
.pro-card .card-footer{margin-top:auto;padding:10px 16px;border-top:1px solid var(--line);font-size:10px}
.pro-card .card-specialty{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:10px}
.pro-card .arrow-circle{width:27px;height:27px;flex:0 0 27px}
.pro-card .arrow-circle svg{width:13px;height:13px}
.demo-card .card-media{display:none}

/* PRONET — floating search on infinite-scroll home */
.floating-search{position:fixed;right:24px;bottom:24px;z-index:80;width:46px;height:46px;border:1px solid rgba(5,45,40,.1);border-radius:50%;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 30px rgba(5,45,40,.18);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(10px) scale(.94);transition:opacity .2s ease,visibility .2s ease,transform .2s ease,box-shadow .2s ease}
.floating-search.is-visible{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.floating-search:hover{box-shadow:0 16px 34px rgba(5,45,40,.24);transform:translateY(-2px) scale(1.02)}
.floating-search svg{width:18px;height:18px;stroke-width:2.2}
@media(max-width:640px){.floating-search{right:16px;bottom:18px;width:44px;height:44px}.floating-search svg{width:17px;height:17px}}


/* PRONET — Google OAuth */
.auth-divider{display:flex;align-items:center;gap:12px;margin:18px 0 14px;color:#87938e;font-size:10px;text-transform:uppercase;letter-spacing:.08em}
.auth-divider:before,.auth-divider:after{content:"";height:1px;background:var(--line);flex:1}
.google-btn{border:1px solid #dfe6e3;background:#fff;color:var(--ink);min-height:46px;border-radius:14px;padding:11px 16px;font-weight:700;font-size:13px;display:flex;align-items:center;justify-content:center;gap:10px;transition:.2s ease}
.google-btn:hover{background:#f8fbfa;border-color:#cbd7d2;transform:translateY(-1px)}
.google-mark{width:21px;height:21px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;font-family:Arial,sans-serif;color:#4285f4;background:#fff}


/* PRONET — auth password recovery */
.password-field{position:relative;margin-top:7px}.password-field input{margin-top:0!important;padding-right:44px!important}.password-toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:34px;height:34px;border:0;background:transparent;color:#71807b;border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer}.password-toggle:hover{background:#eef4f1;color:var(--ink)}.password-toggle svg{width:17px;height:17px}.forgot-link{display:block;margin:7px 0 0 auto;padding:0;border:0;background:transparent;color:#315a52;font-size:11px;font-weight:700;cursor:pointer}.forgot-link:hover{text-decoration:underline}.forgot-view{margin-top:20px}.forgot-view h3{font-size:24px;letter-spacing:-.035em;margin:9px 0 7px}.forgot-view>p{color:#71807b;font-size:12px;line-height:1.6;margin:0}.forgot-view form{margin-top:18px!important}.forgot-view .text-btn{margin-top:13px}.auth-card .forgot-view .auth-error{margin-top:2px}


/* PRONET — public profile UI refinement */
body.profile-page .profile-main{padding-top:34px}
body.profile-page .public-profile{border-radius:26px;box-shadow:0 14px 44px rgba(5,45,40,.07)}
body.profile-page .profile-cover{height:230px;background-color:#eaf3f0;background-position:center;background-repeat:no-repeat}
body.profile-page .profile-head{padding:0 34px 26px;grid-template-columns:112px minmax(0,1fr) auto;gap:18px;align-items:end;margin-top:-42px}
body.profile-page .profile-avatar-large{width:112px;height:112px;border:6px solid #fff;border-radius:28px;box-shadow:0 8px 24px rgba(5,45,40,.12)}
body.profile-page .profile-identity{padding:0 0 4px;min-width:0}
body.profile-page .verified-line{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
body.profile-page .verified-line h1{font-size:34px;line-height:1.08;letter-spacing:-.045em;max-width:100%;overflow-wrap:anywhere}
body.profile-page .verified-line .verified-badge{flex:0 0 auto;padding:6px 8px;font-size:9px;border-radius:999px}
body.profile-page .verified-line .verified-badge svg{width:12px;height:12px}
body.profile-page .profile-identity>p{margin:6px 0 7px;font-size:14px;font-weight:600;color:#53655f}
body.profile-page .profile-location{font-size:11px}
body.profile-page .profile-key-stats{display:flex;gap:7px;margin-top:12px;flex-wrap:wrap}
body.profile-page .profile-key-stats div{min-width:68px;padding:7px 10px;border-radius:11px}
body.profile-page .profile-key-stats strong{font-size:15px}
body.profile-page .profile-key-stats span{font-size:9px}
body.profile-page .profile-head>.dark-btn{align-self:end;margin:0 0 4px;white-space:nowrap;min-height:42px;padding:11px 16px;border-radius:13px}
body.profile-page .profile-layout{grid-template-columns:minmax(0,1fr) 280px;gap:34px;padding:0 34px 34px}
body.profile-page .public-section{padding:27px 0}
body.profile-page .public-section h2{font-size:23px;margin:7px 0 13px}
body.profile-page .section-title-row{display:flex;align-items:center;justify-content:space-between;gap:16px}
body.profile-page .profile-side{padding-top:27px}
body.profile-page .contact-card{margin-top:0;padding:20px;border-radius:18px;position:sticky;top:100px}
body.profile-page .contact-card h3{font-size:17px;line-height:1.3}
body.profile-page .service-card,body.profile-page .portfolio-item,body.profile-page .review-item{border-radius:14px}
body.profile-page .portfolio-image{height:150px}
body.profile-page .contact-links{grid-template-columns:1fr}
@media (max-width:980px){
 body.profile-page .profile-head{grid-template-columns:96px minmax(0,1fr);align-items:end}
 body.profile-page .profile-head>.dark-btn{grid-column:1/-1;width:max-content;justify-self:start;margin:0}
 body.profile-page .profile-layout{gap:24px}
 body.profile-page .profile-side{padding-top:0}
}
@media (max-width:640px){
 body.profile-page .profile-main{padding:18px 0 60px}
 body.profile-page .public-profile{border-radius:20px}
 body.profile-page .profile-cover{height:170px}
 body.profile-page .profile-head{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0 18px 20px;margin-top:-44px}
 body.profile-page .profile-avatar-large{width:88px;height:88px;border-radius:23px;margin-bottom:13px}
 body.profile-page .profile-identity{padding:0}
 body.profile-page .verified-line{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}
 body.profile-page .verified-line h1{font-size:27px;line-height:1.08;min-width:0}
 body.profile-page .verified-line .verified-badge{font-size:8px;padding:5px 7px}
 body.profile-page .profile-identity>p{font-size:13px;margin:7px 0 5px}
 body.profile-page .profile-location{font-size:10px;max-width:100%;white-space:normal}
 body.profile-page .profile-key-stats{width:100%;margin-top:12px;gap:7px}
 body.profile-page .profile-key-stats div{flex:1;min-width:0;text-align:center;padding:8px 6px}
 body.profile-page .profile-key-stats strong{font-size:16px}
 body.profile-page .profile-head>.dark-btn{width:100%;margin-top:14px;min-height:44px}
 body.profile-page .profile-layout{display:block;padding:0 18px 24px}
 body.profile-page .public-section{padding:24px 0}
 body.profile-page .public-section h2{font-size:21px}
 body.profile-page .service-card{padding:14px}
 body.profile-page .portfolio-image{height:180px}
 body.profile-page .contact-card{position:static;margin-top:0}
}

/* PRONET — floating contact action on public profile */
body.profile-page .floating-profile-contact{
  position:fixed;right:24px;bottom:24px;z-index:70;
  display:flex;align-items:center;justify-content:center;gap:8px;
  min-height:48px;padding:0 17px;border:0;border-radius:999px;
  background:var(--ink);color:#fff;font-size:12px;font-weight:750;
  box-shadow:0 14px 34px rgba(5,45,40,.24);
  opacity:0;visibility:hidden;transform:translateY(12px) scale(.96);
  pointer-events:none;transition:opacity .2s ease,visibility .2s ease,transform .2s ease;
}
body.profile-page .floating-profile-contact.is-visible{
  opacity:1;visibility:visible;transform:translateY(0) scale(1);pointer-events:auto;
}
body.profile-page .floating-profile-contact svg{width:17px;height:17px}
body.profile-page .floating-profile-contact:hover{transform:translateY(-2px) scale(1.01);box-shadow:0 17px 38px rgba(5,45,40,.28)}
@media(max-width:640px){
 body.profile-page .floating-profile-contact{right:16px;bottom:18px;min-height:46px;padding:0 15px}
}

/* PRONET — authenticated account menu — shared across Profile, Home, Dashboard and Messages */
.nav-actions{position:relative}
.profile-account-btn{width:40px;height:40px;padding:1px;border:1px solid var(--line);border-radius:999px;background:var(--white);display:inline-flex;align-items:center;justify-content:center;gap:2px;color:var(--ink);box-shadow:0 4px 14px rgba(5,45,40,.08);position:relative;z-index:101}
.profile-account-btn:hover{border-color:#cbd8d3;box-shadow:0 7px 18px rgba(5,45,40,.12)}
.profile-account-btn:focus-visible{outline:2px solid var(--mint);outline-offset:3px}
.profile-account-btn>svg{width:11px;height:11px;flex:none}
.profile-account-avatar{width:34px;height:34px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;background:#052d28;color:#fff;font-size:11px;font-weight:800;flex:none}
.profile-account-avatar img{width:100%;height:100%;display:block;object-fit:cover}
.nav-mini-btn{min-height:34px;padding:0 10px;border:1px solid #dce6e2;border-radius:10px;background:#fff;color:#052d28;display:inline-flex;align-items:center;gap:6px;font-family:inherit;font-size:11px;font-weight:700;white-space:nowrap;cursor:pointer}
.nav-mini-btn svg{width:14px;height:14px;color:#526b65}
.nav-mini-btn:hover{background:#f1f7f5;border-color:#c8d9d4}
html[data-theme="dark"] .nav-mini-btn{background:#10201d;color:#f4fbf8;border-color:#29413c}
html[data-theme="dark"] .nav-mini-btn:hover{background:#19302b}
html[data-theme="dark"] .nav-mini-btn svg{color:#9bb2ac}
@media(max-width:640px){.nav-mini-btn{min-height:32px;padding:0 8px;font-size:10px}.nav-mini-btn span{display:none}.nav-mini-btn svg{width:16px;height:16px}}
.profile-account-menu{position:absolute;top:calc(100% + 10px);right:-4px;width:220px;padding:7px;border:1px solid #dce6e2;border-radius:18px;background:#fff;color:#052d28;box-shadow:0 20px 45px rgba(5,45,40,.18);z-index:200;overflow:hidden;isolation:isolate}
.profile-account-menu a,.profile-account-menu button{box-sizing:border-box;width:100%;min-height:44px;margin:0;padding:0 12px;border:0;border-radius:12px;background:#fff;color:#052d28;display:flex;align-items:center;gap:11px;text-align:left;font-family:inherit;font-size:13px;font-weight:600;line-height:1.2;white-space:nowrap;cursor:pointer}
.profile-account-menu a:hover,.profile-account-menu button:hover{background:#f1f7f5}
.profile-account-menu a:focus-visible,.profile-account-menu button:focus-visible{outline:2px solid #00ffd0;outline-offset:-2px}
.profile-account-menu svg{width:17px;height:17px;color:#526b65;flex:none}
.profile-account-menu span{min-width:0;flex:1}
.profile-account-menu small{margin-left:auto;color:#71827d;font-size:10px;font-weight:600}
.account-menu-divider{height:1px;background:#dce6e2;margin:7px 4px}
.profile-account-menu [id$="LogoutButton"],.profile-account-menu [id$="LogoutButton"] span,.profile-account-menu [id$="LogoutButton"] svg{color:#9a4a4a}
@media (prefers-color-scheme: dark){
.profile-account-menu{background:#10201d;color:#f4fbf8;border-color:#29413c;box-shadow:0 24px 50px rgba(0,0,0,.42)}
.profile-account-menu a,.profile-account-menu button{background:#10201d;color:#f4fbf8}
.profile-account-menu a:hover,.profile-account-menu button:hover{background:#19302b}
.profile-account-menu svg{color:#9bb2ac}
.profile-account-menu small{color:#8da49e}
.account-menu-divider{background:#29413c}
.profile-account-menu [id$="LogoutButton"],.profile-account-menu [id$="LogoutButton"] span,.profile-account-menu [id$="LogoutButton"] svg{color:#ff9b9b}
}
@media(max-width:640px){
.profile-account-menu{right:-4px;width:215px}
.profile-account-btn{width:40px;height:40px}
}


/* PRONET — persistent light/dark theme */
:root{color-scheme:light}
html[data-theme="dark"]{
  color-scheme:dark;
  --ink:#f2fbf8;
  --mint:#00ffd0;
  --paper:#081310;
  --white:#10201d;
  --line:#29413c;
  --soft:#172b27;
  --muted:#8da49e;
  --shadow:0 18px 50px rgba(0,0,0,.28);
}
html[data-theme="light"]{color-scheme:light}
html[data-theme="dark"] body{background:var(--paper);color:var(--ink)}
html[data-theme="dark"] .topbar{background:rgba(8,19,16,.88);border-bottom-color:rgba(255,255,255,.07)}
html[data-theme="dark"] .brand-copy small,
html[data-theme="dark"] .nav-links a,
html[data-theme="dark"] .hero-copy,
html[data-theme="dark"] .results-meta,
html[data-theme="dark"] .role,
html[data-theme="dark"] .location-line,
html[data-theme="dark"] .stats-row,
html[data-theme="dark"] .hero-note,
html[data-theme="dark"] .dash-heading p,
html[data-theme="dark"] .panel-header p,
html[data-theme="dark"] .manage-item span,
html[data-theme="dark"] .project-copy p,
html[data-theme="dark"] .profile-identity>p,
html[data-theme="dark"] .profile-location,
html[data-theme="dark"] .public-section>p,
html[data-theme="dark"] .service-card p,
html[data-theme="dark"] .portfolio-item p,
html[data-theme="dark"] .review-item p,
html[data-theme="dark"] .contact-card p{color:#9bb2ac}
html[data-theme="dark"] .hero{background:linear-gradient(180deg,#0d2923 0%,#0a1c18 55%,var(--paper) 100%)}
html[data-theme="dark"] .orb-two{background:rgba(0,255,208,.05)}
html[data-theme="dark"] .search-bar,
html[data-theme="dark"] .filter-panel,
html[data-theme="dark"] .random-pill,
html[data-theme="dark"] .pro-card,
html[data-theme="dark"] .step,
html[data-theme="dark"] .auth-card,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .welcome-card,
html[data-theme="dark"] .mini-profile,
html[data-theme="dark"] .dash-panel,
html[data-theme="dark"] .public-profile,
html[data-theme="dark"] .service-card,
html[data-theme="dark"] .portfolio-item,
html[data-theme="dark"] .review-item,
html[data-theme="dark"] .guard-card{background:var(--white);border-color:var(--line)}
html[data-theme="dark"] .search-bar{box-shadow:0 22px 60px rgba(0,0,0,.3)}
html[data-theme="dark"] .search-input-wrap input,
html[data-theme="dark"] .location-wrap select,
html[data-theme="dark"] .filter-panel select,
html[data-theme="dark"] .auth-card input,
html[data-theme="dark"] .auth-card select,
html[data-theme="dark"] .editor-form input,
html[data-theme="dark"] .editor-form select,
html[data-theme="dark"] .editor-form textarea,
html[data-theme="dark"] .add-row select,
html[data-theme="dark"] .inline-form input,
html[data-theme="dark"] .project-form input,
html[data-theme="dark"] .project-form textarea{background:#0b1815;color:var(--ink);border-color:var(--line)}
html[data-theme="dark"] .filter-btn,
html[data-theme="dark"] .side-nav,
html[data-theme="dark"] .how-section{background:#0f211d;border-color:var(--line)}
html[data-theme="dark"] .side-link{color:#9bb2ac}
html[data-theme="dark"] .side-link.active,
html[data-theme="dark"] .side-link:hover{background:#17302b;color:var(--ink)}
html[data-theme="dark"] .card-tags span,
html[data-theme="dark"] .tag-list span,
html[data-theme="dark"] .editor-chip,
html[data-theme="dark"] .profile-stats div,
html[data-theme="dark"] .contact-card,
html[data-theme="dark"] .project-thumb,
html[data-theme="dark"] .messages-sidebar,
html[data-theme="dark"] .chat-panel{background:#0f211d;border-color:var(--line)}
html[data-theme="dark"] .card-media,
html[data-theme="dark"] .demo-card .card-media{background:linear-gradient(145deg,#14332d,#10201d)}
html[data-theme="dark"] .card-footer{border-top-color:var(--line);color:#9bb2ac}
html[data-theme="dark"] .verified-badge{background:#17302b;border-color:#29413c;color:#a8c0ba}
/* PRONET — keep the profile cover image unchanged in dark mode; theme must not replace its inline image */
html[data-theme="dark"] .profile-cover{background-color:#052d28;background-repeat:no-repeat;background-size:cover;background-position:center}
html[data-theme="dark"] .profile-avatar-large{border-color:#10201d}
html[data-theme="dark"] .profile-section,
html[data-theme="dark"] .public-section{border-top-color:var(--line)}
html[data-theme="dark"] .pro-card:hover{box-shadow:0 22px 50px rgba(0,0,0,.35)}
html[data-theme="dark"] .modal-close{background:#172b27;color:var(--ink)}
html[data-theme="dark"] .overlay{background:rgba(0,0,0,.58)}
html[data-theme="dark"] .auth-error{background:#3a201e;color:#ffaaa0}
html[data-theme="dark"] .icon-danger{background:#351d1b;color:#ffaaa0}
html[data-theme="dark"] .profile-account-btn{background:#10201d;color:#f2fbf8;border-color:#29413c}
html[data-theme="dark"] .profile-account-menu{background:#10201d;color:#f4fbf8;border-color:#29413c}
html[data-theme="dark"] .profile-account-menu a,
html[data-theme="dark"] .profile-account-menu button{background:#10201d;color:#f4fbf8}
html[data-theme="dark"] .profile-account-menu a:hover,
html[data-theme="dark"] .profile-account-menu button:hover{background:#19302b}
html[data-theme="dark"] .profile-account-menu svg{color:#9bb2ac}
html[data-theme="dark"] .profile-account-menu small{color:#8da49e}
html[data-theme="dark"] .account-menu-divider{background:#29413c}
html[data-theme="light"] .profile-account-menu{background:#fff;color:#052d28;border-color:#dce6e2}
html[data-theme="light"] .profile-account-menu a,
html[data-theme="light"] .profile-account-menu button{background:#fff;color:#052d28}
html[data-theme="light"] .profile-account-menu a:hover,
html[data-theme="light"] .profile-account-menu button:hover{background:#f1f7f5}
.account-theme-button{position:relative}
.account-theme-button svg{width:17px;height:17px}
.account-theme-button small{min-width:42px;text-align:right}
@media(max-width:640px){
  html[data-theme="dark"] .search-bar{background:#10201d}
}

/* PRONET — navbar message + notification actions */
.nav-icon-btn{
  position:relative;width:40px;height:40px;padding:0;border:1px solid var(--line);
  border-radius:999px;background:var(--white);color:var(--ink);
  display:inline-flex;align-items:center;justify-content:center;
  transition:.2s ease;flex:none
}
.nav-icon-btn:hover{background:var(--soft);border-color:#cbd8d3;transform:translateY(-1px)}
.nav-icon-btn:focus-visible{outline:2px solid var(--mint);outline-offset:3px}
.nav-icon-btn svg{width:18px;height:18px}
.nav-badge{
  position:absolute;top:-2px;right:-2px;min-width:17px;height:17px;padding:0 4px;
  border-radius:99px;background:#ff4d67;color:#fff;border:2px solid var(--white);
  display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:800;line-height:1
}
html[data-theme="dark"] .nav-icon-btn{background:#10201d;color:#f2fbf8;border-color:#29413c}
html[data-theme="dark"] .nav-icon-btn:hover{background:#19302b}
html[data-theme="dark"] .nav-badge{border-color:#10201d}
@media(max-width:640px){
  .nav-actions{gap:7px}
  .nav-icon-btn{width:38px;height:38px}
  .nav-icon-btn svg{width:17px;height:17px}
}


/* Profile media and assisted editing */
.card-avatar img,
.profile-account-avatar img,
.avatar img,
.avatar-preview img,
.profile-avatar-large img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  display:block;
}
.profile-account-avatar{
  overflow:hidden;
  isolation:isolate;
  transform:translateZ(0);
}
.profile-account-avatar img{border-radius:50%}
.skills-more{
  background:transparent!important;
  border:1px solid var(--line);
  color:var(--muted)!important;
  font-weight:700;
}
.bio-editor{position:relative}
.bio-editor textarea{padding-bottom:48px!important}
.ai-assist-btn{
  position:absolute;
  right:10px;
  bottom:10px;
  border:1px solid rgba(0,255,208,.35);
  background:rgba(0,255,208,.08);
  color:var(--ink);
  border-radius:10px;
  padding:8px 10px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:11px;
  font-weight:750;
}
.ai-assist-btn svg{width:14px;height:14px}
.ai-assist-btn:hover{background:rgba(0,255,208,.15)}
.field-hint{display:block;margin-top:6px;color:var(--muted);font-size:10px;line-height:1.45}
html[data-theme="dark"] .ai-assist-btn{color:#f2fbf8;background:rgba(0,255,208,.1);border-color:rgba(0,255,208,.28)}




/* PRONET — éditeurs services et réalisations */
.manage-item>div:last-child,.project-actions{display:flex;align-items:center;gap:7px}
.icon-edit{width:32px;height:32px;border:1px solid var(--line);border-radius:10px;background:var(--white);color:var(--ink);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.icon-edit:hover{background:var(--soft);border-color:#cbd8d3}
.icon-edit svg{width:15px;height:15px}
.form-inline-title{grid-column:1/-1;font-size:13px;color:var(--ink);font-weight:800}
#serviceStatus,#projectStatus{font-size:11px}


/* PRONET — finition éditeurs */
.manage-item>div:last-child{
  width:100%;
  padding-left:0;
  margin-left:0;
  flex:none;
}
.manage-item .service-row{
  display:flex;
  align-items:center;
  width:100%;
  gap:10px;
}
.manage-item .service-price{
  margin-right:auto;
  text-align:left;
  white-space:nowrap;
}
.manage-item .service-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex:none;
}
.project-actions{
  gap:10px;
  padding-left:10px;
  flex:none;
}



/* PRONET — dark mode icon + logo contrast audit */
html[data-theme="dark"] .brand-logo{
  filter:brightness(0) invert(1);
}
html[data-theme="dark"] .search-input-wrap svg,
html[data-theme="dark"] .location-wrap svg,
html[data-theme="dark"] .random-pill svg,
html[data-theme="dark"] .location-line svg,
html[data-theme="dark"] .stats-row svg,
html[data-theme="dark"] .side-link svg,
html[data-theme="dark"] .stat-card small svg,
html[data-theme="dark"] .editor-chip svg,
html[data-theme="dark"] .project-thumb svg,
html[data-theme="dark"] .project-copy a svg,
html[data-theme="dark"] .guard-card>svg,
html[data-theme="dark"] .profile-location svg,
html[data-theme="dark"] .profile-card-note svg,
html[data-theme="dark"] .profile-key-stats svg,
html[data-theme="dark"] .role-icon svg,
html[data-theme="dark"] .role-note svg,
html[data-theme="dark"] .messages-search svg,
html[data-theme="dark"] .messages-empty-list svg,
html[data-theme="dark"] .chat-empty-icon svg,
html[data-theme="dark"] .portfolio-image svg{
  color:#9bb2ac;
  stroke:currentColor;
}
html[data-theme="dark"] .contact-link svg{
  color:var(--mint);
  stroke:currentColor;
}
html[data-theme="dark"] .verified-badge svg,
html[data-theme="dark"] .card-verified svg{
  color:#a8c0ba;
  stroke:currentColor;
}
html[data-theme="dark"] .nav-icon-btn svg,
html[data-theme="dark"] .profile-account-menu svg,
html[data-theme="dark"] .modal-close svg,
html[data-theme="dark"] .password-toggle svg,
html[data-theme="dark"] .icon-edit svg,
html[data-theme="dark"] .upload-btn svg{
  color:var(--ink);
  stroke:currentColor;
}
html[data-theme="dark"] .icon-danger svg{
  color:#ffaaa0;
  stroke:currentColor;
}


/* PRONET — dark mode controls with filled icon contrast */
html[data-theme="dark"] .search-submit{
  background:#f2fbf8;
  color:#052d28;
  border-color:rgba(242,251,248,.18);
}
html[data-theme="dark"] .search-submit:hover{
  background:#ffffff;
  color:#052d28;
}
html[data-theme="dark"] .floating-search{
  background:#f2fbf8;
  color:#052d28;
  border-color:rgba(242,251,248,.18);
  box-shadow:0 12px 30px rgba(0,0,0,.35);
}
html[data-theme="dark"] .floating-search:hover{
  background:#ffffff;
  color:#052d28;
  box-shadow:0 16px 34px rgba(0,0,0,.42);
}
html[data-theme="dark"] .arrow-circle{
  background:#f2fbf8;
  color:#052d28;
}
html[data-theme="dark"] .pro-card .arrow-circle{
  background:#f2fbf8;
  color:#052d28;
}


/* PRONET — messaging viewport architecture: sticky frame, internal scroll only */
body.messaging-page{
  min-height:100vh;
  height:auto;
  overflow-x:hidden;
  overflow-y:auto;
}
body.messaging-page .messages-main{
  min-height:calc(100vh - 78px);
  height:auto;
  padding:20px 0;
  overflow:visible;
}
body.messaging-page .messages-shell{
  position:sticky;
  top:98px;
  height:calc(100svh - 118px);
  max-height:calc(100svh - 118px);
  min-height:0;
}
body.messaging-page .messages-sidebar{
  min-height:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
body.messaging-page .conversation-list{
  min-height:0;
  flex:1 1 auto;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
}
body.messaging-page .chat-panel{
  min-height:0;
  height:100%;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
body.messaging-page #chatView{
  min-height:0;
  height:100%!important;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
body.messaging-page .chat-head{
  flex:0 0 68px;
  min-height:68px;
}
body.messaging-page .chat-messages{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
}
body.messaging-page .chat-composer{
  flex:0 0 88px;
  height:88px;
  min-height:88px;
  max-height:88px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  box-sizing:border-box;
  overflow:hidden;
}
body.messaging-page .composer-form{
  flex:0 0 46px;
  height:46px;
  min-height:46px;
  max-height:46px;
}
body.messaging-page .composer-form textarea{
  height:46px;
  min-height:46px;
  max-height:46px;
  resize:none;
  overflow-y:auto;
  box-sizing:border-box;
}
body.messaging-page .composer-note{
  flex:0 0 18px;
  height:18px;
  min-height:18px;
  line-height:18px;
  overflow:hidden;
  white-space:nowrap;
}
@media(max-width:820px){
  body.messaging-page .messages-main{
    min-height:calc(100vh - 78px);
    height:auto;
    padding:10px 0;
    overflow:visible;
  }
  body.messaging-page .messages-shell{
    top:88px;
    height:calc(100svh - 104px);
    max-height:calc(100svh - 104px);
    min-height:0;
    border-radius:18px;
  }
  body.messaging-page .chat-head{
    flex-basis:62px;
    min-height:62px;
  }
  body.messaging-page .chat-composer{
    flex-basis:82px;
    height:82px;
    min-height:82px;
    max-height:82px;
  }
}
@media(max-width:560px){
  body.messaging-page .messages-main{
    min-height:calc(100vh - 78px);
    padding:8px 0;
  }
  body.messaging-page .messages-shell{
    top:86px;
    height:calc(100svh - 94px);
    max-height:calc(100svh - 94px);
    border-radius:16px;
  }
  body.messaging-page .conversation-list,
  body.messaging-page .chat-messages{
    overscroll-behavior:contain;
  }
  body.messaging-page .chat-composer{
    flex-basis:80px;
    height:80px;
    min-height:80px;
    max-height:80px;
  }
  body.messaging-page .composer-form{
    flex-basis:44px;
    height:44px;
    min-height:44px;
    max-height:44px;
  }
  body.messaging-page .composer-form textarea{
    height:44px;
    min-height:44px;
    max-height:44px;
  }
}


/* PRONET — messaging internal frame: deterministic 3-row layout */
body.messaging-page .chat-panel{
  display:flex;
  flex-direction:column;
  min-height:0;
  height:100%;
  overflow:hidden;
}
body.messaging-page #chatView{
  height:100%!important;
  min-height:0;
  display:grid!important;
  grid-template-rows:68px minmax(0,1fr) 88px;
  overflow:hidden;
}
body.messaging-page .chat-head{
  grid-row:1;
  position:relative;
  z-index:2;
  min-height:0;
  height:68px;
  box-sizing:border-box;
  background:var(--white);
}
body.messaging-page .chat-messages{
  grid-row:2;
  min-height:0;
  height:auto;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}
body.messaging-page .chat-composer{
  grid-row:3;
  position:relative;
  z-index:2;
  flex:none;
  height:88px;
  min-height:88px;
  max-height:88px;
  box-sizing:border-box;
  overflow:hidden;
  background:var(--white);
}
@media(max-width:820px){
  body.messaging-page #chatView{
    grid-template-rows:62px minmax(0,1fr) 82px;
  }
  body.messaging-page .chat-head{
    height:62px;
  }
  body.messaging-page .chat-composer{
    height:82px;
    min-height:82px;
    max-height:82px;
  }
}
@media(max-width:560px){
  body.messaging-page #chatView{
    grid-template-rows:62px minmax(0,1fr) 80px;
  }
  body.messaging-page .chat-composer{
    height:80px;
    min-height:80px;
    max-height:80px;
  }
}


/* PRONET — dashboard profile completion indicator */
.profile-progress-card strong{transition:color .2s ease}



/* PRONET — prevent iOS input focus zoom */
@media (max-width:640px){
  input,textarea,select{font-size:16px!important}
}


/* PRONET — WhatsApp-inspired messaging UI */
body.messaging-page{
  --chat-bg:#efeae2;
  --chat-mine:#d9fdd3;
  --chat-theirs:#ffffff;
}
body.messaging-page .messages-main{
  padding:14px 0 18px;
}
body.messaging-page .messages-shell{
  display:grid;
  grid-template-columns:360px minmax(0,1fr);
  gap:0;
  border:1px solid var(--line);
  border-radius:18px;
  overflow:hidden;
  background:var(--white);
  box-shadow:0 18px 55px rgba(5,45,40,.08);
}
body.messaging-page .messages-sidebar{
  border-right:1px solid var(--line);
  background:var(--white);
}
body.messaging-page .messages-sidebar-head{
  padding:18px 16px 12px;
  border-bottom:1px solid var(--line);
  background:var(--white);
}
body.messaging-page .messages-sidebar-head h1{
  margin:0 0 14px;
  font-size:24px;
  letter-spacing:-.035em;
}
body.messaging-page .messages-search{
  height:42px;
  border-radius:12px;
  background:var(--soft);
  border:1px solid transparent;
}
body.messaging-page .messages-search:focus-within{
  border-color:#b9d0c9;
  background:var(--white);
}
body.messaging-page .conversation-item{
  width:100%;
  min-height:76px;
  padding:10px 14px;
  border:0;
  border-bottom:1px solid var(--line);
  background:var(--white);
  color:var(--ink);
  display:flex;
  align-items:center;
  gap:12px;
  text-align:left;
  transition:background .16s ease;
}
body.messaging-page .conversation-item:hover{
  background:var(--soft);
}
body.messaging-page .conversation-item.active{
  background:#eef7f4;
}
body.messaging-page .conversation-avatar{
  width:50px;
  height:50px;
  border-radius:50%;
  flex:none;
  overflow:hidden;
  background:var(--ink);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:800;
}
body.messaging-page .conversation-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}
body.messaging-page .conversation-copy{
  min-width:0;
  flex:1;
}
body.messaging-page .conversation-top{
  display:flex;
  align-items:center;
  gap:8px;
}
body.messaging-page .conversation-top strong{
  min-width:0;
  flex:1;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:13px;
}
body.messaging-page .conversation-top time{
  flex:none;
  color:var(--muted);
  font-size:10px;
}
body.messaging-page .conversation-preview{
  display:flex;
  align-items:center;
  gap:6px;
  margin-top:5px;
  color:var(--muted);
  font-size:11px;
}
body.messaging-page .conversation-preview>span:last-child{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body.messaging-page .conversation-unread{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--mint);
  flex:none;
}
body.messaging-page .chat-panel{
  background:var(--chat-bg);
}
body.messaging-page .chat-head{
  display:flex;
  align-items:center;
  gap:11px;
  padding:10px 14px;
  border-bottom:1px solid rgba(5,45,40,.10);
  background:var(--white);
}
body.messaging-page .chat-head-avatar{
  width:42px;
  height:42px;
  border-radius:50%;
  overflow:hidden;
  flex:none;
  background:var(--ink);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:800;
}
body.messaging-page .chat-head-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}
body.messaging-page .chat-head-copy{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:3px;
}
body.messaging-page .chat-head-copy strong{
  font-size:14px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body.messaging-page .chat-head-copy span{
  color:var(--muted);
  font-size:10px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body.messaging-page .chat-messages{
  padding:20px clamp(12px,3vw,48px);
  background-color:var(--chat-bg);
  background-image:
    radial-gradient(rgba(5,45,40,.035) 1px,transparent 1px),
    radial-gradient(rgba(5,45,40,.025) 1px,transparent 1px);
  background-position:0 0,12px 12px;
  background-size:24px 24px;
}
body.messaging-page .chat-day{
  width:max-content;
  max-width:90%;
  margin:8px auto 14px;
  padding:6px 11px;
  border-radius:8px;
  background:rgba(255,255,255,.82);
  color:#65736d;
  font-size:10px;
  font-weight:700;
  box-shadow:0 1px 2px rgba(5,45,40,.05);
}
body.messaging-page .message-row{
  display:flex;
  justify-content:flex-start;
  margin:3px 0;
}
body.messaging-page .message-row.mine{
  justify-content:flex-end;
}
body.messaging-page .message-bubble{
  position:relative;
  width:max-content;
  max-width:min(78%,560px);
  min-width:56px;
  padding:10px 14px 8px;
  border-radius:10px 10px 10px 3px;
  background:var(--chat-theirs);
  color:#17231f;
  box-shadow:0 1px 2px rgba(5,45,40,.10);
  font-size:13px;
  line-height:1.45;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  word-break:normal;
}
body.messaging-page .message-row.mine .message-bubble{
  border-radius:10px 10px 3px 10px;
  background:var(--chat-mine);
}
body.messaging-page .message-meta{
  margin-top:3px;
  padding:0 1px;
  color:#6f7d78;
  font-size:10px;
  line-height:1.15;
  text-align:right;
  white-space:nowrap;
}
body.messaging-page .chat-composer{
  padding:10px 12px 8px;
  border-top:1px solid rgba(5,45,40,.10);
}
body.messaging-page .composer-form{
  display:flex;
  align-items:flex-end;
  gap:8px;
}
body.messaging-page .composer-form textarea{
  flex:1;
  width:100%;
  border:0;
  outline:0;
  border-radius:18px;
  padding:12px 15px;
  background:var(--white);
  color:var(--ink);
  box-shadow:0 1px 3px rgba(5,45,40,.08);
  font-size:13px;
}
body.messaging-page .composer-form textarea:focus{
  box-shadow:0 0 0 2px rgba(0,255,208,.18);
}
body.messaging-page .composer-send{
  width:44px;
  height:44px;
  border:0;
  border-radius:50%;
  flex:none;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--ink);
  color:#fff;
}
body.messaging-page .composer-send:hover{
  transform:translateY(-1px);
  background:#0b5148;
}
body.messaging-page .composer-send svg{
  width:18px;
  height:18px;
}
body.messaging-page .composer-note{
  text-align:center;
  color:#82908a;
  font-size:9px;
}
html[data-theme="dark"] body.messaging-page{
  --chat-bg:#0b1714;
  --chat-mine:#164c40;
  --chat-theirs:#17302b;
}
html[data-theme="dark"] body.messaging-page .messages-sidebar,
html[data-theme="dark"] body.messaging-page .messages-sidebar-head,
html[data-theme="dark"] body.messaging-page .conversation-item,
html[data-theme="dark"] body.messaging-page .chat-head{
  background:var(--white);
}
html[data-theme="dark"] body.messaging-page .conversation-item:hover,
html[data-theme="dark"] body.messaging-page .conversation-item.active{
  background:#19332d;
}
html[data-theme="dark"] body.messaging-page .chat-messages{
  background-image:
    radial-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    radial-gradient(rgba(255,255,255,.018) 1px,transparent 1px);
}
html[data-theme="dark"] body.messaging-page .chat-day{
  background:#17302b;
  color:#a8bdb7;
}
html[data-theme="dark"] body.messaging-page .message-bubble{
  color:#eef7f4;
}
html[data-theme="dark"] body.messaging-page .message-meta{
  color:#8fa59f;
}
html[data-theme="dark"] body.messaging-page .composer-form textarea{
  background:#17302b;
  color:var(--ink);
}
html[data-theme="dark"] body.messaging-page .composer-send{
  background:#f2fbf8;
  color:#052d28;
}
@media(max-width:820px){
  body.messaging-page .messages-shell{
    grid-template-columns:1fr;
  }
  body.messaging-page .messages-sidebar{
    border-right:0;
  }
  body.messaging-page .messages-shell.chat-open .messages-sidebar{
    display:none;
  }
  body.messaging-page .messages-shell:not(.chat-open) .chat-panel{
    display:none;
  }
}
@media(max-width:560px){
  body.messaging-page .messages-main{
    padding:0;
  }
  body.messaging-page .messages-shell{
    top:78px;
    height:calc(100svh - 78px);
    max-height:calc(100svh - 78px);
    border-radius:0;
    border-left:0;
    border-right:0;
    border-bottom:0;
  }
  body.messaging-page .messages-sidebar-head{
    padding:14px 12px 10px;
  }
  body.messaging-page .messages-sidebar-head h1{
    font-size:22px;
    margin-bottom:11px;
  }
  body.messaging-page .conversation-item{
    min-height:72px;
    padding:9px 12px;
  }
  body.messaging-page .conversation-avatar{
    width:48px;
    height:48px;
  }
  body.messaging-page .chat-messages{
    padding:14px 10px;
  }
  body.messaging-page .message-bubble{
    max-width:84%;
    font-size:13px;
  }
  body.messaging-page .chat-composer{
    padding:8px 8px 6px;
  }
}

/* PRONET — modern messaging controls */
body.messaging-page .messages-search input,
body.messaging-page .composer-form textarea{
  border:1px solid var(--line);
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
body.messaging-page .messages-search input{
  min-height:42px;
  padding:10px 13px;
  border-radius:12px;
  background:var(--soft);
}
body.messaging-page .messages-search input:focus,
body.messaging-page .composer-form textarea:focus{
  border-color:rgba(0,255,208,.55);
  box-shadow:0 0 0 3px rgba(0,255,208,.10);
  background:var(--white);
}
body.messaging-page .composer-form textarea{
  padding:11px 15px;
  border-radius:16px;
}
body.messaging-page .composer-send{
  border:1px solid rgba(0,255,208,.18);
  box-shadow:0 7px 18px rgba(5,45,40,.14);
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
body.messaging-page .composer-send:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(5,45,40,.18)}
body.messaging-page .composer-send:active{transform:translateY(0)}
html[data-theme="dark"] body.messaging-page .messages-search input{
  background:#17302b;color:#eef7f4;border-color:#29413c;
}
html[data-theme="dark"] body.messaging-page .messages-search input:focus,
html[data-theme="dark"] body.messaging-page .composer-form textarea:focus{background:#19332d}
html[data-theme="dark"] body.messaging-page .composer-form textarea{color:#eef7f4;border-color:#29413c}
@media(max-width:560px){
  body.messaging-page .message-bubble{max-width:86%;min-width:54px}
}
/* PRONET — clean messaging inputs */
body.messaging-page .messages-search{
  position:relative;
  width:100%;
}
body.messaging-page .messages-search input{
  width:100%;
  height:44px;
  min-height:44px;
  margin:0;
  padding:0 14px 0 38px;
  border:1px solid var(--line);
  border-radius:14px;
  outline:0;
  background:var(--soft);
  color:var(--ink);
  font-size:16px;
  line-height:20px;
  box-shadow:none;
  -webkit-appearance:none;
  appearance:none;
}
body.messaging-page .messages-search input::placeholder{
  color:#87938e;
  opacity:1;
}
body.messaging-page .messages-search input:focus{
  border-color:rgba(0,255,208,.55);
  background:var(--white);
  box-shadow:0 0 0 3px rgba(0,255,208,.10);
}
body.messaging-page .composer-form{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  height:44px;
  min-height:44px;
  max-height:44px;
  padding:0;
  margin:0;
  border:0;
  border-radius:0;
  background:transparent;
}
body.messaging-page .composer-form textarea{
  flex:1 1 auto;
  width:auto;
  height:44px;
  min-height:44px;
  max-height:44px;
  margin:0!important;
  padding:0 15px!important;
  display:block;
  box-sizing:border-box;
  border:1px solid var(--line)!important;
  border-radius:14px!important;
  outline:0;
  background:var(--white)!important;
  color:var(--ink);
  box-shadow:none!important;
  font-size:16px;
  line-height:20px;
  resize:none;
  -webkit-appearance:none;
  appearance:none;
}
body.messaging-page .composer-form textarea::placeholder{
  color:#87938e;
  opacity:1;
}
body.messaging-page .composer-form textarea:focus{
  border-color:rgba(0,255,208,.55)!important;
  background:var(--white)!important;
  box-shadow:0 0 0 3px rgba(0,255,208,.10)!important;
}
body.messaging-page .composer-send{
  width:44px;
  height:44px;
  min-width:44px;
  min-height:44px;
  margin:0;
  align-self:center;
  flex:0 0 44px;
  border-radius:14px;
}
html[data-theme="dark"] body.messaging-page .messages-search input{
  background:#17302b;
  color:#eef7f4;
  border-color:#29413c;
}
html[data-theme="dark"] body.messaging-page .messages-search input:focus{
  background:#19332d;
}
html[data-theme="dark"] body.messaging-page .composer-form textarea{
  background:#17302b!important;
  color:#eef7f4;
  border-color:#29413c!important;
}
html[data-theme="dark"] body.messaging-page .composer-form textarea:focus{
  background:#19332d!important;
}
body.messaging-page .message-row.mine .message-bubble{
  background:#052d28;
  color:#fff;
  box-shadow:0 1px 3px rgba(5,45,40,.18);
}
body.messaging-page .message-row.mine .message-meta{
  color:#d7e8e3;
}
html[data-theme="dark"] body.messaging-page .message-row.mine .message-bubble{
  background:#052d28;
  color:#fff;
}

/* PRONET — vérification de relation client */
.relationship-action{margin-left:auto;flex:none}.relationship-btn{border:1px solid #b9d9d1;background:#edf9f5;color:var(--ink);border-radius:12px;padding:9px 12px;display:inline-flex;align-items:center;gap:7px;font-size:10px;font-weight:750}.relationship-btn svg,.relationship-status svg{width:14px;height:14px}.relationship-inline{display:flex;align-items:center;gap:7px}.relationship-status{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:7px 9px;font-size:9px;font-weight:750;white-space:nowrap}.relationship-status.pending{background:#f4f6f5;color:#71807b}.relationship-status.active{background:#e6faf4;color:#08745f}.relationship-status.completed{background:#edf7f4;color:#42675f}.relationship-end-btn{border:0;background:transparent;color:#71807b;font-size:9px;font-weight:700;padding:5px}.review-verified{display:inline-flex;align-items:center;gap:4px;margin-left:8px;color:#08745f;font-size:9px;font-weight:750}.review-verified svg{width:12px;height:12px}@media(max-width:700px){.relationship-action{max-width:58%}.relationship-btn{padding:8px 9px;font-size:9px}.relationship-status{font-size:8px}.relationship-end-btn{display:none}}


/* PRONET — client dashboard overview spacing */
body.dashboard-page .client-account-summary{
  display:grid;
  gap:14px;
  margin-bottom:16px;
}
body.dashboard-page #panel-account .panel-header{
  margin-bottom:16px;
}
body.dashboard-page #panel-account .profile-progress-card{
  margin:0;
}
body.dashboard-page #panel-account .role-card{
  margin-top:0;
  padding:16px 18px;
}
body.dashboard-page #panel-account .role-note{
  margin-top:10px;
}
body.dashboard-page #panel-account #becomeProfessionalButton{
  margin-top:12px;
}
@media(max-width:640px){
  body.dashboard-page #panel-account{
    padding:18px;
    border-radius:20px;
  }
  body.dashboard-page #panel-account .panel-header{
    margin-bottom:14px;
  }
  body.dashboard-page .client-account-summary{
    gap:10px;
    margin-bottom:14px;
  }
  body.dashboard-page #panel-account .role-card{
    padding:14px 15px;
    gap:12px;
  }
  body.dashboard-page #panel-account .role-note{
    margin-top:8px;
  }
  body.dashboard-page #panel-account #becomeProfessionalButton{
    margin-top:10px;
  }
}


/* PRONET — interactive dashboard indicators */
.dashboard-indicator{cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;}
.dashboard-indicator:focus-visible{outline:2px solid var(--accent,#00ffd0);outline-offset:2px;}
@media (hover:hover) and (pointer:fine){.dashboard-indicator:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(5,45,40,.08);}}


/* PRONET — WhatsApp-inspired unread dot */
body.messaging-page .conversation-unread{
  width:7px;
  height:7px;
  min-width:7px;
  border-radius:50%;
  background:#25D366;
  flex:0 0 7px;
  display:inline-block;
  box-shadow:0 0 0 2px rgba(37,211,102,.08);
}


/* PRONET — relationship initiation CTA */
.relationship-start-btn{margin-top:10px;}
.relationship-start-btn.is-loading{opacity:.65;pointer-events:none;}


/* PRONET — profile header actions */
.profile-head-actions{display:flex;align-items:center;gap:10px;margin-left:auto;}
.profile-head-actions .relationship-start-btn{margin-top:0;}
@media(max-width:760px){.profile-head-actions{width:100%;margin-left:0;flex-direction:column;align-items:stretch;}.profile-head-actions button{width:100%;}.profile-head{flex-wrap:wrap;}}

/* Service-first contact flow */
.service-link{display:block;text-decoration:none;color:inherit;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.service-link:hover{transform:translateY(-2px)}
.service-link-main{display:flex;gap:14px;align-items:flex-start}
.service-icon{width:40px;height:40px;min-width:40px;border-radius:12px;display:grid;place-items:center;background:rgba(0,255,208,.10);color:#00a98f}
.service-icon svg{width:19px;height:19px}
.service-link-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px;padding-top:14px;border-top:1px solid var(--border,#e7eceb)}
.service-link-bottom span{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:650;color:var(--muted,#687775)}
.service-link-bottom svg{width:15px;height:15px}
.service-main{padding:42px 0 70px}
.service-detail{max-width:980px;margin:0 auto}
.service-back-link{display:inline-flex;align-items:center;gap:7px;margin-bottom:18px;color:var(--muted,#687775);text-decoration:none;font-size:14px;font-weight:600}
.service-back-link svg{width:17px;height:17px}
.service-detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px}
.service-detail-grid>section,.service-provider-card{background:var(--surface,#fff);border:1px solid var(--border,#e7eceb);border-radius:24px;padding:30px;box-shadow:0 12px 35px rgba(5,45,40,.06)}
.service-detail h1{font-size:clamp(30px,5vw,48px);line-height:1.05;margin:8px 0 16px;letter-spacing:-.035em}
.service-detail-description{font-size:17px;line-height:1.7;color:var(--muted,#687775);white-space:pre-line;margin:0;max-width:680px}
.service-detail-price{display:flex;align-items:baseline;gap:9px;margin:28px 0 24px}
.service-detail-price span{font-size:13px;color:var(--muted,#687775)}
.service-detail-price strong{font-size:24px}
.service-contact-btn{display:inline-flex;align-items:center;gap:9px}
.service-contact-btn svg{width:18px;height:18px}
.service-contact-note{font-size:13px;line-height:1.55;color:var(--muted,#687775);margin:13px 0 0;max-width:520px}
.service-provider-card{height:max-content}
.service-provider-avatar{width:72px;height:72px;border-radius:50%;overflow:hidden;background:#edf2f1;display:grid;place-items:center;font-weight:750;font-size:20px;margin-bottom:20px}
.service-provider-avatar img{width:100%;height:100%;object-fit:cover}
.service-provider-card h2{margin:6px 0 6px;font-size:21px}
.service-provider-card p{margin:0 0 22px;color:var(--muted,#687775);line-height:1.5}
.service-provider-card .full{width:100%;justify-content:center}
.profile-owner-action{display:inline-flex;align-items:center;gap:7px;margin-top:10px;text-decoration:none}
.profile-owner-action svg{width:15px;height:15px}
.service-link-own{border-color:rgba(0,169,143,.22);background:linear-gradient(180deg,#fff 0%,#f8fcfb 100%)}
.service-link-own .service-link-bottom span{color:#007f6e}
.service-owner-actions{margin-top:26px;padding-top:22px;border-top:1px solid var(--border,#e7eceb)}
.service-owner-label{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:750;color:#52635e;margin-bottom:14px}
.service-owner-label svg{width:16px;height:16px}
.service-edit-form{display:flex;flex-direction:column;gap:14px}
.service-edit-form label{display:flex;flex-direction:column;gap:7px;font-size:11px;font-weight:700;color:#52635e}
.service-edit-form input,.service-edit-form textarea{
  width:100%;box-sizing:border-box;border:1px solid #dce6e2;border-radius:12px;background:#f8faf9;color:var(--ink,#20302c);
  padding:11px 12px;font:inherit;font-size:13px;font-weight:500;outline:none;resize:vertical;
}
.service-edit-form input:focus,.service-edit-form textarea:focus{border-color:#8ccfc1;background:#fff;box-shadow:0 0 0 3px rgba(0,255,208,.08)}
.service-edit-grid{display:grid;grid-template-columns:1fr 120px;gap:10px}
.service-active-toggle{flex-direction:row!important;align-items:center;gap:9px!important;font-weight:600!important}
.service-active-toggle input{width:16px;height:16px;accent-color:#052d28}
.service-edit-status{min-height:18px;margin:0;font-size:11px;color:#667772}
.service-save-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.service-save-btn svg{width:16px;height:16px}

@media (max-width:760px){
  .service-main{padding:24px 0 50px}
  .service-detail-grid{grid-template-columns:1fr}
  .service-detail-grid>section,.service-provider-card{padding:22px;border-radius:20px}
  .service-detail h1{font-size:32px}
  .service-detail-description{font-size:16px}
  .service-contact-btn{width:100%;justify-content:center}
}

/* PRONET — premium message bubbles */
body.messaging-page .chat-messages{padding:28px 26px 20px;gap:10px;background:linear-gradient(180deg,#fbfcfc 0%,#f7faf9 100%)}
body.messaging-page .chat-day{font-size:10px;font-weight:650;letter-spacing:.02em;color:#87938f;margin:12px 0 10px}
body.messaging-page .message-row{max-width:min(76%,560px);animation:messageIn .18s ease-out}
body.messaging-page .message-row>div{min-width:0}
body.messaging-page .message-bubble{
  padding:12px 15px;
  border-radius:18px 18px 18px 6px;
  background:#fff;
  color:#20302c;
  border:1px solid #e5ebe9;
  box-shadow:0 3px 12px rgba(5,45,40,.045);
  font-size:13px;
  line-height:1.62;
  letter-spacing:-.005em;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
body.messaging-page .message-row.mine .message-bubble{
  background:#052d28;
  color:#fff;
  border:0;
  border-radius:18px 18px 6px 18px;
  box-shadow:0 5px 16px rgba(5,45,40,.14);
}
body.messaging-page .message-meta{
  font-size:9px;
  color:#8b9793;
  margin:5px 4px 0;
  line-height:1;
}
body.messaging-page .message-row.mine .message-meta{text-align:right}
body.messaging-page .message-status{font-size:10px;letter-spacing:-2px;margin-left:2px}
body.messaging-page .chat-composer{
  padding:13px 18px 10px;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(14px);
  border-top:1px solid #e7ecea;
}
body.messaging-page .composer-form{
  background:#f7f9f8;
  border:1px solid #dde6e2;
  border-radius:19px;
  padding:6px 6px 6px 13px;
  box-shadow:0 3px 14px rgba(5,45,40,.035);
}
body.messaging-page .composer-form:focus-within{border-color:#8ccfc1;box-shadow:0 0 0 3px rgba(0,255,208,.08)}
body.messaging-page .composer-form textarea{
  min-height:40px;
  padding:9px 4px!important;
  font-size:13px;
  line-height:1.45;
}
body.messaging-page .composer-send{
  width:40px;height:40px;border-radius:14px;
  background:#052d28;
  box-shadow:0 3px 8px rgba(5,45,40,.14);
  transition:transform .15s ease,opacity .15s ease;
}
body.messaging-page .composer-send:hover{transform:translateY(-1px)}
body.messaging-page .composer-note{font-size:9px;color:#929d99;padding:6px 5px 0}
@keyframes messageIn{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:560px){
 body.messaging-page .chat-messages{padding:20px 12px 14px;gap:8px}
 body.messaging-page .message-row{max-width:88%}
 body.messaging-page .message-bubble{padding:11px 13px;font-size:13px;line-height:1.58}
 body.messaging-page .chat-composer{padding:9px 9px 8px}
}


/* PRONET — final messaging field + balanced bubble spacing */
body.messaging-page .message-bubble{
  padding:13px 16px !important;
  box-sizing:border-box;
}

body.messaging-page .message-row.mine .message-bubble,
body.messaging-page .message-row:not(.mine) .message-bubble{
  padding-left:16px !important;
  padding-right:16px !important;
}

body.messaging-page .chat-composer{
  padding:10px 14px 11px !important;
  background:rgba(255,255,255,.97);
  border-top:1px solid #e7ecea;
}

body.messaging-page .composer-form{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  height:48px;
  min-height:48px;
  max-height:48px;
  padding:4px 4px 4px 14px !important;
  border:1px solid #dce6e2 !important;
  border-radius:17px !important;
  background:#f7f9f8 !important;
  box-shadow:0 2px 10px rgba(5,45,40,.035) !important;
}

body.messaging-page .composer-form:focus-within{
  border-color:#9bd7ca !important;
  background:#fff !important;
  box-shadow:0 0 0 3px rgba(0,255,208,.08) !important;
}

body.messaging-page .composer-form textarea{
  flex:1 1 auto;
  width:100%;
  height:38px;
  min-height:38px;
  max-height:38px;
  padding:9px 2px !important;
  border:0 !important;
  border-radius:10px !important;
  background:transparent !important;
  box-shadow:none !important;
  font-size:14px;
  line-height:20px;
  color:var(--ink);
}

body.messaging-page .composer-form textarea:focus{
  border:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}

body.messaging-page .composer-send{
  width:38px;
  height:38px;
  min-width:38px;
  min-height:38px;
  flex:0 0 38px;
  border-radius:12px;
  border:0;
  margin:0;
  box-shadow:0 3px 9px rgba(5,45,40,.13);
}

body.messaging-page .composer-note{
  padding:5px 4px 0;
  font-size:9px;
}

@media(max-width:560px){
  body.messaging-page .chat-composer{
    padding:8px 9px 7px !important;
  }

  body.messaging-page .composer-form{
    height:46px;
    min-height:46px;
    max-height:46px;
    padding-left:13px !important;
  }

  body.messaging-page .composer-form textarea{
    height:36px;
    min-height:36px;
    max-height:36px;
    font-size:14px;
  }

  body.messaging-page .composer-send{
    width:36px;
    height:36px;
    min-width:36px;
    min-height:36px;
    flex-basis:36px;
    border-radius:11px;
  }

  body.messaging-page .message-bubble{
    padding:12px 15px !important;
  }

  body.messaging-page .message-row.mine .message-bubble,
  body.messaging-page .message-row:not(.mine) .message-bubble{
    padding-left:15px !important;
    padding-right:15px !important;
  }
}


/* PRONET — align message bubble and metadata as one message unit */
body.messaging-page .message-row > div{
  display:flex;
  flex-direction:column;
  width:fit-content;
  max-width:100%;
}

body.messaging-page .message-row.mine > div{
  align-items:flex-end;
}

body.messaging-page .message-row:not(.mine) > div{
  align-items:flex-start;
}

body.messaging-page .message-bubble{
  width:fit-content;
  max-width:100%;
}

body.messaging-page .message-meta{
  width:100%;
  box-sizing:border-box;
  padding:0 4px;
}

body.messaging-page .message-row.mine .message-meta{
  text-align:right;
}

@media(max-width:560px){
  body.messaging-page .message-row > div{
    max-width:100%;
  }
  body.messaging-page .message-meta{
    padding-left:3px;
    padding-right:3px;
  }
}


/* PRONET — final bubble/meta alignment for incoming + outgoing messages */
body.messaging-page .message-row > div{
  display:flex;
  flex-direction:column;
  width:auto;
  max-width:100%;
  min-width:0;
}

body.messaging-page .message-bubble{
  display:block;
  width:max-content;
  max-width:100%;
  box-sizing:border-box;
}

body.messaging-page .message-meta{
  display:block;
  width:max-content;
  max-width:100%;
  box-sizing:border-box;
  margin-top:5px;
  padding:0 4px;
  white-space:nowrap;
}

body.messaging-page .message-row:not(.mine) > div{
  align-items:flex-start;
}

body.messaging-page .message-row:not(.mine) .message-meta{
  align-self:flex-start;
  text-align:left;
}

body.messaging-page .message-row.mine > div{
  align-items:flex-end;
}

body.messaging-page .message-row.mine .message-meta{
  align-self:flex-end;
  text-align:right;
}

@media(max-width:560px){
  body.messaging-page .message-bubble{
    max-width:100%;
  }

  body.messaging-page .message-meta{
    padding-left:3px;
    padding-right:3px;
  }
}


/* PRONET — Samsung/Android narrow-screen overflow fix */
html,body{
  max-width:100%;
  overflow-x:hidden;
}

body.messaging-page .messages-main,
body.messaging-page .messages-shell,
body.messaging-page .chat-panel,
body.messaging-page .chat-messages{
  min-width:0;
  max-width:100%;
}

body.messaging-page .message-row{
  min-width:0;
  max-width:min(76%,560px);
}

body.messaging-page .message-row > div{
  min-width:0;
  max-width:100%;
}

body.messaging-page .message-bubble{
  min-width:0;
  width:auto;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:break-word;
}

body.messaging-page .message-meta{
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}

@media(max-width:560px){
  body.messaging-page .chat-messages{
    width:100%;
    padding-left:10px;
    padding-right:10px;
    overflow-x:hidden;
  }

  body.messaging-page .message-row,
  body.messaging-page .message-row.mine,
  body.messaging-page .message-row:not(.mine){
    max-width:calc(100% - 2px);
    min-width:0;
  }

  body.messaging-page .message-row > div{
    width:auto;
    max-width:100%;
    min-width:0;
  }

  body.messaging-page .message-bubble{
    width:auto;
    max-width:100%;
  }

  body.messaging-page .message-row.mine .message-bubble,
  body.messaging-page .message-row:not(.mine) .message-bubble{
    max-width:100%;
  }
}

@media(max-width:380px){
  body.messaging-page .chat-messages{
    padding-left:8px;
    padding-right:8px;
  }

  body.messaging-page .message-row{
    max-width:100%;
  }

  body.messaging-page .message-bubble{
    padding-left:14px !important;
    padding-right:14px !important;
  }

  body.messaging-page .message-row.mine .message-bubble,
  body.messaging-page .message-row:not(.mine) .message-bubble{
    padding-left:14px !important;
    padding-right:14px !important;
  }
}


/* PRONET — keep message bubbles visually compact on mobile */
body.messaging-page .message-row{
  max-width:min(68%,520px);
}

body.messaging-page .message-bubble{
  max-width:100%;
}

@media(max-width:560px){
  body.messaging-page .message-row,
  body.messaging-page .message-row.mine,
  body.messaging-page .message-row:not(.mine){
    max-width:78%;
  }
}

@media(max-width:380px){
  body.messaging-page .message-row,
  body.messaging-page .message-row.mine,
  body.messaging-page .message-row:not(.mine){
    max-width:82%;
  }
}


/* PRONET — message header: profile action lives on avatar */
body.messaging-page .chat-profile-trigger{
  text-decoration:none;
  cursor:pointer;
  color:#fff;
  border:0;
  outline:0;
}
body.messaging-page .chat-profile-trigger:focus-visible{
  box-shadow:0 0 0 3px rgba(0,255,208,.18);
}
body.messaging-page .relationship-action{
  margin-left:auto;
  flex:0 0 auto;
}

/* PRONET — client cards in dashboard */
.client-panel-header{gap:20px}.client-tools{display:flex;align-items:center;gap:8px;flex:0 0 auto}.client-search,.client-filter{display:flex;align-items:center;gap:9px;height:42px;padding:0 13px;border:1px solid var(--line);border-radius:13px;background:#fff;color:#7a8983}.client-search{width:min(300px,100%)}.client-filter{width:190px}.client-search svg,.client-filter svg{width:17px;height:17px;flex:0 0 auto}.client-search input,.client-filter select{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font-size:12px}.client-search input::placeholder{color:#9aa6a1}.client-filter select{appearance:none;cursor:pointer}.client-search-fab{position:fixed;right:18px;bottom:22px;z-index:700;width:48px;height:48px;border:1px solid rgba(5,45,40,.12);border-radius:50%;background:var(--ink);color:#fff;display:none;align-items:center;justify-content:center;box-shadow:0 12px 30px rgba(5,45,40,.2);cursor:pointer;transition:.2s ease}.client-search-fab svg{width:19px;height:19px}.client-search-fab:hover{transform:translateY(-2px)}.client-search-fab.is-visible{display:flex}.client-search-popover{position:fixed;right:18px;bottom:80px;z-index:701;width:min(360px,calc(100vw - 36px));padding:10px;border:1px solid var(--line);border-radius:16px;background:var(--card,#fff);box-shadow:0 18px 45px rgba(5,45,40,.18);display:none;gap:8px}.client-search-popover.is-open{display:flex}.client-search-popover .client-search,.client-search-popover .client-filter{width:auto;flex:1}.client-search-popover .client-filter{max-width:175px}html[data-theme="dark"] .client-search,html[data-theme="dark"] .client-filter{background:#10201d;border-color:#29413c;color:#dceae5}html[data-theme="dark"] .client-search-fab{background:#00ffd0;color:#052d28}html[data-theme="dark"] .client-search-popover{background:#10201d}@media(max-width:700px){.client-panel-header{align-items:stretch;flex-direction:column;gap:12px}.client-tools{width:100%;flex-direction:column;align-items:stretch}.client-search,.client-filter{width:100%;box-sizing:border-box}.client-search-popover{flex-direction:column}.client-search-popover .client-search,.client-search-popover .client-filter{max-width:none;width:100%;box-sizing:border-box}}body.dashboard-page .client-list{display:flex;flex-direction:column;gap:10px}
body.dashboard-page .client-card{display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid var(--line);border-radius:17px;padding:14px 15px;background:#fff;transition:.18s ease}
body.dashboard-page .client-card:hover{border-color:#c9d9d4;box-shadow:0 8px 22px rgba(5,45,40,.045);transform:translateY(-1px)}
body.dashboard-page .client-card-main{display:flex;align-items:center;gap:13px;min-width:0}
body.dashboard-page .client-card-avatar{width:50px;height:50px;min-width:50px;border-radius:15px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;font-size:14px;font-weight:800;letter-spacing:.02em}
body.dashboard-page .client-card-avatar img{width:100%;height:100%;object-fit:cover}
body.dashboard-page .client-card-copy{min-width:0;display:flex;flex-direction:column;gap:4px}
body.dashboard-page .client-card-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
body.dashboard-page .client-card-top strong{font-size:14px;letter-spacing:-.01em;overflow-wrap:anywhere}
body.dashboard-page .client-card-headline{font-size:11px;color:#6f7e78;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.dashboard-page .client-card-location{display:inline-flex;align-items:center;gap:4px;font-size:10px;color:#87938e}
body.dashboard-page .client-card-location svg{width:12px;height:12px}
body.dashboard-page .client-status{display:inline-flex;align-items:center;padding:4px 7px;border-radius:999px;background:#eefaf6;color:#247564;font-size:9px;font-weight:750;white-space:nowrap}
body.dashboard-page .client-status.completed{background:#f2f5f4;color:#687771}
body.dashboard-page .client-card-footer{flex:0 0 auto}
body.dashboard-page .client-card-link{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:750;color:var(--ink);white-space:nowrap}
body.dashboard-page .client-card-link svg{width:13px;height:13px}
body.dashboard-page .client-card-private{font-size:10px;color:#909b97;white-space:nowrap}
@media(max-width:640px){body.dashboard-page .client-card{align-items:flex-start;flex-direction:column;gap:11px}body.dashboard-page .client-card-footer{width:100%;padding-left:63px}body.dashboard-page .client-card-link{width:100%;justify-content:flex-start}}

/* PRONET — dashboard tool navigation follows indicator selection */
@media(max-width:980px){
  body.dashboard-page .side-nav{scroll-behavior:smooth;scroll-snap-type:x proximity;overscroll-behavior-x:contain;scrollbar-width:none}
  body.dashboard-page .side-nav::-webkit-scrollbar{display:none}
  body.dashboard-page .side-link{flex:0 0 auto;scroll-snap-align:center;width:auto}
}


/* PRONET — mobile avatar crop: one-finger positioning */
.crop-stage,
.crop-stage .cropper-container,
.crop-stage .cropper-wrap-box,
.crop-stage .cropper-canvas,
.crop-stage .cropper-drag-box,
.crop-stage .cropper-view-box{
  touch-action:none;
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
}
.crop-stage .cropper-container{
  width:100%;
  height:100%;
}
.crop-stage .cropper-drag-box{
  cursor:grab;
}
.crop-stage .cropper-drag-box:active{
  cursor:grabbing;
}
@media(max-width:640px){
  .crop-stage{
    overscroll-behavior:contain;
  }
}

/* PRONET — custom avatar crop canvas */
#avatarCropStage{position:relative;overflow:hidden;touch-action:none;background:#14211e}
#avatarCropCanvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none}
#avatarCropCanvas:active{cursor:grabbing}


/* PRONET — avatar images are already square after crop; never crop them again */
.media-preview.avatar-preview img,
.profile-avatar-large img,
.profile-account-avatar img{
  object-fit:contain;
  object-position:center;
}

/* PRONET multilingual picker */
#pronetLanguagePicker{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:20px}
.pronet-lang-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.45);backdrop-filter:blur(6px)}
.pronet-lang-card{position:relative;width:min(360px,100%);padding:24px;border:1px solid rgba(127,127,127,.18);border-radius:24px;background:var(--surface,#fff);box-shadow:0 24px 70px rgba(0,0,0,.25)}
.pronet-lang-card h2{margin:6px 0 18px}
.pronet-lang-card>button:not(.pronet-lang-close){display:block;width:100%;margin:8px 0;padding:14px 16px;border:1px solid rgba(127,127,127,.2);border-radius:14px;background:transparent;color:inherit;text-align:left;font:inherit;cursor:pointer}
.pronet-lang-card>button:not(.pronet-lang-close):hover{background:rgba(0,255,208,.08);border-color:#00ffd0}
.pronet-lang-close{position:absolute;right:14px;top:12px;width:34px;height:34px;border:0;border-radius:50%;background:transparent;color:inherit;font-size:24px;cursor:pointer}


/* PRONET — message checkmarks: sent/unread vs read */
body.messaging-page .message-row.mine .message-status{
  color:#8b9793 !important;
  font-size:11px !important;
  font-weight:800 !important;
  letter-spacing:-1px !important;
  margin-left:4px !important;
  opacity:1 !important;
  text-shadow:none !important;
  vertical-align:-1px;
}

body.messaging-page .message-row.mine .message-status[aria-label="Vu"]{
  color:#25D366 !important;
}

body.messaging-page .message-row.mine .message-meta{
  color:#8b9793 !important;
  font-weight:400 !important;
}

body.messaging-page .message-row.mine .message-meta time,
body.messaging-page .message-row.mine .message-meta .message-time{
  color:#8b9793 !important;
}


/* PRONET — own profile avatar opens dashboard */
body.profile-page .profile-avatar-own{cursor:pointer}
body.profile-page .profile-avatar-own:hover{box-shadow:0 0 0 4px rgba(0,255,208,.16)}
body.profile-page .profile-avatar-own:focus-visible{outline:0;box-shadow:0 0 0 4px rgba(0,255,208,.22)}
body.dashboard-page .media-preview.avatar-preview{cursor:pointer}
body.dashboard-page .media-preview.avatar-preview:hover{border-color:#8ccfc1;box-shadow:0 0 0 3px rgba(0,255,208,.08)}
body.dashboard-page .profile-save-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px;flex-wrap:wrap}
body.dashboard-page .profile-save-actions button{display:inline-flex;align-items:center;justify-content:center;gap:7px}
body.dashboard-page .profile-save-actions svg{width:15px;height:15px}
@media(max-width:640px){
  body.dashboard-page .profile-save-actions{width:100%;flex-direction:column}
  body.dashboard-page .profile-save-actions button{width:100%}
}

/* Desktop account menu: the avatar remains the account trigger on every authenticated page.
   Only the mobile-only navigation links are hidden on desktop. */
@media (min-width:981px){
  .profile-account-menu .mobile-account-nav-item,
  .profile-account-menu .mobile-account-nav-divider{display:none!important}
  .profile-account-menu a,
  .profile-account-menu button{font-size:13px}
}
@media (min-width:981px){.desktop-nav-tabs{display:flex;align-items:center;gap:4px;margin-left:auto}.desktop-nav-tabs .nav-tab{min-height:40px;padding:0 11px;border-radius:11px;display:inline-flex;align-items:center;gap:7px;color:#5b6b65;font-size:12px;font-weight:650;white-space:nowrap;transition:.2s ease}.desktop-nav-tabs .nav-tab svg{width:15px;height:15px}.desktop-nav-tabs .nav-tab:hover{background:var(--soft);color:var(--ink)}.desktop-nav-tabs .nav-tab-home{color:var(--ink)!important}.desktop-nav-tabs .nav-tab-home:hover{background:var(--soft);color:var(--ink)!important}.desktop-nav-tabs .nav-tab-current{background:var(--soft);color:var(--ink)!important}.nav-actions .profile-account-btn{display:inline-flex!important}.nav-actions .profile-account-menu.hidden{display:none!important}.nav-actions .profile-account-menu:not(.hidden){position:absolute;top:calc(100% + 10px);right:0;width:220px;padding:7px;border:1px solid #dce6e2;border-radius:18px;background:#fff;color:#052d28;box-shadow:0 20px 45px rgba(5,45,40,.18);display:block;overflow:hidden;z-index:200}.nav-actions .profile-account-menu:not(.hidden) button{box-sizing:border-box;width:100%;min-height:44px;margin:0;padding:0 12px;border:0;border-radius:12px;background:#fff;color:#052d28;display:flex;align-items:center;gap:11px;text-align:left;font-family:inherit;font-size:13px;font-weight:600;cursor:pointer}.nav-actions .profile-account-menu:not(.hidden) button:hover{background:#f1f7f5}.nav-actions .profile-account-menu:not(.hidden) svg{width:17px;height:17px;color:#526b65;flex:none}.nav-actions .profile-account-menu:not(.hidden) span{min-width:0;flex:1}.nav-actions .profile-account-menu:not(.hidden) small{margin-left:auto;color:#71827d;font-size:10px;font-weight:600}html[data-theme="dark"] .nav-actions .profile-account-menu:not(.hidden){background:#10201d;color:#f4fbf8;border-color:#29413c}html[data-theme="dark"] .nav-actions .profile-account-menu:not(.hidden) button{background:#10201d;color:#f4fbf8}html[data-theme="dark"] .nav-actions .profile-account-menu:not(.hidden) button:hover{background:#19302b}}
@media (max-width:980px){.desktop-nav-tabs{display:none!important}}
.mobile-account-nav-item,.mobile-account-nav-divider{display:none}
@media (min-width:981px){
  .profile-account-menu .mobile-account-nav-item,
  .profile-account-menu .mobile-account-nav-divider{display:none!important}
}
@media (max-width:980px){
  .profile-account-menu .mobile-account-nav-item{display:flex}
  .profile-account-menu .mobile-account-nav-divider{display:block}
}

/* PRONET — Portefeuille dans le menu compte sur tous les écrans */
.profile-account-menu #dashboardWalletLink{display:flex!important;}

/* PRONET — notation vérifiée */
.rating-summary{display:flex;align-items:center;gap:22px;padding:18px;border:1px solid var(--line);border-radius:18px;background:var(--soft);margin-bottom:14px}.rating-summary-score{min-width:120px;text-align:center}.rating-summary-score strong{display:block;font-size:34px;letter-spacing:-.05em}.rating-summary-score span{display:block;color:#0e8b72;letter-spacing:2px;font-size:16px;margin:2px 0}.rating-summary-score small{color:#71807b;font-size:11px}.rating-summary-copy{border-left:1px solid var(--line);padding-left:22px}.rating-summary-copy strong{font-size:14px}.rating-summary-copy p{margin:5px 0 0;color:#71807b;font-size:12px;line-height:1.5}.dashboard-reviews-list{margin-top:12px}.review-date{display:block;margin-top:8px;color:#8a9691;font-size:10px}.review-modal{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:20px}.review-modal.hidden{display:none}.review-modal-backdrop{position:absolute;inset:0;background:rgba(5,45,40,.45);backdrop-filter:blur(4px)}.review-modal-card{position:relative;width:min(100%,500px);background:var(--card,#fff);border:1px solid var(--line);border-radius:24px;padding:24px;box-shadow:0 24px 70px rgba(5,45,40,.2)}.review-modal-head{display:flex;justify-content:space-between;gap:18px}.review-modal-head h2{margin:5px 0;font-size:24px;letter-spacing:-.04em}.review-modal-head p{margin:0;color:#71807b;font-size:12px;line-height:1.5}.review-stars{display:flex;justify-content:center;gap:6px;margin:24px 0 18px}.review-stars button{border:0;background:transparent;color:#cbd5d1;font-size:34px;line-height:1;padding:2px;cursor:pointer;transition:transform .15s ease,color .15s ease}.review-stars button:hover,.review-stars button.selected{color:#0e8b72;transform:scale(1.06)}#reviewTestimonial{width:100%;resize:vertical;border:1px solid var(--line);border-radius:14px;padding:13px;font:inherit;font-size:13px;outline:0;background:var(--card,#fff);color:var(--ink)}#reviewTestimonial:focus{border-color:#8dcabd;box-shadow:0 0 0 3px rgba(0,255,208,.08)}.review-modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}.review-modal .save-status{display:block;min-height:18px;margin-top:8px}.review-modal .dark-btn:disabled{opacity:.55;cursor:not-allowed}
html[data-theme="dark"] .review-modal-card{background:#102a25}.rating-summary{background:var(--soft)}
@media(max-width:640px){.rating-summary{align-items:flex-start;gap:14px}.rating-summary-copy{padding-left:14px}.review-modal{padding:12px}.review-modal-card{padding:19px;border-radius:20px}.review-stars{margin:20px 0 14px}.review-stars button{font-size:30px}}


/* PRONET — transparence des notes : moyenne + nombre d’avis */
.card-rating{display:inline-flex;align-items:center;gap:4px}
.card-rating small{font-size:10px;color:#7b8984;font-weight:600}
.profile-key-stats>div{display:flex;flex-direction:column;align-items:center;gap:2px}
.profile-key-stats>div small{font-size:10px;color:#7b8984;line-height:1.2}

/* PRONET — portfolio desktop 3 colonnes + import couverture */
.project-cover-input{display:flex;gap:8px;align-items:center}.project-cover-input>input{flex:1}.project-cover-upload{margin:0;white-space:nowrap}.project-cover-upload input{display:none}
.pronet-notification-panel{position:fixed;z-index:5000;top:72px;right:24px;width:min(390px,calc(100vw - 32px));max-height:520px;background:var(--card,#fff);border:1px solid var(--line);border-radius:20px;box-shadow:0 20px 60px rgba(5,45,40,.18);overflow:hidden}.pronet-notification-panel.hidden{display:none}.pronet-notification-head{display:flex;align-items:center;justify-content:space-between;padding:15px 17px;border-bottom:1px solid var(--line)}.pronet-notification-head button{border:0;background:transparent;font-size:22px;cursor:pointer;color:inherit}.pronet-notification-list{max-height:455px;overflow:auto}.pronet-notification-item{display:flex;width:100%;flex-direction:column;gap:4px;padding:14px 17px;border:0;border-bottom:1px solid var(--line);background:transparent;text-align:left;cursor:pointer}.pronet-notification-item:hover{background:var(--soft)}.pronet-notification-item.unread{background:#f0faf7}.pronet-notification-item strong{font-size:13px;color:var(--ink)}.pronet-notification-item span{font-size:11px;color:#687871;line-height:1.45}.pronet-notification-item time{font-size:9px;color:#8a9691}.pronet-notification-empty{padding:30px 18px;text-align:center;color:#7a8781;font-size:12px}
html[data-theme="dark"] .pronet-notification-item.unread{background:#142d28}
@media(min-width:981px){body.profile-page .portfolio-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}body.profile-page .portfolio-image{height:145px}}
@media(max-width:980px){.project-cover-input{flex-direction:column;align-items:stretch}.project-cover-input>input,.project-cover-upload{width:100%;box-sizing:border-box}}

@media (min-width:981px){body.profile-page .profile-identity{transform:translateY(78px)}body.profile-page .profile-avatar-large{transform:translateY(48px)}}


@media (min-width:981px){body.profile-page #profileServicesSection{margin-top:56px}body.profile-page .profile-key-stats{display:flex;flex-wrap:wrap;align-items:center;gap:8px}body.profile-page .profile-key-stats>div{flex:0 0 auto;min-width:max-content;width:max-content;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:4px;padding:5px 11px;height:32px;white-space:nowrap}body.profile-page .profile-key-stats strong{font-size:15px;line-height:1}body.profile-page .profile-key-stats span,body.profile-page .profile-key-stats small{margin:0;font-size:9px;line-height:1;white-space:nowrap}}

/* PRONET — Premium account */
.premium-account-card{margin-top:18px;display:flex;align-items:center;gap:13px;width:100%;padding:14px 16px;border:2px solid #00ffd0;border-radius:14px;background:#00ffd0;color:#052d28;text-decoration:none;transition:.2s ease}
.premium-account-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,255,208,.18)}
.premium-account-icon{width:38px;height:38px;flex:0 0 38px;border-radius:11px;display:flex;align-items:center;justify-content:center;background:#052d28;color:#00ffd0}
.premium-account-icon svg{width:18px;height:18px}
.premium-account-copy{min-width:0;display:flex;flex-direction:column;gap:3px;flex:1}
.premium-account-copy strong{font-size:13px;letter-spacing:-.01em}
.premium-account-copy small{font-size:10px;line-height:1.4;color:#052d28}
.premium-account-arrow{width:16px;height:16px;color:#00ffd0;flex:none}
html[data-theme="dark"] .premium-account-card{background:#052d28;border-color:#00ffd0}
/* PRONET — Premium page */
.premium-main{min-height:calc(100vh - 78px);padding:42px 0 90px}
.premium-back{display:inline-flex;align-items:center;gap:7px;color:#65746e;font-size:12px;font-weight:650;margin-bottom:28px}
.premium-back svg{width:15px;height:15px}
.premium-hero{max-width:720px;margin:0 auto 28px;text-align:center}


.premium-hero h1{font-size:clamp(38px,6vw,64px);line-height:1;letter-spacing:-.055em;margin:15px 0 18px}
.premium-hero p{max-width:600px;margin:0 auto;color:#6c7b75;font-size:15px;line-height:1.7}
.premium-plan{max-width:620px;margin:0 auto;padding:30px;border:1px solid var(--line);border-radius:28px;background:#fff;box-shadow:0 20px 60px rgba(5,45,40,.08)}
.premium-plan-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.premium-plan-label{display:block;color:#60746d;font-size:11px;font-weight:750;text-transform:uppercase;letter-spacing:.1em}
.premium-plan h2{margin:7px 0 0;font-size:40px;letter-spacing:-.05em}
.premium-plan h2 small{font-size:13px;letter-spacing:0;color:#71807b;font-weight:600}
.premium-plan-badge{padding:7px 10px;border-radius:999px;background:#eefaf6;color:#197763;font-size:10px;font-weight:750}
.premium-benefits{display:flex;flex-direction:column;gap:13px;margin:28px 0}
.premium-benefits div{display:flex;align-items:flex-start;gap:10px;color:#52645e;font-size:13px;line-height:1.5}
.premium-benefits svg{width:17px;height:17px;color:#0e8b72;flex:none;margin-top:1px}
.premium-pay-button{width:100%;min-height:50px}
.premium-pay-status{min-height:18px;margin:12px 0 0;text-align:center;color:#b24a3d;font-size:12px}
.premium-note{max-width:620px;margin:18px auto 0;text-align:center;color:#87938e;font-size:11px;line-height:1.6}
html[data-theme="dark"] .premium-plan{background:#10201d;border-color:#29413c}
html[data-theme="dark"] .premium-hero p,html[data-theme="dark"] .premium-note{color:#9eb0aa}
html[data-theme="dark"] .premium-benefits div{color:#c1d0cb}
@media(max-width:640px){.premium-main{padding:28px 0 60px}.premium-plan{padding:22px;border-radius:22px}.premium-plan h2{font-size:34px}.premium-hero h1{font-size:40px}.premium-plan-head{align-items:flex-start}}

/* Logged-out header: never show account/avatar control */
body[data-session="inactive"] .profile-account-btn{display:none!important}

/* PRONET — recherche clients flottante */
.client-search-fab,.client-search-popover{font-family:inherit}
.client-search-popover .client-search input,.client-search-popover .client-filter select{font-size:12px}
html[data-theme="dark"] .client-search-popover .client-search,html[data-theme="dark"] .client-search-popover .client-filter{background:#10201d;border-color:#29413c;color:#dceae5}

.client-search-main{width:min(500px,100%)}.client-search-main select{width:145px;flex:0 0 145px;appearance:none;cursor:pointer;border:0;outline:0;background:transparent;color:var(--ink);font-size:12px}.client-search-divider{width:1px;height:20px;background:var(--line);flex:0 0 auto}@media(max-width:700px){.client-search-main{width:100%}.client-search-main select{width:125px;flex-basis:125px}.client-search-divider{height:18px}}
/* Dashboard — dark theme completeness */
html[data-theme="dark"] body.dashboard-page .welcome-card{
  background:linear-gradient(135deg,#102821,#0d1d19);
}
html[data-theme="dark"] body.dashboard-page .mini-profile,
html[data-theme="dark"] body.dashboard-page .media-uploader,
html[data-theme="dark"] body.dashboard-page .switch-row,
html[data-theme="dark"] body.dashboard-page .upload-btn,
html[data-theme="dark"] body.dashboard-page .manage-item,
html[data-theme="dark"] body.dashboard-page .project-item,
html[data-theme="dark"] body.dashboard-page .contact-link,
html[data-theme="dark"] body.dashboard-page .role-card,
html[data-theme="dark"] body.dashboard-page .role-note,
html[data-theme="dark"] body.dashboard-page .profile-key-stats div,
html[data-theme="dark"] body.dashboard-page .demo-profile-stats div,
html[data-theme="dark"] body.dashboard-page .empty-inline{
  background:#0f211d;
  border-color:var(--line);
  color:var(--ink);
}
html[data-theme="dark"] body.dashboard-page .media-preview,
html[data-theme="dark"] body.dashboard-page .project-thumb{
  background:#132a25;
  color:#9bb2ac;
}
html[data-theme="dark"] body.dashboard-page .role-icon{
  background:#17362f;
  color:#8ee8d5;
}
html[data-theme="dark"] body.dashboard-page .role-card p,
html[data-theme="dark"] body.dashboard-page .role-note,
html[data-theme="dark"] body.dashboard-page .manage-item span,
html[data-theme="dark"] body.dashboard-page .project-copy p,
html[data-theme="dark"] body.dashboard-page .media-copy span,
html[data-theme="dark"] body.dashboard-page .profile-key-stats span,
html[data-theme="dark"] body.dashboard-page .demo-profile-stats span{
  color:#9bb2ac;
}
html[data-theme="dark"] body.dashboard-page .icon-danger{
  background:#351d1b;
  color:#ffaaa0;
}
html[data-theme="dark"] body.dashboard-page .client-search,
html[data-theme="dark"] body.dashboard-page .client-filter,
html[data-theme="dark"] body.dashboard-page .client-card{
  background:#0f211d;
  border-color:var(--line);
  color:var(--ink);
}
html[data-theme="dark"] body.dashboard-page .client-search input,
html[data-theme="dark"] body.dashboard-page .client-filter select,
html[data-theme="dark"] body.dashboard-page .client-search-main select{
  background:transparent;
  color:var(--ink);
}


/* PRONET — global auth bootstrap: never flash the wrong session navbar */
html:not([data-pronet-auth-ready="true"]) .nav-actions{
  visibility:hidden !important;
}
html[data-pronet-auth-ready="true"] .nav-actions{
  visibility:visible;
}

/* PRONET — Skeleton Loading */
.skeleton{position:relative;overflow:hidden;background:#e8efec!important;color:transparent!important;border-color:transparent!important}.skeleton::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.62),transparent);animation:pronetSkeletonShimmer 1.35s ease-in-out infinite}.skeleton *{visibility:hidden!important}.skeleton-card{pointer-events:none}.skeleton-card .card-top{display:flex;align-items:center;gap:14px;padding:16px;background:#edf4f1}.skeleton-avatar{width:58px;height:58px;border-radius:18px;background:#dbe6e2}.skeleton-card .card-identity{flex:1}.skeleton-line{height:11px;border-radius:7px;background:#dbe6e2}.skeleton-line.title{width:68%;height:15px}.skeleton-line.role{width:46%;margin-top:9px}.skeleton-card .card-body{padding:17px}.skeleton-line.location{width:72%;margin-bottom:17px}.skeleton-stat-row{display:flex;gap:10px}.skeleton-line.stat{width:28%;height:10px}.skeleton-tags{display:flex;gap:7px;margin-top:15px}.skeleton-tag{width:64px;height:26px;border-radius:10px;background:#dbe6e2}.skeleton-card .card-footer{padding:14px 17px;border-top:1px solid #dfe8e4}.skeleton-line.footer{width:42%}@keyframes pronetSkeletonShimmer{100%{transform:translateX(100%)}}html[data-theme="dark"] .skeleton{background:#123b35!important}html[data-theme="dark"] .skeleton::after{background:linear-gradient(90deg,transparent,rgba(0,255,208,.08),transparent)}html[data-theme="dark"] .skeleton-card .card-top{background:#10352f}html[data-theme="dark"] .skeleton-avatar,html[data-theme="dark"] .skeleton-line,html[data-theme="dark"] .skeleton-tag{background:#1b4942}


/* PRONET — dashboard indicator card effect */
.stat-card.stat-card-effect{position:relative;isolation:isolate;overflow:hidden;transition:transform .2s ease,box-shadow .25s ease,border-color .25s ease,background .25s ease}
.stat-card.stat-card-effect::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(0,255,208,.32),transparent 42%,rgba(5,45,40,.05));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:.9}
.stat-card.stat-card-effect::after{content:"";position:absolute;top:-70%;left:-35%;width:55%;height:240%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent);transform:rotate(18deg) translateX(-180%);transition:transform .65s ease;pointer-events:none}
.stat-card.stat-card-effect:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(5,45,40,.08)}
.stat-card.stat-card-effect:hover::after{transform:rotate(18deg) translateX(420%)}
.stat-card.stat-card-effect>*{position:relative;z-index:1}
.stat-card.metric-rating{background:linear-gradient(145deg,#fff,#f5fbf9)}
.stat-card.metric-clients{background:linear-gradient(145deg,#fff,#f3faf7)}
.stat-card.metric-projects{background:linear-gradient(145deg,#fff,#f6faf8)}
.stat-card.profile-progress-card.completion-red{border-color:rgba(220,53,69,.28);background:linear-gradient(145deg,#fff,#fff5f5)}
.stat-card.profile-progress-card.completion-yellow{border-color:rgba(212,154,0,.30);background:linear-gradient(145deg,#fff,#fffaf0)}
.stat-card.profile-progress-card.completion-green{border-color:rgba(31,157,85,.30);background:linear-gradient(145deg,#fff,#f3fbf6)}
.stat-card.profile-progress-card.completion-services{border-color:rgba(0,255,208,.42);background:linear-gradient(145deg,#fff,#effdfa)}
.stat-card.profile-progress-card.completion-red::before{background:linear-gradient(135deg,rgba(220,53,69,.42),transparent 45%,rgba(220,53,69,.08))}
.stat-card.profile-progress-card.completion-yellow::before{background:linear-gradient(135deg,rgba(212,154,0,.42),transparent 45%,rgba(212,154,0,.08))}
.stat-card.profile-progress-card.completion-green::before{background:linear-gradient(135deg,rgba(31,157,85,.42),transparent 45%,rgba(31,157,85,.08))}
.stat-card.profile-progress-card.completion-services::before{background:linear-gradient(135deg,rgba(0,255,208,.65),transparent 45%,rgba(0,255,208,.12))}
.profile-progress-card.completion-red strong,.profile-progress-card.completion-yellow strong,.profile-progress-card.completion-green strong,.profile-progress-card.completion-services strong{color:var(--ink)}
html[data-theme="dark"] .stat-card.stat-card-effect{background:linear-gradient(145deg,#0d1d19,#102923);border-color:#28433c}
html[data-theme="dark"] .stat-card.stat-card-effect::after{background:linear-gradient(90deg,transparent,rgba(0,255,208,.12),transparent)}
html[data-theme="dark"] .stat-card.profile-progress-card.completion-red{background:linear-gradient(145deg,#1d1718,#261b1c)}
html[data-theme="dark"] .stat-card.profile-progress-card.completion-yellow{background:linear-gradient(145deg,#1d1b15,#272318)}
html[data-theme="dark"] .stat-card.profile-progress-card.completion-green{background:linear-gradient(145deg,#101f19,#13281f)}
html[data-theme="dark"] .stat-card.profile-progress-card.completion-services{background:linear-gradient(145deg,#0d2420,#10332d)}
@media(prefers-reduced-motion:reduce){.stat-card.stat-card-effect,.stat-card.stat-card-effect::after{transition:none}.stat-card.stat-card-effect:hover{transform:none}}

/* Wallet */
.wallet-overview{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,1fr);gap:16px;margin:18px 0}.wallet-balance-card,.wallet-metrics article,.wallet-history,.wallet-note{border:1px solid var(--border,#dfe7e4);background:var(--surface,#fff);border-radius:20px}.wallet-balance-card{padding:24px;display:flex;flex-direction:column;align-items:flex-start}.wallet-balance-card>span,.wallet-metrics span{font-size:.78rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;opacity:.62}.wallet-balance-card>strong{font-size:clamp(2rem,5vw,3.2rem);line-height:1;margin:10px 0 2px}.wallet-balance-card>small{opacity:.55}.wallet-actions{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}.wallet-metrics{display:grid;grid-template-columns:1fr;gap:12px}.wallet-metrics article{padding:18px;display:flex;flex-direction:column;gap:7px}.wallet-metrics strong{font-size:1.35rem}.wallet-history{padding:20px;margin-top:16px}.wallet-history .panel-header{margin-bottom:12px}.wallet-history .panel-header.compact{align-items:center}.wallet-history select{min-width:130px}.wallet-transactions{display:flex;flex-direction:column}.wallet-transaction{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:12px;padding:14px 4px;border-top:1px solid var(--border,#dfe7e4)}.wallet-transaction-icon{width:40px;height:40px;border-radius:12px;display:grid;place-items:center}.wallet-transaction-icon.credit{background:rgba(0,255,208,.12);color:#00a98d}.wallet-transaction-icon.debit{background:rgba(220,70,70,.1);color:#c63f3f}.wallet-transaction-copy{display:flex;min-width:0;flex-direction:column;gap:3px}.wallet-transaction-copy strong{font-size:.92rem}.wallet-transaction-copy span{font-size:.84rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:.76}.wallet-transaction-copy small{font-size:.72rem;opacity:.55}.wallet-transaction-amount{white-space:nowrap;font-size:.9rem}.wallet-transaction-amount.credit{color:#00a98d}.wallet-transaction-amount.debit{color:#c63f3f}.wallet-note{display:flex;align-items:flex-start;gap:10px;padding:14px 16px;margin-top:16px;font-size:.82rem;opacity:.82}.wallet-state{padding:12px 14px;border-radius:12px;background:rgba(220,70,70,.08);margin:12px 0}.wallet-modal{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:20px}.wallet-modal.hidden{display:none}.wallet-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.5);backdrop-filter:blur(6px)}.wallet-modal-card{position:relative;width:min(520px,100%);max-height:90vh;overflow:auto;background:var(--surface,#fff);border:1px solid var(--border,#dfe7e4);border-radius:24px;padding:24px;box-shadow:0 24px 80px rgba(0,0,0,.22)}.wallet-modal-card .panel-header{margin-bottom:18px}@media(max-width:800px){.wallet-overview{grid-template-columns:1fr}.wallet-metrics{grid-template-columns:repeat(3,1fr)}.wallet-metrics article{padding:14px}.wallet-metrics strong{font-size:1.05rem}}@media(max-width:560px){.wallet-metrics{grid-template-columns:1fr}.wallet-transaction{grid-template-columns:38px minmax(0,1fr)}.wallet-transaction-amount{grid-column:2;justify-self:start}.wallet-history{padding:16px}.wallet-modal-card{padding:18px}}


/* PRONET — 2026 visual direction: modern fintech / professional workspace */
:root{
  --surface:var(--white);
  --border:var(--line);
  --surface-soft:#f3f7f5;
  --surface-tint:#eaf8f4;
  --mint-deep:#00b89a;
  --ink-soft:#53655f;
  --radius-lg:22px;
  --radius-md:16px;
}
body{
  background:
    radial-gradient(circle at 82% 0%,rgba(0,255,208,.055),transparent 24%),
    linear-gradient(180deg,#f7faf9 0%,#fbfdfc 48%,#f5f8f7 100%);
}
.topbar{
  background:rgba(255,255,255,.9);
  border-bottom:1px solid rgba(5,45,40,.075);
  box-shadow:0 5px 24px rgba(5,45,40,.035);
}
.nav-inner{height:74px}
.brand{gap:7px}
.brand-logo{filter:none}
.brand-copy strong{font-size:14px;letter-spacing:.1em}
.brand-copy small{font-size:9px;letter-spacing:.01em}
.desktop-nav-tabs .nav-tab{border-radius:12px}
.desktop-nav-tabs .nav-tab-current{
  background:#eaf8f4!important;
  color:#056b5b!important;
}
.nav-icon-btn,.profile-account-btn{
  box-shadow:0 4px 16px rgba(5,45,40,.055);
}
.dark-btn{
  background:#052d28;
  border-radius:13px;
}
.outline-btn{
  border-radius:13px;
  background:#fff;
}
.dashboard-main,.profile-main,.messages-main,.premium-main{position:relative}
.dashboard-main:before,.profile-main:before,.messages-main:before,.premium-main:before{
  content:"";
  position:fixed;
  width:320px;height:320px;
  right:-180px;top:110px;
  border-radius:50%;
  background:rgba(0,255,208,.055);
  filter:blur(12px);
  pointer-events:none;
  z-index:-1;
}
.welcome-card{
  border-radius:24px;
  background:linear-gradient(135deg,#eaf8f4 0%,#ffffff 62%);
  box-shadow:0 12px 35px rgba(5,45,40,.045);
}
.side-nav{
  background:#052d28;
  border-color:#0a463d;
  box-shadow:0 18px 40px rgba(5,45,40,.11);
  padding:9px;
}
.side-link{
  color:#a9c3bc;
}
.side-link.active,.side-link:hover{
  background:#0d4a40;
  color:#fff;
  box-shadow:none;
}
.side-link svg{color:#79a59b}
.side-link.active svg,.side-link:hover svg{color:#00ffd0}
.dash-panel{
  border-radius:24px;
  box-shadow:0 12px 35px rgba(5,45,40,.045);
}
.stats-cards{gap:14px}
.stat-card{
  border-radius:18px;
  box-shadow:0 8px 25px rgba(5,45,40,.035);
}
.stat-card-effect{
  position:relative;
  overflow:hidden;
}
.stat-card-effect:after{
  content:"";
  position:absolute;
  width:110px;height:110px;
  right:-48px;top:-48px;
  border-radius:50%;
  background:rgba(0,255,208,.08);
}
.panel-header h2,.panel-header h3{letter-spacing:-.045em}
.editor-form input,.editor-form select,.editor-form textarea,
.inline-form input,.project-form input,.project-form textarea{
  border-radius:13px;
  background:#f9fbfa;
}
.pro-card,.public-profile,.messages-shell,.premium-plan{
  box-shadow:0 14px 42px rgba(5,45,40,.065);
}
.pro-card{border-radius:20px}
.card-media{background:linear-gradient(145deg,#e6f8f3,#f8fbfa)}
.verified-badge{background:#f0fbf8}
.profile-main{padding-top:38px}
.public-profile{border-radius:26px}
.profile-cover{height:230px}
.profile-key-stats div{
  background:#f1f8f5;
  border:1px solid #e1ece8;
  border-radius:13px;
}
.service-card,.portfolio-item,.review-item{
  box-shadow:0 5px 18px rgba(5,45,40,.025);
}
.messaging-page{
  background:
    radial-gradient(circle at 85% 5%,rgba(0,255,208,.06),transparent 25%),
    #f5f8f7;
}
.messages-shell{
  border-radius:24px;
  box-shadow:0 16px 45px rgba(5,45,40,.075);
}
.messages-sidebar{
  background:#fbfdfc;
}
.conversation-item.active{background:#eaf8f4}
.conversation-unread{background:#25d366}
.chat-panel{background:#f6faf8}
.chat-head,.chat-composer{background:#fff}
.chat-empty-icon{
  background:#e6f8f3;
  color:#008b73;
}
.composer-form{
  background:#f4f8f6;
  border-radius:18px;
}
.composer-send{border-radius:13px}
.premium-main{
  background:
    radial-gradient(circle at 50% 0%,rgba(0,255,208,.09),transparent 30%);
}
.premium-plan{
  border-radius:28px;
  background:linear-gradient(145deg,#ffffff 0%,#f7fbf9 100%);
}
.premium-plan-badge{
  background:#e5f9f4;
  color:#087864;
}
.premium-pay-button{
  background:#00c9aa;
  color:#052d28;
  box-shadow:0 10px 28px rgba(0,201,170,.2);
}
.premium-pay-button:hover{
  background:#00b99e;
  box-shadow:0 14px 32px rgba(0,201,170,.25);
}

/* Wallet — focal fintech treatment */
body.dashboard-page #panel-wallet .panel-header{
  margin-bottom:18px;
}
body.dashboard-page #panel-wallet .panel-header h2{
  font-size:32px;
}
body.dashboard-page .wallet-overview{
  grid-template-columns:minmax(0,1.45fr) minmax(260px,.75fr);
  gap:16px;
}
body.dashboard-page .wallet-balance-card{
  position:relative;
  overflow:hidden;
  min-height:220px;
  padding:25px 26px;
  border:0;
  border-radius:22px;
  color:#fff;
  background:
    radial-gradient(circle at 88% 25%,rgba(0,255,208,.25),transparent 24%),
    linear-gradient(135deg,#052d28 0%,#06463d 58%,#07584c 100%);
  box-shadow:0 18px 42px rgba(5,45,40,.18);
}
body.dashboard-page .wallet-balance-card:before{
  content:"";
  position:absolute;
  width:210px;height:210px;
  right:-82px;bottom:-105px;
  border:1px solid rgba(0,255,208,.18);
  border-radius:50%;
  box-shadow:0 0 0 28px rgba(0,255,208,.025),0 0 0 56px rgba(0,255,208,.02);
}
body.dashboard-page .wallet-balance-card>span{
  position:relative;
  z-index:1;
  color:#b8d4ce;
  text-transform:none;
  letter-spacing:0;
  font-size:13px;
}
body.dashboard-page .wallet-balance-card>strong{
  position:relative;
  z-index:1;
  font-size:clamp(2.5rem,5vw,4.15rem);
  letter-spacing:-.065em;
  margin:13px 0 0;
}
body.dashboard-page .wallet-balance-card>small{
  position:relative;
  z-index:1;
  color:#8fd0c2;
  font-size:14px;
  font-weight:700;
}
body.dashboard-page .wallet-actions{
  position:relative;
  z-index:2;
  margin-top:24px;
}
body.dashboard-page .wallet-actions .dark-btn{
  background:#00ffd0;
  color:#052d28;
  box-shadow:none;
}
body.dashboard-page .wallet-actions .outline-btn{
  background:rgba(255,255,255,.08);
  color:#fff;
  border-color:rgba(255,255,255,.18);
}
body.dashboard-page .wallet-actions .outline-btn:hover{
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.3);
}
body.dashboard-page .wallet-metrics{
  gap:12px;
}
body.dashboard-page .wallet-metrics article{
  min-height:0;
  padding:18px 20px;
  border-radius:18px;
  background:#fff;
  box-shadow:0 8px 25px rgba(5,45,40,.045);
}
body.dashboard-page .wallet-metrics article:first-child{
  background:#eaf8f4;
  border-color:#d5eee8;
}
body.dashboard-page .wallet-metrics span{
  text-transform:none;
  letter-spacing:0;
  color:#6c7d76;
}
body.dashboard-page .wallet-metrics strong{
  letter-spacing:-.035em;
}
body.dashboard-page .wallet-history{
  border-radius:22px;
  padding:20px 22px;
  background:#fff;
  box-shadow:0 10px 30px rgba(5,45,40,.04);
}
body.dashboard-page .wallet-transaction{
  padding:15px 4px;
}
body.dashboard-page .wallet-transaction-icon{
  width:42px;height:42px;border-radius:13px;
}
body.dashboard-page .wallet-note{
  border-radius:16px;
  background:#eaf8f4;
  border-color:#d7eee8;
}
body.dashboard-page .wallet-modal-card{
  border-radius:26px;
  box-shadow:0 28px 80px rgba(5,45,40,.2);
}
@media(max-width:800px){
  body.dashboard-page .wallet-overview{grid-template-columns:1fr}
}
@media(max-width:640px){
  .shell{width:min(100% - 28px,1180px)}
  .nav-inner{height:68px}
  .dash-panel{padding:20px}
  body.dashboard-page .wallet-balance-card{min-height:205px;padding:22px}
  body.dashboard-page .wallet-balance-card>strong{font-size:2.65rem}
}

/* Fintech visual language in dark mode */
html[data-theme="dark"] body{
  background:
    radial-gradient(circle at 82% 0%,rgba(0,255,208,.045),transparent 24%),
    linear-gradient(180deg,#081310 0%,#091613 100%);
}
html[data-theme="dark"] .topbar{
  background:rgba(8,19,16,.92);
  box-shadow:0 5px 24px rgba(0,0,0,.18);
}
html[data-theme="dark"] .desktop-nav-tabs .nav-tab-current{
  background:#14352e!important;
  color:#dffaf4!important;
}
html[data-theme="dark"] .welcome-card{
  background:linear-gradient(135deg,#0e2a24 0%,#10201d 65%);
}
html[data-theme="dark"] .side-nav{
  background:#061f1b;
  border-color:#173a33;
}
html[data-theme="dark"] .side-link.active,
html[data-theme="dark"] .side-link:hover{background:#123b32;color:#fff}
html[data-theme="dark"] .stat-card-effect:after{background:rgba(0,255,208,.06)}
html[data-theme="dark"] .messages-sidebar,
html[data-theme="dark"] .chat-head,
html[data-theme="dark"] .chat-composer{background:#10201d}
html[data-theme="dark"] .conversation-item{background:#10201d}
html[data-theme="dark"] .conversation-item.active{background:#14352e}
html[data-theme="dark"] body.messaging-page{background:#081310}
html[data-theme="dark"] .premium-main{
  background:radial-gradient(circle at 50% 0%,rgba(0,255,208,.06),transparent 30%);
}
html[data-theme="dark"] .premium-plan{
  background:linear-gradient(145deg,#10201d,#0c1916);
}
html[data-theme="dark"] body.dashboard-page .wallet-metrics article,
html[data-theme="dark"] body.dashboard-page .wallet-history{
  background:#10201d;
}
html[data-theme="dark"] body.dashboard-page .wallet-metrics article:first-child,
html[data-theme="dark"] body.dashboard-page .wallet-note{
  background:#12352e;
  border-color:#214b42;
}


/* =========================================================
   PRONET VISUAL SYSTEM — Fintech / Professional Workspace
   Reference direction: ~40% PRONET green, ~60% white/light surfaces
   Applied globally: Explorer, profiles, services, dashboard,
   messages and Premium.
   ========================================================= */
:root{
  --pronet-green:#052d28;
  --pronet-green-2:#07594c;
  --pronet-mint:#00d8b2;
  --pronet-mint-bright:#00ffd0;
  --pronet-white:#ffffff;
  --pronet-bg:#f5f9f7;
  --pronet-surface:#ffffff;
  --pronet-tint:#e8f7f3;
  --pronet-border:#dfe9e5;
  --pronet-muted:#6f817a;
  --pronet-red:#e54848;
  --pronet-shadow:0 14px 38px rgba(5,45,40,.055);
}
html{background:var(--pronet-bg)}
body{
  background:
    radial-gradient(circle at 86% 0%,rgba(0,216,178,.045),transparent 22%),
    linear-gradient(180deg,#f8fbfa 0%,#f4f8f6 100%);
}
.topbar{
  background:rgba(255,255,255,.94);
  border-bottom:1px solid rgba(5,45,40,.08);
  box-shadow:0 4px 22px rgba(5,45,40,.035);
}
.nav-inner{height:76px}
.brand-logo{width:150px;height:150px}
.brand-copy strong{font-size:15px;letter-spacing:.06em}
.brand-copy small{font-size:9px}
.nav-actions{gap:8px}
.nav-tab{
  border-radius:11px;
  transition:.18s ease;
}
.nav-tab:hover{background:#f0f7f4}
.nav-tab.active,.desktop-nav-tabs .nav-tab-current{
  background:var(--pronet-tint)!important;
  color:#056b5b!important;
}
.nav-icon-btn,.profile-account-btn{
  border-color:var(--pronet-border);
  box-shadow:0 5px 16px rgba(5,45,40,.045);
}
.dark-btn{
  background:var(--pronet-green);
  border-radius:12px;
}
.outline-btn{
  background:#fff;
  border-color:var(--pronet-border);
  border-radius:12px;
}
.ghost-btn:hover,.nav-mini-btn:hover{background:#edf6f3}

/* Explorer */
body.site-home .hero{
  padding-top:58px;
  background:linear-gradient(180deg,#eaf8f4 0%,#f7fbf9 46%,#f5f9f7 100%);
}
body.site-home .hero:before{
  background:radial-gradient(circle at 50% 5%,rgba(0,216,178,.12),transparent 36%);
}
body.site-home .search-bar{
  border-radius:17px;
  box-shadow:0 18px 45px rgba(5,45,40,.09);
}
body.site-home .search-submit{
  background:var(--pronet-green);
  border-radius:13px;
}
body.site-home .results-section{background:transparent}
.pro-card{
  border-radius:18px;
  border-color:var(--pronet-border);
  box-shadow:var(--pronet-shadow);
}
.pro-card:hover{box-shadow:0 20px 45px rgba(5,45,40,.09)}
.card-media{background:linear-gradient(145deg,#e5f7f2,#f8fbfa)}
.card-tags span,.tag-list span{
  background:#edf6f3;
  color:#506b63;
}
.arrow-circle{background:var(--pronet-green)}
.how-section{background:#edf5f2}

/* Shared premium card language */
.welcome-card,.dash-panel,.public-profile,.service-detail,
.messages-shell,.premium-plan,.guard-card{
  border-color:var(--pronet-border);
  box-shadow:var(--pronet-shadow);
}

/* Dashboard = strongest reference implementation */
body.dashboard-page{
  background:
    linear-gradient(90deg,#052d28 0,#052d28 238px,#f5f9f7 238px,#f5f9f7 100%);
}
body.dashboard-page .topbar{
  background:rgba(255,255,255,.96);
}
body.dashboard-page .dashboard-main{
  padding:34px 0 90px;
}
body.dashboard-page .dash-heading h1{font-size:38px}
body.dashboard-page .dash-grid{
  grid-template-columns:220px minmax(0,1fr);
  gap:18px;
}
body.dashboard-page .side-nav{
  background:linear-gradient(180deg,#052d28 0%,#063b34 100%);
  border:0;
  border-radius:0 20px 20px 0;
  box-shadow:12px 0 35px rgba(5,45,40,.12);
  padding:10px;
  margin-left:-20px;
  position:sticky;
  top:96px;
}
body.dashboard-page .side-link{
  color:#a9c4bd;
  border-radius:11px;
  padding:12px 13px;
}
body.dashboard-page .side-link svg{color:#78a79d}
body.dashboard-page .side-link.active,
body.dashboard-page .side-link:hover{
  color:#fff;
  background:rgba(0,216,178,.17);
  box-shadow:none;
}
body.dashboard-page .side-link.active svg,
body.dashboard-page .side-link:hover svg{color:var(--pronet-mint-bright)}
body.dashboard-page .welcome-card{
  background:linear-gradient(135deg,#e8f7f3 0%,#fff 70%);
  border-radius:20px;
}
body.dashboard-page .stat-card{
  border-radius:16px;
  box-shadow:0 7px 24px rgba(5,45,40,.035);
}
body.dashboard-page .dash-panel{
  border-radius:20px;
  padding:24px;
}

/* Wallet */
body.dashboard-page #panel-wallet .panel-header h2{font-size:30px}
body.dashboard-page .wallet-overview{
  grid-template-columns:minmax(0,1.5fr) minmax(255px,.7fr);
  gap:16px;
}
body.dashboard-page .wallet-balance-card{
  min-height:228px;
  border:0;
  border-radius:20px;
  padding:25px 26px;
  color:#fff;
  background:
    radial-gradient(circle at 88% 25%,rgba(0,255,208,.22),transparent 24%),
    linear-gradient(135deg,#052d28 0%,#064b40 64%,#075b4e 100%);
  box-shadow:0 18px 42px rgba(5,45,40,.18);
}
body.dashboard-page .wallet-balance-card>span{color:#b9d5ce}
body.dashboard-page .wallet-balance-card>strong{
  font-size:clamp(2.7rem,5vw,4.1rem);
  letter-spacing:-.065em;
}
body.dashboard-page .wallet-balance-card>small{color:#8fd0c2}
body.dashboard-page .wallet-actions .dark-btn{
  background:var(--pronet-mint);
  color:var(--pronet-green);
}
body.dashboard-page .wallet-actions .outline-btn{
  background:#fff;
  color:var(--pronet-green);
}
body.dashboard-page .wallet-metrics article,
body.dashboard-page .wallet-history{
  background:#fff;
  border-color:var(--pronet-border);
  box-shadow:0 8px 26px rgba(5,45,40,.035);
  border-radius:18px;
}
body.dashboard-page .wallet-metrics article:first-child{
  background:#e8f7f3;
  border-color:#d4ece5;
}
body.dashboard-page .wallet-note{
  background:#e8f7f3;
  border-color:#d4ece5;
  border-radius:15px;
}
body.dashboard-page .wallet-modal-card{border-radius:22px}

/* Profile */
body.profile-page .profile-main{
  padding-top:34px;
  background:
    radial-gradient(circle at 90% 4%,rgba(0,216,178,.055),transparent 22%);
}
body.profile-page .public-profile{
  border-radius:24px;
  overflow:hidden;
  background:#fff;
}
body.profile-page .profile-cover{
  height:220px;
  background:linear-gradient(135deg,#063a32,#0a6455);
}
body.profile-page .profile-head{background:#fff}
body.profile-page .profile-key-stats div{
  background:#eaf7f3;
  border-color:#d9ebe6;
}
body.profile-page .service-card,
body.profile-page .portfolio-item,
body.profile-page .review-item{
  border-color:var(--pronet-border);
  border-radius:15px;
  background:#fff;
  box-shadow:0 6px 20px rgba(5,45,40,.025);
}
body.profile-page .contact-card{
  background:#eaf7f3;
  border-color:#d7ebe5;
}

/* Service detail */
body.service-page{
  background:
    radial-gradient(circle at 85% 5%,rgba(0,216,178,.06),transparent 24%),
    linear-gradient(180deg,#f8fbfa,#f3f8f6);
}
body.service-page .service-main{padding:34px 0 90px}
body.service-page .service-detail{
  background:#fff;
  border-radius:24px;
  padding:28px;
}
body.service-page .service-provider-card{
  background:#eaf7f3;
  border:1px solid #d7ebe5;
  border-radius:18px;
}
body.service-page .service-detail-price{
  background:#052d28;
  color:#fff;
  border-radius:16px;
}

/* Messages */
body.messaging-page{
  background:
    radial-gradient(circle at 88% 0%,rgba(0,216,178,.055),transparent 22%),
    #f4f8f6;
}
body.messaging-page .messages-main{padding:28px 0 50px}
body.messaging-page .messages-shell{
  border-radius:22px;
  box-shadow:0 18px 48px rgba(5,45,40,.08);
}
body.messaging-page .messages-sidebar{background:#fff}
body.messaging-page .conversation-item.active{
  background:#e8f7f3;
  box-shadow:inset 3px 0 0 #00b89a;
}
body.messaging-page .conversation-unread{background:#25d366}
body.messaging-page .chat-panel{background:#f6faf8}
body.messaging-page .chat-head,
body.messaging-page .chat-composer{background:#fff}
body.messaging-page .message-row.mine .message-bubble{
  background:#052d28;
}

/* Premium */
body.premium-page .premium-main,
body.premium-main{
  background:
    radial-gradient(circle at 50% 0%,rgba(0,216,178,.08),transparent 30%),
    #f5f9f7;
}
.premium-plan{
  border-radius:24px;
  background:#fff;
  box-shadow:0 18px 48px rgba(5,45,40,.075);
}
.premium-plan-badge{
  background:#e7f7f3;
  color:#087864;
}
.premium-pay-button{
  background:var(--pronet-mint);
  color:var(--pronet-green);
  border-radius:12px;
  box-shadow:0 10px 26px rgba(0,216,178,.18);
}

/* Inputs, dialogs and states */
.auth-card,.profile-account-menu,.wallet-modal-card{
  border-color:var(--pronet-border);
  box-shadow:0 24px 70px rgba(5,45,40,.16);
}
.auth-card input,.auth-card select,
.editor-form input,.editor-form select,.editor-form textarea,
.inline-form input,.project-form input,.project-form textarea{
  background:#f8fbfa;
  border-color:#dce8e4;
  border-radius:12px;
}
.auth-card input:focus,.auth-card select:focus,
.editor-form input:focus,.editor-form select:focus,.editor-form textarea:focus{
  border-color:#76cbb9;
  box-shadow:0 0 0 4px rgba(0,216,178,.10);
}

/* Mobile keeps the same 40/60 visual ratio without horizontal overflow */
@media(max-width:980px){
  body.dashboard-page{background:#f5f9f7}
  body.dashboard-page .side-nav{
    margin-left:0;
    border-radius:16px;
    position:static;
  }
  body.dashboard-page .dash-grid{grid-template-columns:1fr}
}
@media(max-width:640px){
  .topbar{box-shadow:0 3px 18px rgba(5,45,40,.04)}
  body.site-home .hero{padding-top:42px}
  body.dashboard-page .dashboard-main{padding-top:24px}
  body.dashboard-page .wallet-balance-card{min-height:205px;padding:22px}
  body.dashboard-page .wallet-balance-card>strong{font-size:2.65rem}
  body.profile-page .profile-cover{height:190px}
  body.service-page .service-detail{padding:20px;border-radius:20px}
}

/* Dark mode: preserve the same visual hierarchy */
html[data-theme="dark"] body{
  background:
    radial-gradient(circle at 86% 0%,rgba(0,216,178,.035),transparent 22%),
    #081512;
}
html[data-theme="dark"] .topbar{
  background:rgba(8,21,18,.94);
  border-bottom-color:#19352e;
}
html[data-theme="dark"] .nav-tab.active,
html[data-theme="dark"] .desktop-nav-tabs .nav-tab-current{
  background:#123a32!important;
  color:#dffbf5!important;
}
html[data-theme="dark"] body.dashboard-page{
  background:linear-gradient(90deg,#041e1a 0,#041e1a 238px,#081512 238px,#081512 100%);
}
html[data-theme="dark"] body.dashboard-page .topbar{background:rgba(8,21,18,.94)}
html[data-theme="dark"] body.dashboard-page .welcome-card,
html[data-theme="dark"] body.profile-page .public-profile,
html[data-theme="dark"] body.service-page .service-detail,
html[data-theme="dark"] .premium-plan{
  background:#0e211c;
  border-color:#23433b;
}
html[data-theme="dark"] body.dashboard-page .stat-card,
html[data-theme="dark"] body.dashboard-page .wallet-metrics article,
html[data-theme="dark"] body.dashboard-page .wallet-history,
html[data-theme="dark"] body.messaging-page .messages-shell,
html[data-theme="dark"] body.messaging-page .messages-sidebar{
  background:#0e211c;
  border-color:#23433b;
}
html[data-theme="dark"] body.profile-page .profile-head{background:#0e211c}
html[data-theme="dark"] body.profile-page .profile-key-stats div,
html[data-theme="dark"] body.profile-page .contact-card,
html[data-theme="dark"] body.service-page .service-provider-card{
  background:#12362e;
  border-color:#285048;
}
html[data-theme="dark"] body.messaging-page{
  background:#081512;
}
html[data-theme="dark"] body.messaging-page .chat-panel{background:#0a1915}
html[data-theme="dark"] body.messaging-page .chat-head,
html[data-theme="dark"] body.messaging-page .chat-composer{background:#0e211c}
html[data-theme="dark"] .auth-card,
html[data-theme="dark"] .profile-account-menu,
html[data-theme="dark"] .wallet-modal-card{
  background:#0e211c;
  border-color:#294840;
}
html[data-theme="dark"] .auth-card input,
html[data-theme="dark"] .auth-card select,
html[data-theme="dark"] .editor-form input,
html[data-theme="dark"] .editor-form select,
html[data-theme="dark"] .editor-form textarea{
  background:#0a1915;
  border-color:#29433d;
  color:#ecfffa;
}


/* =========================================================
   PRONET — Pinterest-inspired 2026 refinement
   Direction: editorial fintech / jade green / white workspace
   Inspiration references: modern fintech wallet dashboards,
   generous whitespace, compact controls, layered cards.
   ========================================================= */
:root{
  --pronet-jade:#aeb8a0;
  --pronet-jade-soft:#f1f4ed;
  --pronet-lime:#e9f056;
  --pronet-card-radius:18px;
  --pronet-card-radius-lg:24px;
  --pronet-soft-shadow:0 8px 28px rgba(5,45,40,.045);
}
body{
  color:#12312b;
  letter-spacing:-.005em;
}
.topbar{
  backdrop-filter:blur(20px) saturate(135%);
}
.nav-inner{
  height:72px;
}
.desktop-nav-tabs .nav-tab{
  min-height:38px;
  padding-inline:12px;
  font-size:12px;
  font-weight:650;
}
.nav-icon-btn,.profile-account-btn{
  width:40px;
  height:40px;
  border-radius:12px;
  background:#fff;
}
.dark-btn,.outline-btn,.ghost-btn{
  min-height:42px;
  border-radius:12px;
  font-size:12px;
}
.dark-btn{
  box-shadow:0 7px 18px rgba(5,45,40,.11);
}
.outline-btn{
  box-shadow:0 2px 8px rgba(5,45,40,.025);
}

/* Explorer: cleaner cards, stronger editorial hierarchy */
body.site-home .hero{
  padding-bottom:34px;
}
body.site-home .hero h1{
  max-width:920px;
  margin-inline:auto;
  font-size:clamp(44px,6vw,76px);
}
body.site-home .hero-copy{
  font-size:16px;
  max-width:620px;
}
body.site-home .search-wrap{
  margin-top:32px;
}
body.site-home .search-bar{
  padding:7px;
  border-radius:18px;
  box-shadow:0 16px 42px rgba(5,45,40,.085);
}
body.site-home .search-input-wrap,
body.site-home .location-wrap,
body.site-home .filter-btn,
body.site-home .search-submit{
  height:50px;
}
body.site-home .cards-grid{
  gap:14px;
}
body.site-home .pro-card{
  border-radius:18px;
  box-shadow:var(--pronet-soft-shadow);
}
body.site-home .pro-card:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 34px rgba(5,45,40,.075);
}
body.site-home .card-media{
  height:118px;
}
body.site-home .card-body{
  padding:18px 18px 15px;
}
body.site-home .card-footer{
  padding:12px 18px;
}
body.site-home .card-tags span{
  background:var(--pronet-jade-soft);
  color:#53655d;
}

/* Dashboard: dark navigation + calm white workspace */
body.dashboard-page{
  background:
    linear-gradient(90deg,#052d28 0,#052d28 228px,#f5f9f7 228px,#f5f9f7 100%);
}
body.dashboard-page .dash-grid{
  grid-template-columns:210px minmax(0,1fr);
  gap:20px;
}
body.dashboard-page .side-nav{
  width:210px;
  margin-left:-20px;
  padding:12px 10px;
  border-radius:0 22px 22px 0;
  background:linear-gradient(180deg,#052d28 0%,#063a33 100%);
}
body.dashboard-page .side-link{
  min-height:43px;
  padding:11px 12px;
  border-radius:10px;
  font-size:11px;
}
body.dashboard-page .side-link.active{
  background:rgba(0,216,178,.18);
}
body.dashboard-page .welcome-card{
  min-height:136px;
  padding:24px;
  border-radius:20px;
}
body.dashboard-page .stats-cards{
  gap:12px;
}
body.dashboard-page .stat-card{
  min-height:128px;
  border-radius:16px;
  padding:17px;
  box-shadow:var(--pronet-soft-shadow);
}
body.dashboard-page .stat-card strong{
  font-size:28px;
}
body.dashboard-page .dash-panel{
  border-radius:20px;
  padding:23px;
  box-shadow:var(--pronet-soft-shadow);
}

/* Wallet: more premium, less heavy */
body.dashboard-page .wallet-overview{
  grid-template-columns:minmax(0,1.55fr) minmax(235px,.72fr);
}
body.dashboard-page .wallet-balance-card{
  min-height:235px;
  border-radius:22px;
  padding:26px;
  background:
    radial-gradient(circle at 88% 22%,rgba(0,255,208,.23),transparent 22%),
    radial-gradient(circle at 18% 120%,rgba(174,184,160,.16),transparent 34%),
    linear-gradient(135deg,#052d28 0%,#06473e 62%,#07594c 100%);
  box-shadow:0 18px 38px rgba(5,45,40,.15);
}
body.dashboard-page .wallet-balance-card>strong{
  font-size:clamp(2.65rem,5vw,4rem);
}
body.dashboard-page .wallet-actions .dark-btn{
  background:#e9f056;
  color:#052d28;
}
body.dashboard-page .wallet-actions .dark-btn:hover{
  background:#e3ea4b;
}
body.dashboard-page .wallet-metrics{
  gap:10px;
}
body.dashboard-page .wallet-metrics article{
  border-radius:16px;
  padding:16px 18px;
  box-shadow:var(--pronet-soft-shadow);
}
body.dashboard-page .wallet-history{
  border-radius:20px;
  box-shadow:var(--pronet-soft-shadow);
}
body.dashboard-page .wallet-transaction-icon{
  border-radius:12px;
}
body.dashboard-page .wallet-note{
  background:linear-gradient(135deg,#eaf4e9,#e8f7f3);
}

/* Profile: modern portfolio/editorial treatment */
body.profile-page .public-profile{
  border-radius:24px;
  box-shadow:0 12px 36px rgba(5,45,40,.055);
}
body.profile-page .profile-cover{
  height:228px;
  background:linear-gradient(135deg,#052d28 0%,#07594c 58%,#0a7966 100%);
}
body.profile-page .profile-head{
  padding-inline:28px;
}
body.profile-page .profile-avatar-large{
  border-width:5px;
  border-radius:26px;
}
body.profile-page .verified-line h1{
  font-size:clamp(30px,4vw,38px);
}
body.profile-page .profile-key-stats div{
  border-radius:12px;
  background:#eef5f1;
}
body.profile-page .service-card,
body.profile-page .portfolio-item,
body.profile-page .review-item{
  border-radius:15px;
  box-shadow:none;
}

/* Services */
body.service-page .service-detail{
  box-shadow:0 12px 36px rgba(5,45,40,.055);
}
body.service-page .service-provider-card{
  background:linear-gradient(145deg,#eaf7f3,#f1f4ed);
}
body.service-page .service-detail-price{
  box-shadow:0 12px 26px rgba(5,45,40,.12);
}

/* Messages */
body.messaging-page .messages-shell{
  border-radius:22px;
  box-shadow:0 12px 38px rgba(5,45,40,.065);
}
body.messaging-page .conversation-item{
  border-radius:12px;
}
body.messaging-page .conversation-item.active{
  box-shadow:inset 3px 0 0 #00b89a;
}
body.messaging-page .message-row.mine .message-bubble{
  box-shadow:0 5px 14px rgba(5,45,40,.12);
}

/* Premium */
body.premium-page .premium-plan{
  border-radius:24px;
  box-shadow:0 14px 40px rgba(5,45,40,.065);
}
body.premium-page .premium-pay-button{
  background:#e9f056;
  color:#052d28;
  box-shadow:0 9px 22px rgba(174,184,160,.22);
}

/* Shared controls */
.auth-card,
.wallet-modal-card,
.review-modal-card,
.profile-account-menu{
  border-radius:22px;
}
.auth-card input,.auth-card select,
.editor-form input,.editor-form select,.editor-form textarea,
.inline-form input,.project-form input,.project-form textarea,
.wallet-modal-card input,.wallet-modal-card select,.wallet-modal-card textarea{
  min-height:42px;
  border-radius:11px;
}
input:focus,select:focus,textarea:focus{
  outline:none;
}

/* Dark mode */
html[data-theme="dark"] body.dashboard-page{
  background:linear-gradient(90deg,#041e1a 0,#041e1a 228px,#081512 228px,#081512 100%);
}
html[data-theme="dark"] .nav-icon-btn,
html[data-theme="dark"] .profile-account-btn,
html[data-theme="dark"] .outline-btn{
  background:#0e211c;
  border-color:#29463e;
}
html[data-theme="dark"] body.site-home .pro-card,
html[data-theme="dark"] body.site-home .search-bar{
  background:#0e211c;
  border-color:#23433b;
}
html[data-theme="dark"] body.dashboard-page .wallet-note{
  background:#12352e;
}
html[data-theme="dark"] body.premium-page .premium-pay-button{
  background:#e9f056;
  color:#052d28;
}

/* Responsive: retain hierarchy without shrinking the UI excessively */
@media(max-width:980px){
  body.dashboard-page{
    background:#f5f9f7;
  }
  body.dashboard-page .dash-grid{
    grid-template-columns:1fr;
  }
  body.dashboard-page .side-nav{
    width:100%;
    margin-left:0;
    border-radius:16px;
  }
}
@media(max-width:640px){
  .nav-inner{height:66px}
  .shell{width:min(100% - 24px,1180px)}
  body.site-home .hero{
    padding-top:38px;
  }
  body.site-home .hero h1{
    font-size:42px;
  }
  body.dashboard-page .welcome-card{
    min-height:auto;
    padding:20px;
  }
  body.dashboard-page .wallet-overview{
    grid-template-columns:1fr;
  }
  body.dashboard-page .wallet-balance-card{
    min-height:210px;
    padding:22px;
    border-radius:20px;
  }
  body.profile-page .profile-cover{
    height:188px;
  }
}
@media(prefers-reduced-motion:reduce){
  .pro-card,.dark-btn,.outline-btn,.nav-tab{transition:none!important}
}


/* PRONET — Dashboard UI refresh 2026-10-01
   Compact workspace navigation, premium white canvas, restrained PRONET green.
*/
body.dashboard-page{
  background:
    radial-gradient(circle at 78% 8%,rgba(0,255,208,.055),transparent 24%),
    linear-gradient(180deg,#f8fbfa 0%,#f5f8f7 100%);
}
body.dashboard-page .dashboard-main{
  padding:30px 0 80px;
}
body.dashboard-page .dash-heading{
  align-items:center;
  margin-bottom:22px;
}

body.dashboard-page .dash-heading h1{
  font-size:clamp(34px,4vw,46px);
  line-height:1;
  margin:7px 0 7px;
}
body.dashboard-page .dash-heading p{
  max-width:650px;
  font-size:13px;
}
body.dashboard-page .dash-grid{
  grid-template-columns:188px minmax(0,1fr);
  gap:18px;
  align-items:start;
}
body.dashboard-page .side-nav{
  position:sticky;
  top:92px;
  padding:7px;
  border:1px solid #e0e9e5;
  border-radius:18px;
  background:rgba(255,255,255,.92);
  box-shadow:0 10px 30px rgba(5,45,40,.055);
  backdrop-filter:blur(12px);
}
body.dashboard-page .side-link{
  min-height:42px;
  padding:10px 11px;
  border-radius:11px;
  color:#687873;
  font-size:11px;
  font-weight:700;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}
body.dashboard-page .side-link svg{
  width:15px;
  height:15px;
  color:#80908a;
  transition:color .18s ease;
}
body.dashboard-page .side-link:hover{
  background:#f0f7f4;
  color:#052d28;
  transform:translateX(2px);
  box-shadow:none;
}
body.dashboard-page .side-link.active{
  background:#052d28;
  color:#fff;
  box-shadow:0 7px 18px rgba(5,45,40,.13);
}
body.dashboard-page .side-link.active svg{
  color:#00ffd0;
}
body.dashboard-page .side-nav::after{
  content:"";
  display:block;
  height:1px;
  margin:7px 5px 2px;
  background:#edf2f0;
}
body.dashboard-page .dash-panels{
  min-width:0;
}
body.dashboard-page .dash-panel{
  border:1px solid #e2eae7;
  border-radius:22px;
  background:rgba(255,255,255,.94);
  box-shadow:0 12px 34px rgba(5,45,40,.045);
}
body.dashboard-page #panel-overview{
  background:transparent;
  border:0;
  box-shadow:none;
  padding:0;
}
body.dashboard-page .welcome-card{
  position:relative;
  overflow:hidden;
  margin:0 0 18px;
  padding:23px 24px;
  min-height:142px;
  border:1px solid #dce9e5;
  border-radius:21px;
  background:linear-gradient(135deg,#ffffff 0%,#effaf6 100%);
  box-shadow:0 10px 30px rgba(5,45,40,.055);
}
body.dashboard-page .welcome-card::after{
  content:"";
  position:absolute;
  width:170px;
  height:170px;
  right:-70px;
  top:-75px;
  border:1px solid rgba(0,255,208,.18);
  border-radius:50%;
  box-shadow:0 0 0 22px rgba(0,255,208,.035);
  pointer-events:none;
}
body.dashboard-page .welcome-card h2{
  margin:6px 0 6px;
  font-size:24px;
  letter-spacing:-.045em;
}
body.dashboard-page .welcome-card p{
  margin:0;
  max-width:570px;
  font-size:12px;
  line-height:1.6;
}
body.dashboard-page .mini-profile{
  position:relative;
  z-index:2;
  min-width:195px;
  border-radius:15px;
  box-shadow:0 6px 20px rgba(5,45,40,.045);
}
body.dashboard-page .stats-cards{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
body.dashboard-page .stat-card{
  position:relative;
  min-height:126px;
  padding:17px;
  overflow:hidden;
  border:1px solid #e1eae7;
  border-radius:17px;
  background:#fff;
  box-shadow:0 7px 22px rgba(5,45,40,.04);
}
body.dashboard-page .stat-card::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:3px;
  background:#dce9e5;
}
body.dashboard-page .stat-card.metric-rating::before{background:#00b89a}
body.dashboard-page .stat-card.metric-clients::before{background:#65b7a7}
body.dashboard-page .stat-card.metric-projects::before{background:#0c6657}
body.dashboard-page .stat-card.metric-completion::before{background:#00ffd0}
body.dashboard-page .stat-card span{
  font-size:10px;
  font-weight:750;
  color:#788780;
  text-transform:uppercase;
  letter-spacing:.07em;
}
body.dashboard-page .stat-card strong{
  font-size:29px;
  margin:9px 0 9px;
}
body.dashboard-page .stat-card small{
  font-size:10px;
}
body.dashboard-page .panel-header{
  margin-bottom:21px;
}
body.dashboard-page .panel-header h2{
  font-size:27px;
  margin:6px 0 5px;
}
body.dashboard-page .panel-header p{
  font-size:12px;
}
body.dashboard-page .editor-form{
  gap:14px;
}
body.dashboard-page .editor-form input,
body.dashboard-page .editor-form select,
body.dashboard-page .editor-form textarea,
body.dashboard-page .inline-form input,
body.dashboard-page .project-form input,
body.dashboard-page .project-form textarea{
  background:#f9fbfa;
  border-color:#e0e9e5;
  border-radius:12px;
}
body.dashboard-page .manage-item,
body.dashboard-page .project-item,
body.dashboard-page .client-card{
  border-color:#e1eae7;
  border-radius:15px;
  background:#fff;
}
body.dashboard-page .manage-item:hover,
body.dashboard-page .project-item:hover{
  border-color:#c8ddd7;
  box-shadow:0 8px 22px rgba(5,45,40,.045);
}
body.dashboard-page .wallet-overview{
  grid-template-columns:minmax(0,1.4fr) minmax(250px,.75fr);
  gap:14px;
}
body.dashboard-page .wallet-balance-card{
  min-height:210px;
  border-radius:21px;
  box-shadow:0 16px 38px rgba(5,45,40,.16);
}
body.dashboard-page .wallet-metrics article{
  border-radius:16px;
}
body.dashboard-page .wallet-history{
  border-radius:19px;
}
body.dashboard-page .wallet-note{
  border-radius:14px;
}
@media(max-width:980px){
  body.dashboard-page .dash-grid{
    grid-template-columns:1fr;
  }
  body.dashboard-page .side-nav{
    position:sticky;
    top:76px;
    z-index:20;
    display:flex;
    gap:4px;
    overflow-x:auto;
    padding:6px;
    border-radius:15px;
  }
  body.dashboard-page .side-nav::after{display:none}
  body.dashboard-page .side-link{
    width:auto;
    flex:0 0 auto;
    white-space:nowrap;
  }
  body.dashboard-page .side-link:hover{
    transform:none;
  }
}
@media(max-width:760px){
  body.dashboard-page .dashboard-main{
    padding-top:20px;
  }
  body.dashboard-page .dash-heading{
    align-items:flex-start;
    margin-bottom:17px;
  }
  body.dashboard-page .dash-heading h1{
    font-size:34px;
  }
  body.dashboard-page .welcome-card{
    align-items:flex-start;
    flex-direction:column;
    gap:15px;
    padding:20px;
  }
  body.dashboard-page .mini-profile{
    width:100%;
  }
  body.dashboard-page .stats-cards{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  body.dashboard-page .dash-panel{
    border-radius:19px;
  }
}
@media(max-width:480px){
  body.dashboard-page .stats-cards{
    grid-template-columns:1fr 1fr;
    gap:9px;
  }
  body.dashboard-page .stat-card{
    min-height:112px;
    padding:14px;
  }
  body.dashboard-page .stat-card strong{
    font-size:25px;
  }
  body.dashboard-page .wallet-overview{
    grid-template-columns:1fr;
  }
}
/* Dashboard refresh — dark theme */
html[data-theme="dark"] body.dashboard-page{
  background:linear-gradient(180deg,#081310 0%,#0a1714 100%);
}
html[data-theme="dark"] body.dashboard-page .side-nav{
  background:rgba(16,32,29,.96);
  border-color:#29413c;
}
html[data-theme="dark"] body.dashboard-page .side-link{
  color:#9db0aa;
}
html[data-theme="dark"] body.dashboard-page .side-link:hover{
  background:#17322d;
  color:#f3fbf8;
}
html[data-theme="dark"] body.dashboard-page .side-link.active{
  background:#00b89a;
  color:#052d28;
}
html[data-theme="dark"] body.dashboard-page .side-link.active svg{
  color:#052d28;
}
html[data-theme="dark"] body.dashboard-page .dash-panel{
  background:#10201d;
  border-color:#29413c;
}
html[data-theme="dark"] body.dashboard-page #panel-overview{
  background:transparent;
  border:0;
}
html[data-theme="dark"] body.dashboard-page .welcome-card{
  background:linear-gradient(135deg,#102a25,#0f211d);
  border-color:#29413c;
}
html[data-theme="dark"] body.dashboard-page .stat-card,
html[data-theme="dark"] body.dashboard-page .manage-item,
html[data-theme="dark"] body.dashboard-page .project-item,
html[data-theme="dark"] body.dashboard-page .client-card{
  background:#0f211d;
  border-color:#29413c;
}
html[data-theme="dark"] body.dashboard-page .editor-form input,
html[data-theme="dark"] body.dashboard-page .editor-form select,
html[data-theme="dark"] body.dashboard-page .editor-form textarea,
html[data-theme="dark"] body.dashboard-page .inline-form input,
html[data-theme="dark"] body.dashboard-page .project-form input,
html[data-theme="dark"] body.dashboard-page .project-form textarea{
  background:#0c1b18;
  border-color:#29413c;
  color:#eef7f4;
}


/* PRONET — Dashboard cards v2: clean, tactile, information-first */
body.dashboard-page .stats-cards{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-bottom:18px;
}
body.dashboard-page .stat-card{
  min-height:142px;
  padding:18px 18px 16px;
  border:1px solid #dfe9e5;
  border-radius:20px;
  background:#fff;
  box-shadow:0 8px 24px rgba(5,45,40,.045);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
body.dashboard-page .stat-card:hover{
  transform:translateY(-2px);
  border-color:#c8ddd7;
  box-shadow:0 14px 30px rgba(5,45,40,.075);
}
body.dashboard-page .stat-card::before{
  top:0;
  left:18px;
  width:38px;
  height:3px;
  border-radius:0 0 4px 4px;
}
body.dashboard-page .stat-card > span:first-child{
  display:block;
  margin-top:3px;
  color:#687b74;
  font-size:10px;
  font-weight:750;
  letter-spacing:.06em;
  text-transform:uppercase;
}
body.dashboard-page .stat-card strong{
  display:block;
  margin:15px 0 12px;
  color:#052d28;
  font-size:32px;
  line-height:1;
  letter-spacing:-.055em;
}
body.dashboard-page .stat-card small{
  display:flex;
  align-items:center;
  gap:6px;
  color:#82918c;
  font-size:10px;
  font-weight:650;
}
body.dashboard-page .stat-card small svg{
  width:13px;
  height:13px;
  color:#00a98f;
}
body.dashboard-page .stat-card.metric-rating{
  background:linear-gradient(145deg,#fff,#f7fbf9);
}
body.dashboard-page .stat-card.metric-clients{
  background:linear-gradient(145deg,#fff,#f4faf8);
}
body.dashboard-page .stat-card.metric-projects{
  background:linear-gradient(145deg,#fff,#f7faf9);
}
body.dashboard-page .stat-card.metric-completion{
  background:linear-gradient(145deg,#fff,#f1faf7);
}
body.dashboard-page .dash-panel:not(#panel-overview){
  padding:26px;
}
body.dashboard-page .dash-panel:not(#panel-overview) .panel-header{
  padding-bottom:16px;
  border-bottom:1px solid #edf2f0;
}
body.dashboard-page .panel-header h2{
  letter-spacing:-.04em;
}
body.dashboard-page .manage-list,
body.dashboard-page .project-list,
body.dashboard-page .client-list,
body.dashboard-page .reviews-list{
  display:grid;
  gap:10px;
}
body.dashboard-page .manage-item,
body.dashboard-page .project-item,
body.dashboard-page .client-card,
body.dashboard-page .review-item{
  border:1px solid #e3ebe8;
  border-radius:16px;
  background:#fff;
  box-shadow:none;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
body.dashboard-page .manage-item:hover,
body.dashboard-page .project-item:hover,
body.dashboard-page .client-card:hover,
body.dashboard-page .review-item:hover{
  border-color:#cbded8;
  box-shadow:0 8px 22px rgba(5,45,40,.05);
  transform:translateY(-1px);
}
body.dashboard-page .role-card{
  border:1px solid #dfe9e5;
  border-radius:18px;
  background:linear-gradient(135deg,#f7fbf9,#eef8f4);
  box-shadow:none;
}
body.dashboard-page .role-icon{
  border-radius:14px;
  background:#052d28;
  color:#00ffd0;
}
body.dashboard-page .rating-summary{
  border:1px solid #dfe9e5;
  border-radius:19px;
  background:linear-gradient(135deg,#f7fbf9,#fff);
  box-shadow:none;
}
body.dashboard-page .rating-summary-score{
  border-right:1px solid #e5ece9;
}
body.dashboard-page .editor-chip-list .editor-chip{
  border-radius:999px;
  background:#eef7f3;
  border-color:#d7e9e3;
  color:#14584c;
}
body.dashboard-page .add-row{
  margin-top:16px;
  padding-top:16px;
  border-top:1px solid #edf2f0;
}
body.dashboard-page .wallet-overview{
  margin-bottom:14px;
}
body.dashboard-page .wallet-balance-card{
  position:relative;
  overflow:hidden;
  border:0;
}
body.dashboard-page .wallet-balance-card::after{
  content:"";
  position:absolute;
  right:-42px;
  bottom:-68px;
  width:190px;
  height:190px;
  border:1px solid rgba(0,255,208,.2);
  border-radius:50%;
  box-shadow:0 0 0 20px rgba(0,255,208,.035),0 0 0 42px rgba(0,255,208,.018);
  pointer-events:none;
}
body.dashboard-page .wallet-metrics article{
  border:1px solid #dfe9e5;
  background:#fff;
}
body.dashboard-page .wallet-metrics article strong{
  color:#052d28;
}
body.dashboard-page .wallet-history{
  border:1px solid #e0e9e6;
  background:#fff;
}
body.dashboard-page .wallet-note{
  border:1px solid #d7e9e3;
}
@media(max-width:1100px){
  body.dashboard-page .stats-cards{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:520px){
  body.dashboard-page .stats-cards{
    grid-template-columns:1fr;
  }
  body.dashboard-page .stat-card{
    min-height:126px;
  }
  body.dashboard-page .dash-panel:not(#panel-overview){
    padding:20px;
  }
}
html[data-theme="dark"] body.dashboard-page .stat-card,
html[data-theme="dark"] body.dashboard-page .manage-item,
html[data-theme="dark"] body.dashboard-page .project-item,
html[data-theme="dark"] body.dashboard-page .client-card,
html[data-theme="dark"] body.dashboard-page .review-item,
html[data-theme="dark"] body.dashboard-page .wallet-metrics article,
html[data-theme="dark"] body.dashboard-page .wallet-history{
  background:#0f211d;
  border-color:#29413c;
}
html[data-theme="dark"] body.dashboard-page .stat-card strong,
html[data-theme="dark"] body.dashboard-page .wallet-metrics article strong{
  color:#ecfffa;
}
html[data-theme="dark"] body.dashboard-page .stat-card > span:first-child,
html[data-theme="dark"] body.dashboard-page .stat-card small{
  color:#9db0aa;
}
html[data-theme="dark"] body.dashboard-page .dash-panel:not(#panel-overview) .panel-header{
  border-color:#29413c;
}
html[data-theme="dark"] body.dashboard-page .role-card,
html[data-theme="dark"] body.dashboard-page .rating-summary{
  background:#102720;
  border-color:#29413c;
}
html[data-theme="dark"] body.dashboard-page .rating-summary-score{
  border-color:#29413c;
}

/* PRONET — Dashboard KPI cards v3
   Reference direction: modern fintech/SaaS cards — compact, editorial, data-first.
   No gradients, no colored strips, no oversized decoration.
*/
body.dashboard-page .dashboard-kpi-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin:0;
}
body.dashboard-page .dashboard-kpi-grid .stat-card{
  min-width:0;
  min-height:154px;
  padding:18px 18px 16px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  border:1px solid #e2ebe7;
  border-radius:18px;
  background:#fff;
  box-shadow:0 5px 18px rgba(5,45,40,.035);
  overflow:hidden;
  transform:none;
}
body.dashboard-page .dashboard-kpi-grid .stat-card:hover{
  transform:translateY(-2px);
  border-color:#cbded8;
  box-shadow:0 12px 26px rgba(5,45,40,.065);
}
body.dashboard-page .dashboard-kpi-grid .stat-card::before{
  display:none;
}
body.dashboard-page .kpi-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
body.dashboard-page .kpi-label{
  margin:0!important;
  color:#71827c!important;
  font-size:10px!important;
  line-height:1.2;
  font-weight:750!important;
  letter-spacing:.07em;
  text-transform:uppercase;
}
body.dashboard-page .kpi-icon{
  width:32px;
  height:32px;
  flex:0 0 32px;
  display:grid;
  place-items:center;
  border:1px solid #dcebe6;
  border-radius:10px;
  background:#f2f9f6;
  color:#087a68;
}
body.dashboard-page .kpi-icon svg{
  width:15px;
  height:15px;
}
body.dashboard-page .kpi-value-row{
  display:flex;
  align-items:baseline;
  gap:5px;
  margin-top:17px;
}
body.dashboard-page .dashboard-kpi-grid .stat-card strong{
  margin:0!important;
  color:#052d28!important;
  font-size:31px!important;
  line-height:1!important;
  letter-spacing:-.055em;
  font-weight:780;
}
body.dashboard-page .kpi-unit{
  color:#8a9994;
  font-size:11px;
  font-weight:650;
}
body.dashboard-page .kpi-meta{
  margin-top:auto;
  padding-top:13px;
  display:flex;
  align-items:center;
  gap:6px;
  color:#82918c!important;
  font-size:10px!important;
  font-weight:650;
  line-height:1.2;
}
body.dashboard-page .kpi-meta svg{
  width:13px;
  height:13px;
  color:#00a98f;
}
body.dashboard-page .kpi-progress{
  height:6px;
  margin-top:14px;
  overflow:hidden;
  border-radius:999px;
  background:#eaf1ee;
}
body.dashboard-page .kpi-progress span{
  display:block;
  width:0;
  height:100%;
  border-radius:inherit;
  background:#00b89a;
  transition:width .35s ease;
}
body.dashboard-page .metric-rating .kpi-icon{color:#a97816;background:#fff9e9;border-color:#f1e5bd}
body.dashboard-page .metric-rating .kpi-meta svg{color:#b78420}
body.dashboard-page .metric-clients .kpi-icon{color:#0b7764}
body.dashboard-page .metric-projects .kpi-icon{color:#315f57}
body.dashboard-page .metric-completion .kpi-icon{color:#087a68;background:#eefaf6}
@media(max-width:1100px){
  body.dashboard-page .dashboard-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:520px){
  body.dashboard-page .dashboard-kpi-grid{grid-template-columns:1fr 1fr;gap:10px}
  body.dashboard-page .dashboard-kpi-grid .stat-card{min-height:142px;padding:15px}
  body.dashboard-page .dashboard-kpi-grid .stat-card strong{font-size:27px!important}
  body.dashboard-page .kpi-icon{width:29px;height:29px;flex-basis:29px}
}
html[data-theme="dark"] body.dashboard-page .dashboard-kpi-grid .stat-card{
  background:#10201d;
  border-color:#29413c;
  box-shadow:0 7px 22px rgba(0,0,0,.16);
}
html[data-theme="dark"] body.dashboard-page .kpi-label{color:#9db0aa!important}
html[data-theme="dark"] body.dashboard-page .dashboard-kpi-grid .stat-card strong{color:#effaf7!important}
html[data-theme="dark"] body.dashboard-page .kpi-unit,
html[data-theme="dark"] body.dashboard-page .kpi-meta{color:#9db0aa!important}
html[data-theme="dark"] body.dashboard-page .kpi-icon{
  background:#17322d;
  border-color:#294b43;
}
html[data-theme="dark"] body.dashboard-page .kpi-progress{background:#17322d}

/* Dashboard KPI — real progress + hover detail */
body.dashboard-page .kpi-progress{position:relative;height:6px;margin-top:14px;background:#e8f0ed;border-radius:999px;overflow:hidden}
body.dashboard-page .kpi-progress span{display:block;width:var(--progress,0%);height:100%;background:#00b89a;border-radius:inherit;transition:width .5s cubic-bezier(.22,1,.36,1)}
body.dashboard-page .dashboard-kpi-grid .stat-card{position:relative}
body.dashboard-page .kpi-hover-detail{position:absolute;z-index:30;left:10px;right:10px;bottom:10px;padding:12px 13px;border:1px solid #dbe8e3;border-radius:13px;background:rgba(255,255,255,.98);box-shadow:0 14px 32px rgba(5,45,40,.12);opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .18s ease,transform .18s ease}
body.dashboard-page .stat-card:hover .kpi-hover-detail,body.dashboard-page .stat-card:focus-within .kpi-hover-detail{opacity:1;transform:translateY(0);pointer-events:auto}
body.dashboard-page .kpi-hover-detail strong{display:block!important;margin:0!important;font-size:11px!important;letter-spacing:-.01em;color:#052d28!important}
body.dashboard-page .kpi-hover-detail p{margin:5px 0 8px;color:#6f817a;font-size:9px;line-height:1.45}
body.dashboard-page .kpi-hover-detail button{display:inline-flex;align-items:center;gap:4px;padding:0;border:0;background:none;color:#087a68;font-size:9px;font-weight:750;cursor:pointer}
body.dashboard-page .kpi-hover-detail button svg{width:11px;height:11px}
@media(max-width:640px){body.dashboard-page .kpi-hover-detail{display:none}}
html[data-theme="dark"] body.dashboard-page .kpi-hover-detail{background:#122520;border-color:#294b43}
html[data-theme="dark"] body.dashboard-page .kpi-hover-detail strong{color:#effaf7!important}
html[data-theme="dark"] body.dashboard-page .kpi-hover-detail p{color:#a7b8b2}
body.dashboard-page .dashboard-analysis-card{margin-top:18px;padding:22px;border:1px solid #dfe9e5;border-radius:20px;background:#fff;box-shadow:0 12px 30px rgba(5,45,40,.045)}
body.dashboard-page .analysis-header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}
body.dashboard-page .analysis-header h3{margin:3px 0 5px;color:#052d28;font-size:17px;letter-spacing:-.03em}
body.dashboard-page .analysis-header p{margin:0;color:#71827c;font-size:11px;line-height:1.5}
body.dashboard-page .analysis-period{padding:7px 10px;border:1px solid #dfe9e5;border-radius:999px;color:#587068;background:#f6faf8;font-size:10px;font-weight:700;white-space:nowrap}
body.dashboard-page .dashboard-activity-chart{display:grid;gap:13px}
body.dashboard-page .activity-bar-row{display:grid;grid-template-columns:105px minmax(0,1fr) 34px;align-items:center;gap:12px;width:100%;padding:4px 0;border:0;background:none;text-align:left;cursor:pointer}
body.dashboard-page .activity-bar-label{display:flex;align-items:center;gap:7px;color:#4d625b;font-size:10px;font-weight:700}
body.dashboard-page .activity-bar-label svg{width:14px;height:14px;color:#087a68}
body.dashboard-page .activity-bar-track{height:9px;overflow:hidden;border-radius:999px;background:#edf3f0}
body.dashboard-page .activity-bar-fill{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#052d28,#00b89a);transform-origin:left center;transition:width .55s cubic-bezier(.22,1,.36,1)}
body.dashboard-page .activity-bar-row strong{color:#052d28;font-size:11px;text-align:right}
body.dashboard-page .activity-bar-row:hover .activity-bar-fill{filter:brightness(1.08)}
body.dashboard-page .kpi-hover-detail p{max-height:52px;overflow:auto}
body.dashboard-page .kpi-detail-tasks{display:grid;gap:4px;margin:7px 0 9px;max-height:76px;overflow:auto}
body.dashboard-page .kpi-task{display:flex;align-items:center;gap:5px;color:#5f716b;font-size:8.5px;line-height:1.3}
body.dashboard-page .kpi-task svg{width:11px;height:11px;flex:none}
body.dashboard-page .kpi-task.done{color:#087a68}
body.dashboard-page .kpi-task.todo{color:#6f817a}
html[data-theme="dark"] body.dashboard-page .kpi-task{color:#9eb1aa}
html[data-theme="dark"] body.dashboard-page .kpi-task.done{color:#67dec6}
@media(max-width:640px){body.dashboard-page .dashboard-analysis-card{padding:17px;border-radius:17px}.activity-bar-row{grid-template-columns:88px minmax(0,1fr) 28px!important;gap:8px!important}.analysis-header{margin-bottom:14px}}
html[data-theme="dark"] body.dashboard-page .dashboard-analysis-card{background:#10221e;border-color:#294b43}
html[data-theme="dark"] body.dashboard-page .analysis-header h3,html[data-theme="dark"] body.dashboard-page .activity-bar-row strong{color:#effaf7}
html[data-theme="dark"] body.dashboard-page .analysis-header p,html[data-theme="dark"] body.dashboard-page .activity-bar-label{color:#a7b8b2}
html[data-theme="dark"] body.dashboard-page .analysis-period{background:#17302a;border-color:#294b43;color:#b8cbc4}
html[data-theme="dark"] body.dashboard-page .activity-bar-track{background:#203a34}

/* Professional portfolio workspace */
body.dashboard-page .portfolio-panel-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
body.dashboard-page #panel-projects .panel-description{max-width:560px;margin-top:8px;line-height:1.6}
body.dashboard-page #panel-projects .portfolio-panel-actions .outline-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap}
body.dashboard-page #panel-projects .portfolio-panel-actions svg{width:16px;height:16px}
body.dashboard-page #portfolioNavLink{gap:11px}
@media(max-width:760px){body.dashboard-page #panel-projects .portfolio-panel-actions{width:100%;justify-content:stretch}body.dashboard-page #panel-projects .portfolio-panel-actions .outline-btn{flex:1;min-width:0}}
html[data-theme="dark"] body.dashboard-page #panel-projects .panel-description{color:#a7b8b2}

body.dashboard-page .project-publish-state{display:inline-flex;align-items:center;width:max-content;margin-top:5px;padding:4px 8px;border-radius:999px;font-size:10px;font-weight:700}body.dashboard-page .project-publish-state.is-published{background:#e5f7ef;color:#087a53}body.dashboard-page .project-publish-state.is-draft{background:#f1f3f2;color:#68756f}body.dashboard-page .project-visibility-btn{width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--line);border-radius:9px;background:var(--white);color:var(--green);cursor:pointer}body.dashboard-page .project-visibility-btn:disabled{opacity:.5;cursor:wait}body.dashboard-page .project-visibility-btn svg{width:15px;height:15px}html[data-theme="dark"] body.dashboard-page .project-publish-state.is-published{background:#123c30;color:#8ce7c1}html[data-theme="dark"] body.dashboard-page .project-publish-state.is-draft{background:#28332f;color:#c0cbc5}

/* External Profolio app link in the professional dashboard toolbar */
body.dashboard-page .profolio-external-link{position:relative;text-decoration:none}
body.dashboard-page .profolio-external-link .profolio-external-icon{width:13px;height:13px;margin-left:auto;opacity:.62}
body.dashboard-page .profolio-external-link:hover .profolio-external-icon{opacity:1}

/* Profile layout — release unused sidebar space when no public contact block is visible */
.profile-layout:not(:has(.profile-side .public-section:not(.hidden))){
  grid-template-columns:minmax(0,1fr);
}
.profile-layout:not(:has(.profile-side .public-section:not(.hidden))) .portfolio-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
@media(max-width:980px){
  .profile-layout:not(:has(.profile-side .public-section:not(.hidden))){
    grid-template-columns:1fr;
  }
}

/* Desktop profile — separate Presentation and Skills cards */
@media(min-width:981px){
  .profile-main-col > #profileAboutSection,
  .profile-main-col > #profileSkillsSection{
    display:inline-block;
    vertical-align:top;
    width:calc(50% - 14px);
    box-sizing:border-box;
    border:1px solid var(--line);
    border-radius:16px;
    padding:24px;
    background:#fff;
    box-shadow:0 8px 24px rgba(5,45,40,.05);
  }
}

/* Desktop profile — equal-height About and Skills cards, no shadow */
@media(min-width:981px){
  .profile-main-col > #profileAboutSection,
  .profile-main-col > #profileSkillsSection{
    min-height:100%;
    box-shadow:none;
  }
}
/* Profile portfolio — restore mobile layout */
@media(max-width:640px){
  .profile-layout:not(:has(.profile-side .public-section:not(.hidden))) .portfolio-grid{
    grid-template-columns:1fr;
  }
}


/* Profile bio — compact social-profile presentation */
.profile-bio{
  margin:10px 0 0;
  max-width:620px;
  color:#53655f;
  font-size:13px;
  line-height:1.55;
}
@media(max-width:640px){
  .profile-bio{max-width:100%;font-size:12px;line-height:1.5}
}


/* FRILANS LOKAL — visibility safeguard for homepage navigation and professional cards */
body.site-home .topbar{display:block!important;visibility:visible!important;opacity:1!important}
body.site-home .topbar .nav-inner{display:flex!important;visibility:visible!important;opacity:1!important}
body.site-home .topbar .nav-actions{display:flex!important;align-items:center!important;visibility:visible!important;opacity:1!important}
body.site-home .desktop-nav-tabs{display:flex!important;align-items:center!important;gap:8px!important;visibility:visible!important;opacity:1!important}
body.site-home .desktop-nav-tabs .nav-tab{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:10px 12px;border-radius:12px;color:var(--ink);font-size:13px;font-weight:650;white-space:nowrap}
body.site-home .desktop-nav-tabs .nav-tab.active,body.site-home .desktop-nav-tabs .nav-tab:hover{background:var(--soft);color:var(--ink)}
body.site-home .desktop-nav-tabs .nav-tab svg{width:16px;height:16px;flex:none}
body.site-home #loginButton,body.site-home #homeStandaloneLanguage,body.site-home #homeStandaloneTheme,body.site-home #homeAccountButton{flex:none}
body.site-home #resultsGrid.cards-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;visibility:visible!important;opacity:1!important}
body.site-home #resultsGrid .pro-card{display:block!important;visibility:visible!important;opacity:1!important;min-width:0}
body.site-home #resultsGrid .card-link{display:flex;flex-direction:column;min-height:100%;height:100%}
body.site-home #resultsGrid .card-top{display:flex;align-items:center;gap:13px;padding:18px 18px 0}
body.site-home #resultsGrid .card-avatar{width:58px;height:58px;flex:0 0 58px;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:17px;background:var(--ink);color:#fff;font-size:16px;font-weight:800}
body.site-home #resultsGrid .card-avatar img{width:100%;height:100%;object-fit:cover}
body.site-home #resultsGrid .card-identity{min-width:0;flex:1}
body.site-home #resultsGrid .card-name-row{display:flex;align-items:center;gap:6px;min-width:0}
body.site-home #resultsGrid .card-name-row h3{margin:0;font-size:17px;line-height:1.25;overflow-wrap:anywhere}
body.site-home #resultsGrid .card-verified{display:inline-flex;flex:none;color:#16816d}
body.site-home #resultsGrid .card-verified svg{width:16px;height:16px}
body.site-home #resultsGrid .card-identity .role{margin:5px 0 0;font-size:12px;line-height:1.4}
body.site-home #resultsGrid .card-body{display:block;padding:16px 18px;flex:1}
body.site-home #resultsGrid .location-line{display:flex;align-items:center;gap:6px;line-height:1.4}
body.site-home #resultsGrid .stats-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:14px}
body.site-home #resultsGrid .card-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
body.site-home #resultsGrid .card-tags span{display:inline-flex;padding:6px 8px;border-radius:8px;background:var(--soft);font-size:11px}
body.site-home #resultsGrid .card-footer{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:auto;padding:13px 18px;border-top:1px solid var(--line)}
body.site-home #resultsGrid .card-specialty{min-width:0;overflow-wrap:anywhere}
@media(max-width:900px){body.site-home #resultsGrid.cards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){
 body.site-home .nav-inner{gap:8px}
 body.site-home .brand{min-width:0}
 body.site-home .brand-logo{width:150px;height:150px}
 body.site-home .brand-copy small{display:none}
 body.site-home .nav-actions{gap:5px!important}
 body.site-home .desktop-nav-tabs{gap:2px!important}
 body.site-home .desktop-nav-tabs .nav-tab{padding:9px 7px;font-size:11px}
 body.site-home .desktop-nav-tabs .nav-tab svg{display:none}
 body.site-home #loginButton{padding:9px 10px;font-size:11px}
 body.site-home #resultsGrid.cards-grid{grid-template-columns:minmax(0,1fr)}
}


/* FRILANS LOKAL — flat navbar menu, without pill/shape treatments */
body.site-home .desktop-nav-tabs .nav-tab,
body.site-home .desktop-nav-tabs .nav-tab.active,
body.site-home .desktop-nav-tabs .nav-tab:hover{
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  outline:none;
  text-decoration:none;
}
body.site-home .desktop-nav-tabs .nav-tab{
  padding:10px 8px!important;
}
body.site-home .desktop-nav-tabs .nav-tab.active,
body.site-home .desktop-nav-tabs .nav-tab:hover{
  color:var(--ink)!important;
  text-decoration:underline;
  text-decoration-color:var(--mint);
  text-decoration-thickness:2px;
  text-underline-offset:7px;
}
body.site-home .nav-actions .nav-mini-btn{
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
body.site-home .nav-actions .nav-mini-btn:hover{
  background:transparent!important;
  color:var(--ink)!important;
  text-decoration:underline;
  text-decoration-color:var(--mint);
  text-underline-offset:5px;
}


/* FRILANS LOKAL — never render the account avatar before authentication */
body.site-home[data-session="inactive"] #homeAccountButton,
body.site-home:not([data-session="active"]) #homeAccountButton{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}


/* FRILANS LOKAL — persistent homepage professional-card visibility */
body.site-home #resultsGrid.cards-grid {
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
  min-height: 1px;
}
body.site-home #resultsGrid.cards-grid > .pro-card {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}
body.site-home #resultsGrid.cards-grid:empty {
  display: grid !important;
}

/* EspasJob — mobile navigation: hide desktop navbar links on small screens. */
@media (max-width: 980px) {
  .desktop-nav-tabs {
    display: none !important;
  }
}

/* EspasJob — definitive responsive navigation rule.
   The homepage has legacy !important rules that force the desktop tabs visible.
   Keep these tabs for desktop only; mobile uses the existing compact actions/account menu. */
@media screen and (max-width: 980px) {
  nav.desktop-nav-tabs,
  .nav-inner nav.desktop-nav-tabs,
  .topbar .nav-inner .nav-actions nav.desktop-nav-tabs,
  body.site-home nav.desktop-nav-tabs,
  body.site-home .topbar .nav-inner .nav-actions nav.desktop-nav-tabs {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 0 !important;
    max-width: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}
@media screen and (min-width: 981px) {
  nav.desktop-nav-tabs {
    display: flex;
    visibility: visible;
    opacity: 1;
    width: auto;
    max-width: none;
    pointer-events: auto;
  }
}


/* EspasJob — show the logo mark without the text beside it. */
.brand-copy{display:none!important}

/* Correctif prioritaire du logo de la navigation — évite les anciennes règles responsive */
body.site-home .topbar .brand > .brand-logo{width:92px!important;height:92px!important;max-width:none!important;object-fit:contain!important;flex:0 0 92px!important}

/* Ajustement vertical demandé pour le bouton de recherche */
body.site-home #searchButton{transform:none;width:42px;height:42px;align-self:center;justify-self:center}

/* Réduction de 10 px du bouton de lancement de recherche */
body.site-home #searchButton{width:42px;height:40px;}

/* EspasJob brand audit: consistent 92px official logo across the platform. */
.brand-logo{width:92px!important;height:92px!important;max-width:92px!important;object-fit:contain!important;flex:0 0 92px!important}
body.site-home .topbar .brand>.brand-logo{width:92px!important;height:92px!important;max-width:92px!important;object-fit:contain!important;flex:0 0 92px!important}




/* Confirmation before leaving the EspasJob dashboard for Profolio */
body.dashboard-page .profolio-confirm-card .panel-header{margin-bottom:22px}
body.dashboard-page .profolio-confirm-card .panel-header>div>span{display:inline-flex;align-items:center;gap:6px;color:var(--muted,#71807b);font-size:12px;font-weight:600}
body.dashboard-page .profolio-confirm-card .panel-header h2{margin:8px 0;font-size:clamp(21px,3vw,26px);letter-spacing:-.035em}
body.dashboard-page .profolio-confirm-card .panel-header p{max-width:430px;line-height:1.65}
body.dashboard-page .profolio-confirm-actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:10px;margin-top:8px}
body.dashboard-page .profolio-confirm-actions button{min-height:44px}
@media(max-width:520px){body.dashboard-page .profolio-confirm-card{padding:19px}body.dashboard-page .profolio-confirm-actions{flex-direction:column-reverse}body.dashboard-page .profolio-confirm-actions button{width:100%;justify-content:center}}

/* PRONET — couverture du profil : afficher l’image entière dans l’aperçu, sans zoom ni recadrage. */
body.dashboard-page .media-preview.cover-preview{width:140px;height:54px;aspect-ratio:70/27;background:#eef4f1;}
body.dashboard-page .media-preview.cover-preview img{width:100%;height:100%;object-fit:contain;object-position:center;}
