:root {
--background-color:#f8fafc;
--bg-color:#fff;
--border-color:#e2e8f0;
--card-background:#ffffff;
--danger-color:#dc2626;
--primary-color:#2D7FF9;
--primary-hover:#1d4ed8;
--radius-lg:.75rem;
--radius-md:.5rem;
--radius-sm:.375rem;
--secondary-color:#64748b;
--shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.1),0 4px 6px -4px rgb(0 0 0 / 0.1);
--shadow-md:0 4px 6px -1px rgb(0 0 0 / 0.1),0 2px 4px -2px rgb(0 0 0 / 0.1);
--shadow-sm:0 1px 2px 0 rgb(0 0 0 / 0.05);
--success-color:#059669;
--tab-bg:#e9eff5;
--text-primary:#1e293b;
--text-secondary:#64748b;
--transition:all .2s cubic-bezier(0.4,0,0.2,1);
--warning-color:#d97706
}

* {
box-sizing:border-box;
margin:0;
padding:0
}

@media (prefers-reduced-motion: reduce) {
* {
animation-duration:.01ms!important;
animation-iteration-count:1!important;
transition-duration:.01ms!important
}
}

html {
background:url(imagesCss/bodybg.gif) repeat scroll 0 0
}

body {
background:url(imagesCss/bodybg.GIF);
font-family:'Segoe UI',sans-serif;
line-height:1.6;
margin:0;
padding:20px
}

font {
font-family:Verdana,Arial,Helvetica,sans-serif
}

p {
color:#000000;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:12px;
line-height:1.5em;
margin:0 0 10px;
padding:0
}

.ombrage {
box-shadow:0 0 8px 1px #dadada
}

a {
font-weight:normal;
text-decoration:none
}

a:link {
color:#cc6600;
font-family:Verdana;
font-weight:bold;
text-decoration:none
}

a:visited {
color:#cc6600;
font-size:12px;
font-weight:bold
}

a:hover {
color:#cc6600;
font-weight:bold;
text-decoration:underline
}

.flexspacebetween {
align-items:center;
display:flex;
flex-direction:row;
justify-content:space-between
}

#titresite img,#titresite p {
margin:0;
padding:0
}

img {
border:none;
max-width:100%
}

#chemindefer {
font-size:1.2em
}

.homepagemainproduct img {
border:none;
width:100%
}

.Main_Cat_Description {
border-radius:8px;
box-shadow:0 0 8px rgba(0,0,0,0.1);
box-sizing:border-box;
display:flex;
flex-wrap:wrap;
gap:5px;
justify-content:flex-start;
margin:auto;
margin:10px;
max-width:1300px;
padding:10px;
transition:transform .3s ease
}

.Main_Cat_Description:hover {
transform:scale(1.03)
}

.Main_Cat_Description h1 {
font-size:2em
}

#cssmenu {
background:#39b1cc;
background:-moz-linear-gradient(top,#2071D4 0%,#054591 100%);
background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#2071D4),color-stop(100%,#054591));
background:-webkit-linear-gradient(top,#2071D4 0%,#054591 100%);
background:-o-linear-gradient(top,#2071D4 0%,#054591 100%);
background:-ms-linear-gradient(top,#2071D4 0%,#054591 100%);
background:linear-gradient(to bottom,#2071D4 0%,#054591 100%);
font-family:'Open Sans',Helvetica,sans-serif;
width:auto
}

#cssmenu ul ul li a {
background:#ffffff;
box-shadow:0 2px 2px rgba(0,0,0,0.1),1px 1px 1px rgba(0,0,0,0.1),-1px 1px 1px rgba(0,0,0,0.1);
color:#777777;
font-weight:400;
padding:11px 15px;
text-decoration:none;
width:250px
}

#menu {
border-radius:8px;
margin:25px 0 0;
padding:10px
}

#menu ul {
font-family:Verdana;
font-size:.8em;
list-style-type:none;
margin-left:5px;
margin-right:5px;
margin-top:0;
padding-left:0;
text-align:left;
text-indent:10px
}

#menu a {
border:1px solid #00446A;
color:#FFFFFF;
display:block;
font-family:Verdana;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:12px;
font-weight:bold;
margin-top:2px;
padding:3px;
text-decoration:none
}

#menu a:active {
background-color:#FFFFCC;
border:1px solid #F77C07;
color:#FF0000;
display:block;
margin-top:2px;
padding:3px;
text-decoration:none
}

#navmenu a:visited {
color:#FFFFFF;
text-decoration:none
}

#navmenu a:hover {
border:1px solid #A29DFB;
color:#FF0000
}

#navmenu {
margin:0 auto;
position:relative;
z-index:8
}

.menuh {
color:#FFFFFF;
font-size:1em
}

.menuhover {
background:#80316d;
color:#FFFFFF;
font-size:1em
}

.menuh a:hover,.menuh a:link,.menuh a:visited {
color:#FFFFFF;
font-size:1em;
text-decoration:none
}

.menumouseoverh {
background:#7F6377;
font-size:1em
}

.menumouseouth {
color:#ff0000
}

#maincontent {
color:#000000;
flex:1;
font-size:initial;
min-width:0;
order:2;
padding:5px
}

#news {
color:#000000;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:1em;
text-align:left;
z-index:8
}

#news img {
height:auto;
margin:0 0 10px;
width:100%
}

#footer {
  color: #f1f5f9;
  margin-top: 80px;
  box-shadow: 0 -6px 24px rgba(51, 65, 85, 0.2);
  border-top: 1px solid #334155;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 5rem;
  padding: 6rem;
  position: relative;
}
#footer::after {
  display: none;
}

#footer > *:not(.footer-column) {
    grid-column: 1 / -1;
}
#footer::before {
  content: '';
  position: absolute;
  top: -20px;
  left: 0;
  right: 0;
  height: 20px;
  background: linear-gradient(to bottom, rgba(255,255,255,0.05), transparent);
  pointer-events: none;
}


#footer ul {
list-style:none;
margin:16px 0;
padding:0
}

#footer ul li {
color:#cbd5e1;
font-size:15px;
line-height:2;
padding:10px 0;
padding-left:28px;
position:relative;
transition:all .3s ease
}

#footer ul li::before {
color:#ffd814;
content:'◆';
font-size:14px;
font-weight:900;
left:0;
position:absolute;
text-shadow:0 0 10px rgba(255,216,20,0.8)
}

#footer ul li:hover {
color:#ffffff;
padding-left:32px
}

#footer a {
color:#ffd814;
font-weight:700;
position:relative;
text-decoration:none;
text-shadow:0 0 8px rgba(255,216,20,0.5);
transition:all .3s ease
}

#footer > :not(.footer-column) {
grid-column:1 / -1
}

.login_btn {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 10;
}




.footer-column h1 {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0 0 1rem 0;
    color:var(--card-background);
}

.footer-column p {
    margin: 0 0 1rem 0;
    line-height: 1.6;
    color: #666;
}

.footer-column ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-column ul li {
    margin-bottom: 0.5rem;
}

.footer-column a {
    color: #0066cc;
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-column a:hover {
    color: #004499;
    text-decoration: underline;
}
.titrepage,h1 {
font-family:Verdana;
font-size:14pt;
font-weight:bold
}

@media (max-width: 768px) {
#footer {
gap:2rem;
grid-template-columns:1fr;
padding:3rem 1.5rem 1.5rem
}

.login_btn {
right:.5rem;
top:.5rem;
z-index: 10;
}

.login_btn a {
height:35px;
line-height:35px;
width:35px
}
}

@media (max-width: 480px) {
#footer {
padding:3rem 1rem 1rem
}

.footer-column h1 {
font-size:1.1rem
}
}

@keyframes fadeInFooter {
from {
opacity:0;
transform:translateY(40px)
}

to {
opacity:1;
transform:translateY(0)
}
}

@keyframes glow {
0%,100% {
text-shadow:0 0 8px rgba(255,216,20,0.5)
}

50% {
text-shadow:0 0 16px rgba(255,216,20,0.9),0 0 24px rgba(255,216,20,0.6)
}
}

#footer a:hover {
animation:glow 2s ease-in-out infinite
}

#homepagemainproduct::before {
content:'';
height:6px;
left:0;
position:absolute;
right:0;
top:0
}

#homepagemainproduct a:hover .homepagemainproduct_img {
transform:scale(1.05) rotate(1deg)
}

#homepagemainproduct .categories h2 {
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);
background-clip:text;
color:#1a202c;
font-size:24px;
font-weight:800;
line-height:1;
margin:0 0 20px
}

#homepagemainproduct a {
color:#4a5568;
display:block;
font-size:16px;
line-height:1.7;
margin-bottom:20px;
text-decoration:none;
transition:color .3s ease
}

#homepagemainproduct a:hover {
color:#667eea
}

#ptitle {
background:#3C6FB1;
color:#FFFFFF;
font-size:14pt;
padding:5px;
text-align:center
}

.pprice {
color:#FF6633;
font-size:2em;
margin-right:10px
}

.ppricesmall {
color:#b91c1c;
font-size:20px;
font-weight:800;
letter-spacing:-.5px
}

.prixbarre {
color:#a0aec0;
font-size:22px;
font-weight:600;
text-decoration:line-through
}

.prixpromo {
color:#000000;
font-size:2em;
text-decoration:line-through
}

.maincatproduct {
color:#000000;
font-size:1em;
font-weight:bold;
padding:2px;
text-align:center;
text-transform:uppercase
}

.productref {
color:#000000;
text-align:left
}

.pannier_contenu_items {
display:flex;
gap:10px
}

.cart-image {
margin-right:20px;
padding:4px;
width:150px
}

.separator {
clear:both;
height:10px
}

.sptitle {
background:#3C6FB1;
color:#FFFFFF;
font-size:12px;
text-align:left
}

.sptitle a {
color:#FFFFff
}

.sptable {
border:#336699 solid 1px
}

.autresreferences {
background:#FFCC00;
color:#FF0000;
padding-right:10px
}

.produitautresreferences {
border-bottom:#FFCC00 solid 1px
}

.afficheprix {
background:url(imagescatalogue/Prix_Normal.gif) no-repeat;
color:#FFFFFF;
font-size:1.5em;
font-weight:bold;
height:64px;
margin:20px 10px 0;
padding-top:20px;
position:absolute;
text-align:center;
width:79px
}

@keyframes clignoter {
50% {
opacity:0
}

0%,100% {
opacity:1
}
}

.affichepromo,.affichepromo2 {
align-items:center;
animation:pulse-badge 2s ease-in-out infinite;
background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);
border-radius:12px;
box-shadow:0 4px 16px rgba(239,68,68,0.4);
color:white;
display:inline-flex;
font-size:18px;
font-weight:900;
justify-content:center;
margin-left:20px;
padding:10px 20px
}

.affichepromo2 {
font-size:22px;
padding:12px 24px
}

@keyframes pulse-badge {
0%,100% {
transform:scale(1)
}

50% {
transform:scale(1.05)
}
}

@keyframes bounce {
0%,100% {
transform:translateY(0)
}

50% {
transform:translateY(-5px)
}
}

.admh1 {
background:#336699 url(images/AdmTop.gif);
color:#000000;
display:block;
font-size:larger;
text-indent:15px;
width:100%
}

.adminpopup {
background:url(images/AdmBackground.gif);
font-size:14pt;
margin-left:15px
}

.admclosebtn {
position:absolute;
right:5px;
text-align:right;
top:5px
}

.homepagesubtable {
border:#C0C0C0 solid 1px;
color:#000000;
height:300px
}

.searchup {
background:#2B5685;
border-bottom:#000000 solid 1px;
border-top:#000000 solid 1px;
color:#FFFFFF;
font-size:14pt;
font-weight:bold;
height:30px;
margin-left:15px;
text-align:left;
text-indent:10px
}

.searchunder {
background:#FFDD00;
border-bottom:#000000 solid 1px;
border-top:#000000 solid 1px;
height:70px;
margin-left:15px;
text-align:left;
text-indent:10px
}

.results {
background:#2B5685;
border-bottom:#000000 solid 1px;
border-top:#000000 solid 1px;
color:#FFFFFF;
font-size:12px;
font-weight:bold;
height:20px;
text-align:left
}

