/* ==================================================
FILE : /assets/01-mstr-tmplet/04-jz-mobile/css-v2/mobile-w01-adspot-01.css
LINK : <link rel="stylesheet" href="/assets/01-mstr-tmplet/04-jz-mobile/css-v2/mobile-w01-adspot-01.css">
PURPOSE : MOBILE WIDGET 01 - Top Ad Spot (Dual Slot Architecture)
VERSION: v1.0 - DATE CREATED : 2026-04-07 - Rebuild - New Typography Architecture
==================================================== */

/* ==================================================
   🛠️ BRAT TWEAKS: LOCAL OVERRIDES & WIRING
   ================================================== */
.jz-mob-w01-wrapper {
  /* --- SPACING HOOKS (Pulls from Master Dictionary) --- */
  --mob-margin-top: var(--mob-w01-margin-top); 
  --mob-margin-bottom: var(--mob-w01-margin-bottom);
  --mob-wrapper-pad: var(--mob-w01-wrapper-pad);

  /* --- RGB HOOKS (Moved to Wrapper for Outer Border) --- */
  --active-mob-rgb-speed: var(--mob-w01-rgb-speed);
  --active-mob-rgb-colors: var(--mob-w01-rgb-colors);

  /* --- INTERNAL W01 TWEAKS --- */
  --mob-w01-box-min-height: clamp(50px, 21.36px + 8.95vw, 90px); /* <-- Brat Tweak: Fluid Ad Reserve */
  
  /* Layout Logic */
  margin-top: var(--mob-margin-top) !important;
  margin-bottom: var(--mob-margin-bottom) !important;
  /* Padding is removed here and moved to the content so the RGB stays on the absolute edge */
}

/* ==================================================
   SECTION 1: THE CONTENT HOLDER
   ================================================== */
.jz-mob-w01-rgb-box {
  /* --- STRUCTURAL --- */
  width: 100%;
  min-height: var(--mob-w01-box-min-height);
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: var(--mob-wrapper-pad); /* Padding moved here to keep content away from RGB edge */
}

.jz-mob-w01-content {
  position: relative;
  z-index: 2; 
  width: 100%;
  text-align: center;
}

/* ==================================================
   SECTION 2: TYPOGRAPHY (Wired to Juxy-Type Engine)
   ================================================== */
.jz-mob-w01-label {
  font-family: var(--jzn-active-font); 
  font-size: var(--jzn-size-sub); 
  font-weight: var(--jzn-font-weight-sub); 
  color: var(--mob-subtext-color); 
  line-height: 1.2; 
  opacity: 0.7; 
  letter-spacing: 2px;
  text-transform: uppercase;
  user-select: none;
}

/* ==================================================
   SECTION 3: THE ADSENSE FALLBACK
   ================================================== */
.jz-mob-w01-fallback {
  display: none; 
  width: 100%;
  min-height: var(--mob-w01-box-min-height);
  align-items: center;
  justify-content: center;
  padding: var(--mob-wrapper-pad);
}