/*!
Theme Name: Premium denim Fabrics
Theme URI: https://premiumdenimfabrics.us/
Author: Daljeet Kaur
Author URI: daljeet.laddi@gmail.com
Description: Premium denim Fabrics
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: premium-denim-fabrics
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.

*/


/* 
PREMIUM DENIM FEBRIC THEME
=========================

*******INDEXING**********
1) HOME
1.1) Header
1.2) Slider Section
1.3) Home: Slider Section 
1.4) Who we are
1.5) Why we are 
1.6) Warehouse
1.7) News Letter
1.8) footer
2.) Contact Us
3.) inventory page
4.) Inventory detail page
5.) About Us page 
6.) Faq

 */



  /* Global CSS */
 body {
   font-family: 'Raleway', sans-serif; 
    font-weight: 400;
    line-height: normal;
    color: #111;
 }

 img {
    max-width: 100%;
    vertical-align: middle;
 }

 a, .customize_btn, select, button, input, textarea {
    transition: all .35s ease;
    -webkit-transition: all .35s ease;
    -ms-transition: all .35s ease;
 }

 a:focus, select:focus, button:focus, .btn:focus, input:focus  {
    outline: none;
 }

 h1, h2, h3, h4, h5, h6 , p, figure {margin-bottom: 0;margin-top: 0;}

 .container {
    max-width: 1330px;
    width: 100%;
 }

ul, ol {padding: 0; margin: 0; list-style: none;}

a {
    color: #111;
}

a:hover, a:active, a:focus {
    color: #111;
    text-decoration: none;
}

.common {padding-top: 70px; padding-bottom: 70px;}

/* Home: Header  */

.headerTop_container {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;
}

.social_iconWrap > li {
    display: inline-block;
    padding: 0 10px;
}

.top_right {
    display: flex;
    align-items: center;
    flex-flow: row wrap;
}

.serach_form_wrapper {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    padding: 5px 15px;
    background-color: #000;
    display: flex;
    align-items: center;
    justify-content: space-between;
    opacity: 0;
    visibility: hidden;
    transition: all .35s ease;
    -webkit-transition: all .35s ease;
    -ms-transition: all .35s ease;
}

.searchSlide .serach_form_wrapper {
    opacity: 1;
    visibility: visible;
}

.header_main_container {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;
}

.main-menu > li {
    display: inline-block;
    padding: 0 25px;
}

.main-menu > li:last-child {
    padding-right: 0;
}

.toggleBtn {
    display: none;
}

/* Home: Slider Section */

.home .main_slider_outer {
    margin-top: -182px;
    overflow: hidden;
    position: relative;
}

.slider_wrapper .item img {
    margin-left: auto;
    margin-right: auto;
    display: table;
}

.slider_wrapper {
    background-color: #333;
}



.main_slider_outer:after {
    content: "";
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.45);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}


.Topleft a, .social_iconWrap > li > a {
    font-size: 14px;
    font-family: Montserrat;
    color: #fff;
    font-weight: 300;
}

.Topleft a {
    margin-right: 20px;
}

.search_wrapper {
    padding-left: 10px;
}

.search_btn {
    background-color: transparent;
    border: none;
    color: #fff;
    padding: 0;
    font-size: 16px;
}

.home .header_top {
    box-shadow: 0 40px 150px 60px #111;
}

.Topleft a i {margin-right: 5px;}

.Topleft a:hover, .Topleft a:focus, .search_btn:hover, .search_btn:focus, .social_iconWrap > li > a:hover, .social_iconWrap > li > a:focus, 
.main-menu > li > a:hover, .main-menu > li > a:focus, .main-menu > li.current_page_item > a {
    color: #ffd60a;
    opacity: 1;
}

.main_header {
    position: relative;
    z-index: 1;
}

.header_main {
    padding: 20px 0;
    background: #152249;
    border-top: 1px solid #272626;
}

.home .header_main {
    background-color: transparent;
}

 .header_top {
    box-shadow: none;    
    background-color: #111;
    padding: 15px 0;
}

.main-menu > li > a {
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    text-transform: uppercase;
}

.caption {
position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    max-width: 600px;
    text-align: center;
    width: 100%;
    z-index: 2;
}

.banner_title {
    font-size: 58px;
    color: #fff;
    font-weight: 700;
    letter-spacing: 2px;
    line-height: normal;
}

.serach_form_wrapper .widget_search {
    flex-basis: 100%;
    max-width: 100%;
}

.search_closeBtn {
    color: #111;
    font-size: 18px;
    cursor: pointer;
    padding: 9px 15px;
    background: #fff;
}

.serach_form_wrapper .widget_search .search-form .screen-reader-text {
    display: none;
}

.serach_form_wrapper .widget_search .search-form {
    position: relative;
    border: 1px solid #fff;
}

.serach_form_wrapper .widget_search .search-form label {
    margin: 0;
    display: block;
}