.surligne {
background:#FFFF00
}

.resulttable {
border-bottom:#336699 solid 1px;
border-left:#336699 solid 1px;
border-right:#336699 solid 1px;
border-top:#336699 solid 1px;
text-align:left
}

.searchprice {
color:#FF0000;
font-size:1.5em;
font-weight:bold;
text-align:center
}

.uploadiframe {
border:#ffffff solid 1px;
text-align:left
}

#bookmark {
background:url(imagescatalogue/Bookmark_bg.jpg) no-repeat;
color:#FFFFFF;
font-size:10px;
height:22px;
padding-top:2px;
text-align:center;
width:123px
}

#bookmark a {
color:#FFFFFF;
font-size:10px;
font-weight:normal
}

#caddie a {
color:#000000;
color:#333;
font-weight:bold;
margin:0 0 0 40px;
text-decoration:none
}

.smallformbutton {
color:#000000;
font-size:inherit;
font-weight:normal;
text-align:center
}

#galeryselector {
background-color:#E5E6FC;
border-bottom:1px solid #2731E7;
border-left:1px solid #2731E7;
border-right:1px solid #2731E7;
border-top:1px solid #2731E7;
color:#000000;
font-family:Verdana;
font-size:8pt
}

.erreur {
background:#FFB8A6;
border:4px solid #ff0000;
color:#000000;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:14px;
margin:auto;
text-align:center;
width:400px;
z-index:8
}

.incrementAdd {
background:#009933;
border:1px solid #cccccc;
color:#FFFFFF;
cursor:pointer;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:12px;
font-weight:700;
margin:0 2px;
padding:2px;
text-align:center;
width:32px
}

.incrementSubstract {
background:#CC3300;
border:1px solid #cccccc;
color:#FFFFFF;
cursor:pointer;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:12px;
font-weight:900;
margin:0 2px;
padding:2px;
text-align:center;
width:32px
}

.subcatlist {
background:rgb(246,248,249);
background:-moz-linear-gradient(left,rgba(246,248,249,1) 0%,rgba(229,235,238,1) 37%,rgba(215,222,227,1) 65%,rgba(245,247,249,1) 100%);
background:-webkit-gradient(linear,left top,right top,color-stop(0%,rgba(246,248,249,1)),color-stop(37%,rgba(229,235,238,1)),color-stop(65%,rgba(215,222,227,1)),color-stop(100%,rgba(245,247,249,1)));
background:-webkit-linear-gradient(left,rgba(246,248,249,1) 0%,rgba(229,235,238,1) 37%,rgba(215,222,227,1) 65%,rgba(245,247,249,1) 100%);
background:-o-linear-gradient(left,rgba(246,248,249,1) 0%,rgba(229,235,238,1) 37%,rgba(215,222,227,1) 65%,rgba(245,247,249,1) 100%);
background:-ms-linear-gradient(left,rgba(246,248,249,1) 0%,rgba(229,235,238,1) 37%,rgba(215,222,227,1) 65%,rgba(245,247,249,1) 100%);
background:linear-gradient(to right,rgba(246,248,249,1) 0%,rgba(229,235,238,1) 37%,rgba(215,222,227,1) 65%,rgba(245,247,249,1) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f8f9',endColorstr='#f5f7f9',GradientType=1);
margin:0 0 10px;
padding:5px
}

.degradevert {
background:url(userfiles/image/prix_ttc.png)
}

.degradebleu {
background:rgb(30,87,153);
background:-moz-linear-gradient(top,rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);
background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(30,87,153,1)),color-stop(50%,rgba(41,137,216,1)),color-stop(51%,rgba(32,124,202,1)),color-stop(100%,rgba(125,185,232,1)));
background:-webkit-linear-gradient(top,rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);
background:-o-linear-gradient(top,rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);
background:-ms-linear-gradient(top,rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);
background:linear-gradient(to bottom,rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1e5799',endColorstr='#7db9e8',GradientType=0)
}

.radialorange {
background:rgb(255,175,75);
background:-moz-radial-gradient(center,ellipse cover,rgba(255,175,75,1) 0%,rgba(255,146,10,1) 100%);
background:-webkit-gradient(radial,center center,0px,center center,100%,color-stop(0%,rgba(255,175,75,1)),color-stop(100%,rgba(255,146,10,1)));
background:-webkit-radial-gradient(center,ellipse cover,rgba(255,175,75,1) 0%,rgba(255,146,10,1) 100%);
background:-o-radial-gradient(center,ellipse cover,rgba(255,175,75,1) 0%,rgba(255,146,10,1) 100%);
background:-ms-radial-gradient(center,ellipse cover,rgba(255,175,75,1) 0%,rgba(255,146,10,1) 100%);
background:radial-gradient(ellipse at center,rgba(255,175,75,1) 0%,rgba(255,146,10,1) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffaf4b',endColorstr='#ff920a',GradientType=1)
}

.subcatlist a {
border-bottom:1px solid #ddd;
padding:2px 0
}

.titre-subcatlist {
border-bottom:2px solid #ddd;
font-weight:500;
margin:0 0 10px;
padding:10px 0;
text-transform:uppercase
}

.subtitre-subcatlist {
border-bottom:2px solid #ddd;
font-weight:200;
margin:0 0 10px;
padding:3px 0;
text-transform:uppercase
}

.slogan h1,.slogan h2 {
background:#ffffff;
background:linear-gradient(to bottom,rgba(255,255,255,1) 0%,rgba(241,241,241,1) 50%,rgba(225,225,225,1) 51%,rgba(246,246,246,1) 100%);
font-size:20px;
font-weight:600;
height:30px;
line-height:1.15;
margin:0 0 10px;
padding:0 0 0 30px
}

.pastille {
height:53px
}

.degradevert h1 {
color:#fff;
font-size:20px;
font-weight:600;
height:30px;
line-height:1.15;
padding:0 0 0 30px
}

.degradevert h1:before {
content:"contenu"
}

.categories {
padding:10px 0
}

.categories h1,.categories h2 {
background:rgb(255,255,255);
background:-moz-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(241,241,241,1) 50%,rgba(225,225,225,1) 51%,rgba(246,246,246,1) 100%);
background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(255,255,255,1)),color-stop(50%,rgba(241,241,241,1)),color-stop(51%,rgba(225,225,225,1)),color-stop(100%,rgba(246,246,246,1)));
background:-webkit-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(241,241,241,1) 50%,rgba(225,225,225,1) 51%,rgba(246,246,246,1) 100%);
background:-o-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(241,241,241,1) 50%,rgba(225,225,225,1) 51%,rgba(246,246,246,1) 100%);
background:-ms-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(241,241,241,1) 50%,rgba(225,225,225,1) 51%,rgba(246,246,246,1) 100%);
background:linear-gradient(to bottom,rgba(255,255,255,1) 0%,rgba(241,241,241,1) 50%,rgba(225,225,225,1) 51%,rgba(246,246,246,1) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#f6f6f6',GradientType=0);
font-size:20px;
font-weight:normal;
font-weight:600;
height:30px;
line-height:1.15;
padding:0 0 0 10px;
text-align:left
}

.categories h1:before,.categories h2:before {
content:":: "
}

.item {
float:left;
height:220px;
margin:15px;
position:relative;
text-align:center;
width:148px
}

.itemimage img,.itemhomepage img {
box-shadow:0 0 8px 1px #dadada;
padding:5px
}

.itemname,.itemname a {
color:#000000;
padding:5px;
text-transform:uppercase
}

.itemimage img:hover {
box-shadow:0 0 8px 1px #336699
}

.itemprice,.itempricea {
color:#336699;
font-size:1.2em;
font-weight:700;
padding:5px;
text-align:center;
text-transform:uppercase
}

.itemaddtocart {
align-items:center;
display:flex;
flex-direction:row;
justify-content:center
}

button,button a {
box-shadow:0 0 8px 1px #dadada;
cursor:pointer
}

.disponibilite_produit {
align-items:center;
background-color:#f9f9f9;
border:1px solid #ccc;
border-radius:5px;
color:#000000;
cursor:pointer;
display:flex;
font-weight:bold;
padding:10px;
text-align:center
}

.disponibilite_produit img {
border:0;
box-shadow:unset;
width:40px
}

#conteneur {
background:inherit;
box-shadow:-8px 0 15px -5px rgba(0,0,0,0.1),8px 0 15px -5px rgba(0,0,0,0.1);
margin:0 auto;
max-width:1200px;
width:100%
}

#header {
align-items:center;
background:inherit;
display:flex;
flex-wrap:wrap;
justify-content:flex-start;
position:relative;
width:100%
}

#banner {
flex:0 0 auto;
margin:10px 0
}

#titresite {
padding-top:30px;
text-align:left;
width:40%
}

#caddie {
border-radius:5px;
box-sizing:border-box;
display:flex;
font-size:14px;
max-width:calc(100% - 40px);
padding-left:30px;
position:absolute;
right:20px;
transform:translateX(0);
z-index:1000
}

.caddie-icon-red {
align-items:center;
display:flex;
margin-right:10px;
width:70px
}

.caddie-text {
align-items:center;
display:flex;
text-align:center
}

#languagelector {
border-radius:5px;
box-sizing:border-box;
font-size:14px;
left:0;
max-width:calc(100% - 40px);
padding:10px;
position:absolute;
top:0;
transform:translateX(0);
z-index:1000
}

#headerunder {
height:62px;
position:relative;
width:100%;
z-index:99
}

.main-wrapper {
display:flex;
flex-wrap:wrap;
gap:20px;
padding:20px
}

.clearfix::after {
clear:both;
content:"";
display:table
}

.admh2,.admh3 {
color:#0000FF;
font-size:12pt;
font-weight:bold
}

@media screen and (max-width: 1024px) {
#conteneur {
padding:0 10px;
width:95%
}

.leftcolumn {
flex:0 0 250px
}

#header {
padding:15px
}

#caddie {
margin:0;
padding:.5rem 1rem;
position:absolute;
right:15px;
text-align:center;
top:15px;
width:auto
}

#banner {
display:none;
visibility:hidden
}
}

@media screen and (max-width: 768px) {
#header {
flex-direction:row;
text-align:center
}

.pannier_contenu_items {
display:flex;
flex-direction:column-reverse;
gap:10px
}

#banner {
display:none;
margin-bottom:15px;
order:2;
visibility:hidden
}

#titresite {
margin-bottom:15px;
order:1;
width:max-content
}

#caddie {
position:absolute;
right:20px;
top:-35px
}

.main-wrapper {
flex-direction:column;
padding:15px
}

.leftcolumn {
flex:none;
order:2;
width:100%
}

#maincontent {
order:1;
width:100%
}
}

@media screen and (max-width: 480px) {
#conteneur {
padding:0 5px;
width:100%
}

#header {
padding:10px
}

#titresite {
font-size:90%
}

.main-wrapper {
gap:15px;
padding:10px
}

#caddie {
font-size:12px;
padding:8px
}
}

@media screen and (max-width: 320px) {
#header {
padding:8px
}

#titresite {
font-size:85%
}

.main-wrapper {
gap:10px;
padding:8px
}
}

.login_btn span {
color:#ff0000;
cursor:pointer;
float:right;
padding:10px 20px;
text-decoration:none;
font-size: 1.5rem;
}

#homepagemainproduct img:hover {
transform:scale(1.02);
transition:transform .3s ease
}

.login-container {
align-items:center;
background-repeat:no-repeat;
background-size:cover;
display:flex;
justify-content:center
}

.login-form {
background-color:rgba(61,81,122,0.575);
border-radius:8px;
color:#fff;
max-width:70%;
padding:20px;
width:100%
}

.login-form h2 {
font-size:16px;
margin-bottom:20px;
text-align:center
}

.login-form label {
display:block;
font-weight:bold;
margin-bottom:5px
}

.login-form input[type="password"],.login-form input[type="submit"] {
border:none;
border-radius:4px;
margin-bottom:15px;
padding:8px;
width:100%
}

.login-form input[type="submit"] {
background-color:#007BFF;
color:white;
cursor:pointer
}

.login-form input[type="submit"]:hover {
background-color:#0056b3
}

