/* ======================================================================
   SCHIEMERENTERTAINMENT.COM — SITE CUSTOM CSS (ProPhoto 7)
   Strategy:
   - Scope DJEP rules to #se-djep-wrap
   - Scope Playlist page rules to .se-playlist-wrap
   - Avoid global utilities unless explicitly intended
   Last updated: 2026-02-22
   ====================================================================== */


/* ======================================================================
   DJEP PRICING FORM STYLING (Scoped to #se-djep-wrap)
   ====================================================================== */

#se-djep-wrap,
#se-djep-wrap * { box-sizing: border-box !important; }

/* Neutralize DJEP bootstrap column sizing */
#se-djep-wrap .col-xs-12,
#se-djep-wrap .col-sm-8,
#se-djep-wrap .col-sm-offset-2{
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Make form fill the white area */
#se-djep-wrap form,
#se-djep-wrap form > div,
#se-djep-wrap form > div > div{
  width: 100% !important;
  max-width: 100% !important;
}

/* -------------------------
   Spacing rhythm
   ------------------------- */

/* Labels */
#se-djep-wrap p{
  margin: 18px 0 8px !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  letter-spacing: .2px !important;
  line-height: 1.35 !important;
  color: #3a3128 !important;
}

/* Don’t push the very first label down */
#se-djep-wrap form p:first-of-type{
  margin-top: 0 !important;
}

/* Inputs / Selects / Textarea */
#se-djep-wrap input[type="text"],
#se-djep-wrap input[type="email"],
#se-djep-wrap input[type="tel"],
#se-djep-wrap select,
#se-djep-wrap textarea{
  width: 100% !important;
  max-width: 100% !important;
  font-size: 17px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(58,49,40,.18) !important;
  background: #fff !important;
  box-shadow: none !important;
  outline: none !important;

  margin: 0 0 18px !important;

  /* Safari-friendly controls */
  height: 56px !important;
  line-height: 56px !important;
  padding: 0 14px !important;
}

/* Textarea behaves differently */
#se-djep-wrap textarea{
  height: auto !important;
  min-height: 180px !important;
  line-height: 1.35 !important;
  padding: 14px !important;
}

/* Remove DJEP inline widths (like width:240px) */
#se-djep-wrap select[style],
#se-djep-wrap input[style],
#se-djep-wrap textarea[style]{
  width: 100% !important;
}

/* ============================
   Date Of Event row (your .se-date-row wrapper)
   ============================ */

#se-djep-wrap .se-date-row{
  margin: 0 0 18px !important;
}

@media (min-width: 768px){
  #se-djep-wrap .se-date-row{
    display: flex !important;
    gap: 15px !important;
    align-items: flex-start !important;
  }
  #se-djep-wrap .se-date-row select{
    flex: 1 1 0 !important;
    width: auto !important;
    margin: 0 !important; /* keep row even */
  }
}

@media (max-width: 767px){
  #se-djep-wrap .se-date-row{
    display: block !important;
  }
  #se-djep-wrap .se-date-row select{
    width: 100% !important;
    margin: 0 0 12px !important;
  }
}

/* Submit button */
#se-djep-wrap input[type="submit"]{
  appearance: none !important;
  -webkit-appearance: none !important;
  background:#2f4f3f !important;
  color:#fff !important;
  border:1px solid #2f4f3f !important;
  border-radius:16px !important;
  padding: 16px 28px !important;
  font-size:17px !important;
  font-weight:900 !important;
  cursor:pointer !important;
  box-shadow: 0 14px 28px rgba(47,79,63,.20) !important;

  height: auto !important;
  line-height: 1.2 !important;
  margin-top: 8px !important;
}

/* ============================
   DJEP Thank You buttons hover (scoped)
   Use class="se-ty-hover" on the table
   ============================ */
#se-djep-wrap .se-ty-hover input[type="button"]:hover{
  filter: brightness(0.98);
}

/* ==================================
   DJEP: Mobile-safe button tables (scoped)
   Stack buttons on small screens
   ================================== */

@media (max-width: 768px){
  #se-djep-wrap .se-btn-table{
    width: 100% !important;
    border-spacing: 0 12px !important;  /* vertical gap between stacked buttons */
  }
  #se-djep-wrap .se-btn-table td{
    display: block !important;
    width: 100% !important;
  }
  #se-djep-wrap .se-btn-table input[type="button"]{
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal !important;    /* allow wrapping if needed */
  }
}