.serach_form_wrapper .widget_search .search-form input.search-field {
    width: 100%;
    height: 37px;
    background-color: transparent;
    border: none;
    padding-left: 15px;
    padding-right: 100px;
    color: #fff;
    font-family: inherit;
    font-size: 16px;
    line-height: normal;
}

.serach_form_wrapper .widget_search .search-form .search-submit {
    position: absolute;
    right: 2px;
    top: 0;
    bottom: 0;
    overflow: hidden;
    color: #333;
    background-color: #fff;
    border: none;
    font-weight: 500;
    padding: 0 15px;
}


/* Who we are */

.main_title_wrapper {
    text-align: center;
}

.main_title {
    display: inline-block;
    font-size: 32px;
    font-weight: 600;
    text-transform: none;
    font-style: normal;
    text-decoration: none;
    margin-bottom: 50px;
    color: #292929;
    font-family: inherit;
    line-height: 1.4;
    position: relative;
    padding-top: 20px;
}

.main_title:before {
    content: "";
    height: 4px;
    width: 35px;
    position: absolute;
    background: #ffd60a;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
}

.content p {
    font-size: 16px;
    line-height: 1.6;
    color: #5f656d;
    font-weight: 400;
    font-family: inherit;
}

.whoWeAre .content {
    max-width: 1000px;
    margin: 0 auto;
}

.customize_btn {
    background: #ffd60a;
    display: inline-block;
    margin-top: 45px;
    line-height: 40px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 0 15px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #111;
}

.btn_readMore {
    max-width: 160px;
    width: 100%;
}

.customize_btn:hover, .customize_btn:focus, .customize_btn:active {
    background-color: #111;
    color: #fff;
}

.whoWeAre {
/*     background: #000 url(../images/about_usBanner.jpg) center center no-repeat; */
    background-size: cover !important;
    background-attachment: fixed !important;
}

