/* profil.css — halaman Profil Usaha */
/* ---- Profil Usaha ---- */
.pf-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:18px;align-items:start;max-width:none}
.pf-col{display:flex;flex-direction:column;gap:18px;min-width:0}
.pfc{background:#fff;border-radius:24px;padding:20px 20px 18px;box-shadow:0 8px 22px rgba(40,40,60,.06);animation:dUp .6s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--k,0)*90ms)}
.pfc h3{font-size:15.5px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:8px}
.pf-hero{position:relative;overflow:hidden;color:#fff;background:linear-gradient(140deg,#F26A2E -10%,#D53E0F 46%,#7E0306 118%);box-shadow:0 20px 40px rgba(126,3,6,.25)}
.pf-hbg{position:absolute;inset:0;pointer-events:none}
.pf-hbg i{position:absolute;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.24),rgba(255,255,255,0) 70%)}
.pf-hbg i:nth-child(1){width:260px;height:260px;right:-60px;top:-90px;animation:lgDrift1 15s ease-in-out infinite alternate}
.pf-hbg i:nth-child(2){width:170px;height:170px;left:30%;bottom:-90px;background:radial-gradient(circle,rgba(255,196,120,.34),rgba(255,196,120,0) 70%);animation:lgDrift2 18s ease-in-out infinite alternate}
.pf-hmain,.pf-meter{position:relative}
.pf-hmain{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.pf-hero .logobox{width:96px;height:96px;border-radius:24px;background:#fff;border:3px solid rgba(255,255,255,.55);box-shadow:0 12px 26px rgba(0,0,0,.22);animation:lgPop .8s .1s cubic-bezier(.3,1.5,.5,1) both}
.pf-hid{flex:1;min-width:190px}
.pf-name{font-size:21px;font-weight:800;letter-spacing:-.01em}
.pf-badge{display:inline-block;margin-top:6px;background:rgba(255,255,255,.2);border-radius:999px;padding:4px 12px;font-size:12px;font-weight:700}
.pf-meter{margin-top:18px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:18px;padding:12px 14px;backdrop-filter:blur(6px)}
.pf-mt{display:flex;justify-content:space-between;font-size:12.5px;font-weight:700;margin-bottom:8px}
.pf-mbar{height:8px;border-radius:8px;background:rgba(255,255,255,.25);overflow:hidden}
.pf-mbar i{display:block;height:100%;background:#fff;border-radius:8px;transform-origin:left;animation:dGrow 1.2s .5s cubic-bezier(.4,0,.2,1) both}
.pf-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.pf-chips span{font-size:11px;font-weight:700;border-radius:999px;padding:3px 10px;background:rgba(255,255,255,.14);opacity:.8}
.pf-chips span.ok{background:#fff;color:var(--red);opacity:1}
.pf-types{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pf-types button{position:relative;text-align:left;border:2px solid #eee;background:#fff;border-radius:18px;padding:14px;cursor:pointer;display:flex;flex-direction:column;gap:3px;font-family:inherit;transition:border-color .2s,background .2s,transform .2s,box-shadow .2s}
.pf-types button:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(40,40,60,.08)}
.pf-types button i{font-style:normal;font-size:24px;margin-bottom:4px}
.pf-types button b{font-size:13px}
.pf-types button span{font-size:11px;color:var(--muted);line-height:1.35}
.pf-types button.on{border-color:var(--red);background:linear-gradient(160deg,#fff,#fff3ec)}
.pf-types button.on::after{content:"✓";position:absolute;top:10px;right:12px;width:22px;height:22px;border-radius:50%;background:var(--red);color:#fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;animation:dPop .35s cubic-bezier(.3,1.6,.5,1) both}
.pf-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.pf-row:last-of-type{border-bottom:none}
.pf-ri{width:38px;height:38px;border-radius:12px;background:var(--cream);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.pf-rt{flex:1;min-width:0}.pf-rt b{display:block;font-size:13.5px}.pf-rt span{display:block;font-size:11.5px;color:var(--muted);margin-top:1px;line-height:1.35}
.pf-rate{display:flex;align-items:center;gap:4px}
.pf-rate input{width:64px;text-align:right;padding:7px 9px}
.sw{position:relative;display:inline-block;width:46px;height:27px;flex-shrink:0}
.sw>input[type=checkbox]{-webkit-appearance:none;appearance:none;width:46px;height:27px;min-width:0;margin:0;padding:0;border:none;border-radius:999px;background:#dcd6d2;cursor:pointer;transition:background .25s;display:block}
.sw>input[type=checkbox]::after{content:"";position:absolute;top:3px;left:3px;width:21px;height:21px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.28);transition:transform .28s cubic-bezier(.3,1.5,.5,1)}
.sw>input[type=checkbox]:checked{background:var(--red)}
.sw>input[type=checkbox]:checked::after{transform:translateX(19px)}
.sw>input[type=checkbox]:focus-visible{outline:3px solid rgba(213,62,15,.3);outline-offset:2px}
.pf-save{position:sticky;bottom:14px;z-index:6;max-width:none;margin-top:18px;display:flex;justify-content:flex-end;pointer-events:none}
.pf-savein{pointer-events:auto;display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border:1px solid rgba(0,0,0,.06);border-radius:999px;padding:8px 8px 8px 18px;box-shadow:0 14px 34px rgba(40,40,60,.18)}
.pf-dirty{font-size:12px;color:var(--muted);font-weight:600;opacity:.0;max-width:0;overflow:hidden;white-space:nowrap;transition:opacity .3s,max-width .35s}
.pf-dirty.on{opacity:1;max-width:240px;color:var(--amber)}
.pf-savein .btn{border-radius:999px;padding:11px 20px}
@media (max-width:900px){.pf-grid{grid-template-columns:1fr}.pf-types{grid-template-columns:1fr}}
/* ---- Profil v2: penyempurnaan mobile (bar simpan di atas bottom nav, tanpa scroll horizontal) ---- */
.pf-head{margin-bottom:16px}
.pfc,.pf-grid{min-width:0}
.pfc input,.pfc textarea{max-width:100%}
.pf-savein .btn{box-shadow:0 8px 18px rgba(213,62,15,.28)}
@media (max-width:820px){
  .pf-grid{gap:14px}.pf-col{gap:14px}
  .pfc{border-radius:24px;padding:16px 16px 15px}
  .pfc h3{font-size:15px;margin-bottom:12px}
  .pf-hero{padding:18px 16px 16px;border-radius:26px}
  .pf-hmain{flex-direction:column;align-items:center;text-align:center;gap:12px}
  .pf-hero .logobox{width:92px;height:92px}
  .pf-hid{min-width:0;width:100%}
  .pf-hid .flexbtns{justify-content:center;flex-wrap:nowrap}
  .pf-hid .flexbtns .btn{flex:0 1 auto;border-radius:999px;padding:9px 16px}
  .pf-chips{justify-content:center}
  .pf-meter{padding:12px}
  .pfc .grid2{grid-template-columns:1fr}
  .pf-types{grid-template-columns:1fr;gap:9px}
  .pf-types button{padding:12px 14px}
  .pf-types button i{margin-bottom:0}
  .pf-row{gap:10px}
  .pf-rate input{width:56px}
  .pf-ri{width:36px;height:36px}
  /* bar simpan menempel di atas bottom nav (nav ±76px + jarak 12px) */
  .pf-save{position:sticky;bottom:calc(92px + var(--sab));max-width:none;justify-content:stretch;margin:14px 0 0}
  .pf-savein{width:100%;justify-content:space-between;gap:10px;padding:7px 7px 7px 16px}
  .pf-dirty{max-width:none;flex:1;min-width:0}
  .pf-savein .btn{flex-shrink:0}
}
@media (prefers-reduced-motion:reduce){.tcard,.pfc,.tc-bar i,.pf-mbar i,.pf-hbg i,.pf-hero .logobox,.pf-types button.on::after{animation:none!important}}
@media (prefers-reduced-motion:reduce){.lhero::before,.lhero::after,.lh-word,.lh-copy *,.lplate,.ldisc,.lorbit,.lfc,.lwave,.lwave-b,.lhead,.lh-tag{animation:none!important}}
@media (prefers-reduced-motion:reduce){.loginbg,.loginbg::before,.loginbg::after,.loginbox,.loginbox *,.lfx span{animation:none!important;transition:none!important}.lfx{display:none}}