.blink {
animation:blink-animation 1.5s ease-in-out infinite;
color:#ef4444;
font-weight:700;
letter-spacing:1px;
text-transform:uppercase
}

@keyframes blink-animation {
0%,100% {
opacity:1
}

50% {
opacity:.6
}
}

@media (max-width: 600px) {
#homepagemainproduct img {
height:auto;
width:100%
}
}

.homepagemainproduct_img {
height:auto;
width:100%
}

.conteneur_images {
min-height:190px;
text-align:center
}

.product-wrapper {
display:flex;
flex-wrap:wrap;
gap:10px;
margin-top:20px
}

.product-left {
flex:1 1 40%;
text-align:center
}

.product-right {
flex:1 1 55%
}

.image-actions a img {
margin:0 5px
}

.price-block,.description {
margin:15px 0 30px
}

.description p {
font-size:1em
}

.price-block {
align-items:center;
display:flex;
justify-content:center;
margin-top:15px
}

.bookmark {
margin-top:15px
}

#table1 {
box-sizing:border-box;
padding:2px;
width:100%
}

.cart-quantity,.cart-feedback {
margin-bottom:1em;
white-space:nowrap
}

.cart-feedback {
font-size:1.3em;
padding:10px
}

.cart-quantity {
align-items:center;
display:flex;
font-size:1.2em;
gap:20px;
justify-content:center;
margin-top:10px
}

.btn-view-cart {
align-items:center;
background:#00a8ef;
border:none;
border-radius:4px;
box-shadow:0 2px 5px rgba(0,0,0,0.15);
color:white;
cursor:pointer;
display:inline-flex;
font-size:15px;
font-weight:bold;
gap:10px;
padding:10px 20px;
transition:background .3s ease,transform .2s ease
}

.btn-view-cart:hover {
background:#000000;
transform:scale(1.02)
}

.btn-icon {
background-image:url(/UserFiles/image/add_to_cart.svg);
background-position:center;
background-repeat:no-repeat;
background-size:contain;
flex-shrink:0;
height:20px;
width:20px
}

.btn-view-cart-green {
background:linear-gradient(to bottom,#4ae275,#57a725);
border:none;
border-radius:4px;
box-shadow:0 2px 4px rgba(0,0,0,0.2);
color:white;
cursor:pointer;
font-size:14px;
font-weight:bold;
padding:8px 16px;
transition:background .3s ease
}

.btn-view-cart-green:hover {
background:linear-gradient(to bottom,#5af0c0,#46d24f)
}

.lightbox {
align-items:center;
background:rgba(0,0,0,0.8);
display:none;
height:100vh;
justify-content:center;
left:0;
position:fixed;
top:0;
width:100vw;
z-index:9999
}

.lightbox-content {
background:white;
background:white;
border-radius:8px;
border-radius:8px;
max-height:90%;
max-height:95%;
max-width:90%;
max-width:95%;
overflow:auto;
overflow:auto;
padding:20px;
padding:20px;
text-align:center;
text-align:center
}

.lightbox-content img {
border-radius:4px;
margin-bottom:1em;
max-height:80vh;
max-width:90vw;
object-fit:contain
}

.btn-fermer {
background:#357ABD;
border:none;
border-radius:4px;
color:white;
cursor:pointer;
font-size:15px;
font-weight:bold;
margin-top:10px;
padding:10px 20px
}

.check-list {
list-style:none;
margin:0;
padding:0
}

.check-list li {
color:#1a3e6e;
font-size:16px;
font-weight:500;
margin-bottom:15px;
padding-left:30px;
position:relative
}

.check-list li::before {
color:#3498db;
content:"✔";
font-size:18px;
left:0;
position:absolute;
top:0
}

.variantes li {
color:#1a3e6e;
padding-left:30px;
position:relative
}

.variantes li::before {
color:#3498db;
content:"★";
font-size:18px;
left:0;
position:absolute;
top:0
}

.onglet {
background-color:#0074D9;
color:#FFF;
cursor:pointer;
padding:10px;
position:fixed;
right:0;
top:50%;
transform:translateY(-50%);
z-index:10
}

.superposition {
background-color:rgba(0,0,0,0.5);
display:none;
height:100%;
left:0;
position:fixed;
top:0;
width:100%
}

.close-button {
cursor:pointer;
display:none;
position:absolute;
right:10px;
top:10px
}

.infos {
background-color:#F0F0F0;
height:100%;
overflow:auto;
padding:20px;
position:fixed;
right:-100%;
top:0;
transition:right .5s ease;
width:30%;
z-index:9999
}

@media screen and (max-width: 1024px) {
.infos {
right:-80%;
width:80%
}
}

@media screen and (max-width: 768px) {
.infos {
right:-100%;
width:100%
}
}

@media screen and (max-width: 480px) {
.infos {
right:-100%;
width:100%
}
}

@media screen and (max-width: 320px) {
.infos {
padding:15px;
right:-100%;
width:100%
}
}

.infos.open .close-button {
background:red;
display:block
}

.admin_onglet {
background-color:#ddd;
border-top-left-radius:5px;
border-top-right-radius:5px;
color:#000;
cursor:pointer;
display:inline-block;
font-weight:bold;
margin-right:5px;
padding:10px 20px
}

.admin_onglet.active {
background-color:#fff;
border-bottom:2px solid #fff
}

.admin_contenu {
background-color:#fff;
border:1px solid #ddd;
border-top:none;
display:none;
padding:20px
}

.tabs {
border-bottom:2px solid #ccc;
display:flex
}

.tab {
background-color:#f7f7f7;
border:1px solid #ccc;
border-bottom:none;
cursor:pointer;
padding:10px 20px
}

.tab.active {
background-color:#ffffff;
border-top:2px solid #0078D7;
font-size:initial;
font-weight:bold
}

.tab-content {
border:1px solid #ccc;
display:none;
font-size:larger;
padding:15px
}

.spacebetween {
align-items:center;
display:flex;
justify-content:space-between
}

.flexend {
align-items:center;
display:flex;
flex-direction:row;
justify-content:flex-end
}

.admin-actions-grid {
display:flex;
flex-wrap:wrap;
gap:10px;
margin-top:10px
}

.admin-actions-grid img {
display:flex;
height:50px;
transition:transform .2s;
width:50px
}

.admin-actions-grid img:hover {
transform:scale(1.1)
}

.disk-full-message {
background-color:#ffe6e6;
border:1px solid #ff9999;
border-radius:5px;
margin:40px auto;
padding:30px;
text-align:center
}

.lightbox-overlay {
background-color:rgba(0,0,0,0.8);
display:none;
height:100%;
left:0;
opacity:0;
position:fixed;
top:0;
transition:opacity .3s ease;
width:100%;
z-index:10
}

.lightbox-overlay.active {
align-items:center;
display:flex;
justify-content:center;
opacity:1
}

.lightbox-content {
background:white;
border-radius:8px;
box-shadow:0 10px 30px rgba(0,0,0,0.3);
max-height:95%;
max-width:95%;
overflow:hidden;
position:relative;
transform:scale(0.7);
transition:transform .3s ease
}

.lightbox-overlay.active .lightbox-content {
transform:scale(1)
}

.lightbox-close:hover {
background-color:#f0f0f0;
color:#333
}

.lightbox-iframe {
border:none;
display:block;
height:100%;
width:100%
}

.admin_contenu.active,.tab-content.active {
display:block
}

@media (max-width: 768px) {
.lightbox-content {
margin:20px;
max-height:90%;
max-width:95%
}

.lightbox-close {
font-size:20px;
right:15px;
top:10px
}

.infos.open {
right:0
}

.superposition {
display:block;
display:none
}

.close-button {
display:block
}

fielset {
align-items:center;
display:flex;
flex-direction:row;
flex-wrap:wrap;
gap:1rem;
margin-top:1.5rem
}
}

@media (max-width: 480px) {
.lightbox-content {
margin:10px;
max-height:85%;
max-width:98%
}
}

.tabs {
border-bottom:1px solid #ccc;
display:flex;
flex-wrap:wrap
}

.tab {
align-items:center;
background:var(--tab-bg);
cursor:pointer;
display:flex;
flex:1;
font-size:initial;
gap:8px;
justify-content:center;
padding:12px;
text-align:center;
transition:background .3s
}

.tab svg {
height:20px;
width:20px
}

.tab:hover {
background:#d9e5f0
}

.tab.active {
background:var(--bg-color);
border-bottom:3px solid var(--primary-color);
color:var(--primary-color);
font-weight:bold
}

.tab-content {
animation:fadeIn .3s ease-in;
display:none;
padding:20px
}

.tab-content.active {
display:block
}

@keyframes fadeIn {
from {
opacity:0
}

to {
opacity:1
}
}

.container {
background:var(--bg-color);
border-radius:10px;
box-shadow:0 4px 10px rgba(0,0,0,0.1);
font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
margin:auto;
max-width:800px;
min-height:99vh;
overflow-x:hidden
}

h2 {
color:var(--text-primary);
font-size:1.875rem;
font-weight:700;
letter-spacing:-.025em;
margin:0 0 2rem;
text-align:center
}

.tabs {
background:var(--card-background);
border:1px solid var(--border-color);
border-bottom:none;
border-radius:var(--radius-lg) var(--radius-lg) 0 0;
box-shadow:var(--shadow-sm);
display:flex;
overflow:hidden
}

.tab {
align-items:center;
background:var(--card-background);
border:none;
border-right:1px solid var(--border-color);
color:var(--text-secondary);
cursor:pointer;
display:flex;
flex:1;
font-weight:500;
gap:.5rem;
justify-content:center;
padding:1rem 1.5rem;
position:relative;
transition:var(--transition)
}

.tab:last-child {
border-right:none
}

.tab svg {
height:1.25rem;
transition:var(--transition);
width:1.25rem
}

.tab:hover {
background:#f1f5f9;
color:var(--primary-color);
transform:translateY(-1px)
}

.tab.active {
background:var(--primary-color);
box-shadow:var(--shadow-md);
color:white;
z-index:1
}

.tab.active::after {
background:var(--primary-color);
bottom:-1px;
content:'';
height:2px;
left:0;
position:absolute;
right:0
}

.tab-content {
background:var(--card-background);
border:1px solid var(--border-color);
border-radius:0 0 var(--radius-lg) var(--radius-lg);
border-top:none;
box-shadow:var(--shadow-md);
display:none;
padding:2rem
}

.tab-content.active {
animation:fadeIn .3s ease-in-out;
display:block
}

@keyframes fadeIn {
from {
opacity:0;
transform:translateY(10px)
}

to {
opacity:1;
transform:translateY(0)
}
}

.tab-content hr {
background:linear-gradient(90deg,transparent,var(--border-color),transparent);
border:none;
height:1px;
margin:0 0 1.5rem
}

.flexstart {
align-items:center;
background:transparent!important;
display:flex;
flex-direction:row;
flex-wrap:wrap;
gap:1rem;
justify-content:flex-start;
margin-top:1.5rem
}

.flexstart > div {
align-items:center;
display:flex
}

.icones_admin {
background:var(--primary-color);
border-radius:var(--radius-md);
height:4rem;
padding:.5rem;
transition:var(--transition);
width:4rem
}

.icones_admin_mini {
background:var(--primary-color);
border-radius:var(--radius-md);
height:24px;
padding:.3rem;
transition:var(--transition);
width:24px
}

.imghelp {
cursor:pointer;
height:25px;
margin:10px 10px 0 0;
width:25px
}

.flexstart > div a {
align-items:center;
background:var(--primary-color);
border-radius:var(--radius-md);
box-shadow:var(--shadow-sm);
display:inline-flex;
justify-content:center;
padding:.5rem;
transition:var(--transition)
}

.icones_admin.white-icon {
filter:brightness(0) invert(1)
}

.flexstart > div a img {
filter:drop-shadow(0 0 1px rgba(255,255,255,0.3))
}

.adminimage {
cursor:pointer
}

fieldset {
background:linear-gradient(135deg,#f8fafc 0%,#f1f5f9 100%);
border:1px solid var(--border-color);
border-radius:var(--radius-lg);
box-shadow:var(--shadow-sm);
margin:1rem 0
}

fieldset legend {
background:var(--card-background);
border:1px solid var(--border-color);
border-radius:var(--radius-md);
box-shadow:var(--shadow-sm);
color:var(--text-primary);
font-weight:600;
padding:.5rem 1rem
}

fieldset legend h2 {
font-size:1.25rem;
margin:0
}

#table5 {
background:var(--card-background);
border-radius:var(--radius-md);
box-shadow:var(--shadow-sm);
padding:1rem;
width:100%
}

#table5 > div {
align-items:center;
border-bottom:1px solid var(--border-color);
display:flex;
padding:.75rem 0;
transition:var(--transition)
}

#table5 > div:last-child {
border-bottom:none
}

