.ep-modal-content { max-width: 1200px !important; width: 98% !important;  display: flex; flex-direction: column; }
  .ep-main-box { box-shadow: 0 10px 40px rgba(245, 158, 11, 0.15); border-radius: 20px; padding: 20px; background: #fff; display: flex; flex-direction: column; flex: 1; overflow: hidden; font-family: &quot;SolaimanLipi&quot;, sans-serif !important; }
  .ep-grid-layout { display: grid; grid-template-columns: 1fr 1.3fr; gap: 20px; flex: 1; overflow: hidden; }

  /* Input Side */
  .ep-input-side { display: flex; flex-direction: column; gap: 15px; overflow-y: auto; padding-right: 10px; padding-bottom: 20px; }
  .ep-input-side::-webkit-scrollbar { width: 6px; }
  .ep-input-side::-webkit-scrollbar-thumb { background: #fcd34d; border-radius: 10px; }
  
  .ep-input-card { background: #fff; box-shadow: 0 4px 15px rgba(0,0,0,0.04); padding: 18px; border-radius: 12px; border: 1px solid #fef3c7; }
  .ep-section-title { margin: 0 0 15px 0; font-weight: 800; font-size: 16px; color: #d97706; border-bottom: 2px solid #fef3c7; padding-bottom: 8px; }
  
  .ep-label { font-size: 13px; font-weight: 800; color: #92400e; display: block; margin-bottom: 6px; }
  .ep-input, .ep-select { width: 100%; padding: 12px; border-radius: 8px; border: 1px solid #fcd34d; font-family: &quot;SolaimanLipi&quot;, sans-serif !important; font-size: 15px; outline: none; transition: 0.3s; box-sizing: border-box; background: #fff; margin-bottom: 12px; }
  .ep-input:focus, .ep-select:focus { border-color: #f59e0b; box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.2); }

  /* Photo Upload Box */
  .ep-upload-box { border: 2px dashed #f59e0b; background: #fffbeb; padding: 20px; text-align: center; border-radius: 12px; cursor: pointer; transition: 0.3s; margin-bottom: 12px; }
  .ep-upload-box:hover { background: #fef3c7; }
  .ep-upload-box i { font-size: 35px; color: #f59e0b; margin-bottom: 10px; }

  /* Preview Side */
  .ep-preview-side { background: #1e293b; border-radius: 15px; border: 4px solid #f1f5f9; display: flex; flex-direction: column; overflow-y: auto; padding: 20px 0; align-items: center; }
  
  #ep-preview-wrapper { width: 100%; display: flex; justify-content: center; overflow: hidden; position: relative; }

  /* The 800x800 Poster Canvas */
  .ep-poster-export { 
      width: 800px; height: 800px; position: relative; 
      background: radial-gradient(circle at top right, #1e3a8a, #0f172a); 
      color: white; overflow: hidden; flex-shrink: 0; transform-origin: top center;
      font-family: &quot;SolaimanLipi&quot;, sans-serif !important;
  }
  
  /* Color Themes */
  .ep-poster-export.theme-green { background: radial-gradient(circle at top right, #059669, #064e3b); }
  .ep-poster-export.theme-purple { background: radial-gradient(circle at top right, #7e22ce, #3b0764); }
  .ep-poster-export.theme-red { background: radial-gradient(circle at top right, #be123c, #4c0519); }

  /* Bismillah Text */
  .ep-bismillah { position: absolute; top: 55px; width: 100%; text-align: center; font-size: 18px; color: #fde68a; z-index: 15; font-weight: bold; letter-spacing: 1px; }

  /* Poster Decorations */
  .ep-stars { position: absolute; top:0; left:0; width: 100%; height: 100%; opacity: 0.3; background-image: radial-gradient(2px 2px at 40px 70px, #fff, rgba(0,0,0,0)), radial-gradient(2px 2px at 150px 160px, #fff, rgba(0,0,0,0)), radial-gradient(2px 2px at 90px 40px, #fff, rgba(0,0,0,0)), radial-gradient(2px 2px at 300px 120px, #fff, rgba(0,0,0,0)); background-repeat: repeat; background-size: 350px 350px; }
  .ep-frame { position: absolute; top: 20px; left: 20px; right: 20px; bottom: 20px; border: 3px solid #fbbf24; border-radius: 15px; pointer-events: none; z-index: 10; transition: all 0.3s; }
  .ep-frame-inner { position: absolute; top: 28px; left: 28px; right: 28px; bottom: 28px; border: 1px dashed #fde68a; border-radius: 10px; pointer-events: none; z-index: 10; transition: all 0.3s; }
  
  /* Replaced Lightbulbs with Moons */
  .ep-lantern-left { position: absolute; top: 70px; left: 60px; font-size: 80px; color: #fcd34d; opacity: 0.8; transform: rotate(-20deg); z-index: 10; }
  .ep-lantern-right { position: absolute; top: 70px; right: 60px; font-size: 60px; color: #fcd34d; opacity: 0.6; transform: rotate(20deg); z-index: 10; }
  
  .ep-moon-bg { position: absolute; top: 150px; right: 50px; font-size: 250px; color: #fde68a; opacity: 0.15; }
  .ep-mosque-bg { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); font-size: 400px; color: #ffffff; opacity: 0.05; }

  /* Poster Typography */
  .ep-title { font-size: 95px; font-weight: 900; color: #fbbf24; text-align: center; margin-top: 130px; text-shadow: 0 5px 15px rgba(0,0,0,0.5); line-height: 1.1; position: relative; z-index: 5; transition: all 0.3s; }
  .ep-message { font-size: 32px; text-align: center; margin-top: 15px; color: #f8fafc; font-weight: bold; position: relative; z-index: 5; padding: 0 40px; }
  
  /* User Area */
  .ep-user-area { position: absolute; bottom: 60px; width: 100%; text-align: center; z-index: 5; }
  .ep-user-photo-wrap { width: 230px; height: 230px; margin: 0 auto; border-radius: 50%; border: 8px solid #fbbf24; background: #475569; overflow: hidden; box-shadow: 0 10px 25px rgba(0,0,0,0.4); display: flex; align-items: center; justify-content: center; transition: all 0.3s; }
  .ep-user-photo { height: 100%; object-fit: cover; transition: all 0.3s; }
  .ep-user-name { font-size: 40px; font-weight: 900; color: #fbbf24; margin: 15px 0 0 0; text-shadow: 0 3px 10px rgba(0,0,0,0.5); }
  .ep-user-title { font-size: 22px; color: #e2e8f0; font-weight: bold; margin: 5px 0 0 0; }
  .ep-address { font-size: 28px; color: #cbd5e1; font-weight: 500; margin-top: 25px; } /* Address Styling */

  /* =============== TEMPLATE LAYOUTS =============== */
  /* Layout 1: Default Base (Round Photo, Standard Lines) */
  
  /* Layout 2: Classic Square */
  .ep-poster-export.layout-2 .ep-user-photo-wrap { border-radius: 20px; border: 6px solid #fbbf24; }
  .ep-poster-export.layout-2 .ep-frame { border: 4px dashed #fcd34d; }
  .ep-poster-export.layout-2 .ep-frame-inner { display: none; }
  .ep-poster-export.layout-2 .ep-title { text-shadow: 3px 3px 0px #b45309; color: #fde68a; }

  /* Layout 3: Modern Hexagon  Elegant */
  .ep-poster-export.layout-3 .ep-user-photo-wrap { border-radius: 0; clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%); border: none; background: #fbbf24; padding: 6px; box-shadow: none; }
  .ep-poster-export.layout-3 .ep-user-photo { clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%); }
  .ep-poster-export.layout-3 .ep-frame { border: 2px solid #fde68a; outline: 2px solid #fde68a; outline-offset: 6px; }
  .ep-poster-export.layout-3 .ep-bismillah { background: rgba(0,0,0,0.3); display: inline-block; padding: 6px 25px; border-radius: 30px; width: auto; left: 50%; transform: translateX(-50%); top: 50px; }

  /* Buttons */
  .ep-btn-action { background: linear-gradient(135deg, #f59e0b, #d97706); color: white; border: none; padding: 14px; border-radius: 8px; cursor: pointer; font-weight: 800; font-size: 16px; width: 100%; transition: 0.3s; display: flex; align-items: center; justify-content: center; gap: 10px; }
  .ep-btn-action:hover { box-shadow: 0 5px 15px rgba(0,0,0,0.2); transform: translateY(-2px); }

  @media (max-width: 950px) {
    .ep-grid-layout { 
        grid-template-columns: 1fr; 
        overflow: auto; 
    }
    .ep-input-side { 
        overflow-y: visible; 
        padding-right: 0; 
        order: 2;
    }
    .ep-preview-side {
        order: 1;
        margin-bottom: 20px;
    }
}
.ep-action-buttons {
    margin-top: 25px; 
    display: grid; 
    grid-template-columns: 1fr 1fr; 
    gap: 15px; 
    width: 100%; 
    max-width: 600px; 
    padding: 0 15px;
    box-sizing: border-box;
}

@media (max-width: 600px) {
    .ep-action-buttons {
        grid-template-columns: 1fr;
        gap: 12px;
        padding: 0 10px;
    }
    .ep-btn-action {
        padding: 14px;
        font-size: 15px;
    }
}

  /* Cropper Modal CSS */
  .ep-cropper-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.85); z-index: 999999; align-items: center; justify-content: center; }
  .ep-cropper-box { background: #fff; padding: 20px; border-radius: 15px; width: 90%; max-width: 500px; display: flex; flex-direction: column; gap: 15px; }
  .ep-cropper-area { width: 100%; max-height: 400px; overflow: hidden; background: #e2e8f0; border-radius: 8px; }
