/* Noor Shop – Widgets (includes/widgets.php) · Shop-Design Schwarz/Gold, Schrift Lato */

/* 🚚 Versandleiste im Warenkorb + Kasse */
.noor-shipbar { margin: 0 0 18px; padding: 12px 14px; border: 1px solid #e8e8e8; border-inline-start: 4px solid #c9a84c; border-radius: 6px; background: #fff; font-family: Lato, sans-serif; color: #111; }
.noor-shipbar__t { font-size: 14px; margin-bottom: 8px; }
.noor-shipbar__bar { display: block; height: 6px; border-radius: 99px; background: #f1ede2; overflow: hidden; }
.noor-shipbar__bar i { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, #c9a84c, #f0d080); }
.noor-shipbar[data-done="1"] .noor-shipbar__bar i { background: #1f7a3a; }

/* 👋 Abschieds-Popup – links goldenes Angebot, rechts Text + Ticket */
.noor-exit { position: fixed; inset: 0; z-index: 100002; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(11, 10, 8, 0); backdrop-filter: blur(0); font-family: Lato, sans-serif; transition: background .25s ease, backdrop-filter .25s ease; }
.noor-exit.is-in { background: rgba(11, 10, 8, .62); backdrop-filter: blur(4px); }
.noor-exit__card { position: relative; display: grid; grid-template-columns: 230px 1fr; width: 100%; max-width: 680px; overflow: hidden; border-radius: 20px; background: #fff; color: #111; box-shadow: 0 30px 80px rgba(0, 0, 0, .45); opacity: 0; transform: translateY(18px) scale(.96); transition: opacity .3s ease, transform .35s cubic-bezier(.2, .9, .3, 1.2); }
.noor-exit.is-in .noor-exit__card { opacity: 1; transform: none; }
.noor-exit__side { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 30px 18px; overflow: hidden; color: #fff; text-align: center;
  background: radial-gradient(circle at 30% 20%, rgba(240, 208, 128, .22), transparent 55%), linear-gradient(160deg, #1d1a13, #0b0a08 70%); }
.noor-exit__badge { position: relative; z-index: 1; padding: 6px 12px; border: 1px solid rgba(201, 168, 76, .6); border-radius: 999px; color: #f0d080; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; }
.noor-exit__big { position: relative; z-index: 1; margin-top: 10px; font: 900 66px/1 Lato, sans-serif; letter-spacing: -.02em;
  background: linear-gradient(110deg, #c9a84c 20%, #fff1c4 40%, #c9a84c 60%); background-size: 250% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: noor-exit-shine 2.6s ease-in-out .4s 2; }
.noor-exit__off { position: relative; z-index: 1; color: #ddd; font-size: 15px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
/* achtzackiger Stern (Rub el Hizb) als dezentes Ornament */
.noor-exit__orn { position: absolute; width: 230px; height: 230px; right: -70px; bottom: -80px; border: 1px solid rgba(201, 168, 76, .22); transform: rotate(22.5deg); }
.noor-exit__orn::after { content: ''; position: absolute; inset: -1px; border: 1px solid rgba(201, 168, 76, .22); transform: rotate(45deg); }
@keyframes noor-exit-shine { 0% { background-position: 100% 0; } 100% { background-position: -50% 0; } }
.noor-exit__main { position: relative; display: flex; flex-direction: column; padding: 30px 28px 20px; }
.noor-exit__x { position: absolute; top: 12px; inset-inline-end: 12px; width: 32px; height: 32px; border: 1px solid #e8e8e8; border-radius: 50%; background: #fff; color: #555; cursor: pointer; }
.noor-exit__kicker { color: #a8873a; font-size: 11px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.noor-exit__title { margin: 6px 36px 10px 0; color: #111; font: 800 23px/1.25 Lato, sans-serif; }
.noor-exit[dir="rtl"] .noor-exit__title { margin: 6px 0 10px 36px; }
.noor-exit__text { margin: 0 0 14px; color: #444; font-size: 15px; line-height: 1.55; }
.noor-exit__ticket { position: relative; display: block; width: 100%; margin: 0 0 12px; padding: 12px 16px; border: 2px dashed #c9a84c; border-radius: 12px; background: #faf8f3; color: #111; text-align: center; cursor: pointer; transition: background .2s ease; }
.noor-exit__ticket::before, .noor-exit__ticket::after { content: ''; position: absolute; top: 50%; width: 16px; height: 16px; margin-top: -8px; border-radius: 50%; background: #fff; border: 2px dashed #c9a84c; }
.noor-exit__ticket::before { left: -10px; border-left-color: transparent; border-bottom-color: transparent; transform: rotate(45deg); }
.noor-exit__ticket::after { right: -10px; border-right-color: transparent; border-top-color: transparent; transform: rotate(45deg); }
.noor-exit__ticket:hover { background: #f5efdf; }
.noor-exit__ticket small { display: block; color: #888; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.noor-exit__ticket b { display: block; margin: 2px 0; font-size: 26px; letter-spacing: .16em; }
.noor-exit__tap { display: block; color: #a8873a; font-size: 12px; font-weight: 700; }
.noor-exit__ticket.is-copied .noor-exit__tap { color: #1f7a3a; }
.noor-exit__btn { display: block; width: 100%; padding: 14px; border: 0; border-radius: 10px; background: linear-gradient(135deg, #c9a84c, #f0d080); color: #1a1a1a !important; font: 800 15px Lato, sans-serif; text-align: center; text-decoration: none !important; cursor: pointer; box-shadow: 0 8px 20px rgba(201, 168, 76, .35); transition: transform .15s ease, box-shadow .15s ease; }
.noor-exit__btn:hover { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(201, 168, 76, .45); }
.noor-exit__btn.is-done { background: #1f7a3a; color: #fff !important; box-shadow: none; }
.noor-exit__msg { margin: 8px 0 0; color: #b32d2e; font-size: 13px; }
.noor-exit__msg:empty { display: none; }
.noor-exit__fine { margin: 10px 0 0; color: #999; font-size: 11px; line-height: 1.45; }
.noor-exit__later { align-self: center; margin-top: 8px; padding: 4px 8px; border: 0; background: none; color: #888; font: 13px Lato, sans-serif; text-decoration: underline; cursor: pointer; }
@media (max-width: 620px) {
  .noor-exit__card { grid-template-columns: 1fr; max-width: 420px; }
  .noor-exit__side { flex-direction: row; flex-wrap: wrap; gap: 6px 12px; padding: 18px 16px; }
  .noor-exit__badge { width: 100%; text-align: center; }
  .noor-exit__big { margin: 0; font-size: 48px; }
  .noor-exit__main { padding: 20px 20px 14px; }
  .noor-exit__title { font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) { .noor-exit__card, .noor-exit { transition: none; } .noor-exit__big { animation: none; } }

/* 💡 Produkt-Tipp */
.noor-tip { padding: 10px 0 4px; color: #555; font: 13px/1.65 Lato, sans-serif; min-height: 20px; }
.noor-tip__cursor { display: inline-block; width: 2px; height: 13px; margin-inline-start: 2px; vertical-align: middle; background: #b8924a; animation: noor-tip-blink .65s step-end infinite; }
@keyframes noor-tip-blink { 50% { opacity: 0; } }