.whoWeAre .main_title {color: #fff;margin-bottom: 40px;}

.whoWeAre .content p {
    color: #ccc;
}

.whoWeAre .btn_readMore:hover, 
.whoWeAre .btn_readMore:focus, 
.whoWeAre .btn_readMore:active {
    background-color: #fff;
    color: #000;
}


/* Why we are */

.feature_icon img {
    height: 85px;
    width: auto;
    transition: all .35s ease;
}

.feature_title {
    margin-top: 30px;
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 700;
}

.feature_wrapper:hover .feature_icon img {
    transform: translateY(-10px);
}

.feature_wrapper {
    padding: 45px 0 25px;
}


/* Warehouse */

.wareHouseWrapper {
    position: relative;
    overflow: hidden;
    display:  block;
}
.wareHouseName a {
    color: #fff;
}
.wareHouseWrapper:after 
{
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    /*background-color: rgba(0,0,0,.65);*/
	background-color: rgba(0, 0, 0, 0.17);
    transition: all .35s ease;
    
}

.wareHouseYards a{
	color: #fff;
}
.wareHouse_img {
    transition: all .25s ease;
    text-align: center;
}

.wareHouseWrapper:hover .wareHouseName {top: -230px;}
.wareHouseWrapper:hover .wareHouseYards {top: 0px;}
.wareHouseWrapper:hover .wareHouse_img {transform: scale(1.2) rotate(10deg);}

.wareHouseName, .wareHouseYards {
    position: absolute;
    bottom: auto;
    left: 0;
    right: 0;
    font-size: 22px;
    padding: 75px 30px 50px;
    text-align: center;
    color: #fff;
    font-weight: 500;
    line-height: 1.5;
    transition: all .35s ease;
    height: 100%;
    z-index: 1;

}

.wareHouseName {
    top: 0;

}

.wareHouseYards {
    top: 230px;
    background-color: rgba(0,0,0,.65);
}

/* News Letter */

.newsLetter {
    background-color: #ffd60a;
    padding-top: 30px;
    padding-bottom: 30px;
}

.newstitleWrapper h3 {
    font-size: 35px;
    font-weight: 700;
    color: #333;
    line-height: normal;
    margin-bottom: 10px;
    font-family: inherit;
}

.newstitleWrapper p {
    font-size: 18px;
    font-weight: 400;
    color: #111;
    line-height: 2;
    font-family: inherit;
}

.newletter_form .input_field[type="email"] {
    height: 50px;
    padding: 0 15px;
    font-family: Montserrat;
    font-weight: 400;
    font-size: 16px;
    width: 100%;
    border: 1px solid transparent;
    color: #333;
    line-height: normal;
    background-color: #fff;
}


.newletter_form .input_field[type="email"]:focus {
    border: 1px solid #333333;
}

.newletter_form .subscbribe_btnss[type="submit"] {
    margin-top: 0;
    border: none;
    background-color: #333;
    color: #fff;
    height: 50px;
    padding-left: 15px;
    padding-right: 15px;
    min-width: 160px;
    border: 2px solid transparent;
}

.newletter_form .form_group {
    display: flex;
    align-items: center;
}

.newsLetter .row {
    align-items: center;
}

.newletter_form .tnp-subscription div.tnp-field {
    margin-bottom: 0;
}

.newletter_form .tnp-subscription div.tnp-field-email {
    width: calc(100% - 160px);
}

.newletter_form .tnp-subscription {
    max-width: 100%;
    margin: 0;
}

/* Contact Us */
.input-field, .input-textarea {
    width: 100%;
    border: 1px solid #e0dada;
    font-size: 15px;
    font-family: inherit;
    line-height: normal;
}

.input-field {
    height: 40px;
    padding: 0 15px;
}

.input-textarea {
    height: 120px;
    padding: 10px 15px;
}

.input-field:focus, .input-textarea:focus {
    border: 1px solid #333;
    box-shadow: none;
    outline: none;
}

.contact-us-wrapper .customize_btn {
    margin-top: 10px;
    border: none;
}

.contact-us-wrapper .ajax-loader {display: none !important;}

.contact-us-wrapper .form-group span[role="alert"] {
    font-size: 14px;
    margin-top: 5px;
}

.content_wrapper h4 {
    margin-bottom: 15px;
}


/* inventory page */

.inventorySubouter .link_wrapper {
    flex: 0 0 100%;
    max-width: 100%;
}


.inventorySubouter .quickLInkWrapper ul {
    display: flex;
    flex-flow: row wrap;
}

.inventorySubouter .quickLInkWrapper ul > li {
    padding: 0 15px;
    max-width: 25%;
    flex-basis: 25%;
    text-align: center;
    margin-bottom: 30px;
}

.inventorySubouter .quickLInkWrapper ul > li > a {
    color: #fff;
    text-decoration: none;
    font-weight: 500;
    font-size: 24px;
    min-height: 180px;
    padding: 15px 50px;
    line-height: 1.5;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    transition: all .35s ease;
    background-image: url(images/inventorybg.jpg);
    z-index: 1;
    overflow: hidden;
}

.inventorySubouter .quickLInkWrapper ul > li > a:hover, 
.inventorySubouter .quickLInkWrapper ul > li > a:focus, 
.inventorySubouter .quickLInkWrapper ul > li > a:active {
    transform: translateY(-15px);
    color: #333;
    background-color: #ffd60a;
}

.inventorySubouter .quickLInkWrapper ul > li > a:before {
    content: "";
    height: 100%;
    width: 100%;
    background-color: rgba(0,0,0,.25);
    position: absolute;
    z-index: -1;
}

.inventorySubouter .quickLInkWrapper ul > li > a:after {
    content: "";
    height: 100%;
    width: 100%;
    position: absolute;
    background: rgba(255, 214, 10, 0.95);
    bottom: 180px;
    transition: all .35s ease-in-out;
    z-index: -1;
}

.inventorySubouter .quickLInkWrapper ul > li > a:hover:after, 
.inventorySubouter .quickLInkWrapper ul > li > a:focus:after, 
.inventorySubouter .quickLInkWrapper ul > li > a:active:after {
    bottom: 0;
}


/* Inventory detail page */
.content.inventoryRecord table tr th.even, .content.inventoryRecord table tr .odd {
    padding: 10px;
}

.content.inventoryRecord table {
    font-family: 'Montserrat';
}

.content.inventoryRecord .col-1, .content.inventoryRecord .col-2, .content.inventoryRecord .col-3, .content.inventoryRecord .col-4, .content.inventoryRecord .col-5, .content.inventoryRecord .col-6, .content.inventoryRecord .col-7 {
    width: auto;
}

.content.inventoryRecord table {width: 100%;}

.content.inventoryRecord table tr th {
    background-color: #ffd60a;
}


.content.inventoryRecord table tbody tr.odd {
    background-color: #e6e2e2;
}

.content.inventoryRecord table tbody tr.even {
    background-color: #f7f7f7;
}

.content.inventoryRecord table {
    border: 1px solid rgba(255, 214, 10, 0.30);
}

/* About Us page */

.inner_heading {
    display: inline-block;
    font-size: 32px;
    font-weight: 600;
    text-transform: none;
    font-style: normal;
    text-decoration: none;
    margin-bottom: 30px;
    color: #292929;
    font-family: inherit;
    line-height: 1.4;
    position: relative;
}

.content_wrapper p {
    font-size: 18px;
    line-height: 1.7;
    margin-bottom: 15px;
    color: #111;
    font-weight: 400;
}

.common.content_wrapper {
    padding: 50px 0;
}

.about_usImage {
    float: right;
    margin: 20px;
}
.content_wrapper a {
    color: blue;
}

.content_wrapper a:hover, .content_wrapper a:focus, .content_wrapper a:active {
    text-decoration: none;
    color: #333;
}

/* Faq */

.content_wrapper .faq_questions {
    font-size: 18px;
    font-weight: 600;
    display: block;
    box-shadow: 0px 2px 5px rgba(255, 214, 10, 0.43);
    padding: 12px 40px 12px 15px;
    color: #111;
    line-height: normal;
    background-color: #dfdfdf;
    position: relative;
	text-decoration: none;
}
.content_wrapper .faq_questions:hover, 
.content_wrapper .faq_questions:focus, .content_wrapper .faq_questions:active {
	color: #111;
	text-decoration: none;
}

.faq_list {
    margin-bottom: 10px;
}

.faq_list .card {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.faq_questions:after {
    position: absolute;
    right: 15px;
    font-family: FontAwesome;
    top: 50%;
    transform: translateY(-50%);
}

a[aria-expanded="false"]:after {
    content: "\f067";    
}

a[aria-expanded="true"]:after {
    content: "\f068";    
}

.acf-map {
	width: 100%;
	height: 600px;
	border: #ccc solid 1px;
}

/* fixes potential theme css conflict */
.acf-map img {
   max-width: inherit !important;
}




/* footer  */
.footer_top {
    background-color: #3e3939;
    padding: 50px 0;
}

.footerLogo {
    opacity: .6;
    max-width: 220px;
    width: 100%;
    display: block;
}

.foot_col .content p {
    font-size: 13px;
    padding: 25px 25px 0;
    color: #ccc;
}

.foot_col .content a {
    color: #ffd60a;
}

.foot_col .content a:hover, 
.foot_col .content a:focus, 
.foot_col .content a:active, 
.links > li > a:hover, 
.links > li > a:focus, 
.links > li > a:active {
    color: #ffd60a;
}

.link_title {
    font-size: 16px;
    font-weight: 600;
    color: #ffd60a;
    margin-bottom: 15px;
    line-height: normal;
    text-transform: uppercase;
    padding-top: 15px;
    position: relative;
}

.links > li {
    margin-bottom: 10px;
    line-height: normal;
}

.links > li > a {
    font-size: 13px;
    color: #ccc;
    font-family: inherit;
    line-height: normal;
    text-decoration: none;
}

.footLInk_col .link_wrapper {
    max-width: 33.33%;
    flex-basis: 33.33%;

}
.static_links li > a > span {
    width: 60px;
    display: inline-block;
    vertical-align: middle;
    border: 1px solid #fff;
    margin-right: 5px;
}

.static_links li {
    margin-bottom: 10px;
}


/*.footLInk_col .link_wrapper.quickLInkWrapper {
    max-width: 70%;
    flex-basis: 70%;
}*/

.footLInk_col {
    display: flex;
    flex-flow: row wrap;
}

/*.footLInk_col .link_wrapper.quickLInkWrapper .links {
    column-count: 3;
    column-gap: 20px;
}*/

.links > li.menu-item-type-custom > a {
    color: #ffd60a;
}

.links > li.menu-item-type-custom > a:hover, 
.links > li.menu-item-type-custom > a:focus, 
.links > li.menu-item-type-custom > a:active, 
.foot_col .content a:hover, .foot_col .content a:focus, .foot_col .content a:active {
    opacity: .7;
}

.link_title:before {
    content: "";
    height: 2px;
    width: 25px;
    background: #ffd60a;
    position: absolute;
    top: 0;
    left: 0;
}

.footer_bottom {
    padding: 10px 0;
    background-color: #111;
}

.footer_bottom p {
    color: #fff;
    margin-bottom: 0;
    font-size: 13px;
    font-family: inherit;
    line-height: normal;
}



/* Media Query */


@media (max-width: 1199px) {
.wareHouseName, .wareHouseYards {
    padding: 30px 30px 50px;
}
.inventorySubouter .quickLInkWrapper ul > li > a {
    padding: 15px 20px;
}

}

@media (max-width: 1023px) {
	
}

@media (max-width: 990px) {
	.main-menu > li {
	    padding: 0 15px;
	}
	.banner_title {
	    font-size: 32px;
	}
	.caption {
	    max-width: 500px;
	    margin-top: 30px;
	}
	.brand_logo img {
	    max-width: 160px;
	}

	.wareHourseCol {
	    flex: 0 0 50%;
	    max-width: 50%;
	    margin-bottom: 30px;
	}
	.wareHouseYards {
	    top: 300px;
	}
	.wareHouseName, .wareHouseYards {
	    padding: 100px 50px;
	}
	.warehouse {
	    padding-bottom: 40px;
	}
	.about_usImage {
	    max-width: 400px;
	    height: auto;
	}
	.inventorySubouter .quickLInkWrapper ul > li {
	    max-width: 33.33%;
	    flex-basis: 33.33%;
	}
	.content.inventoryRecord {
	    overflow-x: auto;
	}	
	.contact-left, .contact-right {
	    flex: 0 0 100%;
	    max-width: 100%;
	}

	.contact-right {
	    margin-top: 30px;
	}	
}

@media (max-width: 767px) {

.toggleBtn {
    display: block;
    background-color: transparent;
    color: #ffb420;
    padding: 0;
    border: none;
    font-size: 32px;	
}

.main_navigation {
	position: fixed;
    top: 0;
    left: -1000px;
    min-width: 200px;
    height: 100vh;
    background-color: #ffb420;
    z-index: 10;
    transition: left.35s ease;
}
.main_navigation.active {
    left: 0;
    transition: left .15s ease;
}
.main-menu > li {
    display: block;
    padding: 8px 15px;
}
.wareHouseWrapper:after {content: none;}
.wareHouseName, .wareHouseYards {
   z-index: inherit;
}
.wareHouse_img {
    background: rgba(0,0,0,.7);
}

.wareHouse_img img {
    opacity: .5;
}
.main_slider_outer {
    z-index: -1;
}
.home .header_main {
    background-color: #0a0a0a;
}
.home .main_slider_outer {margin-top: 0;}

.main-menu > li > a:hover, .main-menu > li > a:focus, .main-menu > li.current_page_item > a {
    color: #0a0a0a;
}
.newletter_form .form_group {
    justify-content: center;
}
.newlettercol, .foot_col {
    flex: 0 0 100%;
    max-width: 100%;
}

.whywearecol {flex: 0 0 50%;max-width: 50%;margin-bottom: 30px}
.newlettercol + .newlettercol {
    margin-top: 30px;
}

.foot_col + .foot_col {
	margin-top: 50px;
}

.whyWeAre {
    padding-bottom: 40px;
}

.feature_title {
    font-size: 16px;
}
.about_usImage {
    max-width: 100%;
    float: none;
    margin-left: auto;
    margin-right: auto;
    display: table;
}
.content_wrapper p, .content_wrapper .faq_questions {
    font-size: 16px;
}

.caption {
    margin-top: 0;
}

.inner_heading {
    font-size: 28px;
}

.inventorySubouter .quickLInkWrapper ul > li {
    max-width: 50%;
    flex-basis: 50%;
}

.inventorySubouter .quickLInkWrapper ul > li > a:before, 
.inventorySubouter .quickLInkWrapper ul > li > a:after {content: none;}

.inventorySubouter .quickLInkWrapper ul > li > a {
    z-index: auto;
}
.inventorySubouter .quickLInkWrapper ul > li > a:hover, .inventorySubouter .quickLInkWrapper ul > li > a:focus, 
.inventorySubouter .quickLInkWrapper ul > li > a:active {
    background-image: none;
}
.banner_title {
    font-size: 28px;
}
.main_title, .newstitleWrapper h3 {
    font-size: 26px;
}
.common {
    padding-top: 50px;
    padding-bottom: 50px;
}


}

@media (max-width: 639px) {

.newstitleWrapper h3, .main_title {
    font-size: 28px;
}


.wareHouseName, .wareHouseYards {
    padding: 50px;
    font-size: 20px;
}
.content p {
    font-size: 15px;
}
.newstitleWrapper {
    text-align: center;
}
.newstitleWrapper p {
    font-size: 15px;
    line-height: 1.4;
}
.newstitleWrapper {
    text-align: center;
}

.footLInk_col .link_wrapper {
    max-width: 50%;
    flex-basis: 50%;
}

.static_links {
    margin-top: 30px;
}
.caption {
    margin-top: 0;
}

}


@media (max-width: 540px) {

.footLInk_col .link_wrapper {flex-basis: 100%;max-width: 100%;}
.quickLInkWrapper {
    margin-top: 30px;
}
.Topleft a {
    font-size: 0;
}
.Topleft a i {
    font-size: 14px;
}

.wareHourseCol {
    flex: 0 0 100%;
    max-width: 100%;
}
.wareHouseWrapper {
    max-width: 330px;
    margin: 0 auto;
}

.warehouse {
    padding-bottom: 20px;
}

.whyWeAre {
    padding-bottom: 25px;
}

}


@media (max-width: 479px) {
	.newletter_form .form_group {
	    flex-flow: row wrap;
	}
	.newletter_form .subscbribe_btnss[type="submit"] {
	    min-width: 0;
	    width: 100%;
	    margin-top: 15px;
	}

.inventorySubouter .quickLInkWrapper ul > li {
    max-width: 100%;
    flex-basis: 100%;
}

.newstitleWrapper h3 {
    text-align: center;
}

}


@media (max-width: 359px) {
	.whywearecol {
	    flex: 0 0 100%;
	    max-width: 100%;
	}	
	.banner_title {
	    font-size: 28px;
	}	
}
/* --- fabric page header imagery and typical applications (2026-09) --- */
/* Deliberately a shallow strip, not a hero: these pages exist to show the
   inventory table, and a full-height image pushed it below the fold. */
.fabric_banner {
    margin: 0 0 18px;
    max-width: 100%;
}
.fabric_banner img {
    display: block;
    width: 100%;
    height: 200px;
    object-fit: cover;
    object-position: center;
    border-radius: 4px;
}
.fabric_banner--wide img { height: 260px; }
@media (max-width: 640px) {
    .fabric_banner img { height: 140px; }
    .fabric_banner--wide img { height: 160px; }
}
.fabric_banner figcaption {
    font-size: 12px;
    color: #6b7280;
    font-style: italic;
    margin-top: 7px;
}
.fabric_uses {
    font-size: 15px;
    color: #333;
    margin: 0 0 26px;
}
.fabric_uses span {
    display: inline-block;
    font-size: 11px;
    letter-spacing: .06em;
    text-transform: uppercase;
    font-weight: 700;
    color: #16224f;
    background: #ffd700;
    padding: 3px 8px;
    border-radius: 3px;
    margin-right: 8px;
}

/* --- inventory index cards (replaces the plain link list) --- */
.inv_cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin: 0 0 30px;
    width: 100%;
}
.inv_card {
    display: block;
    border: 1px solid #e3e6ee;
    border-radius: 4px;
    background: #fff;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.inv_card:hover {
    border-color: #16224f;
    box-shadow: 0 6px 20px rgba(22,34,79,.10);
    transform: translateY(-2px);
    text-decoration: none;
}
.inv_card__img { display: block; overflow: hidden; background: #f6f7fa; }
.inv_card__img img { display: block; width: 100%; height: 160px; object-fit: cover; transition: transform .35s ease; }
.inv_card:hover .inv_card__img img { transform: scale(1.05); }
.inv_card__body { display: block; padding: 16px 18px 18px; }
.inv_card__title { display: block; font-size: 18px; font-weight: 700; color: #16224f; line-height: 1.3; }
.inv_card__uses { display: block; font-size: 13px; color: #5a6070; margin: 6px 0 12px; }
.inv_card__go { display: block; font-size: 13px; font-weight: 700; color: #1a1a1a; }
@media (max-width: 991px) { .inv_cards { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .inv_cards { grid-template-columns: 1fr; } }

/* --- common uses thumbnail strip --- */
.fabric_uses_block { margin: 0 0 26px; }
.fabric_uses_block .fabric_uses { margin-bottom: 12px; }
.use_strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 190px));
    gap: 12px;
}
.use_thumb {
    display: block;
    border: 1px solid #e3e6ee;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
    text-decoration: none;
    color: inherit;
    transition: border-color .15s ease, transform .15s ease;
}
a.use_thumb:hover { border-color: #16224f; transform: translateY(-2px); text-decoration: none; }
.use_thumb img { display: block; width: 100%; height: 110px; object-fit: cover; transition: transform .35s ease; }
a.use_thumb:hover img { transform: scale(1.05); }
.use_thumb__label {
    display: block;
    padding: 9px 12px;
    font-size: 13px;
    font-weight: 700;
    color: #16224f;
}
.use_strip__note { font-size: 12px; color: #6b7280; font-style: italic; margin: 10px 0 0; }
@media (max-width: 640px) {
    .use_strip { grid-template-columns: repeat(2, 1fr); }
    .use_thumb img { height: 90px; }
}

/* Guide <-> category cross-link on fabric pages */
.fabric_guidelink {
    font-size: 14px; color: #5a6070; background: #f6f7fa;
    border-left: 3px solid #ffd700; padding: 12px 16px; margin: 0 0 24px;
}
.fabric_guidelink a { color: #16224f; font-weight: 700; }

/* --- "not finding it?" CTA under the inventory table --- */
.fabric_cta {
    margin: 34px 0 0;
    padding: 26px 28px;
    background: #16224f;
    border-radius: 4px;
    color: #fff;
}
.fabric_cta h2 { color: #fff; font-size: 22px; margin: 0 0 10px; font-weight: 700; }
.fabric_cta p { color: #ccd3e6; font-size: 15px; line-height: 1.6; margin: 0 0 16px; max-width: 68ch; }
.fabric_cta__actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }
.fabric_cta__btn {
    display: inline-block; padding: 12px 22px; border-radius: 3px;
    background: #ffd700; color: #1a1a1a; font-weight: 700; font-size: 14px;
    text-transform: uppercase; letter-spacing: .02em; text-decoration: none;
    border: 2px solid #ffd700;
}
.fabric_cta__btn:hover { background: #e6c200; border-color: #e6c200; color: #1a1a1a; text-decoration: none; }
.fabric_cta__btn--ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,.55); }
.fabric_cta__btn--ghost:hover { background: #fff; color: #16224f; border-color: #fff; }

/* --- mobile sticky action bar --- */
.mobile_bar { display: none; }
@media (max-width: 767px) {
    .mobile_bar {
        display: grid;
        /* Equal columns. "auto 1fr" sized the call button to its own text and
           handed the remainder to the CTA, so a matched pair of actions read as
           two different weights. */
        grid-template-columns: 1fr 1fr;
        gap: 10px;
        position: fixed;
        left: 0; right: 0; bottom: 0;
        z-index: 999;
        padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
        background: #16224f;
        border-top: 2px solid #ffd700;
        box-shadow: 0 -6px 20px rgba(0,0,0,.28);
    }
    .mobile_bar a {
        display: flex; align-items: center; justify-content: center;
        min-height: 48px; padding: 0 8px; border-radius: 4px;
        font-weight: 700; text-decoration: none;
        /* The CTA wrapped to "REQUEST SWATCH &" / "PRICING" inside a 46px box.
           Shorter label plus nowrap means it cannot recur at any width. */
        white-space: nowrap;
    }
    .mobile_bar__call {
        background: transparent; color: #fff;
        border: 1px solid rgba(255,255,255,.55);
        font-size: 15px; letter-spacing: .01em;
    }
    .mobile_bar__call:hover, .mobile_bar__call:focus { color: #fff; }
    .mobile_bar__icon { margin-right: 8px; font-size: 14px; opacity: .85; }
    .mobile_bar__cta {
        background: #ffd700; color: #1a1a1a;
        text-transform: uppercase; font-size: 13px; letter-spacing: .03em;
    }
    .mobile_bar__cta:hover, .mobile_bar__cta:focus { color: #1a1a1a; }
    /* keep the sticky bar from covering the last of the page */
    body { padding-bottom: 74px; }
}

/* No embed may set the page width. The contact page map is published with
   width="1900", which pushed the mobile layout viewport out to 1560px: the
   browser zoomed the whole page out to fit, every scroll position collapsed
   (maxScroll became 0) and the sticky header below could never engage. A
   max-width here fixes it for that map and for any embed added later. */
iframe { max-width: 100%; }

/* --- sticky header on mobile --- */
@media (max-width: 767px) {
    /* The black utility strip scrolls away and the branded bar pins to the top.
       The negative offset is what makes that possible: sticky cannot go on
       .header_main directly, because it would be constrained to the parent
       header box and unstick again after 145px. Offsetting the whole header by
       the height of the utility strip scrolls that strip off and leaves the
       96px branded bar pinned. The value tracks the measured mobile height of
       .header_top, which is pinned below so the two cannot drift apart. */
    .main_header {
        position: -webkit-sticky;
        position: sticky;
        top: -49px;
        z-index: 900;
    }
    .main_header .header_top { height: 49px; box-sizing: border-box; }
    /* Anchored jumps have to clear the pinned bar. */
    html { scroll-padding-top: 104px; }
}

/* The theme sets `.content_wrapper a { color: blue }` at (0,2,0), which beats a
   single class. Everything added inside that wrapper has to match or exceed it. */
.content_wrapper .fabric_cta__btn { color: #1a1a1a; }
.content_wrapper .fabric_cta__btn:hover,
.content_wrapper .fabric_cta__btn:focus { color: #1a1a1a; }
.content_wrapper .fabric_cta__btn--ghost { color: #fff; }
.content_wrapper .fabric_cta__btn--ghost:hover,
.content_wrapper .fabric_cta__btn--ghost:focus { color: #16224f; }
.content_wrapper .fabric_guidelink a { color: #16224f; }
.content_wrapper .use_thumb { color: inherit; }
.content_wrapper .use_thumb__label { color: #16224f; }
.content_wrapper .inv_card { color: inherit; }
.content_wrapper .inv_card__title { color: #16224f; }
.content_wrapper .inv_card__go { color: #1a1a1a; }

/* --- inventory listing unavailable (sheet deleted or unpublished) --- */
.inv_unavailable {
    background: #fffbe6; border: 1px solid #f0d97a; border-left: 4px solid #ffd700;
    border-radius: 4px; padding: 26px 28px; margin: 0 0 26px;
}
.inv_unavailable__tag {
    font-size: 11px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
    color: #8a6d00; margin: 0 0 8px;
}
.inv_unavailable h2 { font-size: 22px; color: #16224f; margin: 0 0 12px; font-weight: 700; }
.inv_unavailable p { font-size: 15px; line-height: 1.65; color: #4a4a4a; margin: 0 0 12px; max-width: 68ch; }
.inv_unavailable__actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 0 !important; }
.content_wrapper .fabric_cta__btn--dark { background: transparent; border-color: #16224f; color: #16224f; }
.content_wrapper .fabric_cta__btn--dark:hover { background: #16224f; color: #fff; }
.inv_alts { margin: 0 0 28px; }
.inv_alts h3 { font-size: 15px; text-transform: uppercase; letter-spacing: .05em; color: #16224f; margin: 0 0 10px; }
.inv_alts ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; }
.content_wrapper .inv_alts a { color: #16224f; font-weight: 700; font-size: 15px; }

/* --- "found it" CTA directly under an inventory list --------------------- */
/* Paired with .fabric_cta further down the page, which is the "did not find
   it" case. This one is deliberately lighter: it sits between the table and
   the rest of the page and should not compete with the list it follows. */
.inv_quote {
    margin: 26px 0 34px;
    padding: 20px 22px;
    background: #f6f7fa;
    border: 1px solid #e3e6ee;
    border-left: 4px solid #ffd700;
    border-radius: 4px;
}
.inv_quote__text {
    margin: 0 0 14px;
    font-size: 15px; line-height: 1.6; color: #3d4356;
    max-width: 68ch;
}
.inv_quote__text strong { color: #16224f; }
.inv_quote__actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; }
@media (max-width: 600px) {
    .inv_quote { padding: 16px 16px; }
    .inv_quote__actions .fabric_cta__btn { flex: 1 1 100%; text-align: center; }
}

/* --- pricing / swatch request modal -------------------------------------- */
.pdfreq { position: fixed; inset: 0; z-index: 10000; display: flex;
    align-items: flex-start; justify-content: center; padding: 24px 16px; overflow-y: auto; }
.pdfreq[hidden] { display: none; }
.pdfreq__backdrop { position: fixed; inset: 0; background: rgba(10,15,35,.62); }
.pdfreq__panel { position: relative; width: 100%; max-width: 620px; margin: auto;
    background: #fff; border-radius: 6px; padding: 26px 28px 22px;
    box-shadow: 0 24px 60px rgba(0,0,0,.35); }
.pdfreq__x { position: absolute; top: 8px; right: 10px; width: 38px; height: 38px;
    border: 0; background: transparent; font-size: 28px; line-height: 1; color: #6a7080;
    cursor: pointer; border-radius: 4px; }
.pdfreq__x:hover { background: #f0f2f7; color: #16224f; }
.pdfreq__title { margin: 0 0 4px; font-size: 24px; font-weight: 700; color: #16224f; }
.pdfreq__lede { margin: 0 0 18px; font-size: 14px; color: #5a6070; }
/* Context we filled in for the buyer, visually grouped so it reads as
   "what you are asking about" rather than more fields to complete. */
.pdfreq__ctx { background: #f6f7fa; border: 1px solid #e3e6ee; border-left: 4px solid #ffd700;
    border-radius: 4px; padding: 14px 16px 4px; margin: 0 0 16px; }
.pdfreq__hint { font-weight: 400; color: #7a8095; font-size: 12px; }
.pdfreq__specline { font-size: 13px; }
.pdfreq .pdfreq__ro { background: #eef0f6; color: #3d4356; }
.pdfreq label { display: block; font-size: 13px; font-weight: 700; color: #16224f; margin-bottom: 4px; }
.pdfreq input[type=text], .pdfreq input[type=email], .pdfreq input[type=tel], .pdfreq textarea {
    width: 100%; padding: 10px 12px; border: 1px solid #ccd2e0; border-radius: 4px;
    font-size: 15px; font-family: inherit; box-sizing: border-box; }
.pdfreq p { margin: 0 0 12px; }
.pdfreq__row { display: flex; gap: 12px; }
.pdfreq__row > p { flex: 1 1 0; min-width: 0; }
.pdfreq__submit { background: #ffd700; color: #1a1a1a; border: 2px solid #ffd700;
    padding: 12px 26px; border-radius: 3px; font-weight: 700; text-transform: uppercase;
    font-size: 14px; letter-spacing: .02em; cursor: pointer; }
.pdfreq__submit:hover { background: #e6c200; border-color: #e6c200; }
/* The request type drives which fields apply. */
.pdfreq .pdfreq__type { display: none; }
.pdfreq--price .pdfreq__swatch { display: none; }
.pdfreq--swatch .pdfreq__price { display: none; }
body.pdfreq-open { overflow: hidden; }
@media (max-width: 600px) {
    .pdfreq { padding: 0; }
    .pdfreq__panel { border-radius: 0; min-height: 100%; padding: 22px 18px 18px; }
    .pdfreq__row { display: block; }
}

/* Per-row request controls injected into inventory tables by js/request.js. */
.pdfreq__col { white-space: nowrap; text-align: right; }
.content_wrapper a.pdfreq__rowbtn {
    display: inline-block; margin-left: 5px; padding: 3px 9px;
    border: 1px solid #16224f; border-radius: 3px;
    font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .02em;
    color: #16224f; text-decoration: none; background: #fff;
}
.content_wrapper a.pdfreq__rowbtn:hover { background: #16224f; color: #fff; text-decoration: none; }