/* QUINCA+ v9 — catalogue produits selon la maquette */

.pc-wrap{max-width:1180px}
.pc-topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:10px
}
.pc-title-group{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
  flex:1
}
.pc-title-group h1{
  margin:0;
  font-size:23px;
  letter-spacing:-.035em;
  white-space:nowrap
}
.pc-searchbox{
  position:relative;
  width:min(360px,100%);
  flex:0 1 360px
}
.pc-searchbox span{
  position:absolute;
  left:10px;
  top:50%;
  transform:translateY(-50%);
  color:#7c90a9;
  font-size:12px
}
.pc-searchbox input{
  width:100%;
  height:34px;
  padding:0 10px 0 30px;
  border:1px solid #d9e3ed;
  background:#f7fafd;
  border-radius:7px;
  outline:none;
  color:var(--ink);
  font-size:10px
}
.pc-searchbox input:focus{
  border-color:#84baff;
  background:#fff;
  box-shadow:0 0 0 3px rgba(8,120,249,.08)
}
.pc-new-btn{
  white-space:nowrap;
  height:34px;
  padding:0 14px;
  font-size:10px;
  border-radius:6px
}

.pc-filterbar{
  display:flex;
  gap:8px;
  align-items:center;
  margin-bottom:7px
}
.pc-filter{
  min-width:112px;
  height:32px;
  border:1px solid #d8e2ec;
  border-radius:6px;
  background:#fff;
  color:var(--ink);
  padding:0 28px 0 9px;
  font-size:9.5px;
  outline:none
}
.pc-filter:hover{border-color:#aac6e7}
.pc-filter:focus{
  border-color:#7bb4f7;
  box-shadow:0 0 0 3px rgba(8,120,249,.07)
}

.pc-table-card{
  background:#fff;
  border:1px solid #dfe7ef;
  border-radius:7px;
  overflow:hidden;
  box-shadow:0 3px 10px rgba(26,54,88,.035)
}
.pc-table-scroll{overflow:auto}
.pc-table{
  width:100%;
  min-width:760px;
  border-collapse:collapse;
  table-layout:auto
}
.pc-table thead th{
  height:30px;
  background:#edf2f7;
  color:#536980;
  border-bottom:1px solid #dce5ee;
  padding:0 9px;
  text-align:left;
  font-size:8.5px;
  font-weight:800;
  letter-spacing:0
}
.pc-table tbody td{
  height:42px;
  padding:4px 9px;
  border-bottom:1px solid #e7edf3;
  background:#fff;
  font-size:9.3px;
  color:#1a2e47;
  vertical-align:middle
}
.pc-table tbody tr:last-child td{border-bottom:0}
.pc-table tbody tr{transition:background .12s ease}
.pc-table tbody tr:hover td{background:#f5f9fe}
.pc-clickable{cursor:pointer}
.pc-clickable:hover td{background:#f2f8ff!important}
.pc-clickable:hover .pc-name strong{color:#0878f9}

.pc-thumb{
  width:32px;
  height:32px;
  border-radius:5px;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:#f3f6f9
}
.pc-thumb img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  background:white
}
.pc-noimg{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  font-size:19px;
  background:linear-gradient(145deg,#fafcff,#eef3f7)
}
.pc-code{
  font-weight:760;
  color:#35516f!important;
  font-size:8.8px!important
}
.pc-name strong{
  display:block;
  font-size:9.7px;
  color:#142941;
  line-height:1.18
}
.pc-name small{
  display:block;
  color:#7c8da0;
  font-size:7.8px;
  margin-top:2px
}
.pc-price{
  white-space:nowrap;
  font-weight:780
}
.pc-stock{
  font-weight:780;
  text-align:center
}
.pc-status{
  display:inline-block;
  padding:4px 7px;
  border-radius:999px;
  font-size:8px;
  font-weight:850;
  white-space:nowrap
}
.pc-status.ok{background:#dff7e9;color:#17945f}
.pc-status.warn{background:#fff0c8;color:#b47400}
.pc-status.bad{background:#ffe1e5;color:#c93c49}

.pc-footer{
  min-height:38px;
  padding:6px 9px 6px 12px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  border-top:1px solid #e3eaf1;
  background:#fbfdff
}
.pc-footer>span{
  color:#6e8095;
  font-size:8.5px
}
.pc-pagination{
  display:flex;
  align-items:center;
  gap:4px
}
.pc-page-btn{
  min-width:26px;
  height:26px;
  padding:0 6px;
  border:1px solid #dde6ef;
  background:#fff;
  color:#526982;
  border-radius:5px;
  font-size:8.5px;
  font-weight:760;
  cursor:pointer;
  transition:.12s ease
}
.pc-page-btn:hover:not(:disabled){
  border-color:#83b9f4;
  color:#0878f9;
  background:#f3f8ff
}
.pc-page-btn.active{
  color:#fff;
  border-color:#0878f9;
  background:#0878f9;
  box-shadow:0 3px 9px rgba(8,120,249,.18)
}
.pc-page-btn:disabled{
  opacity:.4;
  cursor:not-allowed
}
.pc-empty{
  padding:32px 10px;
  text-align:center;
  color:#7e8fa3
}
.pc-hint{
  padding:8px 2px 0;
  color:#8292a5;
  font-size:8.5px
}

body.dark-ui .pc-table-card,
body.dark-ui .pc-table tbody td,
body.dark-ui .pc-filter,
body.dark-ui .pc-searchbox input,
body.dark-ui .pc-page-btn{
  background:#101d2f;
  color:var(--ink)
}
body.dark-ui .pc-table thead th{background:#17263a;color:#afc0d5}
body.dark-ui .pc-footer{background:#111f31}
body.dark-ui .pc-table tbody tr:hover td,
body.dark-ui .pc-clickable:hover td{background:#16283f!important}

@media(max-width:760px){
  .pc-topline{align-items:flex-start}
  .pc-title-group{display:block}
  .pc-title-group h1{margin-bottom:8px}
  .pc-searchbox{width:100%;max-width:420px}
  .pc-filterbar{overflow:auto;padding-bottom:2px}
  .pc-filter{flex:0 0 112px}
  .pc-footer{align-items:flex-start;flex-direction:column}
}
@media(max-width:520px){
  .pc-topline{display:grid;grid-template-columns:1fr auto}
  .pc-title-group{min-width:0}
  .pc-title-group h1{font-size:20px}
  .pc-new-btn{align-self:start}
  .pc-searchbox{grid-column:1/-1}
}