#table5 > div:hover {
background:#f8fafc;
border-radius:var(--radius-sm);
margin:0 -.5rem;
padding-left:1.25rem;
padding-right:1.25rem
}

#table5 b font {
color:var(--text-primary);
font-size:.875rem;
font-weight:600
}

#table5 a {
align-items:center;
background:var(--primary-color);
border-radius:var(--radius-sm);
box-shadow:var(--shadow-sm);
color:white;
display:inline-flex;
font-size:.75rem;
font-weight:500;
gap:.375rem;
padding:.375rem .75rem;
text-decoration:none;
transition:var(--transition)
}

#table5 a:hover {
background:var(--primary-hover);
box-shadow:var(--shadow-md);
transform:translateY(-1px)
}

#table5 img {
filter:brightness(0) invert(1);
height:.75rem;
width:.75rem
}

.alert {
animation:slideIn .3s ease-out;
border-left:4px solid;
border-radius:var(--radius-md);
box-shadow:var(--shadow-sm);
margin:1rem 0;
padding:1rem 1.5rem
}

.icones_admin:hover,.flexstart > div a:hover {
background:var(--primary-hover);
box-shadow:var(--shadow-lg);
transform:translateY(-2px) scale(1.05)
}

@keyframes slideIn {
from {
opacity:0;
transform:translateX(-20px)
}

to {
opacity:1;
transform:translateX(0)
}
}

.alert-warning {
background:#fef3c7!important;
border-left-color:var(--warning-color);
color:#92400e!important
}

.alert-warning h2 {
color:#92400e;
font-size:1.125rem;
margin:0 0 .5rem
}

.flex-caption {
animation:bounceInUp 1s ease-out forwards;
background:rgba(0,0,0,0.7);
border-radius:10px;
bottom:30px;
box-shadow:0 8px 20px rgba(0,0,0,0.4);
color:#fff;
font-family:'Segoe UI',sans-serif;
font-size:1.4rem;
left:50%;
max-width:80%;
padding:20px 30px;
position:absolute;
text-align:center;
transform:translateX(-50%);
z-index:10
}

@keyframes bounceInUp {
0% {
opacity:0;
transform:translate(-50%,300px) scale(0.5)
}

60% {
opacity:1;
transform:translate(-50%,-20px) scale(1.1)
}

80% {
transform:translate(-50%,10px) scale(0.95)
}

100% {
transform:translate(-50%,0) scale(1)
}
}

.tab-content > div:first-of-type {
background:linear-gradient(135deg,var(--success-color),#047857);
border-radius:var(--radius-md);
box-shadow:var(--shadow-md);
color:white;
font-weight:500;
margin-bottom:1.5rem;
padding:1rem 1.5rem
}

.tab-content > div:first-of-type b {
font-weight:700
}

.lightbox-overlay {
backdrop-filter:blur(4px);
background-color:rgba(0,0,0,0.8);
display:none;
height:100%;
left:0;
opacity:0;
position:fixed;
top:0;
transition:opacity .3s ease;
width:100%;
z-index:9999
}

.lightbox-overlay.active {
align-items:center;
display:flex;
justify-content:center;
opacity:1
}

.lightbox-content {
background:var(--card-background);
border-radius:var(--radius-lg);
box-shadow:0 25px 50px -12px rgb(0 0 0 / 0.25);
max-height:95%;
max-width:95%;
overflow:hidden;
position:relative;
transform:scale(0.7);
transition:transform .3s cubic-bezier(0.34,1.56,0.64,1)
}

.lightbox-overlay.active .lightbox-content {
transform:scale(1)
}

.lightbox-close {
align-items:center;
backdrop-filter:blur(8px);
background:rgba(0,0,0,0.1);
border:none;
border-radius:50%;
color:var(--text-secondary);
cursor:pointer;
display:flex;
font-size:1.5rem;
height:2rem;
justify-content:center;
position:absolute;
right:20px;
top:15px;
transition:background-color .2s ease,color .2s ease;
width:2rem;
z-index:10001
}

.lightbox-close:hover {
background:rgba(0,0,0,0.2);
color:var(--text-primary);
transform:scale(1.1)
}

.lightbox-iframe {
border:none;
border-radius:var(--radius-lg);
display:block;
height:100%;
width:100%
}

@media (max-width: 768px) {
.tabs {
flex-direction:row
}

.tab {
border-bottom:1px solid var(--border-color);
border-right:none;
padding:.75rem 1rem
}

.tab:last-child {
border-bottom:none
}

.tab-content {
padding:1.5rem
}

.flexstart {
align-items:flex-start;
flex-direction:row;
gap:.75rem
}

#table5 > div {
align-items:flex-start;
flex-direction:column;
gap:.5rem
}

#table5 > div > div:not(:first-child) {
margin-left:0
}

fieldset {
padding:1rem
}

.lightbox-content {
margin:1rem;
max-height:90%;
max-width:95%
}
}

@media (max-width: 480px) {
h2 {
font-size:1.5rem
}

.tab {
font-size:.875rem;
gap:.375rem
}

.tab svg {
height:1rem;
width:1rem
}

.tab-content {
padding:1rem
}

.icones_admin {
height:4rem;
width:4rem
}

.lightbox-content {
margin:.5rem;
max-height:85%;
max-width:98%
}

.lightbox-close {
font-size:1.25rem;
height:1.75rem;
width:1.75rem
}
}

.tab:focus,.icones_admin:focus,.lightbox-close:focus,#table5 a:focus {
outline:2px solid var(--primary-color);
outline-offset:2px
}

.admin-container {
background:white;
border-radius:12px;
box-shadow:0 4px 20px rgba(0,0,0,0.08);
margin:0 auto;
max-width:1200px;
overflow:hidden
}

.admin-header {
background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);
color:white;
padding:20px 30px
}

.admin-header h1 {
font-size:1.8rem;
font-weight:600
}

.admin-header p {
margin-top:5px;
opacity:.9
}

.pages-list {
padding:0
}

.page-item {
align-items:center;
border-bottom:1px solid #e9ecef;
display:flex;
margin-bottom:5px;
transition:all .2s ease
}

.page-item:hover {
background:#f8f9fa;
transform:translateX(2px)
}

.page-item:last-child {
border-bottom:none
}

.page-name {
color:#333;
flex:1;
font-size:1.1rem;
font-weight:500;
margin-right:20px
}

.page-actions {
align-items:center;
display:flex;
gap:12px
}

.action-btn {
align-items:center;
border:none;
border-radius:8px;
cursor:pointer;
display:inline-flex;
font-size:16px;
height:40px;
justify-content:center;
text-decoration:none;
transition:all .2s ease;
width:40px
}

.view-btn {
background:#e3f2fd;
color:#1976d2
}

.view-btn:hover {
background:#bbdefb;
transform:scale(1.05)
}

.edit-btn {
background:#fff3e0;
color:#f57c00
}

.edit-btn:hover {
background:#ffe0b2;
transform:scale(1.05)
}

.icon {
height:18px;
width:18px
}

@media (max-width: 768px) {
body {
padding:10px
}

.admin-header {
padding:16px 20px
}

.admin-header h1 {
font-size:1.5rem
}

.page-item {
padding:15px 20px
}

.page-name {
font-size:1rem;
margin-right:15px
}

.action-btn {
height:36px;
width:36px
}

.page-actions {
gap:8px
}
}

@media (max-width: 480px) {
.page-item {
padding:12px 15px
}

.page-name {
font-size:.95rem;
margin-right:10px
}

.action-btn {
height:32px;
width:32px
}

.icon {
height:16px;
width:16px
}
}

.page-item {
animation:fadeInUp .3s ease-out forwards;
opacity:0;
transform:translateY(10px)
}

.page-item:nth-child(1) {
animation-delay:.1s
}

.page-item:nth-child(2) {
animation-delay:.2s
}

.page-item:nth-child(3) {
animation-delay:.3s
}

.page-item:nth-child(4) {
animation-delay:.4s
}

.page-item:nth-child(5) {
animation-delay:.5s
}

@keyframes fadeInUp {
to {
opacity:1;
transform:translateY(0)
}
}

.cart-item-variants {
display:flex;
flex-wrap:wrap;
gap:8px;
margin:8px 0
}

.variant-badge {
align-items:center;
background:#f0f0f0;
border-radius:4px;
color:#333;
display:inline-flex;
font-size:13px;
padding:4px 10px
}

.variant-badge strong {
color:#666;
margin-right:4px
}

.cart-item-sku {
color:#999;
font-size:12px;
margin-top:5px
}

.cart-item-sku strong {
color:#666
}

.result-container {
background:white;
border-radius:8px;
box-shadow:0 2px 10px rgba(0,0,0,0.1);
margin:0 auto;
max-width:800px;
padding:30px
}

.success-icon {
font-size:48px;
margin-bottom:20px;
text-align:center
}

.upload-summary {
background:#e7f3ff;
border-left:4px solid #0066cc;
border-radius:4px;
margin-bottom:20px;
padding:15px
}

.upload-item {
background:#f8f9fa;
border-radius:4px;
margin:5px 0;
padding:10px
}

.upload-item strong {
color:#495057
}

.btn-continue {
background:#ff6600;
border-radius:6px;
color:white;
display:block;
font-weight:bold;
margin-top:30px;
padding:15px;
text-align:center;
text-decoration:none;
transition:background .3s;
width:100%
}

.btn-continue:hover {
background:#ff8533
}

.image-upload-section {
background:#f8f9fa;
border:1px solid #dee2e6;
border-radius:8px;
margin-bottom:20px;
padding:20px
}

.image-upload-section h4 {
align-items:center;
color:#495057;
display:flex;
font-size:16px;
font-weight:600;
gap:8px;
margin-top:0
}

.image-upload-group {
align-items:center;
background:white;
border:1px solid #e9ecef;
border-radius:6px;
display:grid;
gap:15px;
grid-template-columns:200px 1fr auto;
margin-bottom:10px;
padding:15px
}

.image-upload-group label {
color:#495057;
font-weight:500
}

.image-upload-group label .required {
color:#dc3545;
font-weight:bold
}

.image-upload-group label .optional {
color:#6c757d;
font-size:12px;
font-weight:normal
}

.image-upload-group input[type="file"] {
background:#fff;
border:2px solid #ced4da;
border-radius:4px;
padding:8px
}

.image-preview {
border:2px solid #dee2e6;
border-radius:4px;
height:100px;
object-fit:cover;
width:100px
}

.no-image {
align-items:center;
background:#e9ecef;
border:2px dashed #ced4da;
border-radius:4px;
color:#6c757d;
display:flex;
font-size:12px;
height:100px;
justify-content:center;
width:100px
}

.variant-images-grid {
display:grid;
gap:15px;
grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
margin-top:15px
}

.variant-image-card {
background:white;
border:1px solid #e9ecef;
border-radius:6px;
padding:15px
}

.variant-image-card .variant-name {
color:#495057;
display:block;
font-weight:600;
margin-bottom:10px
}

.upload-info {
background:#e7f3ff;
border-left:4px solid #0066cc;
border-radius:4px;
color:#004085;
font-size:14px;
margin-bottom:20px;
padding:12px
}

.upload-info ul {
margin:8px 0 0 20px;
padding:0
}

.product-gallery {
display:flex;
flex-direction:column;
gap:15px;
position:relative
}

.gallery-main {
background:#f8f9fa;
border:1px solid #e0e0e0;
border-radius:8px;
overflow:hidden;
position:relative;
width:100%
}

.gallery-main-image {
display:block;
height:auto;
transition:opacity .3s ease;
width:100%
}

