/**
 * Coffee Shop Formula Skin Stylesheet
 *
 * Scoped styles for Coffee Shop skin preset.
 *
 * @package formula
 */

/* ==========================================================================
   Coffee Shop Theme Scoped Variables & Global Aesthetics
   ========================================================================== */
body.formula-skin-coffee {
	--formula-coffee-accent: #b98e62;
	--formula-coffee-accent-hover: #9c7348;
	--formula-coffee-dark: #18120e;
	--formula-coffee-dark-card: rgba(30, 22, 17, 0.85);
	--formula-coffee-border: rgba(185, 142, 98, 0.25);
	--formula-coffee-gold: #d4af37;
	--formula-coffee-cream: #f4ede4;
}

/* Fix dark background texture rendering */
body.formula-skin-coffee {
	background-color: var(--formula-coffee-dark);
	background-attachment: fixed;
	background-size: cover;
	background-repeat: no-repeat;
}

/* Frosted glass header tuning for dark ambience */
body.formula-skin-coffee .navbar-fixed-top.header-glass {
	background: rgba(24, 18, 14, 0.82);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	border-bottom: 1px solid var(--formula-coffee-border);
}

/* Service / Drinks Card Polishing */
body.formula-skin-coffee .service .service-item {
	background: var(--formula-coffee-dark-card);
	border: 1px solid var(--formula-coffee-border);
	border-radius: var(--formula-card-radius, 12px);
	padding: 30px 24px;
	transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

body.formula-skin-coffee .service .service-item:hover {
	transform: translateY(-6px);
	border-color: var(--formula-coffee-accent);
	box-shadow: 0 16px 32px rgba(0, 0, 0, 0.45);
}

body.formula-skin-coffee .service .service-item .service-thumb img {
	max-height: 180px;
	width: auto;
	margin: 0 auto 18px;
	transition: transform 0.35s ease;
	filter: drop-shadow(0 10px 18px rgba(0, 0, 0, 0.4));
}

body.formula-skin-coffee .service .service-item:hover .service-thumb img {
	transform: scale(1.08) rotate(2deg);
}

/* Portfolio / Menu Cards */
body.formula-skin-coffee .portfolio-selector .portfolio-item {
	border-radius: var(--formula-card-radius, 12px);
	overflow: hidden;
	border: 1px solid var(--formula-coffee-border);
	background: var(--formula-coffee-dark-card);
}

body.formula-skin-coffee .portfolio-selector .portfolio-item figcaption {
	background: linear-gradient(180deg, rgba(24, 18, 14, 0.1) 0%, rgba(24, 18, 14, 0.95) 100%);
}

/* Call to Action warm gradient */
body.formula-skin-coffee .callout-to-action {
	background: linear-gradient(135deg, rgba(35, 25, 19, 0.92) 0%, rgba(20, 14, 10, 0.96) 100%);
	border-top: 1px solid var(--formula-coffee-border);
	border-bottom: 1px solid var(--formula-coffee-border);
}

/* Barista Team Section */
body.formula-skin-coffee #team-selector-scroll .section-header .section-subtitle,
body.formula-skin-coffee .team .section-header .section-subtitle {
	color: var(--formula-coffee-gold);
}

body.formula-skin-coffee #team-selector-scroll .section-header .section-title,
body.formula-skin-coffee .team .section-header .section-title {
	color: #ffffff;
}

body.formula-skin-coffee #team-selector-scroll .section-header .divider-line,
body.formula-skin-coffee .team .section-header .divider-line {
	background-color: var(--formula-coffee-accent);
}

body.formula-skin-coffee .team .team-item {
	border-radius: var(--formula-card-radius, 12px);
	overflow: hidden;
	background: var(--formula-coffee-dark-card);
	border: 1px solid var(--formula-coffee-border);
	transition: transform 0.3s ease, border-color 0.3s ease;
}

body.formula-skin-coffee .team .team-item:hover {
	transform: translateY(-5px);
	border-color: var(--formula-coffee-accent);
}

/* Testimonial Cards */
body.formula-skin-coffee .testimonial-selector .client-thumbnail img {
	width: 52px;
	height: 52px;
	object-fit: cover;
	border-radius: 50%;
}

body.formula-skin-coffee .testimonial-selector cite.client-name {
	margin-top: 0;
	margin-bottom: 3px;
}

body.formula-skin-coffee .testimonial .testimonial-item {
	background: var(--formula-coffee-dark-card);
	border: 1px solid var(--formula-coffee-border);
	border-radius: var(--formula-card-radius, 12px);
	padding: 30px;
}

body.formula-skin-coffee .testimonial .testimonial-item .star-rating {
	color: #e5a93b;
	margin-bottom: 12px;
}


/* Buttons Polish */
body.formula-skin-coffee .thm-btn {
	background-color: var(--formula-coffee-accent);
	color: #ffffff;
	border-radius: var(--formula-btn-radius, 30px);
	transition: all 0.3s ease;
}

body.formula-skin-coffee .thm-btn:hover {
	background-color: var(--formula-coffee-accent-hover);
	color: #ffffff;
	box-shadow: 0 6px 18px rgba(185, 142, 98, 0.35);
}

/* ==========================================================================
   Blog / Coffee Journal Section Readability
   ========================================================================== */
body.formula-skin-coffee #blog-selector-scroll .section-header .section-subtitle,
body.formula-skin-coffee .blog .section-header .section-subtitle {
	color: var(--formula-coffee-gold);
}

body.formula-skin-coffee #blog-selector-scroll .section-header .section-title,
body.formula-skin-coffee .blog .section-header .section-title {
	color: #ffffff;
}

body.formula-skin-coffee #blog-selector-scroll .section-header .divider-line,
body.formula-skin-coffee .blog .section-header .divider-line {
	background-color: var(--formula-coffee-accent);
}

body.formula-skin-coffee #blog-selector-scroll .modern-header-btn {
	color: #ffffff;
	border-color: var(--formula-coffee-border);
}

