/*
 * nz-fx.css -- "objects & effects" layer of the Bazar redesign (loaded after nz-soft.css; pairs with js/nz-fx.js).
 * Ideas borrowed from component galleries (rotating neon edge, spotlight cards, ink stamp, ticker, soft switches),
 * re-drawn here in plain CSS/SVG. Everything is decoration: without this file the site looks like before, and every
 * animation is switched off under prefers-reduced-motion.
 */
@property --nzs-a { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
@keyframes nzs-spin { to { --nzs-a: 360deg; } }
@keyframes nzs-marq { to { transform: translateX(50%); } }
@keyframes nzs-sway { 0%, 100% { transform: rotate(-7deg); } 50% { transform: rotate(7deg); } }
@keyframes nzs-shimmer { to { background-position: -200% 0; } }

/* 1) spotlight: a warm glow follows the pointer over cards (the empty full-card link carries it, so no extra markup) */
.nz-ad__link { background: radial-gradient(260px circle at var(--mx, -400px) var(--my, -400px), rgba(255, 205, 150, .26), transparent 62%); border-radius: inherit; }
[data-nzc-mode="dark"] .nz-ad__link { background: radial-gradient(260px circle at var(--mx, -400px) var(--my, -400px), rgba(255, 190, 130, .12), transparent 62%); }
.bz-tier, .bz-shopcard, .bz-catcol { --mx: -400px; --my: -400px; }
.bz-shopcard:hover, .bz-catcol:hover { background-image: radial-gradient(300px circle at var(--mx) var(--my), rgba(255, 205, 150, .22), transparent 62%); }

/* 2) neon edge: VIP cards and the recommended plan get a slowly travelling gold/ruby rim */
.nz-ad:has(.nz-chip--vip), .bz-tier.is-hot {
  border: 2px solid transparent;
  background:
    linear-gradient(var(--nzf-card, #fffdfa), var(--nzf-card, #fffdfa)) padding-box,
    conic-gradient(from var(--nzs-a), #ffd27a, #e0263f 25%, #ffd27a 50%, #e0a458 75%, #ffd27a) border-box;
  animation: nzs-spin 7s linear infinite;
}
[data-nzc-mode="dark"] .nz-ad:has(.nz-chip--vip), [data-nzc-mode="dark"] .bz-tier.is-hot {
  background: linear-gradient(var(--surface), var(--surface)) padding-box, conic-gradient(from var(--nzs-a), #b8862f, #c8102e 25%, #b8862f 50%, #8a5a1e 75%, #b8862f) border-box;
}

/* 3) ink stamp for sold ads: a rotated, double-ruled seal over a greyed photo instead of a small corner tag */
.nz-chip--sold { inset: 50% auto auto 50%; transform: translate(-50%, -50%) rotate(-11deg); z-index: 3; padding: 5px 18px; border: 3px double #c8102e; border-radius: 10px; background: rgba(255, 255, 255, .86);
  color: #c8102e; font-size: 20px; font-weight: 900; line-height: 1.4; letter-spacing: 0; box-shadow: none; pointer-events: none; text-shadow: none; }
[data-nzc-mode="dark"] .nz-chip--sold { background: rgba(20, 14, 12, .82); color: #ff6b81; border-color: #ff6b81; }
.nz-ad:has(.nz-chip--sold) .nz-thumb { filter: grayscale(.9) brightness(.96); }

/* 4) switches: pale sunken track, white knob with a soft drop, ruby when on */
.nz-main .nzc-switch__track { border: 0; background: color-mix(in srgb, var(--line-strong) 38%, var(--surface-2)); box-shadow: inset 0 1px 4px rgba(60, 30, 10, .2); }
.nz-main .nzc-switch__track::after { background: #fff; box-shadow: 0 2px 7px rgba(60, 30, 10, .32); }
.nz-main .nzc-switch input:checked + .nzc-switch__track { background: linear-gradient(180deg, #e0263f, #b30f28); box-shadow: inset 0 1px 3px rgba(0, 0, 0, .25); }
.nz-main .nzc-switch input:focus-visible + .nzc-switch__track { outline: 3px solid color-mix(in srgb, var(--primary) 45%, transparent); outline-offset: 2px; }

/* 5) shop cards: a soft tinted cover (their own colour) instead of a huge cropped silhouette */
.nz-inner .bz-shopcard__cover { position: relative; height: 92px; overflow: hidden;
  background: radial-gradient(150px 100px at 86% 10%, color-mix(in srgb, var(--_c) 34%, #fff), transparent 72%), linear-gradient(135deg, color-mix(in srgb, var(--_c) 24%, #fff), color-mix(in srgb, var(--_c) 52%, #fff)); }
.nz-inner .bz-shopcard__cover > * { display: none; }
.nz-inner .bz-shopcard__cover::after { content: ''; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(circle at 12% 130%, rgba(255, 255, 255, .55) 0 24%, transparent 25%), radial-gradient(circle at 96% -14%, rgba(255, 255, 255, .4) 0 20%, transparent 21%); }
[data-nzc-mode="dark"] .nz-inner .bz-shopcard__cover { background: linear-gradient(135deg, color-mix(in srgb, var(--_c) 35%, #1c1512), color-mix(in srgb, var(--_c) 55%, #1c1512)); }

/* 6) plan ribbon: the stamp text inherited the primary colour on a primary background */
.nz-inner .bz-tier__stamp { color: #fff !important; box-shadow: 0 6px 14px rgba(200, 16, 46, .3); }

/* 7) image skeleton: a shimmer shows while a lazy photo loads */
.nz-thumb { background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, .55) 50%, transparent 70%) 0 0 / 200% 100%, var(--nzf-cream, #fbf1e4); animation: nzs-shimmer 1.6s linear infinite; }
[data-nzc-mode="dark"] .nz-thumb { background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, .07) 50%, transparent 70%) 0 0 / 200% 100%, var(--surface-2); }

/* 8) ticker of popular searches (js/nz-fx.js wraps + clones the chips only when they overflow) */
.nz-popular__view { flex: 1 1 0; min-width: 0; overflow: hidden; -webkit-mask: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); mask: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); }
.nz-popular__track { display: flex; width: max-content; gap: 10px; animation: nzs-marq 42s linear infinite; }
.nz-popular__set { display: flex; gap: 10px; padding-inline-end: 10px; }
.nz-popular__view:hover .nz-popular__track { animation-play-state: paused; }

/* 9) 404: compass swings, the search slip becomes a plain soft card */
.bz-404__num img { transform-origin: 50% 60%; animation: nzs-sway 5.5s ease-in-out infinite; }
.tp-bazar .bz-404__slip { border: 1.5px solid var(--nzf-line-2, #e6d6c2); border-radius: 24px; background: var(--nzf-card, #fffdfa); box-shadow: var(--shadow-1); padding: 22px; }
.tp-bazar .bz-404__slip .bz-slip__label { position: static; display: block; margin-bottom: 10px; padding: 0; background: none; border: 0; color: var(--text-2, #6b5a4c); font-size: 13px; transform: none; }
.tp-bazar .bz-404__slip input { height: 48px; padding-inline: 16px; border: 1.5px solid var(--nzf-line-2, #e6d6c2); border-radius: 15px; background: var(--nzf-field, #fff); }

/* 10) edges: footer rises in a wave, the plain (login) header loses its hard double rule */
.nz-foot { margin-top: 44px;
  -webkit-mask: linear-gradient(#000 0 0) bottom / 100% calc(100% - 19px) no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 20' preserveAspectRatio='none'%3E%3Cpath d='M0 20H160V10C140 0 120 0 80 10S20 20 0 10Z'/%3E%3C/svg%3E") top / 160px 20px repeat-x;
          mask: linear-gradient(#000 0 0) bottom / 100% calc(100% - 19px) no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 20' preserveAspectRatio='none'%3E%3Cpath d='M0 20H160V10C140 0 120 0 80 10S20 20 0 10Z'/%3E%3C/svg%3E") top / 160px 20px repeat-x; }
.nz-head--plain { border-bottom: 0; padding-bottom: 14px;
  -webkit-mask: linear-gradient(#000 0 0) top / 100% calc(100% - 19px) no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 20' preserveAspectRatio='none'%3E%3Cpath d='M0 0H160V10C140 20 120 20 80 10S20 0 0 10Z'/%3E%3C/svg%3E") bottom / 160px 20px repeat-x;
          mask: linear-gradient(#000 0 0) top / 100% calc(100% - 19px) no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 20' preserveAspectRatio='none'%3E%3Cpath d='M0 0H160V10C140 20 120 20 80 10S20 0 0 10Z'/%3E%3C/svg%3E") bottom / 160px 20px repeat-x; }

/* 11) header menu: one line on laptop widths (it broke the last item onto a second row) */
@media (max-width: 1320px) {
  .nz-head--photo .nz-nav { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; justify-content: flex-start; }
  .nz-head--photo .nz-nav::-webkit-scrollbar { display: none; }
  .nz-head--photo .nz-nav a { padding-inline: 10px; font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .nz-ad:has(.nz-chip--vip), .bz-tier.is-hot, .nz-thumb, .bz-404__num img, .nz-popular__track { animation: none; }
}

/* 12) filigree corners: only the big section panels (.nz-panel--warm, both corners, framing a centred heading) keep them. On the small
   utility cards (profile, trust note, my-ads rows, login/wizard cards) the piece landed as a random clipped scrap next to the avatar / tab. */
.nz-card--orn::before, .nz-card--orn2::after { display: none; }

/* 13) price card: "توافقی"/"رایگان" is a word, not a number -- at the numeric price's 46px size (nz-inner.css) it wrapped
   onto two lines and duplicated the note stamp above it (fixed in detail.blade.php: the note is now hidden when it repeats
   the word-price, and the value itself drops to a calmer size here). */
.nz-inner .bz-pricecard__v.is-word b { font-family: var(--font-display); font-size: 26px; font-weight: 800; color: var(--primary-text); }