/* © muathemewpgiare.com – Layouts Module CSS v3.0.0 */

/* Grid Layout */
.mfs-layout-grid{display:grid;gap:20px;padding:24px;}
.mfs-cols-2{grid-template-columns:repeat(2,1fr);}
.mfs-cols-3{grid-template-columns:repeat(3,1fr);}
.mfs-cols-4{grid-template-columns:repeat(4,1fr);}
.mfs-cols-5{grid-template-columns:repeat(5,1fr);}
.mfs-cols-6{grid-template-columns:repeat(6,1fr);}

/* List Layout */
.mfs-layout-list{display:flex;flex-direction:column;gap:16px;padding:24px;}
.mfs-layout-list .mfs-card{display:flex;flex-direction:row;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.06);}
.mfs-layout-list .mfs-card .mfs-card-image{width:220px;min-width:220px;height:auto;}
.mfs-layout-list .mfs-card .mfs-card-image img{width:100%;height:100%;object-fit:cover;}
.mfs-layout-list .mfs-card .mfs-card-body{flex:1;padding:20px;display:flex;flex-direction:column;justify-content:center;}

/* Carousel Layout */
.mfs-layout-carousel{display:flex;gap:20px;padding:24px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;}
.mfs-layout-carousel::-webkit-scrollbar{height:6px;}
.mfs-layout-carousel::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px;}
.mfs-layout-carousel::-webkit-scrollbar-thumb{background:var(--mfs-color,#e91e63);border-radius:10px;}
.mfs-layout-carousel .mfs-card{min-width:260px;max-width:300px;scroll-snap-align:start;flex-shrink:0;}

/* Masonry Layout */
.mfs-layout-masonry{column-count:4;column-gap:20px;padding:24px;}
.mfs-layout-masonry .mfs-card{break-inside:avoid;margin-bottom:20px;display:inline-block;width:100%;}

/* Card Styles */
.mfs-card{border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.06);transition:all .3s ease;position:relative;display:flex;flex-direction:column;}
.mfs-card:hover{transform:translateY(-6px);box-shadow:0 12px 32px rgba(0,0,0,.12);}
.mfs-card-image{position:relative;overflow:hidden;}
.mfs-card-image img{width:100%;aspect-ratio:1;object-fit:cover;transition:transform .5s;}
.mfs-card:hover .mfs-card-image img{transform:scale(1.08);}
.mfs-card-body{padding:16px;flex:1;display:flex;flex-direction:column;}
.mfs-card-title{font-size:14px;font-weight:600;color:#1f2937;line-height:1.4;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.mfs-card-title a{color:inherit;text-decoration:none;}
.mfs-card-price{margin-top:auto;}
.mfs-card-price del{color:#9ca3af;font-size:12px;}
.mfs-card-price .mfs-price-current{font-size:20px;font-weight:800;color:var(--mfs-color,#ef4444);}
.mfs-card-actions{padding:12px 16px;display:flex;gap:8px;align-items:center;}
.mfs-card-cta{flex:1;text-align:center;padding:10px 16px;border-radius:10px;background:var(--mfs-color,#ef4444);color:#fff;font-weight:700;font-size:13px;text-decoration:none;transition:all .2s;border:none;cursor:pointer;}
.mfs-card-cta:hover{opacity:.9;box-shadow:0 4px 12px rgba(0,0,0,.2);color:#fff;}

/* Card Modern */
.mfs-card-modern{border:1px solid rgba(0,0,0,.06);}
.mfs-card-modern:hover{border-color:var(--mfs-color,#ef4444);}

/* Card Glassmorphism */
.mfs-card-glass{background:rgba(255,255,255,.8);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.3);}

/* Card Neumorphism */
.mfs-card-neumorphism{box-shadow:8px 8px 16px #d1d5db,-8px -8px 16px #ffffff;border:none;}
.mfs-card-neumorphism:hover{box-shadow:12px 12px 24px #d1d5db,-12px -12px 24px #ffffff;}

/* Card Flat */
.mfs-card-flat{box-shadow:none;border:2px solid #f3f4f6;}
.mfs-card-flat:hover{border-color:var(--mfs-color,#ef4444);box-shadow:none;transform:none;}

/* Card Bordered */
.mfs-card-bordered{border:2px solid var(--mfs-color,#ef4444);box-shadow:none;}

/* Responsive */
@media(max-width:1024px){.mfs-cols-5,.mfs-cols-6{grid-template-columns:repeat(3,1fr);}.mfs-layout-masonry{column-count:3;}}
@media(max-width:768px){.mfs-cols-3,.mfs-cols-4,.mfs-cols-5,.mfs-cols-6{grid-template-columns:repeat(2,1fr);}.mfs-layout-masonry{column-count:2;}.mfs-layout-list .mfs-card{flex-direction:column;}.mfs-layout-list .mfs-card .mfs-card-image{width:100%;height:200px;}}
@media(max-width:480px){.mfs-cols-2,.mfs-cols-3,.mfs-cols-4,.mfs-cols-5,.mfs-cols-6{grid-template-columns:1fr;}.mfs-layout-masonry{column-count:1;}}