How to Full width Header and Footer on product Category page on Woocommerce

I have no link as this site is not yet live. but I can provide you with screenshot <a href="https://ibb.co/geeiwc"><img src="https://thumb.ibb.co/geeiwc/Capture.png" alt="Capture" border="0"></a> Please help me with these. I almost used every css like these

.archive.woocommerce .x-sidebar {
display: none !important;
}

.archive.woocommerce {
padding-left: 0 !important;
}

@media screen and (min-width: 1200px) {
.archive.woocommerce.x-sidebar-content-active .x-navbar-fixed-top {
left: 0 !important;
}
}

body.woocommerce div#primary {
width: 100%;
}

body.woocommerce div#secondary {
display: none;
}

body.single-product #content {
width: 100%;
}

.container{
width: 100% !important;
}