body.formula-skin-coffee #blog-selector-scroll .modern-header-btn:hover {
	color: var(--formula-coffee-gold);
	border-color: var(--formula-coffee-gold);
}

/* Modern Blog (Template 2) Colors */
body.formula-skin-coffee #blog-selector-scroll .modern-entry-meta,
body.formula-skin-coffee #blog-selector-scroll .modern-entry-meta .modern-date,
body.formula-skin-coffee #blog-selector-scroll .modern-entry-meta .modern-read-time {
	color: #dfd3c7;
}

body.formula-skin-coffee #blog-selector-scroll .modern-entry-meta .meta-separator {
	color: var(--formula-coffee-accent);
}

body.formula-skin-coffee #blog-selector-scroll .modern-entry-title a {
	color: #ffffff;
}

body.formula-skin-coffee #blog-selector-scroll .modern-entry-title a:hover {
	color: var(--formula-coffee-gold);
}

body.formula-skin-coffee #blog-selector-scroll .modern-entry-content {
	color: #f0e6dc;
}

body.formula-skin-coffee #blog-selector-scroll .modern-btn-link {
	color: var(--formula-coffee-gold);
}

body.formula-skin-coffee #blog-selector-scroll .modern-btn-link:hover {
	color: #ffffff;
}

body.formula-skin-coffee #blog-selector-scroll .modern-btn-link .arrow {
	color: var(--formula-coffee-gold);
}

body.formula-skin-coffee #blog-selector-scroll .modern-btn-link:hover .arrow {
	color: #ffffff;
}

/* Classic Blog (Template 1) Fallback Colors */
body.formula-skin-coffee #blog-selector-scroll .entry-title a {
	color: #ffffff;
}

body.formula-skin-coffee #blog-selector-scroll .entry-title a:hover {
	color: var(--formula-coffee-gold);
}

body.formula-skin-coffee #blog-selector-scroll .entry-meta,
body.formula-skin-coffee #blog-selector-scroll .entry-meta .byline,
body.formula-skin-coffee #blog-selector-scroll .entry-meta .author a {
	color: #dfd3c7;
}

body.formula-skin-coffee #blog-selector-scroll .full-content,
body.formula-skin-coffee #blog-selector-scroll .full-content p {
	color: #f0e6dc;
}

/* ==========================================================================
   Sponsors / Farm Partners Section
   ========================================================================== */
body.formula-skin-coffee #client-selector-scroll .section-header .section-subtitle,
body.formula-skin-coffee .sponsors .section-header .section-subtitle {
	color: var(--formula-coffee-gold);
}

body.formula-skin-coffee #client-selector-scroll .section-header .section-title,
body.formula-skin-coffee .sponsors .section-header .section-title {
	color: #ffffff;
}

body.formula-skin-coffee #client-selector-scroll .section-header .divider-line,
body.formula-skin-coffee .sponsors .section-header .divider-line {
	background-color: var(--formula-coffee-accent);
}

body.formula-skin-coffee #client-selector-scroll .client-logo-wrap {
	min-height: 110px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 16px;
}

body.formula-skin-coffee #client-selector-scroll .client-logo-wrap img {
	max-height: 95px;
	max-width: 95px;
	width: auto;
	height: auto;
	filter: none;
	opacity: 0.92;
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.35s ease;
}

body.formula-skin-coffee #client-selector-scroll .item:hover .client-logo-wrap img {
	opacity: 1;
	transform: scale(1.1);
}

body.formula-skin-coffee #client-selector-scroll .client-title {
	color: #ffffff;
	font-size: 16px;
	font-weight: 700;
	margin-bottom: 6px;
	letter-spacing: -0.2px;
}

body.formula-skin-coffee #client-selector-scroll .client-subtitle {
	color: var(--formula-coffee-gold);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 1.5px;
	text-transform: uppercase;
}

/* ==========================================================================
   Hero Slider Styling for Coffee Skin
   ========================================================================== */
body.formula-skin-coffee .slider-caption .subtitle {
	color: var(--formula-coffee-gold);
	background-color: rgba(24, 18, 14, 0.45);
	border-bottom: 2px solid var(--formula-coffee-accent);
	letter-spacing: 3px;
	padding: 6px 14px;
	border-radius: 4px;
}

body.formula-skin-coffee .slider-caption .title {
	color: #ffffff;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.55);
}

body.formula-skin-coffee .slider-caption .description,
body.formula-skin-coffee .slider-caption p {
	color: var(--formula-coffee-cream);
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.45);
}

body.formula-skin-coffee .hero-slider .slider-caption .thm-btn {
	background-color: var(--formula-coffee-accent);
	color: #ffffff;
	border: 1px solid var(--formula-coffee-border);
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3);
	transition: all 0.35s ease;
}

body.formula-skin-coffee .hero-slider .slider-caption .thm-btn:hover {
	background-color: var(--formula-coffee-accent-hover);
	color: #ffffff;
	transform: translateY(-2px);
	box-shadow: 0 8px 22px rgba(0, 0, 0, 0.45);
}


