/*
 * WHAT THIS FILE DOES:
 * Spotify's embed player itself can't be restyled — it's a locked iframe
 * from Spotify's own servers. What CAN be styled is the "frame" around it.
 * This file wraps the plain iframe in a rounded card with a subtle shadow
 * and a colored top border, using Elite Income Advisors' actual brand
 * colors and fonts (pulled directly from eliteincomeadvisors.com's own
 * Elementor stylesheet), so the player looks like it belongs on their site
 * instead of a bare, generic embed box.
 *
 * Brand colors used below:
 *   #053F5C — EIA navy (primary brand color)
 *   #429EBD — EIA teal (secondary/accent color)
 *   #F6AD1B — EIA gold (used sparingly, for the accent border)
 */

.pullman-spotify-player {
	/* Rounded card with a soft shadow, matching the clean/corporate
	   look of the rest of the site. */
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 4px 18px rgba(5, 63, 92, 0.18);
	border: 1px solid rgba(5, 63, 92, 0.12);

	/* A thin gold accent bar across the top ties it to EIA's brand
	   without covering up any of Spotify's own player controls. */
	border-top: 4px solid #f6ad1b;

	/* Keeps a little breathing room around the player so it doesn't
	   look like it's touching other page elements. */
	max-width: 100%;
	background: #ffffff;
}

/* Removes the small gap some themes/browsers add below inline iframes. */
.pullman-spotify-player iframe {
	display: block;
	width: 100%;
	border: 0;
}

/* Messages shown ONLY while editing in Elementor — never on the live
   site — so mistakes are obvious to fix without visitors ever seeing
   a broken box. */
.pullman-spotify-notice {
	font-family: 'Montserrat', sans-serif;
	padding: 16px;
	border-radius: 10px;
	background: rgba(66, 158, 189, 0.1);
	border: 1px dashed #429ebd;
	color: #053f5c;
	font-size: 14px;
}

.pullman-spotify-notice--error {
	background: rgba(246, 173, 27, 0.12);
	border-color: #f6ad1b;
	color: #7a4a00;
}
