/* ── PRICEHUB PLUGIN STYLES ─────────────────────── */
:root{
  --ph-blue:#0064A6;--ph-blue-dk:#004F84;--ph-blue-lt:#1A7EC0;
  --ph-blue-pale:#E3EFF8;--ph-orange:#E87722;--ph-navy:#003057;
  --ph-white:#FFFFFF;--ph-g100:#F4F7FA;--ph-g200:#E8EDF3;
  --ph-g300:#CDD5DF;--ph-g400:#97AEC5;--ph-g500:#5F7E9A;
  --ph-g700:#2C4A65;--ph-g900:#0E1E2E;
  --ph-green:#2E9E5B;--ph-r:7px;
  --ph-sh1:0 1px 4px rgba(0,64,166,.09);
  --ph-sh2:0 4px 18px rgba(0,64,166,.14);
  --ph-sh3:0 8px 36px rgba(0,64,166,.18);
}
/* NOTE: a blanket reset here (margin/padding/box-sizing on every element)
   was found to never have been active in production due to a long-standing
   selector bug. The rest of this stylesheet was tuned assuming default
   browser spacing on p/label/button/etc. Enabling any version of a global
   reset — even box-sizing alone — broke existing layouts (card text
   spacing, login sizing) once tried. Intentionally NOT reintroducing it;
   the one bug it was meant to fix (icons overlapping login input text) is
   already fixed directly on .ph-input below via an explicit, scoped
   box-sizing:border-box, which doesn't touch anything else. */
#pricehub-root{
  font-family:-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  background:var(--ph-g100);color:var(--ph-g900);
  font-size:14px;line-height:1.5;display:flex;flex-direction:column;
  overflow:hidden;border-radius:var(--ph-r);
  box-shadow:var(--ph-sh3);
  position:relative;
  width:100% !important;box-sizing:border-box !important;margin:0 !important;
}

/* LOGIN */
.ph-login-screen{
  flex:1;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(145deg,var(--ph-navy) 0%,var(--ph-blue-dk) 55%,var(--ph-blue) 100%);
  padding:20px;
}
.ph-login-card{
  background:var(--ph-white);border-radius:14px;
  box-shadow:var(--ph-sh3);width:100%;max-width:400px;
  overflow:hidden;animation:phLoginIn .32s ease;
}
@keyframes phLoginIn{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
@keyframes phShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-8px)}40%{transform:translateX(8px)}60%{transform:translateX(-5px)}80%{transform:translateX(5px)}}