.image-actions {
display:flex;
gap:8px;
position:absolute;
right:10px;
top:10px;
z-index:10
}

.image-actions a {
align-items:center;
background:rgba(255,255,255,0.95);
border-radius:6px;
box-shadow:0 2px 8px rgba(0,0,0,0.15);
display:flex;
height:30px;
justify-content:center;
transition:all .2s ease;
width:30px
}

.image-actions a:hover {
background:white;
box-shadow:0 4px 12px rgba(0,0,0,0.2);
transform:scale(1.05)
}

.gallery-thumbnails {
display:flex;
flex-wrap:wrap;
gap:10px;
justify-content:center;
padding:10px 0
}

.gallery-thumb {
background:#f8f9fa;
border:3px solid transparent;
border-radius:6px;
cursor:pointer;
height:80px;
overflow:hidden;
position:relative;
transition:all .2s ease;
width:80px
}

.gallery-thumb:hover {
border-color:#ff9933;
box-shadow:0 4px 8px rgba(0,0,0,0.15);
transform:translateY(-2px)
}

.gallery-thumb.active {
border-color:#ff6600;
box-shadow:0 0 0 1px #ff6600
}

.gallery-thumb img {
display:block;
height:100%;
object-fit:cover;
width:100%
}

.gallery-thumb-label {
background:rgba(0,0,0,0.7);
bottom:0;
color:white;
font-size:10px;
left:0;
overflow:hidden;
padding:2px 4px;
position:absolute;
right:0;
text-align:center;
text-overflow:ellipsis;
white-space:nowrap
}

.product-reference {
background:#f8f9fa;
border-radius:6px;
color:#666;
font-weight:500;
margin-top:15px;
padding:10px;
text-align:center
}

.separator {
background:#e0e0e0;
height:1px;
margin:10px 0
}

@media (max-width: 768px) {
.gallery-thumb {
height:60px;
width:60px
}
}

.variant-group {
margin-bottom:25px
}

.variant-label {
color:#333;
display:block;
font-size:14px;
font-weight:bold;
margin-bottom:10px
}

.variant-options {
display:flex;
flex-wrap:wrap;
gap:10px
}

.variant-btn {
background:white;
border:2px solid #ddd;
border-radius:6px;
cursor:pointer;
font-size:14px;
min-width:80px;
padding:10px 20px;
text-align:center;
transition:all .3s ease
}

.variant-btn:hover {
background:#fff5f0;
border-color:#ff6600
}

.variant-btn.selected {
background:#ff6600;
border-color:#ff6600;
color:white;
font-weight:bold
}

.variant-btn.disabled {
background:#f5f5f5;
cursor:not-allowed;
opacity:.4
}

.combo-info {
background:#f8f9fa;
border-left:4px solid #ff6600;
border-radius:8px;
margin:20px 0;
padding:15px
}

.combo-price {
color:#ff6600;
font-size:24px;
font-weight:bold;
margin-bottom:10px
}

.combo-stock {
color:#666;
font-size:14px
}

.combo-stock.in-stock {
color:#28a745;
font-weight:bold
}

.combo-stock.low-stock {
color:#ff9800;
font-weight:bold
}

.combo-stock.out-of-stock {
color:#dc3545;
font-weight:bold
}

.combo-sku {
color:#999;
font-size:12px;
margin-top:5px
}

.qty-btn {
align-items:center;
background:white;
border:2px solid #ddd;
border-radius:6px;
color:#333;
cursor:pointer;
display:flex;
font-size:24px;
font-weight:bold;
height:40px;
justify-content:center;
transition:all .2s ease;
width:40px
}

.qty-btn:hover {
background:#fff5f0;
border-color:#ff6600;
transform:scale(1.05)
}

.qty-btn:active {
transform:scale(0.95)
}

.qty-minus {
color:#f44336
}

.qty-plus {
color:#4caf50
}

#quantityInput {
border:2px solid #ddd;
border-radius:6px;
font-weight:bold
}

#quantityInput:focus {
border-color:#ff6600;
outline:none
}

@keyframes slideIn {
from {
opacity:0;
transform:translateY(-20px)
}

to {
opacity:1;
transform:translateY(0)
}
}

.share-lightbox {
animation:fadeIn .3s ease;
display:none;
height:100%;
left:0;
position:fixed;
top:0;
width:100%;
z-index:10000
}

.share-lightbox.active {
display:block
}

.share-overlay {
backdrop-filter:blur(5px);
background:rgba(0,0,0,0.7);
height:100%;
left:0;
position:absolute;
top:0;
width:100%
}

.share-modal {
animation:slideUp .3s ease;
background:white;
border-radius:16px;
box-shadow:0 20px 60px rgba(0,0,0,0.3);
left:50%;
max-height:90vh;
max-width:500px;
overflow-y:auto;
position:absolute;
top:50%;
transform:translate(-50%,-50%);
width:90%
}

.share-header {
align-items:center;
border-bottom:1px solid #e0e0e0;
display:flex;
justify-content:space-between;
padding:20px 24px
}

.share-header h3 {
color:#333;
font-size:20px;
font-weight:600;
margin:0
}

.share-close {
align-items:center;
background:none;
border:none;
border-radius:50%;
color:#999;
cursor:pointer;
display:flex;
font-size:32px;
height:36px;
justify-content:center;
line-height:1;
padding:0;
transition:all .2s;
width:36px
}

.share-close:hover {
background:#f5f5f5;
color:#333
}

.share-content {
padding:24px
}

.share-url-box {
background:#f5f5f5;
border:1px solid #ddd;
border-radius:8px;
color:#666;
font-family:'Courier New',monospace;
font-size:13px;
margin-bottom:20px;
padding:12px 16px;
word-break:break-all
}

.share-buttons-grid {
display:grid;
gap:12px;
grid-template-columns:repeat(2,1fr)
}

.share-btn {
align-items:center;
border:none;
border-radius:8px;
color:white;
cursor:pointer;
display:flex;
font-size:14px;
font-weight:500;
gap:8px;
justify-content:center;
padding:12px 16px;
text-decoration:none;
transition:all .3s
}

.share-btn:hover {
box-shadow:0 4px 12px rgba(0,0,0,0.15);
transform:translateY(-2px)
}

.share-btn svg {
flex-shrink:0;
height:20px;
width:20px
}

.btn-copy {
background:#6c757d;
grid-column:1 / -1
}

.btn-copy:hover {
background:#5a6268
}

.btn-email {
background:#dc3545
}

.btn-email:hover {
background:#c82333
}

.btn-whatsapp {
background:#25D366
}

.btn-whatsapp:hover {
background:#1da851
}

.btn-facebook {
background:#1877F2
}

.btn-facebook:hover {
background:#0d65d9
}

.btn-twitter {
background:#1DA1F2
}

.btn-twitter:hover {
background:#0d8bd9
}

.btn-linkedin {
background:#0A66C2
}

.btn-linkedin:hover {
background:#084d8f
}

.btn-pinterest {
background:#E60023
}

.btn-pinterest:hover {
background:#ad001a
}

.copy-notification {
background:#28a745;
border-radius:8px;
box-shadow:0 4px 12px rgba(0,0,0,0.15);
color:white;
font-weight:500;
opacity:0;
padding:12px 20px;
pointer-events:none;
position:fixed;
right:20px;
top:20px;
transform:translateY(-20px);
transition:all .3s;
z-index:10001
}

.copy-notification.show {
opacity:1;
transform:translateY(0)
}

@keyframes fadeIn {
from {
opacity:0
}

to {
opacity:1
}
}

@keyframes slideUp {
from {
opacity:0;
transform:translate(-50%,-40%)
}

to {
opacity:1;
transform:translate(-50%,-50%)
}
}

@media (max-width: 600px) {
.share-buttons-grid {
grid-template-columns:1fr
}

.share-modal {
width:95%
}

.share-header h3 {
font-size:18px
}
}

.share-btn,.share-btn:link,.share-btn:visited,.share-btn:hover,.share-btn:active {
color:white!important;
text-decoration:none!important
}

.Search_form {
background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);
border-radius:20px;
box-shadow:0 20px 60px rgba(102,126,234,0.4);
margin-bottom:40px;
padding:40px
}

.Search_main-row {
margin-bottom:32px
}

.Search_input-group {
position:relative
}

.Search_label {
color:#ffffff;
display:block;
font-size:24px;
font-weight:800;
margin-bottom:16px;
text-shadow:0 2px 4px rgba(0,0,0,0.2)
}

.Search_motcle {
background:rgba(255,255,255,0.95);
border:3px solid rgba(255,255,255,0.3);
border-radius:16px;
box-shadow:0 4px 16px rgba(0,0,0,0.1);
font-size:18px;
padding:18px 24px;
transition:all .4s cubic-bezier(0.4,0,0.2,1);
width:100%
}

.Search_motcle:focus {
background:#ffffff;
border-color:#ffd814;
box-shadow:0 8px 32px rgba(255,216,20,0.5);
outline:none;
transform:translateY(-4px)
}

.Search_hint {
color:rgba(255,255,255,0.9);
font-size:14px;
font-style:italic;
margin-top:10px
}

.Search_filters-section {
backdrop-filter:blur(10px);
background:rgba(255,255,255,0.15);
border:2px solid rgba(255,255,255,0.2);
border-radius:16px;
margin-bottom:24px;
padding:24px
}

.Search_filters-title {
color:#ffffff;
font-size:20px;
font-weight:700;
margin-bottom:20px;
text-shadow:0 2px 4px rgba(0,0,0,0.2)
}

.Search_filters-grid {
align-items:start;
display:grid;
gap:24px;
grid-template-columns:1fr 2fr
}

.Search_filter-item {
align-items:center;
display:flex
}

.Search_checkbox-label {
align-items:center;
background:rgba(255,255,255,0.1);
border:2px solid rgba(255,255,255,0.2);
border-radius:12px;
color:#ffffff;
cursor:pointer;
display:flex;
font-size:16px;
font-weight:600;
gap:12px;
padding:14px 20px;
transition:all .3s ease
}

.Search_checkbox-label:hover {
background:rgba(255,255,255,0.2);
transform:translateX(4px)
}

.Search_checkbox-label input[type="checkbox"] {
accent-color:#ffd814;
cursor:pointer;
height:22px;
width:22px
}

.Search_checkbox-text {
user-select:none
}

.Search_price-filter {
display:grid;
gap:20px;
grid-template-columns:1fr 1fr
}

.Search_price-group {
display:flex;
flex-direction:column;
gap:12px
}

.Search_price-label {
align-items:center;
color:#ffffff;
display:flex;
font-size:15px;
font-weight:600;
gap:8px
}

.Search_price-label strong {
color:#ffd814;
font-size:18px;
min-width:70px;
text-align:right
}

