/* newsletter-modal.css
   Namespaced styles for the newsletter modal & footer widget.
   Prefix: ns- (namespace)
   Colors (system):
     --ns-main: #874b05;
     --ns-accent: #058776;
     --ns-icon: #ffe600;
*/

/* Root variables to allow overriding if needed */
:root {
  --ns-main: #874b05;
  --ns-accent: #058776;
  --ns-icon: #ffe600;
  --ns-radius: 14px;
  --ns-max-width: 980px;
}

/* General helpers for this module only */
.ns-heading { color: var(--ns-main); font-weight:700; margin-bottom:0.35rem; }
.ns-subhead { color: rgba(0,0,0,0.65); margin-bottom:1rem; }

/* Footer input */
.ns-footer-form { display:flex; flex-direction:column; align-items:center; gap:0.6rem; }
.ns-input-group { position:relative; width:100%; max-width:420px; }
.ns-input-group .ns-icon-email { position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--ns-icon); font-size:1.05rem; }
.ns-input { padding-left:38px; border-radius:8px; border:1px solid rgba(0,0,0,0.12); height:44px; box-shadow:none; }

/* Buttons */
.ns-btn-primary { background:linear-gradient(90deg, var(--ns-accent), var(--ns-main)); border:none; color:#fff; padding:10px 18px; border-radius:10px; box-shadow:0 6px 18px rgba(7,10,7,0.06); transition:transform .12s ease, box-shadow .12s ease; }
.ns-btn-primary:hover { transform:translateY(-2px); box-shadow:0 10px 24px rgba(7,10,7,0.10); }
.ns-btn-icon { margin-right:6px; color:var(--ns-icon); }

/* Inline alerts */
.ns-alert-success { background: rgba(5,135,118,0.08); border-left:4px solid var(--ns-accent); color:var(--ns-accent); padding:10px 14px; border-radius:8px; }

/* Modal overrides & namespaced look */
.ns-modal .modal-backdrop { /* keep default so backdrop appears; override if needed */ }
.ns-modal .modal-content { background: transparent; border: none; box-shadow: none; }

/* center container */
.ns-modal-body { min-height:100vh; background: transparent; display:flex; align-items:center; justify-content:center; }

/* Card wrapper - a glass panel centered */
.ns-card-wrapper { width:100%; max-width:var(--ns-max-width); padding:2rem; box-sizing:border-box; }
.ns-card {
  display:grid;
  grid-template-columns: 46% 54%;
  background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.03));
  border-radius: var(--ns-radius);
  overflow:hidden;
  backdrop-filter: blur(6px) saturate(1.08);
  -webkit-backdrop-filter: blur(6px);
  border: 1px solid rgba(255,255,255,0.06);
  box-shadow: 0 12px 40px rgba(0,0,0,0.35);
  min-height: 420px;
}

/* media (image area) */
.ns-card-media {
  background-size:cover;
  background-position:center;
  min-height:420px;
  display:block;
}

/* content area */
.ns-card-content {
  padding:36px;
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:14px;
  color: #fff;
}

/* close btn */
.ns-close-btn { position:absolute; top:18px; right:18px; background:transparent; border:none; color:#fff; font-size:20px; opacity:0.95; }
.ns-close-btn:hover { opacity:1; transform:scale(1.03); }

/* header */
.ns-card-header { display:flex; align-items:center; gap:12px; margin-bottom:4px; }
.ns-card-icon { color:var(--ns-icon); font-size:34px; background:rgba(255,230,0,0.08); border-radius:10px; padding:8px; }
.ns-title { margin:0; font-size:1.6rem; color:#fff; }
.ns-lead { color: rgba(255,255,255,0.85); margin-bottom:12px; }

/* form input large */
.ns-input-inline { display:flex; align-items:center; gap:10px; border-radius:10px; background: rgba(255,255,255,0.03); padding:8px; border:1px solid rgba(255,255,255,0.04); }
.ns-input-inline-icon { color:var(--ns-icon); font-size:1.1rem; margin-left:6px; }
.ns-input-lg { background:transparent; border:none; color: #fff; width:100%; padding:10px 8px; outline:none; }

/* buttons row */
.ns-btn-row { display:flex; gap:10px; align-items:center; margin-top:8px; }
.ns-btn-action { background: var(--ns-accent); color:#fff; border:none; padding:10px 16px; border-radius:10px; display:flex; align-items:center; gap:8px; box-shadow:0 8px 24px rgba(5,135,118,0.14); }
.ns-btn-action:hover { transform:translateY(-2px); }
.ns-btn-ghost { background: transparent; border:1px solid rgba(255,255,255,0.12); color:#fff; padding:10px 14px; border-radius:10px; display:flex; align-items:center; gap:8px; }
.ns-btn-ghost-icon { color: var(--ns-icon); }
.ns-btn-link { background:transparent; color: rgba(255,255,255,0.9); border:none; }

/* feedback */
.ns-feedback { min-height:1.4rem; margin-top:8px; color:#fff; }
.ns-success { background: rgba(5,135,118,0.12); border-left:4px solid var(--ns-accent); padding:10px; border-radius:8px; color:var(--ns-accent); display:inline-block; }
.ns-error { background: rgba(200,40,40,0.08); border-left:4px solid rgba(200,40,40,0.9); padding:10px; border-radius:8px; color:rgba(200,40,40,0.95); display:inline-block; }

/* disclaimer */
.ns-disclaimer { color: rgba(255,255,255,0.72); margin-top:12px; display:inline-flex; align-items:center; gap:8px; }

/* inline footer success/error (under footer form) */
.ns-inline-success { margin-top:12px; color:var(--ns-accent); background: rgba(5,135,118,0.06); padding:8px 10px; border-radius:8px; display:inline-flex; gap:8px; align-items:center; border-left:3px solid var(--ns-accent); }
.ns-inline-error { margin-top:12px; color:crimson; background: rgba(255,0,0,0.04); padding:8px 10px; border-radius:8px; display:inline-block; }

/* responsive adjustments */
@media (max-width: 991px) {
  .ns-card { grid-template-columns: 1fr; min-height: 560px; }
  .ns-card-media { min-height:200px; }
  .ns-card-content { padding:22px; }
}

@media (max-width: 576px) {
  .ns-card-wrapper { padding:1rem; }
  .ns-title { font-size:1.25rem; }
  .ns-input-lg { padding:8px 6px; }
  .ns-btn-row { flex-direction:column; align-items:stretch; }
  .ns-btn-link { align-self:flex-end; }
}