/* CATALOG PICKER (post-login, shown only when a user has 2+ catalogs) */
.ph-catalog-picker{
  display:none;flex:1;align-items:center;justify-content:center;
  background:linear-gradient(145deg,var(--ph-navy) 0%,var(--ph-blue-dk) 55%,var(--ph-blue) 100%);
  padding:24px;position:absolute;inset:0;z-index:20;overflow:auto;
}
.ph-cp-wrap{width:100%;max-width:760px;margin:auto;}
.ph-cp-header{text-align:center;margin-bottom:22px;color:var(--ph-white);}
.ph-cp-header h2{font-size:19px;font-weight:700;margin-top:12px;}
.ph-cp-header img{max-height:44px;max-width:180px;object-fit:contain;margin:0 auto;display:block;}
.ph-cp-cards{display:flex;gap:18px;flex-wrap:wrap;justify-content:center;}
.ph-cp-card{
  background:var(--ph-white);border-radius:14px;overflow:hidden;width:280px;
  box-shadow:var(--ph-sh3);cursor:pointer;transition:transform .15s ease;
  animation:phLoginIn .32s ease;
}
.ph-cp-card:hover{transform:translateY(-4px);}
.ph-cp-cover{background-color:var(--ph-g200);overflow:hidden;}
.ph-cp-cover-empty{height:140px;display:flex;align-items:center;justify-content:center;font-size:38px;color:var(--ph-g400);}
.ph-cp-body{padding:16px 18px 20px;}
.ph-cp-body h3{font-size:15px;font-weight:700;color:var(--ph-navy);margin-bottom:6px;}
.ph-cp-body p{font-size:12.5px;color:var(--ph-g500);margin-bottom:14px;line-height:1.4;}
.ph-cp-btn{
  width:100%;background:var(--ph-blue);color:var(--ph-white);border:none;
  padding:10px 14px;border-radius:8px;font-size:13.5px;font-weight:700;cursor:pointer;
  transition:background .15s ease;
}
.ph-cp-btn:hover{background:var(--ph-blue-dk);}
.ph-login-top{
  background:linear-gradient(135deg,var(--ph-navy),var(--ph-blue));
  padding:28px 28px 22px;text-align:center;
}
.ph-logo-img{max-height:54px;max-width:210px;object-fit:contain;display:block;margin:0 auto 16px;}
.ph-logo-img-header{max-height:38px;max-width:150px;object-fit:contain;display:block;}
.ph-public-logo img,.ph-public-top .ph-logo-img{max-height:46px;max-width:200px;margin-bottom:10px;}
.ph-logo-box{
  display:inline-block;background:#fff;color:var(--ph-blue);
  font-weight:900;font-size:20px;letter-spacing:3px;
  padding:4px 12px;border-radius:4px;margin-bottom:18px;
}
.ph-login-title{color:#fff;font-size:16px;font-weight:700;margin-bottom:4px;}
.ph-login-sub{color:rgba(255,255,255,.65);font-size:11.5px;}
.ph-login-body{padding:24px 28px 28px;}
.ph-field{margin-bottom:16px;}
.ph-label{display:block;font-size:10.5px;font-weight:700;color:var(--ph-g500);letter-spacing:.8px;text-transform:uppercase;margin-bottom:5px;}
.ph-input-wrap{position:relative;display:flex;align-items:center;}
.ph-input{
  width:100%;border:1.5px solid var(--ph-g300);border-radius:8px;
  padding:9px 38px 9px 42px !important;font-size:14px;color:var(--ph-g900);
  outline:none;transition:border .18s,box-shadow .18s;background:var(--ph-g100);
  box-sizing:border-box !important;
  margin:0 !important;
}
.ph-input:focus{border-color:var(--ph-blue);box-shadow:0 0 0 3px rgba(0,100,166,.12);background:#fff;}
.ph-input.ph-error{border-color:#c53030;box-shadow:0 0 0 3px rgba(197,48,48,.1);}
.ph-input-ic{position:absolute;left:13px;top:50%;transform:translateY(-50%);font-size:14px;color:var(--ph-g400);pointer-events:none;line-height:1;width:18px;text-align:center;z-index:1;}
.ph-eye{position:absolute;right:11px;top:50%;transform:translateY(-50%);font-size:13px;color:var(--ph-g400);cursor:pointer;user-select:none;transition:color .15s;z-index:1;}
.ph-eye:hover{color:var(--ph-blue);}
.ph-login-err{
  background:#fff0f0;border:1px solid #fcc;border-radius:6px;
  padding:8px 12px;font-size:12px;color:#c53030;
  margin-bottom:14px;display:none;align-items:center;gap:6px;
}
.ph-login-err.show{display:flex;}
.ph-login-btn{
  width:100%;background:var(--ph-blue);border:none;color:#fff;
  padding:11px;border-radius:8px;font-size:14px;font-weight:700;
  cursor:pointer;transition:background .15s;letter-spacing:.3px;
}
.ph-login-btn:hover{background:var(--ph-blue-dk);}
.ph-login-footer{text-align:center;margin-top:14px;font-size:11px;color:var(--ph-g400);}
.ph-login-custom-el{text-align:center;margin-top:10px;font-size:12px;color:var(--ph-g500);}
a.ph-login-custom-el{display:block;color:var(--ph-blue);text-decoration:underline;}

/* APP */
.ph-app-shell{flex:1;display:none;flex-direction:column;overflow:hidden;min-height:0;}
.ph-app-shell.ph-visible{display:flex;}

/* HEADER */
.ph-hdr{
  background:linear-gradient(135deg,var(--ph-navy) 0%,var(--ph-blue-dk) 55%,var(--ph-blue) 100%);
  height:56px;display:flex !important;align-items:center !important;gap:10px;padding:0 16px;
  box-shadow:var(--ph-sh2);flex-shrink:0;width:100% !important;margin:0 !important;box-sizing:border-box !important;
}
.ph-hdr-logo{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.ph-hdr-logo-box{background:#fff;color:var(--ph-blue);font-weight:900;font-size:15px;letter-spacing:2px;padding:3px 8px;border-radius:4px;}
.ph-hdr-logo-text{color:rgba(255,255,255,.9);font-size:10.5px;line-height:1.25;overflow:hidden;min-width:0;}
.ph-hdr-logo-text strong{display:block;font-size:12px;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ph-hdr-search{flex:1;max-width:440px;position:relative;display:flex;align-items:center;gap:6px;}
.ph-hdr-search input{
  width:100%;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);
  border-radius:18px;padding:6px 12px 6px 30px;color:#fff;font-size:12.5px;outline:none;
  transition:background .2s,border .2s;
}
.ph-hdr-search input:focus{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.5);}
.ph-hdr-search input::placeholder{color:rgba(255,255,255,.5);}
.ph-hdr-search-ic{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:rgba(255,255,255,.55);font-size:14px;pointer-events:none;}
.ph-badge{background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.88);font-size:10px;padding:3px 9px;border-radius:18px;white-space:nowrap;flex-shrink:0;}
.ph-logout-btn{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);color:rgba(255,255,255,.85);border-radius:6px;padding:4px 10px;font-size:11.5px;cursor:pointer;white-space:nowrap;flex-shrink:0;transition:background .15s;}
.ph-logout-btn:hover{background:rgba(255,255,255,.22);}
.ph-switch-catalog-btn{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);color:rgba(255,255,255,.85);border-radius:6px;padding:4px 10px;font-size:11.5px;cursor:pointer;white-space:nowrap;flex-shrink:0;transition:background .15s;}
.ph-switch-catalog-btn:hover{background:rgba(255,255,255,.22);}
.ph-account-menu{position:relative;flex-shrink:0;}
.ph-account-btn{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);color:var(--ph-header-icon,#fff);border-radius:6px;width:32px;height:32px;font-size:19px;line-height:1;cursor:pointer;transition:background .15s;display:flex;align-items:center;justify-content:center;}
.ph-account-btn:hover{background:rgba(255,255,255,.22);}
.ph-account-dropdown{display:none;position:absolute;top:calc(100% + 6px);right:0;background:var(--ph-white);border:1px solid var(--ph-g200);border-radius:8px;box-shadow:var(--ph-sh3);min-width:180px;overflow:hidden;z-index:50;flex-direction:column;}
.ph-account-dropdown.open{display:flex;}
.ph-account-item{background:none;border:none;text-align:left;padding:10px 14px;font-size:13px;color:var(--ph-g900);cursor:pointer;white-space:nowrap;transition:background .12s;}
.ph-account-item:hover{background:var(--ph-g100);}
.ph-account-item + .ph-account-item{border-top:1px solid var(--ph-g200);}

/* LAYOUT */
.ph-layout{flex:1;display:flex;overflow:hidden;min-height:0;}

/* SIDEBAR */
.ph-sb{
  width:248px;min-width:248px;background:var(--ph-white);
  border-right:1px solid var(--ph-g300);display:flex;
  flex-direction:column;overflow:hidden;transition:transform .28s ease;
}
.ph-sb-top{padding:11px 13px 9px;border-bottom:1px solid var(--ph-g200);flex-shrink:0;}
.ph-sb-catalog-switch{padding:11px 13px 9px;border-bottom:1px solid var(--ph-g200);flex-shrink:0;}
.ph-sb-catalog-switch label{font-size:9.5px;font-weight:700;color:var(--ph-g400);letter-spacing:1.2px;text-transform:uppercase;margin-bottom:6px;display:block;}
.ph-sb-catalog-switch select{width:100%;padding:7px 9px;border:1.5px solid var(--ph-g300);border-radius:7px;font-size:13px;color:var(--ph-g900);background:var(--ph-white);cursor:pointer;}
.ph-sb-lbl{font-size:9.5px;font-weight:700;color:var(--ph-g400);letter-spacing:1.2px;text-transform:uppercase;margin-bottom:7px;}
.ph-price-row{display:flex;gap:5px;align-items:center;}
.ph-price-row input{flex:1;min-width:0;border:1px solid var(--ph-g300);border-radius:5px;padding:5px 6px;font-size:11.5px;color:var(--ph-g900);background:var(--ph-g100);outline:none;transition:border .15s;}
.ph-price-row input:focus{border-color:var(--ph-blue);}
.ph-price-row input::placeholder{color:var(--ph-g400);}
.ph-price-sep{color:var(--ph-g400);font-size:11px;flex-shrink:0;}
.ph-clear-btn{background:none;border:none;color:var(--ph-blue);font-size:11px;cursor:pointer;text-decoration:underline;text-align:left;padding:0;margin-top:5px;display:block;}
.ph-sb-tree{overflow-y:auto;flex:1;}
.ph-sb-tree::-webkit-scrollbar{width:3px;}
.ph-sb-tree::-webkit-scrollbar-thumb{background:var(--ph-g300);border-radius:2px;}
.ph-sb-section{border-bottom:1px solid var(--ph-g200);}
.ph-sec-btn{
  width:100%;display:flex;align-items:center;gap:5px;padding:8px 13px;
  background:none;border:none;cursor:pointer;text-align:left;
  font-size:11.5px;font-weight:700;color:var(--ph-g700);transition:background .12s;
}
.ph-sec-btn:hover{background:var(--ph-g100);}
.ph-sec-btn.open{color:var(--ph-blue);}
.ph-sec-arrow{margin-left:auto;font-size:9px;color:var(--ph-g400);transition:transform .2s;}
.ph-sec-btn.open .ph-sec-arrow{transform:rotate(180deg);}
.ph-sec-cnt{background:var(--ph-g200);color:var(--ph-g500);font-size:9px;font-weight:700;padding:1px 6px;border-radius:10px;flex-shrink:0;}
.ph-sec-btn.open .ph-sec-cnt{background:var(--ph-blue);color:#fff;}
.ph-cats{display:none;}
.ph-cats.open{display:block;}
.ph-cat-item,.ph-all-btn{
  display:flex;align-items:center;gap:6px;cursor:pointer;
  border-left:3px solid transparent;transition:background .1s,border-color .1s;user-select:none;
}
.ph-all-btn{padding:6px 13px 6px 20px;}
.ph-cat-item{padding:5px 13px 5px 24px;}
.ph-cat-item:hover,.ph-all-btn:hover{background:var(--ph-blue-pale);}
.ph-cat-item.active,.ph-all-btn.active{background:var(--ph-blue-pale);border-left-color:var(--ph-blue);}
.ph-cat-item.active .ph-cat-name,.ph-all-btn.active .ph-cat-name{color:var(--ph-blue);font-weight:600;}
.ph-cat-name{font-size:11.5px;color:var(--ph-g700);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ph-cat-cnt{font-size:9.5px;font-weight:600;color:var(--ph-g400);background:var(--ph-g200);padding:1px 6px;border-radius:10px;flex-shrink:0;}
.ph-cat-item.active .ph-cat-cnt,.ph-all-btn.active .ph-cat-cnt{background:var(--ph-blue);color:#fff;}

/* MAIN */
.ph-main{flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden;}
.ph-mob-search{padding:9px 11px;background:var(--ph-white);border-bottom:1px solid var(--ph-g200);display:none;position:relative;gap:8px;align-items:center;}
.ph-mob-search input{flex:1;min-width:0;border:1px solid var(--ph-g300);border-radius:7px;padding:7px 11px 7px 30px;font-size:13px;outline:none;background:var(--ph-g100);color:var(--ph-g900);transition:border .15s;}
.ph-mob-search input:focus{border-color:var(--ph-blue);}
.ph-mob-search-ic{position:absolute;left:21px;top:50%;transform:translateY(-50%);color:var(--ph-g400);font-size:14px;}
.ph-filter-toggle{background:var(--ph-g100);border:1px solid var(--ph-g300);color:var(--ph-filter-icon,var(--ph-g700));border-radius:7px;width:34px;height:34px;flex-shrink:0;font-size:14px;cursor:pointer;display:none;align-items:center;justify-content:center;transition:background .15s;}
.ph-filter-toggle:hover{background:var(--ph-g200);}
.ph-hdr-search .ph-filter-toggle{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.22);color:var(--ph-filter-icon,#fff);width:30px;height:30px;}
.ph-hdr-search .ph-filter-toggle:hover{background:rgba(255,255,255,.24);}

/* TOOLBAR */
.ph-toolbar{
  background:var(--ph-white);border-bottom:1px solid var(--ph-g200);
  padding:8px 14px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  box-shadow:var(--ph-sh1);flex-shrink:0;
}
.ph-tb-count{font-size:12.5px;color:var(--ph-g500);}
.ph-tb-count strong{color:var(--ph-blue);font-weight:700;}
.ph-tb-right{margin-left:auto;display:flex;align-items:center;gap:7px;}
.ph-sort-sel{background:var(--ph-white);border:1px solid var(--ph-g300);border-radius:6px;color:var(--ph-g700);padding:4px 8px;font-size:11.5px;outline:none;cursor:pointer;}
.ph-vg{display:flex;border:1px solid var(--ph-g300);border-radius:6px;overflow:hidden;}
.ph-vb{background:var(--ph-white);border:none;color:var(--ph-g400);padding:5px 10px;font-size:13px;cursor:pointer;line-height:1;transition:background .12s,color .12s;}
.ph-vb+.ph-vb{border-left:1px solid var(--ph-g300);}
.ph-vb:hover{background:var(--ph-blue-pale);color:var(--ph-blue);}
.ph-vb.active{background:var(--ph-blue);color:#fff;}

/* PRODUCT AREA */
.ph-pa{flex:1;overflow-y:auto;padding:14px;scroll-behavior:smooth;}
.ph-pa::-webkit-scrollbar{width:5px;}
.ph-pa::-webkit-scrollbar-thumb{background:var(--ph-g300);border-radius:3px;}

/* GRID */
.ph-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:10px;}
.ph-card{
  background:var(--ph-white);border:1px solid var(--ph-g300);
  border-radius:var(--ph-r);cursor:pointer;
  transition:box-shadow .15s,border-color .15s,transform .12s;
  display:flex;flex-direction:column;position:relative;overflow:hidden;
}
.ph-card::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--ph-blue-dk),var(--ph-blue-lt));opacity:0;transition:opacity .18s;}
.ph-card:hover{border-color:var(--ph-blue-lt);box-shadow:var(--ph-sh2);transform:translateY(-1px);}
.ph-card:hover::after{opacity:1;}
.ph-card-img{width:100%;height:140px;object-fit:contain;background:var(--ph-g100);border-bottom:1px solid var(--ph-g200);}
.ph-card-img-placeholder{width:100%;height:100px;display:flex;align-items:center;justify-content:center;background:var(--ph-g100);color:var(--ph-g300);font-size:32px;border-bottom:1px solid var(--ph-g200);}
.ph-card-body{padding:12px 13px;display:flex;flex-direction:column;gap:4px;flex:1;}
.ph-c-sec{font-size:9px;font-weight:700;color:var(--ph-orange);letter-spacing:1px;text-transform:uppercase;}
.ph-c-cat{font-size:9.5px;font-weight:700;color:var(--ph-blue);letter-spacing:.6px;text-transform:uppercase;}
.ph-c-ref{font-size:12.5px;font-weight:700;color:var(--ph-g900);font-family:'SFMono-Regular','Consolas',monospace;word-break:break-all;}
.ph-c-table{font-size:10px;color:var(--ph-g500);font-style:italic;}
.ph-c-hdrs{font-size:9.5px;color:var(--ph-g400);line-height:1.35;}
.ph-c-desc{font-size:11.5px;color:var(--ph-g700);line-height:1.45;flex:1;}
.ph-c-foot{display:flex;justify-content:space-between;align-items:flex-end;margin-top:6px;gap:6px;}
.ph-c-code{font-size:9.5px;color:var(--ph-g400);font-family:monospace;}
.ph-c-price{font-size:15px;font-weight:800;color:var(--ph-blue);white-space:nowrap;}
.ph-c-price small{font-size:9px;font-weight:500;color:var(--ph-g400);margin-left:2px;}

/* LIST TABLE */
.ph-ltbl{width:100%;border-collapse:collapse;background:var(--ph-white);border-radius:var(--ph-r);overflow:hidden;box-shadow:var(--ph-sh1);border:1px solid var(--ph-g300);}
.ph-ltbl thead th{background:var(--ph-navy);color:rgba(255,255,255,.82);font-size:9.5px;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:9px 10px;text-align:left;white-space:nowrap;}
.ph-ltbl thead th:last-child{text-align:right;}
.ph-ltbl tbody tr{border-bottom:1px solid var(--ph-g200);cursor:pointer;transition:background .1s;}
.ph-ltbl tbody tr:last-child{border-bottom:none;}
.ph-ltbl tbody tr:hover{background:var(--ph-blue-pale);}
.ph-ltbl td{padding:7px 10px;vertical-align:middle;font-size:12px;}
.ph-td-img img{width:40px;height:35px;object-fit:contain;border:1px solid var(--ph-g200);border-radius:3px;display:block;}
.ph-td-ref{font-family:monospace;font-weight:700;max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ph-td-cat{color:var(--ph-g500);font-size:11px;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ph-td-desc{color:var(--ph-g700);max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ph-td-code{color:var(--ph-g400);font-family:monospace;font-size:10.5px;white-space:nowrap;}
.ph-td-price{font-weight:800;color:var(--ph-blue);text-align:right;white-space:nowrap;font-size:12.5px;}

/* OVERVIEW */
.ph-ovgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:11px;}
.ph-ovc{background:var(--ph-white);border:1px solid var(--ph-g300);border-radius:var(--ph-r);padding:14px;cursor:pointer;transition:box-shadow .15s,border-color .15s;}
.ph-ovc:hover{border-color:var(--ph-blue);box-shadow:var(--ph-sh2);}
.ph-ov-sec{font-size:9px;font-weight:700;color:var(--ph-orange);text-transform:uppercase;letter-spacing:.8px;margin-bottom:3px;}
.ph-ov-hdr{display:flex;justify-content:space-between;align-items:flex-start;gap:5px;margin-bottom:9px;}
.ph-ov-name{font-size:12.5px;font-weight:700;color:var(--ph-g900);flex:1;}
.ph-ov-bdg{background:var(--ph-blue);color:#fff;font-size:9.5px;font-weight:700;padding:2px 8px;border-radius:10px;white-space:nowrap;flex-shrink:0;}
.ph-ov-stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px;margin-bottom:9px;}
.ph-ov-stat{background:var(--ph-g100);border:1px solid var(--ph-g200);border-radius:5px;padding:5px 7px;}
.ph-ov-sl{font-size:8.5px;font-weight:700;color:var(--ph-g400);letter-spacing:.7px;text-transform:uppercase;margin-bottom:1px;}
.ph-ov-sv{font-size:11px;font-weight:700;color:var(--ph-g900);}
.ph-ov-sv.g{color:var(--ph-green);}
.ph-ov-sv.o{color:var(--ph-orange);}
.ph-ov-bar{height:3px;background:var(--ph-g200);border-radius:2px;overflow:hidden;}
.ph-ov-fill{height:100%;border-radius:2px;background:linear-gradient(90deg,var(--ph-blue-dk),var(--ph-blue-lt));}

/* EMPTY */
.ph-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:50px 20px;text-align:center;color:var(--ph-g400);}
.ph-empty-ic{font-size:40px;opacity:.4;margin-bottom:10px;}
.ph-empty h3{font-size:14px;color:var(--ph-g500);margin-bottom:4px;}

/* PAGINATION */
.ph-pgn{background:var(--ph-white);border-top:1px solid var(--ph-g200);padding:9px 14px;display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap;flex-shrink:0;}
.ph-pgn-pages{display:flex;align-items:center;gap:4px;flex-wrap:wrap;}
.ph-pgn-size{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ph-g500);white-space:nowrap;}
.ph-pgn-size select{padding:4px 7px;border:1.5px solid var(--ph-g300);border-radius:6px;font-size:12.5px;color:var(--ph-g900);background:var(--ph-white);cursor:pointer;}
.ph-pg{background:var(--ph-white);border:1px solid var(--ph-g300);color:var(--ph-g700);padding:4px 10px;border-radius:6px;font-size:11.5px;cursor:pointer;transition:all .12s;line-height:1.4;}
.ph-pg:hover{background:var(--ph-blue-pale);border-color:var(--ph-blue);color:var(--ph-blue);}
.ph-pg.active{background:var(--ph-blue);border-color:var(--ph-blue);color:#fff;font-weight:700;}
.ph-pg:disabled{opacity:.3;pointer-events:none;}
.ph-pg-sep{font-size:12px;color:var(--ph-g400);padding:0 2px;}

/* MODAL */
.ph-moverlay{
  position:fixed;inset:0;background:rgba(0,48,87,.52);backdrop-filter:blur(5px);
  z-index:99999;display:flex;align-items:center;justify-content:center;padding:16px;
  opacity:0;pointer-events:none;transition:opacity .2s;
}
.ph-moverlay.open{opacity:1;pointer-events:all;}
.ph-modal{
  background:var(--ph-white);border-radius:12px;box-shadow:var(--ph-sh3);
  width:100%;max-width:560px;max-height:90vh;overflow-y:auto;
  transform:scale(.95) translateY(6px);transition:transform .22s ease;position:relative;
}
.ph-moverlay.open .ph-modal{transform:scale(1) translateY(0);}
.ph-m-top{background:linear-gradient(135deg,var(--ph-navy),var(--ph-blue));padding:16px 18px 13px;border-radius:12px 12px 0 0;}
.ph-m-sec{font-size:9px;font-weight:700;color:rgba(255,255,255,.6);letter-spacing:1.2px;text-transform:uppercase;margin-bottom:2px;}
.ph-m-cat{font-size:10px;font-weight:700;color:rgba(255,255,255,.75);letter-spacing:.8px;text-transform:uppercase;margin-bottom:4px;}
.ph-m-ref{font-size:16px;font-weight:800;font-family:monospace;color:#fff;word-break:break-all;padding-right:36px;line-height:1.3;}
.ph-m-close{position:absolute;top:13px;right:13px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.25);color:#fff;width:28px;height:28px;border-radius:50%;font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s;}
.ph-m-close:hover{background:rgba(255,255,255,.28);}
.ph-m-body{padding:16px 18px 18px;}
.ph-m-img-area{position:relative;margin-bottom:14px;}
.ph-m-img-wrap{width:100%;height:200px;display:flex;align-items:center;justify-content:center;background:var(--ph-g100);border:1px solid var(--ph-g200);border-radius:8px;overflow:hidden;}
.ph-m-img-wrap img{max-width:100%;max-height:100%;object-fit:contain;cursor:zoom-in;transition:transform .2s;}
.ph-m-img-wrap img:hover{transform:scale(1.03);}
.ph-m-img-placeholder{font-size:48px;color:var(--ph-g300);}
.ph-m-img-actions{position:absolute;top:8px;right:8px;display:flex;flex-direction:column;gap:6px;}
.ph-img-btn{width:34px;height:34px;border-radius:50%;border:none;background:rgba(0,48,87,.55);color:#fff;font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(3px);transition:background .15s,transform .15s;}
.ph-img-btn:hover{background:var(--ph-blue);transform:scale(1.08);}

/* LIGHTBOX */
.ph-lightbox{position:fixed;inset:0;z-index:100000;background:rgba(8,18,30,.92);display:none;align-items:center;justify-content:center;}
.ph-lightbox.open{display:flex;}
.ph-lb-stage{width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none;}
.ph-lb-img{max-width:92vw;max-height:88vh;object-fit:contain;transform-origin:center center;will-change:transform;cursor:zoom-in;user-select:none;-webkit-user-drag:none;}
.ph-lb-close{position:absolute;top:16px;right:18px;width:40px;height:40px;border-radius:50%;border:none;background:rgba(255,255,255,.15);color:#fff;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s;z-index:2;}
.ph-lb-close:hover{background:rgba(255,255,255,.3);}
.ph-lb-controls{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;background:rgba(0,0,0,.45);padding:8px 14px;border-radius:30px;backdrop-filter:blur(4px);z-index:2;}
.ph-lb-btn{width:34px;height:34px;border-radius:50%;border:none;background:rgba(255,255,255,.18);color:#fff;font-size:17px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s;}
.ph-lb-btn:hover{background:rgba(255,255,255,.35);}
.ph-lb-zoom{color:#fff;font-size:13px;font-weight:600;min-width:48px;text-align:center;}
.ph-lb-hint{position:absolute;top:18px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.7);font-size:12px;background:rgba(0,0,0,.4);padding:5px 14px;border-radius:20px;z-index:2;}

/* SHARE TOAST */
.ph-share-toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ph-navy);color:#fff;padding:11px 22px;border-radius:30px;font-size:13px;font-weight:600;box-shadow:0 6px 24px rgba(0,0,0,.3);z-index:100001;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;}
.ph-share-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* PUBLIC FICHA (no login) */
.ph-public-wrap{flex:1;display:flex;align-items:flex-start;justify-content:center;background:linear-gradient(145deg,var(--ph-navy) 0%,var(--ph-blue-dk) 55%,var(--ph-blue) 100%);padding:30px 16px;overflow-y:auto;min-height:100%;}
.ph-public-card{background:var(--ph-white);border-radius:14px;box-shadow:0 16px 50px rgba(0,0,0,.3);width:100%;max-width:520px;overflow:hidden;animation:phLoginIn .32s ease;}
.ph-public-loading{padding:60px 24px;text-align:center;color:var(--ph-g500);font-size:14px;}
.ph-public-top{background:linear-gradient(135deg,var(--ph-navy),var(--ph-blue));padding:18px 22px 16px;}
.ph-public-logo{display:inline-block;background:#fff;color:var(--ph-blue);font-weight:900;font-size:16px;letter-spacing:2px;padding:3px 9px;border-radius:4px;margin-bottom:10px;}
.ph-public-sec{font-size:10px;font-weight:700;color:rgba(255,255,255,.65);letter-spacing:1.2px;text-transform:uppercase;margin-bottom:3px;}
.ph-public-ref{font-size:18px;font-weight:800;font-family:var(--ph-font-mono,'SFMono-Regular','Consolas',monospace);color:#fff;word-break:break-all;line-height:1.3;}
.ph-public-body{padding:18px 20px 20px;}
.ph-public-img-wrap{width:100%;height:220px;display:flex;align-items:center;justify-content:center;background:var(--ph-g100);border:1px solid var(--ph-g200);border-radius:8px;overflow:hidden;}
.ph-public-img{max-width:100%;max-height:100%;object-fit:contain;transition:transform .2s;}
.ph-public-img:hover{transform:scale(1.03);}
.ph-public-img-ph{font-size:48px;color:var(--ph-g300);}
.ph-public-foot{margin-top:16px;}
.ph-public-foot .ph-btn-p{width:100%;}
.ph-public-note{margin-top:14px;text-align:center;font-size:11.5px;color:var(--ph-g400);line-height:1.5;}
.ph-m-price-row{display:flex;align-items:baseline;gap:7px;margin-bottom:4px;}
.ph-m-price{font-size:28px;font-weight:900;color:var(--ph-blue);letter-spacing:-.5px;}
.ph-m-pnote{font-size:10.5px;color:var(--ph-g400);}
.ph-m-box{border-left:3px solid var(--ph-g300);background:var(--ph-g100);border-radius:0 5px 5px 0;padding:8px 11px;margin-bottom:10px;}
.ph-m-box.accent{border-left-color:var(--ph-orange);}
.ph-m-box.blue{border-left-color:var(--ph-blue);background:var(--ph-blue-pale);}
.ph-m-bl{font-size:9px;font-weight:700;color:var(--ph-g400);letter-spacing:1px;text-transform:uppercase;margin-bottom:3px;}
.ph-m-bt{font-size:12px;color:var(--ph-g700);line-height:1.45;word-break:break-word;overflow-wrap:break-word;}
.ph-m-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:14px;}
.ph-m-field{background:var(--ph-g100);border:1px solid var(--ph-g200);border-radius:6px;padding:8px 11px;}
.ph-m-fl{font-size:9px;font-weight:700;color:var(--ph-g400);letter-spacing:.8px;text-transform:uppercase;margin-bottom:2px;}
.ph-m-fv{font-size:12.5px;font-weight:600;color:var(--ph-g900);}
.ph-m-acts{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;}
.ph-m-acts>button{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ph-btn-p{flex:1;background:var(--ph-blue);border:none;color:#fff;padding:9px 14px;border-radius:7px;font-size:12.5px;font-weight:600;cursor:pointer;transition:background .15s;}
.ph-btn-p:hover{background:var(--ph-blue-dk);}
.ph-btn-s{background:var(--ph-g100);border:1px solid var(--ph-g300);color:var(--ph-g700);padding:9px 13px;border-radius:7px;font-size:12.5px;font-weight:500;cursor:pointer;white-space:nowrap;transition:all .15s;}

/* Links box: distributed in responsive columns, same idea as the header's
   column layout — items wrap into as many columns as fit. */
.ph-links-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin-top:4px;}
.ph-link-btn{
  display:flex;align-items:center;justify-content:center;gap:7px;
  background:var(--ph-g100);border:1px solid var(--ph-g300);color:var(--ph-g700);
  padding:9px 12px;border-radius:7px;font-size:12.5px;font-weight:500;
  text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  transition:all .15s;
}
.ph-link-btn:hover{border-color:var(--ph-blue);color:var(--ph-blue);background:var(--ph-blue-pale);}
.ph-link-btn i{font-size:13px;flex-shrink:0;}
.ph-link-btn span{overflow:hidden;text-overflow:ellipsis;}
.ph-btn-s:hover{border-color:var(--ph-blue);color:var(--ph-blue);}

/* OVERLAY sidebar mobile */
.ph-sb-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:99997;}
.ph-sb-overlay.open{display:block;}

/* RESPONSIVE */
@media(max-width:768px){
  .ph-hide-mobile{display:none !important;}
  .ph-filter-toggle{display:flex;}
  .ph-sb{position:fixed;top:0;left:0;bottom:0;z-index:99998;width:280px;transform:translateX(-100%);box-shadow:var(--ph-sh3);transition:transform .28s ease;padding-top:14px !important;}
  .ph-sb.open{transform:translateX(0);}
  .ph-badge{display:none;}
  .ph-hdr{flex-wrap:wrap;height:auto;min-height:56px;padding:9px 12px;row-gap:8px;}
  .ph-hcol:has(.ph-hdr-search){flex-basis:100%;order:5;}
  .ph-hdr-search{max-width:none;}
  .ph-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:9px;}
  .ph-pa{padding:11px;}
  .ph-ltbl .ph-td-desc{display:none;}
  .ph-moverlay{padding:0;align-items:flex-end;}
  .ph-modal{border-radius:0;max-height:92vh;max-width:100%;}
  .ph-m-top{border-radius:0;padding-top:28px;}
  .ph-ovgrid{grid-template-columns:1fr 1fr;gap:9px;}
}
@media(max-width:480px){
  .ph-mob-search{display:flex;}
  .ph-hdr-search{display:none;}
  .ph-hcol:has(.ph-hdr-search){display:none;}
  .ph-powered{max-width:96px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .ph-hdr-logo-text{max-width:130px;overflow:hidden;text-overflow:ellipsis;}
  .ph-public-wrap{padding-top:56px !important;}
  .ph-sb{padding-top:44px !important;}
  .ph-grid{grid-template-columns:1fr;}
  .ph-ovgrid{grid-template-columns:1fr;}
  .ph-m-grid{grid-template-columns:1fr;}
  .ph-ov-stats{grid-template-columns:1fr 1fr;}
}

/* ── HEADER COLUMNS (v1.9.0) ─────────────────── */
.ph-hcol{min-width:0;}
.ph-hcol .ph-hdr-search{width:100%;}
.ph-powered{font-size:11px;color:rgba(255,255,255,.8);text-decoration:none;background:rgba(255,255,255,.12);padding:5px 10px;border-radius:14px;white-space:nowrap;transition:background .15s;}
.ph-hdr-custom-el{font-size:11.5px;color:rgba(255,255,255,.85);text-decoration:none;background:rgba(255,255,255,.12);padding:4px 10px;border-radius:6px;white-space:nowrap;transition:background .15s;}
.ph-hdr-custom-el:hover{background:rgba(255,255,255,.22);}
a.ph-powered:hover{background:rgba(255,255,255,.25);}

/* ── PRICE RANGE SLIDER (v1.9.0) ─────────────── */
.ph-slider{position:relative;height:30px;margin:6px 2px 12px;}
.ph-slider-track{position:absolute;top:13px;left:0;right:0;height:4px;background:var(--ph-g300);border-radius:3px;}
.ph-slider-range{position:absolute;top:13px;height:4px;background:var(--ph-blue);border-radius:3px;left:0;width:100%;}
.ph-slider-input{position:absolute;top:6px;left:0;width:100%;height:18px;margin:0;background:none;pointer-events:none;-webkit-appearance:none;appearance:none;}
.ph-slider-input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid var(--ph-blue);box-shadow:0 1px 4px rgba(0,0,0,.25);cursor:grab;pointer-events:auto;}
.ph-slider-input::-webkit-slider-thumb:active{cursor:grabbing;}
.ph-slider-input::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid var(--ph-blue);box-shadow:0 1px 4px rgba(0,0,0,.25);cursor:grab;pointer-events:auto;}
.ph-slider-input:focus{outline:none;}