/**
 * Event Date Formatted Block Styles
 * 
 * Minimal styling - inherits typography from parent context.
 * Designed for use in query loops and event detail pages.
 */

/* ==========================================================================
   Base Container
   ========================================================================== */

.event-date-formatted-block {
	display: block;
   margin: 0;
   padding: 8px 10px !important;
   background-color: rgba(255, 255, 255, 0.1);
   border-radius: 3px;
}

@media (min-width: 768px) {
	.event-date-formatted-block {
		padding: 8px 16px !important;
	}
}

/* ==========================================================================
   Date Text
   ========================================================================== */

.event-date-formatted-block__date {
	display: block;
   font-size: 0.85rem;
   letter-spacing: 1px;
   text-transform: uppercase;
   color: var(--global-palette9);
}

@media (min-width: 768px) {
	.event-date-formatted-block__date {
		font-size: 1rem;
      letter-spacing: 2px;
	}
}

/* ==========================================================================
   TBD State
   ========================================================================== */