.Search_range {
-webkit-appearance:none;
appearance:none;
background:linear-gradient(90deg,#ffd814 0%,#ffaa00 100%);
border-radius:8px;
box-shadow:0 2px 8px rgba(0,0,0,0.2);
cursor:pointer;
height:8px;
outline:none;
width:100%
}

.Search_range::-webkit-slider-thumb {
-webkit-appearance:none;
appearance:none;
background:#ffffff;
border:3px solid #ffd814;
border-radius:50%;
box-shadow:0 4px 12px rgba(0,0,0,0.3);
cursor:pointer;
height:24px;
transition:all .3s ease;
width:24px
}

.Search_range::-moz-range-thumb {
background:#ffffff;
border:3px solid #ffd814;
border-radius:50%;
box-shadow:0 4px 12px rgba(0,0,0,0.3);
cursor:pointer;
height:24px;
transition:all .3s ease;
width:24px
}

.Search_btn {
background:linear-gradient(135deg,#ffd814 0%,#ffaa00 100%);
border:none;
border-radius:16px;
box-shadow:0 8px 24px rgba(255,216,20,0.5);
color:#111;
cursor:pointer;
font-size:18px;
font-weight:800;
letter-spacing:1px;
overflow:hidden;
padding:18px 40px;
position:relative;
text-transform:uppercase;
transition:all .4s cubic-bezier(0.4,0,0.2,1);
width:100%
}

.Search_btn::before {
background:rgba(255,255,255,0.3);
border-radius:50%;
content:'';
height:0;
left:50%;
position:absolute;
top:50%;
transform:translate(-50%,-50%);
transition:width 0.6s,height .6s;
width:0
}

.Search_btn:hover::before {
height:300px;
width:300px
}

.Search_btn:hover {
background:linear-gradient(135deg,#ffaa00 0%,#ff8c00 100%);
box-shadow:0 16px 40px rgba(255,216,20,0.7);
transform:translateY(-4px)
}

.Search_btn:active {
transform:translateY(-2px)
}

.Search_btn:disabled,.Search_btn.Search_btn-disabled {
background:linear-gradient(135deg,#cbd5e0 0%,#a0aec0 100%);
box-shadow:0 2px 8px rgba(0,0,0,0.1);
color:#718096;
cursor:not-allowed;
transform:none
}

.Search_btn:disabled::before,.Search_btn.Search_btn-disabled::before {
display:none
}

.Search_btn:disabled:hover,.Search_btn.Search_btn-disabled:hover {
background:linear-gradient(135deg,#cbd5e0 0%,#a0aec0 100%);
box-shadow:0 2px 8px rgba(0,0,0,0.1);
transform:none
}

.Search_results-count {
align-items:center;
background:linear-gradient(135deg,#ffffff 0%,#f7fafc 100%);
border-left:6px solid #667eea;
border-radius:16px;
box-shadow:0 4px 16px rgba(0,0,0,0.08);
color:#1a202c;
display:flex;
font-size:22px;
font-weight:700;
gap:16px;
margin:32px 0 24px;
padding:20px 28px
}

.Search_results-count img {
filter:drop-shadow(0 2px 4px rgba(0,0,0,0.1))
}

.Search_count-number {
color:#667eea;
font-size:28px;
font-weight:900
}

.Search_results-count strong {
color:#764ba2
}

.Search_no-results {
background:#ffffff;
border-radius:20px;
box-shadow:0 8px 32px rgba(0,0,0,0.1);
margin:48px auto;
max-width:600px;
padding:56px 40px;
text-align:center
}

.Search_no-results::before {
animation:float 3s ease-in-out infinite;
content:"📦";
display:block;
font-size:72px;
margin-bottom:20px;
opacity:.4
}

.Search_range::-webkit-slider-thumb:hover,.Search_range::-moz-range-thumb:hover {
box-shadow:0 6px 16px rgba(255,216,20,0.6);
transform:scale(1.2)
}

@keyframes float {
0%,100% {
transform:translateY(0)
}

50% {
transform:translateY(-10px)
}
}

.Search_no-results p {
color:#4a5568;
font-size:20px;
line-height:1.6;
margin:0 0 12px
}

.Search_no-results-hint {
color:#718096!important;
font-size:16px!important;
font-style:italic
}

.Search_no-results strong {
color:#667eea;
font-weight:800
}

.Search_grid {
display:grid;
gap:28px;
grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
margin-top:40px
}

.Search_card {
background:#ffffff;
border:none;
border-radius:20px;
box-shadow:0 4px 16px rgba(0,0,0,0.08);
display:flex;
flex-direction:column;
overflow:hidden;
padding:0;
position:relative;
transition:all .5s cubic-bezier(0.4,0,0.2,1)
}

.Search_card::before {
background:linear-gradient(90deg,#667eea 0%,#764ba2 100%);
content:'';
height:5px;
left:0;
opacity:0;
position:absolute;
right:0;
top:0;
transition:opacity .4s ease
}

.Search_card:hover::before {
opacity:1
}

.Search_card:hover {
box-shadow:0 16px 48px rgba(102,126,234,0.3);
transform:translateY(-12px)
}

.Search_link {
color:inherit;
display:flex;
flex:1;
flex-direction:column;
padding:20px;
text-decoration:none
}

.Search_thumb {
background:linear-gradient(135deg,#f7fafc 0%,#edf2f7 100%);
border-radius:16px;
height:220px;
margin-bottom:20px;
object-fit:contain;
padding:16px;
transition:transform .5s ease;
width:100%
}

.Search_card:hover .Search_thumb {
transform:scale(1.08) rotate(2deg)
}

.Search_name {
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
color:#1a202c;
display:-webkit-box;
font-size:17px;
font-weight:800;
line-clamp:2;
line-height:1.4;
margin:0 0 12px;
min-height:48px;
overflow:hidden
}

.Search_link:hover .Search_name {
color:#667eea
}

.Search_desc {
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
color:#718096;
display:-webkit-box;
flex:1;
font-size:15px;
line-clamp:2;
line-height:1.6;
margin:0 0 16px;
overflow:hidden
}

.Search_meta {
background:linear-gradient(135deg,#f7fafc 0%,#edf2f7 100%);
border-top:2px solid #e2e8f0;
display:flex;
flex-direction:column;
gap:12px;
margin-top:auto;
padding:20px
}

.Search_price-block {
align-items:baseline;
display:flex;
flex-wrap:wrap;
gap:12px
}

.Search_price {
color:#b91c1c;
font-size:28px;
font-weight:900;
letter-spacing:-.5px
}

.Search_price-old {
color:#a0aec0;
font-size:18px;
font-weight:600;
text-decoration:line-through
}

.Search_price-promo {
animation:pulse-price 2s ease-in-out infinite;
color:#b91c1c;
font-size:28px;
font-weight:900;
letter-spacing:-.5px
}

@keyframes pulse-price {
0%,100% {
transform:scale(1)
}

50% {
transform:scale(1.08)
}
}

.Search_stock {
align-items:center;
background:#d1fae5;
border-radius:24px;
color:#065f46;
display:inline-flex;
font-size:14px;
font-weight:800;
gap:6px;
letter-spacing:.8px;
padding:8px 16px;
text-transform:uppercase
}

.Search_stock::before {
content:"✓";
font-size:16px;
font-weight:900
}

.Search_stock.Search_out {
background:#fee2e2;
color:#b91c1c
}

.Search_stock.Search_out::before {
content:"✗"
}

.Search_pagination {
align-items:center;
display:flex;
flex-wrap:wrap;
gap:10px;
justify-content:center;
margin:56px 0 40px
}

.Search_page-link {
align-items:center;
background:#ffffff;
border:3px solid #e2e8f0;
border-radius:14px;
box-shadow:0 2px 8px rgba(0,0,0,0.06);
color:#4a5568;
display:inline-flex;
font-size:16px;
font-weight:700;
height:48px;
justify-content:center;
min-width:48px;
padding:0 20px;
text-decoration:none;
transition:all .4s cubic-bezier(0.4,0,0.2,1)
}

.Search_page-link:hover {
background:#667eea;
border-color:#667eea;
box-shadow:0 8px 20px rgba(102,126,234,0.4);
color:#ffffff;
transform:translateY(-4px)
}

.Search_page-link.Search_current {
background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);
border-color:#667eea;
box-shadow:0 8px 24px rgba(102,126,234,0.5);
color:#ffffff;
font-weight:900;
transform:translateY(-4px)
}

.Search_page-link.Search_disabled {
background:#f7fafc;
border-color:#e2e8f0;
box-shadow:none;
color:#cbd5e0;
cursor:not-allowed
}

.Search_page-link.Search_disabled:hover {
background:#f7fafc;
box-shadow:none;
color:#cbd5e0;
transform:none
}

@media (max-width: 1024px) {
.Search_filters-grid {
gap:20px;
grid-template-columns:1fr
}

.Search_price-filter {
grid-template-columns:1fr
}

.Search_grid {
gap:24px;
grid-template-columns:repeat(2,1fr)
}
}

@media (max-width: 768px) {
.Search_form {
padding:28px
}

.Search_filters-section {
padding:20px
}

.Search_label {
font-size:20px
}

.Search_motcle {
font-size:16px;
padding:16px 20px
}

.Search_btn {
font-size:16px;
padding:16px 32px
}

.Search_thumb {
height:200px
}
}

@media (max-width: 560px) {
.Search_grid {
gap:20px;
grid-template-columns:1fr
}

.Search_form {
border-radius:16px;
padding:24px
}

.Search_filters-section {
padding:16px
}

.Search_thumb {
height:240px
}

.Search_results-count {
flex-direction:column;
font-size:18px;
gap:12px;
padding:16px 20px;
text-align:center
}

.Search_pagination {
gap:8px
}

.Search_page-link {
font-size:15px;
height:44px;
min-width:44px
}
}

@keyframes fadeInUp {
from {
opacity:0;
transform:translateY(30px)
}

to {
opacity:1;
transform:translateY(0)
}
}

.Search_card {
animation:fadeInUp .6s ease-out;
animation-fill-mode:both
}

.Search_card:nth-child(1) {
animation-delay:.05s
}

.Search_card:nth-child(2) {
animation-delay:.1s
}

.Search_card:nth-child(3) {
animation-delay:.15s
}

.Search_card:nth-child(4) {
animation-delay:.2s
}

.Search_card:nth-child(5) {
animation-delay:.25s
}

.Search_card:nth-child(6) {
animation-delay:.3s
}

.Search_card:nth-child(7) {
animation-delay:.35s
}

.Search_card:nth-child(8) {
animation-delay:.4s
}

.Search_card:nth-child(9) {
animation-delay:.45s
}

.product-grid {
display:grid;
gap:28px;
grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
margin:40px 0
}

.product-card {
background:#ffffff;
border-radius:20px;
box-shadow:0 4px 16px rgba(0,0,0,0.08);
overflow:hidden;
padding:20px;
position:relative;
transition:all .5s cubic-bezier(0.4,0,0.2,1)
}

.product-card::before {
background:linear-gradient(90deg,#667eea 0%,#764ba2 100%);
content:'';
height:5px;
left:0;
opacity:0;
position:absolute;
right:0;
top:0;
transition:opacity .4s ease
}

.product-card:hover::before {
opacity:1
}

.product-card .categories h2 {
color:#667eea;
font-size:14px;
font-weight:700;
letter-spacing:1px;
margin:0 0 16px;
text-transform:uppercase
}

.product-card .conteneur_images {
background:linear-gradient(135deg,#f7fafc 0%,#edf2f7 100%);
border-radius:16px;
margin-bottom:16px;
overflow:hidden;
padding:16px
}

.product-card .conteneur_images img {
border-radius:12px;
height:auto;
transition:transform .5s ease;
width:100%
}

.product-card:hover .conteneur_images img {
transform:scale(1.08) rotate(2deg)
}

.product-card a {
color:#1a202c;
display:block;
font-size:16px;
font-weight:700;
text-decoration:none;
transition:color .3s ease
}

.product-card a:hover {
color:#667eea
}

.findproduct {
color:#718096;
font-size:14px;
line-height:1.6;
margin:12px 0
}

.lastproducts {
background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);
border-radius:20px;
box-shadow:0 8px 32px rgba(102,126,234,0.4);
margin:56px 0 32px
}

.lastproducts h2 {
color:#ffffff;
font-size:28px;
font-weight:800;
letter-spacing:2px;
margin:0;
text-align:center;
text-shadow:0 2px 8px rgba(0,0,0,0.2);
text-transform:uppercase
}

.itemhomepage-grid {
display:grid;
gap:28px;
grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
margin-top:40px
}

.itemhomepage {
background:#ffffff;
border-radius:20px;
box-shadow:0 4px 16px rgba(0,0,0,0.08);
display:flex;
flex-direction:column;
overflow:hidden;
transition:all .5s cubic-bezier(0.4,0,0.2,1)
}

.itemhomepage > div:first-child {
animation:pulse-price-badge 2s ease-in-out infinite;
background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%)!important;
border-radius:12px!important;
box-shadow:0 4px 16px rgba(239,68,68,0.5)!important;
font-size:18px!important;
font-weight:900!important;
left:12px;
padding:10px 16px!important;
position:absolute;
top:12px;
z-index:10
}

.product-card:hover,.itemhomepage:hover {
box-shadow:0 16px 48px rgba(102,126,234,0.3);
transform:translateY(-12px)
}

@keyframes pulse-price-badge {
0%,100% {
transform:scale(1)
}

50% {
transform:scale(1.05)
}
}

.itemimage {
align-items:center;
background:linear-gradient(135deg,#f7fafc 0%,#edf2f7 100%);
display:flex;
justify-content:center;
min-height:240px;
padding:20px
}

.itemimage img {
border-radius:12px;
height:auto;
max-height:200px;
object-fit:contain;
transition:transform .5s ease;
width:100%
}

.itemhomepage:hover .itemimage img {
transform:scale(1.08) rotate(2deg)
}

.itemname {
background:linear-gradient(135deg,#ffffff 0%,#f7fafc 100%);
border-top:2px solid #e2e8f0;
color:#1a202c;
font-size:16px;
font-weight:700;
line-height:1.4;
padding:20px;
text-align:center
}

@media (max-width: 1024px) {
#homepagemainproduct {
flex-direction:column!important;
padding:28px
}

.product-grid,.itemhomepage-grid {
gap:24px;
grid-template-columns:repeat(2,1fr)
}

.ppricemiddle {
font-size:28px
}
}

@media (max-width: 768px) {
#homepagemainproduct {
border-radius:16px;
padding:20px
}

.ppricemiddle {
font-size:24px
}

.lastproducts h2 {
font-size:22px
}
}

@media (max-width: 560px) {
.product-grid,.itemhomepage-grid {
gap:20px;
grid-template-columns:1fr
}

#homepagemainproduct {
padding:16px
}

.produit_principal_prix {
align-items:flex-start;
flex-direction:column;
padding:16px
}

.affichepromo,.affichepromo2 {
font-size:16px;
padding:8px 16px
}
}

@keyframes fadeInUp {
from {
opacity:0;
transform:translateY(30px)
}

to {
opacity:1;
transform:translateY(0)
}
}

.product-card,.itemhomepage {
animation:fadeInUp .6s ease-out;
animation-fill-mode:both
}

.product-card:nth-child(1),.itemhomepage:nth-child(1) {
animation-delay:.05s
}

.product-card:nth-child(2),.itemhomepage:nth-child(2) {
animation-delay:.1s
}

.product-card:nth-child(3),.itemhomepage:nth-child(3) {
animation-delay:.15s
}

.product-card:nth-child(4),.itemhomepage:nth-child(4) {
animation-delay:.2s
}

.product-card:nth-child(5),.itemhomepage:nth-child(5) {
animation-delay:.25s
}

.product-card:nth-child(6),.itemhomepage:nth-child(6) {
animation-delay:.3s
}

.product-card:nth-child(7),.itemhomepage:nth-child(7) {
animation-delay:.35s
}

.product-card:nth-child(8),.itemhomepage:nth-child(8) {
animation-delay:.4s
}

.subcat-main-container {
margin:0 auto;
max-width:1400px;
padding:20px
}

.subcat-header {
background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);
border-radius:24px;
box-shadow:0 12px 48px rgba(102,126,234,0.4);
margin-bottom:48px;
overflow:hidden;
padding:48px 40px;
position:relative
}

.subcat-header::before {
background:radial-gradient(circle,rgba(255,255,255,0.1) 0%,transparent 70%);
border-radius:50%;
content:'';
height:500px;
position:absolute;
right:-10%;
top:-50%;
width:500px
}

.subcat-header-title {
color:#ffffff;
font-size:42px;
font-weight:900;
letter-spacing:2px;
margin:0 0 20px;
position:relative;
text-shadow:0 4px 12px rgba(0,0,0,0.3);
text-transform:uppercase;
z-index:1
}

.subcat-header-desc {
color:rgba(255,255,255,0.95);
font-size:18px;
line-height:1.8;
max-width:900px;
position:relative;
z-index:1
}

.subcat-section {
animation:fadeInUp .6s ease-out;
margin-bottom:64px
}

.subcat-title-bar {
align-items:center;
background:linear-gradient(135deg,#ffffff 0%,#f7fafc 100%);
border-bottom:4px solid #667eea;
border-radius:20px 20px 0 0;
box-shadow:0 4px 16px rgba(0,0,0,0.08);
display:flex;
justify-content:space-between;
margin-bottom:0;
padding:24px 32px
}

.subcat-title {
align-items:center;
color:#1a202c;
display:flex;
font-size:28px;
font-weight:800;
gap:12px;
margin:0
}

.subcat-icon {
filter:drop-shadow(0 2px 4px rgba(0,0,0,0.1));
font-size:32px
}

.subcat-count-badge {
align-items:center;
background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);
border-radius:12px;
box-shadow:0 4px 16px rgba(102,126,234,0.4);
color:#ffffff;
display:inline-flex;
font-size:16px;
font-weight:700;
gap:8px;
padding:12px 24px;
text-decoration:none;
transition:all .4s cubic-bezier(0.4,0,0.2,1)
}

.subcat-count-badge:hover {
box-shadow:0 8px 24px rgba(102,126,234,0.6);
transform:translateX(8px)
}

.subcat-arrow {
font-size:18px;
transition:transform .3s ease
}

.subcat-count-badge:hover .subcat-arrow {
transform:translateX(4px)
}

.subcat-grid {
background:#ffffff;
border-radius:0 0 20px 20px;
box-shadow:0 8px 32px rgba(0,0,0,0.08);
display:grid;
gap:32px;
grid-template-columns:2fr 1fr;
padding:40px
}

.subcat-featured-product {
display:flex;
flex-direction:column;
gap:24px
}

.subcat-featured-image {
align-items:center;
background:linear-gradient(135deg,#f7fafc 0%,#edf2f7 100%);
border-radius:20px;
display:flex;
justify-content:center;
min-height:400px;
overflow:hidden;
padding:32px;
position:relative
}

.subcat-featured-img {
border-radius:16px;
height:auto;
max-height:400px;
max-width:100%;
object-fit:contain;
transition:transform .5s cubic-bezier(0.4,0,0.2,1)
}

.subcat-featured-image:hover .subcat-featured-img {
transform:scale(1.08) rotate(2deg)
}

.subcat-no-image {
color:#cbd5e1;
font-size:120px;
opacity:.2
}

.subcat-featured-title {
color:#1a202c;
font-size:28px;
font-weight:800;
line-height:1.3;
margin:0
}

.subcat-featured-title a {
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);
background-clip:text;
color:inherit;
text-decoration:none;
transition:color .3s ease
}

.subcat-featured-title a:hover {
opacity:.8
}

.subcat-featured-desc {
color:#4a5568;
font-size:16px;
line-height:1.8;
margin:0
}

.subcat-featured-price {
background:linear-gradient(135deg,#f7fafc 0%,#edf2f7 100%);
border:2px solid #e2e8f0;
border-radius:16px;
padding:24px
}

.subcat-price-block {
align-items:center;
display:flex;
flex-wrap:wrap;
gap:16px
}

.subcat-price-old {
color:#a0aec0;
font-size:20px;
font-weight:600;
text-decoration:line-through
}

.subcat-price-promo {
animation:pulse-price 2s ease-in-out infinite;
color:#b91c1c;
font-size:36px;
font-weight:900;
letter-spacing:-.5px
}

.subcat-price-normal {
color:#1a202c;
font-size:36px;
font-weight:900;
letter-spacing:-.5px
}

.subcat-badge-promo {
align-items:center;
animation:pulse-badge 2s ease-in-out infinite;
background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);
border-radius:12px;
box-shadow:0 4px 16px rgba(239,68,68,0.4);
color:white;
display:inline-flex;
font-size:20px;
font-weight:900;
justify-content:center;
padding:12px 20px
}

.subcat-btn-details {
align-items:center;
align-self:flex-start;
background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);
border-radius:16px;
box-shadow:0 8px 24px rgba(102,126,234,0.4);
color:#ffffff;
display:inline-flex;
font-size:18px;
font-weight:700;
gap:12px;
padding:16px 32px;
text-decoration:none;
transition:all .4s cubic-bezier(0.4,0,0.2,1)
}

.subcat-btn-details:hover {
box-shadow:0 12px 32px rgba(102,126,234,0.6);
transform:translateY(-4px)
}

.subcat-sidebar-title {
background:linear-gradient(135deg,#f7fafc 0%,#edf2f7 100%);
border-left:5px solid #ffd814;
border-radius:12px;
color:#1a202c;
font-size:20px;
font-weight:800;
margin:0 0 12px;
padding:16px
}

.subcat-sidebar-item {
background:#ffffff;
border:2px solid #e2e8f0;
border-radius:16px;
box-shadow:0 2px 8px rgba(0,0,0,0.05);
display:flex;
gap:16px;
padding:16px;
transition:all .4s cubic-bezier(0.4,0,0.2,1)
}

.subcat-sidebar-item:hover {
border-color:#667eea;
box-shadow:0 8px 24px rgba(102,126,234,0.2);
transform:translateX(-8px)
}

.subcat-sidebar-image {
align-items:center;
background:linear-gradient(135deg,#f7fafc 0%,#edf2f7 100%);
border-radius:12px;
display:flex;
flex-shrink:0;
height:100px;
justify-content:center;
overflow:hidden;
width:100px
}

.subcat-sidebar-img {
max-height:100%;
max-width:100%;
object-fit:contain;
transition:transform .4s ease
}

.subcat-sidebar-item:hover .subcat-sidebar-img {
transform:scale(1.15)
}

.subcat-no-image-small {
color:#cbd5e1;
font-size:40px;
opacity:.2
}

.subcat-sidebar-info {
display:flex;
flex:1;
flex-direction:column;
gap:8px
}

.subcat-sidebar-product-title {
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
color:#1a202c;
display:-webkit-box;
font-size:15px;
font-weight:700;
line-clamp:2;
line-height:1.3;
margin:0;
overflow:hidden
}

.subcat-sidebar-product-title a {
color:inherit;
text-decoration:none;
transition:color .3s ease
}

.subcat-sidebar-product-title a:hover {
color:#667eea
}

.subcat-sidebar-ref {
color:#718096;
font-size:12px;
font-style:italic;
margin:0
}

.subcat-sidebar-price {
align-items:center;
color:#1a202c;
display:flex;
flex-wrap:wrap;
font-size:16px;
font-weight:800;
gap:8px;
margin:0
}

.subcat-sidebar-price-promo {
color:#b91c1c;
font-size:18px
}

.subcat-sidebar-discount {
background:#ef4444;
border-radius:6px;
color:white;
display:inline-block;
font-size:12px;
font-weight:900;
padding:4px 8px
}

.subcat-empty {
background:#ffffff;
border-radius:24px;
box-shadow:0 8px 32px rgba(0,0,0,0.08);
padding:80px 40px;
text-align:center
}

.subcat-empty-icon {
animation:float 3s ease-in-out infinite;
font-size:120px;
margin-bottom:24px;
opacity:.3
}

.subcat-empty h2 {
color:#1a202c;
font-size:28px;
font-weight:800;
margin:0 0 16px
}

.subcat-empty p {
color:#718096;
font-size:18px;
margin:0
}

.subcat-featured-info,.subcat-sidebar {
display:flex;
flex-direction:column;
gap:20px
}

@keyframes fadeInUp {
from {
opacity:0;
transform:translateY(30px)
}

to {
opacity:1;
transform:translateY(0)
}
}

@keyframes pulse-price {
0%,100% {
transform:scale(1)
}

50% {
transform:scale(1.05)
}
}

@keyframes pulse-badge {
0%,100% {
transform:scale(1)
}

50% {
transform:scale(1.08)
}
}

@keyframes float {
0%,100% {
transform:translateY(0)
}

50% {
transform:translateY(-15px)
}
}

@media (max-width: 1200px) {
.subcat-grid {
gap:24px;
grid-template-columns:1.5fr 1fr;
padding:32px
}

.subcat-featured-title {
font-size:24px
}

.subcat-price-promo,.subcat-price-normal {
font-size:28px
}
}

@media (max-width: 1024px) {
.subcat-header {
padding:36px 28px
}

.subcat-header-title {
font-size:32px
}

.subcat-title-bar {
padding:20px 24px
}

.subcat-title {
font-size:24px
}
}

@media (max-width: 768px) {
.subcat-grid {
gap:32px;
grid-template-columns:1fr;
padding:24px
}

.subcat-sidebar {
order:-1
}

.subcat-featured-image {
min-height:300px;
padding:24px
}

.subcat-featured-img {
max-height:300px
}

.subcat-title-bar {
align-items:flex-start;
flex-direction:column;
gap:16px
}

.subcat-count-badge {
align-self:stretch;
justify-content:center
}

.subcat-header {
margin-bottom:32px;
padding:28px 20px
}

.subcat-header-title {
font-size:28px
}

.subcat-header-desc {
font-size:16px
}
}

@media (max-width: 560px) {
.subcat-main-container {
padding:12px
}

.subcat-header {
border-radius:16px;
margin-bottom:24px;
padding:24px 16px
}

.subcat-title-bar {
border-radius:16px 16px 0 0;
padding:16px
}

.subcat-grid {
border-radius:0 0 16px 16px;
padding:20px
}

.subcat-featured-desc {
font-size:14px
}

.subcat-price-old {
font-size:16px
}

.subcat-badge-promo {
font-size:16px;
padding:8px 16px
}

.subcat-btn-details {
font-size:16px;
justify-content:center;
padding:14px 24px;
width:100%
}

.subcat-sidebar-item {
align-items:center;
flex-direction:column;
text-align:center
}

.subcat-sidebar-image {
height:120px;
width:120px
}

.subcat-sidebar-price {
justify-content:center
}

.subcat-header-title,.subcat-icon,.subcat-price-promo,.subcat-price-normal {
font-size:24px
}

.subcat-title,.subcat-featured-title {
font-size:20px
}
}

.subcat-btn-details,.subcat-btn-details:link,.subcat-btn-details:visited,.subcat-count-badge,.subcat-btn-details:active {
color:#ffffff!important;
text-decoration:none!important
}

.subcat-btn-details:hover {
color:#ffffff!important
}

.product-breadcrumb {
align-items:center;
background:linear-gradient(135deg,#ffffff 0%,#f7fafc 100%);
border-left:5px solid #667eea;
border-radius:16px;
box-shadow:0 2px 8px rgba(0,0,0,0.05);
display:flex;
flex-wrap:wrap;
font-size:15px;
gap:12px;
margin-bottom:32px;
padding:20px 24px
}

.breadcrumb-home {
align-items:center;
color:#667eea;
display:flex;
font-weight:700;
gap:4px;
text-decoration:none;
transition:all .3s ease
}

.breadcrumb-home:hover {
color:#764ba2;
transform:translateX(2px)
}

.breadcrumb-separator {
color:#cbd5e1;
font-size:18px;
font-weight:700
}

.breadcrumb-link {
color:#4a5568;
font-weight:600;
position:relative;
text-decoration:none;
transition:all .3s ease
}

.breadcrumb-link::after {
background:#667eea;
bottom:-2px;
content:'';
height:2px;
left:0;
position:absolute;
transition:width .3s ease;
width:0
}

.breadcrumb-link:hover::after {
width:100%
}

.breadcrumb-current {
color:#1a202c;
font-weight:700
}

.product-breadcrumb a:hover {
text-decoration:none
}

.itemhomepage-grid {
display:grid;
gap:28px;
grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
margin:40px 0
}

.itemhomepage.product-card-modern {
background:#ffffff;
border:2px solid transparent;
border-radius:20px;
box-shadow:0 4px 16px rgba(0,0,0,0.08);
display:flex;
flex-direction:column;
overflow:hidden;
position:relative;
transition:all .5s cubic-bezier(0.4,0,0.2,1)
}

.itemhomepage.product-card-modern::before {
background:linear-gradient(90deg,#667eea 0%,#764ba2 100%);
border-radius:0;
content:'';
height:5px;
left:0;
opacity:0;
position:absolute;
right:0;
top:0;
transition:opacity .4s ease;
z-index:10
}

.itemhomepage.product-card-modern:hover::before {
opacity:1
}

.itemhomepage.product-card-modern:hover {
border-color:#667eea;
box-shadow:0 16px 48px rgba(102,126,234,0.3);
transform:translateY(-12px)
}

.product-out-of-stock {
filter:grayscale(30%);
opacity:.7
}

.product-out-of-stock:hover {
box-shadow:0 8px 24px rgba(0,0,0,0.15);
transform:translateY(-4px)
}

.product-badge-promo,.product-badge-stock {
position:absolute;
z-index:30
}

.product-badge-promo {
animation:pulse-badge 2s ease-in-out infinite;
background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);
border-radius:12px;
box-shadow:0 4px 16px rgba(239,68,68,0.5);
color:white;
font-size:16px;
font-weight:900;
padding:8px 16px;
right:16px;
top:16px
}

.product-badge-stock {
align-items:center;
border-radius:10px;
box-shadow:0 2px 8px rgba(0,0,0,0.2);
display:flex;
font-size:13px;
font-weight:800;
gap:6px;
left:16px;
letter-spacing:.5px;
padding:8px 14px;
text-transform:uppercase;
top:16px
}

.badge-in-stock {
background:linear-gradient(135deg,#10b981 0%,#059669 100%);
color:white
}

.badge-out-stock {
background:linear-gradient(135deg,#6b7280 0%,#4b5563 100%);
color:white
}

.itemimage.product-image-wrapper {
align-items:center;
background:linear-gradient(135deg,#f7fafc 0%,#edf2f7 100%);
border-radius:20px 20px 0 0;
display:flex;
justify-content:center;
min-height:260px;
padding:24px;
position:relative
}

.product-img {
border-radius:12px;
height:auto;
max-height:220px;
object-fit:contain;
transition:transform .5s cubic-bezier(0.4,0,0.2,1);
width:100%
}

.itemhomepage:hover .product-img {
transform:scale(1.1) rotate(2deg)
}

.product-no-image {
color:#cbd5e1;
font-size:80px;
opacity:.2
}

.disabled-link {
cursor:not-allowed;
opacity:.6;
pointer-events:none
}

.itemname.product-name {
align-items:center;
color:#1a202c;
display:flex;
font-size:17px;
font-weight:800;
justify-content:center;
line-height:1.4;
min-height:70px;
padding:20px 20px 12px;
text-align:center
}

.itemname.product-name a {
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
color:inherit;
display:-webkit-box;
line-clamp:2;
overflow:hidden;
text-decoration:none;
transition:color .3s ease
}

.product-out-of-stock .itemname.product-name a {
color:#718096
}

.itemprice.product-price-block {
align-items:center;
display:flex;
flex-direction:column;
gap:8px;
padding:0 20px 16px;
text-align:center
}

.product-prices {
align-items:center;
display:flex;
flex-direction:column;
gap:4px
}

.product-price-old {
color:#a0aec0;
font-size:16px;
font-weight:600;
text-decoration:line-through
}

.product-price-promo {
animation:pulse-price 2s ease-in-out infinite;
color:#b91c1c;
font-size:28px;
font-weight:900;
letter-spacing:-.5px
}

.product-price-normal {
color:#1a202c;
font-size:28px;
font-weight:900;
letter-spacing:-.5px
}

.product-promo-label {
animation:blink-promo 1.5s ease-in-out infinite;
background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);
border-radius:8px;
color:white;
display:inline-block;
font-size:13px;
font-weight:800;
letter-spacing:.5px;
padding:6px 14px;
text-transform:uppercase
}

.breadcrumb-link:hover,.itemname.product-name a:hover {
color:#667eea
}

@keyframes blink-promo {
0%,100% {
opacity:1
}

50% {
opacity:.7
}
}

.product-action {
margin-top:auto;
padding:0 20px 20px
}

.product-btn {
border:none;
border-radius:12px;
cursor:pointer;
display:block;
font-size:16px;
font-weight:700;
letter-spacing:.5px;
padding:14px 24px;
text-align:center;
text-decoration:none;
text-transform:uppercase;
transition:all .4s cubic-bezier(0.4,0,0.2,1);
width:100%
}

.product-btn-primary {
background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);
box-shadow:0 4px 16px rgba(102,126,234,0.4);
color:#ffffff
}

.product-btn-primary:hover {
box-shadow:0 8px 24px rgba(102,126,234,0.6);
transform:translateY(-3px)
}

.product-btn-disabled {
background:linear-gradient(135deg,#cbd5e0 0%,#a0aec0 100%);
box-shadow:0 2px 8px rgba(0,0,0,0.1);
color:#718096;
cursor:not-allowed
}

.product-btn-disabled:hover {
box-shadow:0 2px 8px rgba(0,0,0,0.1);
transform:none
}

.product-empty-state {
background:#ffffff;
border-radius:24px;
box-shadow:0 8px 32px rgba(0,0,0,0.08);
margin:40px auto;
max-width:600px;
padding:80px 40px;
text-align:center
}

.product-empty-icon {
animation:float 3s ease-in-out infinite;
font-size:120px;
margin-bottom:24px;
opacity:.3
}

.product-empty-state h2 {
color:#1a202c;
font-size:28px;
font-weight:800;
margin:0 0 16px
}

.product-empty-state p {
color:#718096;
font-size:18px;
line-height:1.6;
margin:0
}

@keyframes pulse-badge {
0%,100% {
transform:scale(1)
}

50% {
transform:scale(1.08)
}
}

@keyframes pulse-price {
0%,100% {
transform:scale(1)
}

50% {
transform:scale(1.05)
}
}

@keyframes float {
0%,100% {
transform:translateY(0)
}

50% {
transform:translateY(-15px)
}
}

@keyframes fadeInUp {
from {
opacity:0;
transform:translateY(30px)
}

to {
opacity:1;
transform:translateY(0)
}
}

.itemhomepage.product-card-modern {
animation:fadeInUp .6s ease-out;
animation-fill-mode:both
}

.itemhomepage.product-card-modern:nth-child(1) {
animation-delay:.05s
}

.itemhomepage.product-card-modern:nth-child(2) {
animation-delay:.1s
}

.itemhomepage.product-card-modern:nth-child(3) {
animation-delay:.15s
}

.itemhomepage.product-card-modern:nth-child(4) {
animation-delay:.2s
}

.itemhomepage.product-card-modern:nth-child(5) {
animation-delay:.25s
}

.itemhomepage.product-card-modern:nth-child(6) {
animation-delay:.3s
}

.itemhomepage.product-card-modern:nth-child(7) {
animation-delay:.35s
}

.itemhomepage.product-card-modern:nth-child(8) {
animation-delay:.4s
}

.itemhomepage.product-card-modern:nth-child(9) {
animation-delay:.45s
}

@media (max-width: 1024px) {
.itemhomepage-grid {
gap:24px;
grid-template-columns:repeat(3,1fr)
}
}

@media (max-width: 768px) {
.itemhomepage-grid {
gap:20px;
grid-template-columns:repeat(2,1fr)
}

.product-breadcrumb {
font-size:14px;
gap:8px;
padding:16px 20px
}

.breadcrumb-separator {
font-size:16px
}

.itemimage.product-image-wrapper {
min-height:220px;
padding:20px
}

.product-img {
max-height:180px
}

.itemname.product-name {
font-size:15px;
min-height:60px;
padding:16px 16px 10px
}

.product-price-promo,.product-price-normal {
font-size:24px
}

.product-badge-stock {
font-size:11px;
left:8px;
padding:6px 10px;
top:8px
}
}

@media (max-width: 560px) {
.itemhomepage-grid {
gap:20px;
grid-template-columns:1fr
}

.product-breadcrumb {
border-radius:12px;
font-size:13px;
margin-bottom:24px;
padding:14px 16px
}

.itemhomepage.product-card-modern {
border-radius:16px
}

.itemimage.product-image-wrapper {
border-radius:16px 16px 0 0;
min-height:240px
}

.product-img {
max-height:200px
}

.itemname.product-name {
font-size:16px;
min-height:auto;
padding:20px 16px 12px
}

.product-price-promo,.product-price-normal {
font-size:26px
}

.product-btn {
font-size:15px;
padding:16px 24px
}

.product-empty-state {
margin:24px 16px;
padding:60px 24px
}

.product-empty-icon {
font-size:80px
}

.product-empty-state h2 {
font-size:22px
}

.product-empty-state p {
font-size:16px
}
}

.product-action .product-btn-primary,.product-action .product-btn-primary:link,.product-action .product-btn-primary:visited,.product-action .product-btn-primary:active,.product-action .product-btn-primary:hover {
color:#ffffff!important;
text-decoration:none!important
}