/*
Theme Name:   	Storefront Child Theme
Theme URI:    	https://github.com/stuartduff/storefront-child-theme
Author:       	Stuart Duff
Author URI:     http://stuartduff.com
Template:     	storefront
Description:  	This is a blank child theme for WooThemes StoreFront theme
Version:      	1.0.0
License:      	GNU General Public License v2 or later
License URI:  	http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  	storefront
Tags:         	black, white, light, two-columns, left-sidebar, right-sidebar, responsive-layout, custom-background, custom-colors, custom-header, custom-menu, featured-images, full-width-template, threaded-comments, accessibility-ready
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
Storefront is based on Underscores http://underscores.me/, (C) 2012-2014 Automattic, Inc.
Resetting and rebuilding styles have been helped along thanks to the fine work of
Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
FontAwesome License: SIL Open Font License - http://scripts.sil.org/OFL
Images License: GNU General Public License v2 or later
*/
/*
 * Add your own custom css below this text.
 */
@media (min-width: 768px) {
    .col-full {
        max-width: 1300px;
        margin-left: auto;
        margin-right: auto;
        padding: 0 2.617924em;
        box-sizing: content-box;
    }
}
/* Main container */
.prad-addons-wrapper {
    background: #fff;
    padding: 25px;
    border-radius: 14px;
    border: 1px solid #e5e5e5;
    box-shadow: 0 2px 12px rgba(0,0,0,0.04);
}

/* Each row */
.prad-parent {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 18px !important;
    position: relative;
}

/* Label wrapper */
.prad-parent .prad-d-flex.prad-flex-column {
    width: 220px;
    min-width: 220px;
    margin-bottom: 0 !important;
}

/* Labels */
.prad-block-title {
    font-size: 15px;
    font-weight: 600;
    color: #222;
    line-height: 1.4;
}

/* Required star */
.prad-block-required {
    color: #e11d48;
    right: -12px;
    top: -2px;
    font-size: 15px;
}

/* Input/select area */
.prad-custom-select,
.prad-parent input.prad-input {
    flex: 1;
    width: 100%;
}

/* Select & input styling */
.prad-select-box,
.prad-input {
    height: 48px;
    border: 1px solid #d6d6d6;
    border-radius: 10px;
    background: #fff;
    padding: 0 16px;
    font-size: 14px;
    color: #222;
    transition: all 0.2s ease;
}

/* Focus effect */
.prad-select-box:hover,
.prad-input:hover {
    border-color: #999;
}

.prad-input:focus {
    outline: none;
    border-color: #111;
    box-shadow: 0 0 0 3px rgba(0,0,0,0.05);
}

/* Dropdown styling */
.prad-select-options {
    border: 1px solid #ddd;
    border-radius: 10px;
    overflow: hidden;
    margin-top: 6px;
    background: #fff;
    box-shadow: 0 4px 18px rgba(0,0,0,0.08);
}

.prad-select-option {
    padding: 12px 16px;
    transition: background 0.2s ease;
}

.prad-select-option:hover {
    background: #f7f7f7;
}

/* Active option */
.prad-select-option.prad-active {
    background: #f2f2f2;
    font-weight: 600;
}

/* Better input width for name field */
.prad-block-textfield .prad-input {
    max-width: 100%;
}

/* Price summary */
.prad-product-price-summary {
    margin-top: 30px !important;
    padding-top: 20px;
    border-top: 1px solid #ececec;
}

.prad-price-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
    font-size: 15px;
}

.prad-price-row strong {
    font-weight: 600;
}

/* Hide edit button on frontend */
.prad-fron-edit-addon {
    display: none !important;
}
.prad-blocks-container, .prad-builder-fields-container, .prad-section-container {
    -moz-column-gap: 10px;
    column-gap: 10px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    row-gap: 0px!important;
}
body .prad-mb-12 {
    margin-bottom: 0px!important;
    width: 100%;
}
body .prad-mt-48{
    margin-top: 10px !important;
}
/* Mobile */
@media (max-width: 768px) {

    .prad-addons-wrapper {
        padding: 18px;
    }

    .prad-parent {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .prad-parent .prad-d-flex.prad-flex-column {
        width: 100%;
        min-width: 100%;
    }

    .prad-block-textfield .prad-input {
        max-width: 100%;
    }

    .prad-select-box,
    .prad-input {
        width: 100%;
    }
}

.case-brand-models {
	width: 100%;
	max-width: 980px;
	margin: 0 auto;
	padding: 24px 16px;
	color: #565656;
}

.case-brand-models__brands {
	display: grid;
	grid-template-columns: repeat(6, minmax(90px, 1fr));
	gap: 34px 38px;
	align-items: end;
	justify-items: center;
	margin-bottom: 46px;
}

.case-brand-models__brand {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	width: 100%;
	min-height: 86px;
	padding: 0;
	border: 0;
	background: transparent;
	color: #5d5d5d;
	font-weight: 700;
	text-align: center;
	cursor: pointer;
	box-shadow: none;
	transition: color .16s ease, transform .16s ease;
}

.case-brand-models__brand:hover,
.case-brand-models__brand:focus,
.case-brand-models__brand.is-active {
	color: #222;
	background: transparent;
	outline: none;
	transform: translateY(-2px);
}

.case-brand-models__logo {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 78px;
	height: 48px;
	font-size: 42px;
	font-weight: 800;
	line-height: 1;
	color: currentColor;
	filter: grayscale(1);
	opacity: .92;
}

.case-brand-models__logo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	border-radius: 0;
}

.case-brand-models__name {
	display: block;
	font-size: 15px;
	line-height: 1.2;
}

.case-brand-models__panels {
	width: 100%;
}

.case-brand-models__panel {
	grid-template-columns: repeat(5, minmax(128px, 1fr));
	gap: 14px 20px;
	align-items: center;
}

.case-brand-models__panel.is-active {
	display: grid;
}

.case-brand-models__panel[hidden] {
	display: none;
}

.case-brand-models__model {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 9px 12px;
	border: 1px solid #2d2d2d;
	border-radius: 5px;
	background: #fff;
	color: #555;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.25;
	text-align: center;
	text-decoration: none;
	transition: border-color .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.case-brand-models__model:hover,
.case-brand-models__model:focus {
	border-color: #0b746d;
	color: #0b746d;
	text-decoration: none;
	box-shadow: 0 8px 20px rgba(15,23,42,.08);
	transform: translateY(-1px);
	outline: none;
}

.case-brand-models__empty {
	grid-column: 1 / -1;
	margin: 0;
	padding: 18px;
	border: 1px dashed #cfcfcf;
	border-radius: 6px;
	color: #777;
	font-size: 15px;
	text-align: center;
}

@media (max-width: 900px) {
	.case-brand-models__brands {
		grid-template-columns: repeat(4, minmax(82px, 1fr));
		gap: 28px 24px;
	}

	.case-brand-models__panel {
		grid-template-columns: repeat(3, minmax(120px, 1fr));
	}
}

@media (max-width: 560px) {
	.case-brand-models {
		padding: 20px 10px;
	}

	.case-brand-models__brands {
		grid-template-columns: repeat(3, minmax(74px, 1fr));
		gap: 24px 16px;
		margin-bottom: 32px;
	}

	.case-brand-models__logo {
		width: 64px;
		height: 40px;
		font-size: 34px;
	}

	.case-brand-models__name,
	.case-brand-models__model {
		font-size: 14px;
	}

	.case-brand-models__panel {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px;
	}
}