body.kolbeh-body .account-sidebar { position: sticky; top: 5.5rem; display: flex; flex-direction: column; gap: 0.85rem; padding: 1rem; border-radius: 18px; border: 1px solid rgba(212, 175, 55, 0.28); background: linear-gradient( 165deg, rgba(22, 34, 64, 0.96) 0%, rgba(12, 20, 38, 0.98) 100% ); box-shadow: 0 0 24px rgba(212, 175, 55, 0.1), 0 16px 40px rgba(0, 0, 0, 0.35); } body.kolbeh-body .account-sidebar__profile { display: flex; align-items: center; gap: 0.75rem; padding: 0.65rem 0.55rem 0.85rem; border-bottom: 1px solid rgba(212, 175, 55, 0.14); } body.kolbeh-body .account-sidebar__avatar { display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; flex-shrink: 0; background: rgba(10, 18, 36, 0.75); border: 1px solid rgba(212, 175, 55, 0.38); color: var(--kolbeh-purple); font-size: 1.1rem; font-weight: 700; overflow: hidden; box-shadow: 0 0 14px rgba(212, 175, 55, 0.16); } body.kolbeh-body .account-sidebar__avatar.has-photo img { width: 100%; height: 100%; object-fit: cover; } body.kolbeh-body .account-sidebar__meta { min-width: 0; display: flex; flex-direction: column; gap: 0.15rem; } body.kolbeh-body .account-sidebar__name { font-size: 0.9rem; font-weight: 700; color: var(--kolbeh-purple); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } body.kolbeh-body .account-sidebar__phone { font-size: 0.74rem; color: rgba(255, 255, 255, 0.5); } body.kolbeh-body .account-sidebar__nav { display: flex; flex-direction: column; gap: 0.2rem; } body.kolbeh-body .account-sidebar__link { display: flex; align-items: center; gap: 0.65rem; padding: 0.58rem 0.65rem; border-radius: 11px; color: rgba(255, 255, 255, 0.82); text-decoration: none; font-size: 0.82rem; font-weight: 500; border: 1px solid transparent; transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease, transform 0.2s ease; } body.kolbeh-body .account-sidebar__link:hover, body.kolbeh-body .account-sidebar__link:focus { color: #fff8e8 !important; background: rgba(212, 175, 55, 0.08); border-color: rgba(212, 175, 55, 0.14); } body.kolbeh-body .account-sidebar__link.is-active, body.kolbeh-body .account-sidebar__link.is-active:hover, body.kolbeh-body .account-sidebar__link.is-active:focus { color: #fff8e8 !important; background: rgba(212, 175, 55, 0.14); border-color: rgba(212, 175, 55, 0.32); box-shadow: inset 3px 0 0 var(--kolbeh-purple); } body.kolbeh-body[data-dir="ltr"] .account-sidebar__link.is-active { box-shadow: inset -3px 0 0 var(--kolbeh-purple); } body.kolbeh-body .account-sidebar__icon { display: inline-grid; place-items: center; width: 1.9rem; height: 1.9rem; border-radius: 9px; flex-shrink: 0; background: rgba(10, 18, 36, 0.55); border: 1px solid rgba(212, 175, 55, 0.18); color: var(--kolbeh-purple); font-size: 0.9rem; } body.kolbeh-body .account-sidebar__link.is-active .account-sidebar__icon { border-color: rgba(248, 220, 140, 0.42); box-shadow: 0 0 10px rgba(212, 175, 55, 0.18); } body.kolbeh-body .account-sidebar__notify-badge { margin-inline-start: auto; min-width: 18px; height: 18px; font-size: 0.62rem; } body.kolbeh-body .account-sidebar__footer { padding: 0.65rem 0.45rem 0.2rem; border-top: 1px solid rgba(212, 175, 55, 0.14); } body.kolbeh-body .account-sidebar__link--logout { justify-content: center; width: 100%; min-height: 2.65rem; padding: 0.68rem 0.9rem; font-weight: 700; letter-spacing: 0.02em; color: #fecdd3; border: 1px solid rgba(248, 113, 113, 0.34); border-radius: 12px; background: linear-gradient(135deg, rgba(220, 38, 38, 0.18) 0%, rgba(127, 29, 29, 0.1) 100%); box-shadow: 0 2px 14px rgba(220, 38, 38, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.06); } body.kolbeh-body .account-sidebar__link--logout .account-sidebar__icon { color: #fda4af; border-color: rgba(248, 113, 113, 0.34); background: rgba(69, 10, 22, 0.42); box-shadow: 0 0 12px rgba(248, 113, 113, 0.12); } body.kolbeh-body .account-sidebar__link--logout:hover, body.kolbeh-body .account-sidebar__link--logout:focus { color: #ffe4e6 !important; background: linear-gradient(135deg, rgba(248, 113, 113, 0.24) 0%, rgba(185, 28, 28, 0.16) 100%); border-color: rgba(252, 165, 165, 0.48); transform: translateY(-1px); box-shadow: 0 6px 20px rgba(220, 38, 38, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.08); } body.kolbeh-body .account-page-head { margin-bottom: 1.25rem; } body.kolbeh-body .account-page-head--split { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; } body.kolbeh-body .account-back-btn { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.45rem 0.9rem; border-radius: 999px; color: #14100a; font-size: 0.8rem; font-weight: 700; text-decoration: none; background: transparent; box-shadow: 0 0 0 1px rgba(60, 46, 18, 0.18), 0 2px 8px rgba(0, 0, 0, 0.28); } body.kolbeh-body .account-back-btn::after { background: var(--btn-primary-bg); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.24), inset 0 -1px 0 rgba(100, 78, 32, 0.22); } body.kolbeh-body .account-back-btn:hover, body.kolbeh-body .account-back-btn:focus { color: #14100a !important; transform: translateY(-1px); box-shadow: 0 0 0 1px rgba(60, 46, 18, 0.24), 0 4px 12px rgba(0, 0, 0, 0.34); } body.kolbeh-body .account-back-btn:hover::after, body.kolbeh-body .account-back-btn:focus::after { box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28), inset 0 -1px 0 rgba(100, 78, 32, 0.28); } body.kolbeh-body .account-back-btn > *, body.kolbeh-body .account-back-btn .btn-shine-inner { position: relative; z-index: 4; color: #14100a; } body.kolbeh-body .account-panel__head { padding: 0.9rem 1.1rem; border-bottom: 1px solid rgba(212, 175, 55, 0.14); } body.kolbeh-body .account-panel__title { margin: 0; font-size: 0.95rem; font-weight: 600; color: var(--kolbeh-purple); } body.kolbeh-body .account-panel__head--split { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; } body.kolbeh-body .account-panel__more { display: inline-flex; align-items: center; padding: 0.32rem 0.72rem; border-radius: 999px; border: 1px solid rgba(212, 175, 55, 0.22); background: rgba(212, 175, 55, 0.08); color: var(--kolbeh-purple); font-size: 0.72rem; font-weight: 700; text-decoration: none; white-space: nowrap; transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.18s ease; } body.kolbeh-body .account-panel__more:hover, body.kolbeh-body .account-panel__more:focus-visible { color: #fff8e8; border-color: rgba(248, 220, 140, 0.42); background: rgba(212, 175, 55, 0.16); outline: none; } body.kolbeh-body .account-recent-orders { display: flex; flex-direction: column; gap: 0.55rem; padding: 0.85rem 1rem 1rem; } body.kolbeh-body .account-recent-orders.account-order-cards { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; padding: 1rem; align-items: stretch; } @media (min-width: 768px) { body.kolbeh-body .account-recent-orders.account-order-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } body.kolbeh-body .account-recent-orders.account-order-cards > .account-recent-order-card:last-child:nth-child(odd) { grid-column: 1 / -1; max-width: calc((100% - 1rem) / 2); width: 100%; justify-self: start; } } body.kolbeh-body .account-recent-orders.account-order-cards > .account-recent-order-card { height: 100%; min-height: 100%; } body.kolbeh-body .account-recent-orders__empty { padding: 2rem 1rem; text-align: center; font-size: 0.86rem; color: rgba(255, 255, 255, 0.48); } body.kolbeh-body .account-recent-order-card { --order-accent: #d4af37; display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.82rem 0.9rem 0.82rem 1rem; border-radius: 14px; border: 1px solid rgba(212, 175, 55, 0.14); background: linear-gradient( 135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 100% ); box-shadow: inset 3px 0 0 var(--order-accent); cursor: pointer; transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease; } body.kolbeh-body .account-order-card { flex-direction: column; align-items: stretch; gap: 0.75rem; padding: 1rem 1rem 0.95rem; } body.kolbeh-body .account-order-cards .account-order-card { display: flex; } body.kolbeh-body .account-order-cards .account-order-card__foot { margin-top: auto; } body.kolbeh-body .account-order-card--complete { border-color: rgba(52, 211, 153, 0.24); background: linear-gradient(135deg, rgba(16, 185, 129, 0.08) 0%, rgba(255, 255, 255, 0.02) 100%); } body.kolbeh-body .account-order-card__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.65rem; } body.kolbeh-body .account-order-card__badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.35rem; flex-shrink: 0; } body.kolbeh-body .account-order-card--payment-due { border-color: rgba(245, 158, 11, 0.32); background: linear-gradient( 165deg, rgba(245, 158, 11, 0.08) 0%, rgba(255, 255, 255, 0.03) 45%, rgba(255, 255, 255, 0.02) 100% ); } body.kolbeh-body .account-order-card--countdown { padding-top: 0; gap: 0.85rem; } body.kolbeh-body .account-order-cards .account-order-card--countdown .account-order-card__paybar { flex-direction: column; align-items: stretch; } body.kolbeh-body .account-order-cards .account-order-card--countdown .account-order-card__paybar-btn { justify-content: center; width: 100%; } body.kolbeh-body .account-order-card__paybar { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; margin: -1rem -1rem 0; padding: 0.85rem 1rem; border-bottom: 1px solid rgba(245, 158, 11, 0.22); background: linear-gradient( 135deg, rgba(245, 158, 11, 0.14) 0%, rgba(212, 175, 55, 0.08) 100% ); } body.kolbeh-body .account-order-card__paybar-main { display: flex; align-items: center; gap: 0.75rem; min-width: 0; flex: 1; } body.kolbeh-body .account-order-card__countdown { --pr-gold: var(--elco-gold-bright, #e8cc6a); position: relative; width: 48px; height: 48px; flex-shrink: 0; } body.kolbeh-body .account-order-card__countdown-ring { width: 100%; height: 100%; transform: rotate(-90deg); } body.kolbeh-body .account-order-card__countdown .pr-timer__track { fill: none; stroke: rgba(255, 255, 255, 0.12); stroke-width: 4; } body.kolbeh-body .account-order-card__countdown .pr-timer__bar { fill: none; stroke: var(--pr-gold); stroke-width: 4; stroke-linecap: round; stroke-dasharray: 175.93; stroke-dashoffset: calc(175.93 * (1 - var(--pr-progress, 1))); transition: stroke-dashoffset 1s linear, stroke 0.25s; } body.kolbeh-body .account-order-card__countdown.is-urgent .pr-timer__bar { stroke: #ff8a96; } body.kolbeh-body .account-order-card__countdown.is-expired .pr-timer__bar { stroke: rgba(255, 255, 255, 0.18); } body.kolbeh-body .account-order-card__countdown-time { position: absolute; inset: 0; display: grid; place-items: center; font-size: 0.68rem; font-weight: 800; color: #fff; font-variant-numeric: tabular-nums; } body.kolbeh-body .account-order-card__countdown.is-urgent .account-order-card__countdown-time { color: #ff8a96; } body.kolbeh-body .account-order-card__countdown.is-expired .account-order-card__countdown-time { color: rgba(255, 255, 255, 0.35); } body.kolbeh-body .account-order-card__paybar-copy { min-width: 0; } body.kolbeh-body .account-order-card__paybar-label { display: block; font-size: 0.72rem; font-weight: 700; color: #fff8e8; margin-bottom: 0.1rem; } body.kolbeh-body .account-order-card__paybar-hint { margin: 0; font-size: 0.68rem; line-height: 1.45; color: rgba(255, 255, 255, 0.58); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } body.kolbeh-body .account-order-card__paybar-btn { display: inline-flex; align-items: center; gap: 0.35rem; flex-shrink: 0; padding: 0.5rem 0.85rem; border-radius: 999px; border: 1px solid rgba(212, 175, 55, 0.45); background: linear-gradient(135deg, rgba(212, 175, 55, 0.28) 0%, rgba(168, 139, 58, 0.18) 100%); color: #fff; font-size: 0.72rem; font-weight: 800; text-decoration: none; white-space: nowrap; transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease; } body.kolbeh-body .account-order-card__paybar-btn:hover { color: #fff; background: linear-gradient(135deg, rgba(212, 175, 55, 0.38) 0%, rgba(168, 139, 58, 0.26) 100%); border-color: rgba(212, 175, 55, 0.62); transform: translateY(-1px); } body.kolbeh-body .account-order-card__hint--payment { color: rgba(255, 248, 232, 0.78); font-weight: 600; } body.kolbeh-body .account-order-card__identity { min-width: 0; } body.kolbeh-body .account-order-card__products { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; } body.kolbeh-body .account-order-card__thumbs { display: flex; align-items: center; gap: 0.4rem; } body.kolbeh-body .account-order-card__thumb { width: 3rem; height: 3rem; border-radius: 10px; overflow: hidden; border: 1px solid rgba(212, 175, 55, 0.18); background: rgba(255, 255, 255, 0.04); flex-shrink: 0; } body.kolbeh-body .account-order-card__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; } body.kolbeh-body .account-order-card__thumb--more { display: grid; place-items: center; font-size: 0.72rem; font-weight: 800; color: rgba(255, 255, 255, 0.72); } body.kolbeh-body .account-order-card__items { margin: 0; font-size: 0.72rem; font-weight: 600; color: rgba(255, 255, 255, 0.5); white-space: nowrap; } body.kolbeh-body .account-order-card__progress { display: flex; align-items: center; gap: 0; padding: 0.1rem 0.15rem; } body.kolbeh-body .account-order-card__dot { width: 0.55rem; height: 0.55rem; border-radius: 999px; background: rgba(255, 255, 255, 0.18); flex-shrink: 0; } body.kolbeh-body .account-order-card__dot--done { background: #34d399; box-shadow: 0 0 0 3px rgba(52, 211, 153, 0.18); } body.kolbeh-body .account-order-card__dot--active { background: var(--elco-gold-bright, #d4af37); box-shadow: 0 0 0 4px rgba(212, 175, 55, 0.22); transform: scale(1.15); } body.kolbeh-body .account-order-card__line { flex: 1; height: 2px; min-width: 0.75rem; background: rgba(255, 255, 255, 0.12); border-radius: 2px; } body.kolbeh-body .account-order-card__line--done { background: rgba(52, 211, 153, 0.55); } body.kolbeh-body .account-order-card__hint { margin: 0; font-size: 0.76rem; line-height: 1.5; color: rgba(255, 255, 255, 0.62); } body.kolbeh-body .account-order-card__foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 0.75rem; padding-top: 0.55rem; border-top: 1px solid rgba(212, 175, 55, 0.1); } body.kolbeh-body .account-order-card__total-wrap { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; } body.kolbeh-body .account-order-card__total-label { font-size: 0.66rem; font-weight: 600; color: rgba(255, 255, 255, 0.45); } body.kolbeh-body .account-order-card__actions { display: flex; flex-direction: column; align-items: flex-end; gap: 0.45rem; flex-shrink: 0; } body.kolbeh-body .account-order-card__detail-btn { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.42rem 0.72rem; border-radius: 999px; border: 1px solid rgba(212, 175, 55, 0.28); background: rgba(212, 175, 55, 0.1); color: #fff8e8; font-size: 0.72rem; font-weight: 700; text-decoration: none; transition: background 0.15s ease, border-color 0.15s ease; } body.kolbeh-body .account-order-card__detail-btn:hover { background: rgba(212, 175, 55, 0.18); border-color: rgba(212, 175, 55, 0.42); color: #fff; } body.kolbeh-body .account-orders-filter { display: flex; flex-wrap: wrap; gap: 0.45rem; margin-bottom: 1rem; padding: 0.35rem; border-radius: 14px; border: 1px solid rgba(212, 175, 55, 0.12); background: rgba(255, 255, 255, 0.03); } body.kolbeh-body .account-orders-filter__tab { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.48rem 0.82rem; border-radius: 999px; border: 1px solid transparent; color: rgba(255, 255, 255, 0.62); font-size: 0.76rem; font-weight: 700; text-decoration: none; transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease; } body.kolbeh-body .account-orders-filter__tab:hover { color: #fff; background: rgba(255, 255, 255, 0.05); } body.kolbeh-body .account-orders-filter__tab--active { color: #fff8e8; background: rgba(212, 175, 55, 0.16); border-color: rgba(212, 175, 55, 0.32); } body.kolbeh-body .account-orders-filter__count { min-width: 1.25rem; padding: 0.05rem 0.35rem; border-radius: 999px; background: rgba(255, 255, 255, 0.1); font-size: 0.64rem; text-align: center; } body.kolbeh-body .account-orders-filter__tab--active .account-orders-filter__count { background: rgba(15, 26, 50, 0.28); } body.kolbeh-body .account-orders-list-panel { padding: 0; overflow: hidden; } body.kolbeh-body .account-orders-grouped { display: flex; flex-direction: column; gap: 1.25rem; padding: 1rem; } body.kolbeh-body .account-orders-section__head { display: flex; align-items: flex-start; gap: 0.75rem; margin-bottom: 0.85rem; padding: 0.85rem 1rem; border-radius: 14px; } body.kolbeh-body .account-orders-section--attention .account-orders-section__head { background: linear-gradient(135deg, rgba(245, 158, 11, 0.16) 0%, rgba(212, 175, 55, 0.08) 100%); border: 1px solid rgba(245, 158, 11, 0.28); } body.kolbeh-body .account-orders-section--settled .account-orders-section__head { background: rgba(255, 255, 255, 0.03); border: 1px solid rgba(212, 175, 55, 0.12); } body.kolbeh-body .account-orders-section__icon { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 10px; flex-shrink: 0; background: rgba(245, 158, 11, 0.18); border: 1px solid rgba(245, 158, 11, 0.32); color: #fbbf24; font-size: 1.05rem; } body.kolbeh-body .account-orders-section__icon--muted { background: rgba(52, 211, 153, 0.12); border-color: rgba(52, 211, 153, 0.24); color: #34d399; } body.kolbeh-body .account-orders-section__title { margin: 0 0 0.2rem; font-size: 0.92rem; font-weight: 800; color: #fff; line-height: 1.35; } body.kolbeh-body .account-orders-section__hint { margin: 0; font-size: 0.74rem; line-height: 1.5; color: rgba(255, 255, 255, 0.55); } body.kolbeh-body .account-orders-section__count { margin-inline-start: auto; flex-shrink: 0; min-width: 1.65rem; padding: 0.15rem 0.5rem; border-radius: 999px; background: rgba(15, 26, 50, 0.35); font-size: 0.72rem; font-weight: 800; color: #fff8e8; text-align: center; } body.kolbeh-body .account-orders-section--attention .account-orders-section__count { background: rgba(245, 158, 11, 0.22); color: #fde68a; } body.kolbeh-body .account-orders-section .account-recent-orders.account-order-cards { padding: 0; } body.kolbeh-body .account-page-subtitle--alert { display: inline-flex; align-items: center; gap: 0.35rem; margin-top: 0.35rem; padding: 0.35rem 0.65rem; border-radius: 999px; font-size: 0.76rem; font-weight: 700; color: #fde68a; background: rgba(245, 158, 11, 0.14); border: 1px solid rgba(245, 158, 11, 0.28); } body.kolbeh-body .account-orders-filter__tab--attention:not(.account-orders-filter__tab--active) { color: #fde68a; border-color: rgba(245, 158, 11, 0.22); background: rgba(245, 158, 11, 0.08); } body.kolbeh-body .account-orders-filter__tab--attention.account-orders-filter__tab--active { background: rgba(245, 158, 11, 0.2); border-color: rgba(245, 158, 11, 0.38); color: #fff8e8; } body.kolbeh-body .account-order-cards .account-recent-order-card { box-shadow: inset 0 3px 0 var(--order-accent), 0 6px 20px rgba(0, 0, 0, 0.14); } body.kolbeh-body .account-order-cards .account-order-card__foot { flex-direction: column; align-items: stretch; gap: 0.65rem; } body.kolbeh-body .account-order-cards .account-order-card__actions { align-items: stretch; width: 100%; } body.kolbeh-body .account-order-cards .account-order-card__detail-btn, body.kolbeh-body .account-order-cards .account-recent-order-card__pay-btn { justify-content: center; width: 100%; } body.kolbeh-body .account-empty--compact { padding: 2rem 1.25rem; } body.kolbeh-body .account-recent-order-card__date { display: block; margin-top: 0.15rem; font-size: 0.72rem; line-height: 1.35; color: rgba(255, 255, 255, 0.46); } body.kolbeh-body .account-recent-order-card--pending { --order-accent: #f59e0b; } body.kolbeh-body .account-recent-order-card--processing { --order-accent: #38bdf8; } body.kolbeh-body .account-recent-order-card--shipped { --order-accent: #818cf8; } body.kolbeh-body .account-recent-order-card--delivered { --order-accent: #34d399; } body.kolbeh-body .account-recent-order-card--cancelled { --order-accent: #f87171; } body.kolbeh-body .account-recent-order-card--default { --order-accent: #94a3b8; } body.kolbeh-body .account-recent-order-card:hover, body.kolbeh-body .account-recent-order-card:focus-visible { transform: translateY(-2px); border-color: rgba(212, 175, 55, 0.28); background: rgba(212, 175, 55, 0.06); outline: none; box-shadow: inset 3px 0 0 var(--order-accent), 0 8px 22px rgba(0, 0, 0, 0.18); } body.kolbeh-body .account-order-cards .account-recent-order-card:hover, body.kolbeh-body .account-order-cards .account-recent-order-card:focus-visible { box-shadow: inset 0 3px 0 var(--order-accent), 0 12px 28px rgba(0, 0, 0, 0.2); } body.kolbeh-body .account-recent-order-card__main { min-width: 0; flex: 1 1 auto; } body.kolbeh-body .account-recent-order-card__top { display: flex; align-items: center; flex-wrap: wrap; gap: 0.35rem 0.5rem; } body.kolbeh-body .account-recent-order-card__no { font-size: 0.8rem; font-weight: 700; letter-spacing: 0.03em; color: #fff; } @media (max-width: 575.98px) { body.kolbeh-body .account-order-card__paybar { flex-direction: column; align-items: stretch; } body.kolbeh-body .account-order-card__paybar-btn { justify-content: center; width: 100%; } body.kolbeh-body .account-order-card__foot { flex-direction: column; align-items: stretch; } body.kolbeh-body .account-order-card__actions { align-items: stretch; } body.kolbeh-body .account-order-card__detail-btn, body.kolbeh-body .account-recent-order-card__pay-btn { justify-content: center; width: 100%; } body.kolbeh-body .account-orders-filter__tab { flex: 1 1 calc(50% - 0.25rem); justify-content: center; } } body.kolbeh-body .account-recent-order-card__aside { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 0.45rem; flex-shrink: 0; } body.kolbeh-body .account-recent-order-card__price { display: inline-flex; align-items: center; gap: 0.35rem; } body.kolbeh-body .account-recent-order-card__actions { display: flex; justify-content: flex-end; } body.kolbeh-body .account-recent-order-card__actions .account-order-pay-form { margin: 0; } body.kolbeh-body .account-recent-order-card__pay-btn { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.4rem 0.78rem; border: none; border-radius: 999px; background: var(--btn-primary-bg); color: #14100a; font-size: 0.68rem; font-weight: 700; line-height: 1.2; white-space: nowrap; cursor: pointer; box-shadow: 0 0 0 1px rgba(60, 46, 18, 0.14), 0 2px 8px rgba(0, 0, 0, 0.16); transition: transform 0.18s ease, box-shadow 0.18s ease; } body.kolbeh-body .account-recent-order-card__pay-btn:hover, body.kolbeh-body .account-recent-order-card__pay-btn:focus-visible { transform: translateY(-1px); box-shadow: 0 0 0 1px rgba(60, 46, 18, 0.22), 0 4px 12px rgba(0, 0, 0, 0.22); outline: none; } body.kolbeh-body .account-order-group__panel--cards { overflow: hidden; } body.kolbeh-body .account-recent-order-card__total { font-size: 0.82rem; font-weight: 700; color: var(--kolbeh-purple); white-space: nowrap; } body.kolbeh-body .account-recent-order-card__chevron { font-size: 0.78rem; color: rgba(232, 204, 106, 0.55); transition: transform 0.2s ease, color 0.2s ease; } body.kolbeh-body .account-recent-order-card:hover .account-recent-order-card__chevron, body.kolbeh-body .account-recent-order-card:focus-visible .account-recent-order-card__chevron { color: var(--kolbeh-purple); transform: translateX(-2px); } body.kolbeh-body[data-dir="ltr"] .account-recent-order-card:hover .account-recent-order-card__chevron, body.kolbeh-body[data-dir="ltr"] .account-recent-order-card:focus-visible .account-recent-order-card__chevron { transform: translateX(2px); } body.kolbeh-body .account-order-meta { padding: 1.1rem 1.15rem; } body.kolbeh-body .account-order-meta__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem 1.25rem; } body.kolbeh-body .account-order-meta__item { display: flex; flex-direction: column; gap: 0.35rem; min-width: 0; } body.kolbeh-body .account-order-meta__label { font-size: 0.72rem; font-weight: 600; color: rgba(232, 204, 106, 0.72); letter-spacing: 0.02em; } body.kolbeh-body .account-order-tracking { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid rgba(212, 175, 55, 0.12); display: flex; flex-direction: column; gap: 0.35rem; } body.kolbeh-body .account-order-tracking strong { color: #fff; font-size: 0.9rem; } body.kolbeh-body .account-order-summary { padding: 1rem 1.15rem 1.15rem; border-top: 1px solid rgba(212, 175, 55, 0.14); } body.kolbeh-body .account-order-summary__rows { margin-inline-start: auto; width: min(100%, 22rem); display: flex; flex-direction: column; gap: 0.45rem; } body.kolbeh-body .account-order-summary__row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; font-size: 0.84rem; color: rgba(255, 255, 255, 0.72); } body.kolbeh-body .account-order-summary__row--discount span:last-child { color: #6ee7b7; } body.kolbeh-body .account-order-summary__row--total { margin-top: 0.35rem; padding-top: 0.65rem; border-top: 1px solid rgba(212, 175, 55, 0.18); font-size: 0.95rem; font-weight: 700; color: #fff; } body.kolbeh-body .account-order-summary__grand { color: var(--kolbeh-purple); font-size: 1.05rem; } body.kolbeh-body .account-order-address { padding: 1rem 1.15rem; } body.kolbeh-body .account-order-address__text { margin: 0.5rem 0 0; color: rgba(255, 255, 255, 0.72); line-height: 1.7; } body.kolbeh-body .account-cancel-btn { display: inline-flex; align-items: center; padding: 0.55rem 1.15rem; border-radius: 999px; border: 1px solid rgba(255, 120, 140, 0.38); background: rgba(80, 16, 32, 0.35); color: #ffb8c6; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease; } body.kolbeh-body .account-cancel-btn:hover, body.kolbeh-body .account-cancel-btn:focus { color: #ffc4d0; background: rgba(120, 24, 48, 0.42); border-color: rgba(255, 140, 160, 0.5); } body.kolbeh-body .account-page-title { margin: 0; font-size: clamp(1.25rem, 2.5vw, 1.55rem); font-weight: 700; color: #fff; letter-spacing: 0.01em; } body.kolbeh-body .account-page-subtitle { margin: 0.35rem 0 0; font-size: 0.82rem; color: rgba(255, 255, 255, 0.48); } body.kolbeh-body .account-panel { border-radius: 18px; border: 1px solid rgba(212, 175, 55, 0.24); background: linear-gradient( 165deg, rgba(18, 28, 52, 0.94) 0%, rgba(10, 18, 36, 0.97) 100% ); box-shadow: 0 14px 36px rgba(0, 0, 0, 0.32); overflow: hidden; } body.kolbeh-body .account-table-wrap { overflow-x: auto; } body.kolbeh-body .account-table { --bs-table-color: rgba(255, 255, 255, 0.88); --bs-table-bg: transparent; --bs-table-border-color: rgba(212, 175, 55, 0.1); --bs-table-hover-bg: rgba(212, 175, 55, 0.06); margin: 0; } body.kolbeh-body .account-table thead th { padding: 0.9rem 1rem; font-size: 0.74rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: rgba(232, 204, 106, 0.78); background: rgba(10, 18, 36, 0.65); border-bottom: 1px solid rgba(212, 175, 55, 0.18); white-space: nowrap; } body.kolbeh-body .account-table tbody td { padding: 1rem; vertical-align: middle; border-bottom: 1px solid rgba(255, 255, 255, 0.05); } body.kolbeh-body .account-table tbody tr:last-child td { border-bottom: 0; } body.kolbeh-body .account-table tbody tr:hover td { background: rgba(212, 175, 55, 0.04); } body.kolbeh-body .account-order-no { display: inline-block; font-size: 0.82rem; font-weight: 600; color: #fff; letter-spacing: 0.03em; } body.kolbeh-body .account-order-date { display: block; font-size: 0.84rem; color: rgba(255, 255, 255, 0.88); } body.kolbeh-body .account-order-time { display: block; margin-top: 0.12rem; font-size: 0.72rem; color: rgba(255, 255, 255, 0.42); } body.kolbeh-body .account-order-total { font-size: 0.9rem; font-weight: 700; color: var(--kolbeh-purple); white-space: nowrap; } body.kolbeh-body .account-table__view-btn { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.42rem 0.85rem; border-radius: 999px; color: #14100a; font-size: 0.78rem; font-weight: 700; text-decoration: none; white-space: nowrap; background: transparent; box-shadow: 0 0 0 1px rgba(60, 46, 18, 0.18), 0 2px 8px rgba(0, 0, 0, 0.28); } body.kolbeh-body .account-table__view-btn::after { background: var(--btn-primary-bg); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.24), inset 0 -1px 0 rgba(100, 78, 32, 0.22); } body.kolbeh-body .account-table__view-btn:hover, body.kolbeh-body .account-table__view-btn:focus { color: #14100a !important; transform: translateY(-1px); box-shadow: 0 0 0 1px rgba(60, 46, 18, 0.24), 0 4px 12px rgba(0, 0, 0, 0.34); } body.kolbeh-body .account-table__view-btn:hover::after, body.kolbeh-body .account-table__view-btn:focus::after { box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28), inset 0 -1px 0 rgba(100, 78, 32, 0.28); } body.kolbeh-body .account-table__view-btn > *, body.kolbeh-body .account-table__view-btn .btn-shine-inner { position: relative; z-index: 4; color: #14100a; } body.kolbeh-body .account-table__action-group { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 0.45rem; justify-content: flex-end; } body.kolbeh-body .account-order-pay-form { margin: 0; } body.kolbeh-body .account-table__pay-btn, body.kolbeh-body .account-order-pay-btn { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.42rem 0.85rem; border: 0; border-radius: 999px; color: #14100a; font-size: 0.78rem; font-weight: 700; text-decoration: none; white-space: nowrap; cursor: pointer; background: var(--btn-primary-bg); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.24), inset 0 -1px 0 rgba(100, 78, 32, 0.22), 0 2px 8px rgba(0, 0, 0, 0.28); transition: transform 0.15s ease, box-shadow 0.15s ease; } body.kolbeh-body .account-order-pay-btn { padding: 0.55rem 1.1rem; font-size: 0.84rem; } body.kolbeh-body .account-table__pay-btn:hover, body.kolbeh-body .account-table__pay-btn:focus, body.kolbeh-body .account-order-pay-btn:hover, body.kolbeh-body .account-order-pay-btn:focus { color: #14100a; transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28), inset 0 -1px 0 rgba(100, 78, 32, 0.28), 0 4px 12px rgba(0, 0, 0, 0.34); } body.kolbeh-body .account-badge { display: inline-flex; align-items: center; padding: 0.28rem 0.62rem; border-radius: 999px; font-size: 0.74rem; font-weight: 600; line-height: 1.2; border: 1px solid transparent; white-space: nowrap; } body.kolbeh-body .account-badge--pending { color: #fcd34d; background: rgba(252, 211, 77, 0.12); border-color: rgba(252, 211, 77, 0.28); } body.kolbeh-body .account-badge--processing { color: #93c5fd; background: rgba(147, 197, 253, 0.12); border-color: rgba(147, 197, 253, 0.28); } body.kolbeh-body .account-badge--confirmed { color: #6ee7b7; background: rgba(110, 231, 183, 0.12); border-color: rgba(110, 231, 183, 0.28); } body.kolbeh-body .account-badge--shipped { color: #c4b5fd; background: rgba(196, 181, 253, 0.12); border-color: rgba(196, 181, 253, 0.28); } body.kolbeh-body .account-badge--delivered { color: #6ee7b7; background: rgba(110, 231, 183, 0.12); border-color: rgba(110, 231, 183, 0.28); } body.kolbeh-body .account-badge--cancelled { color: #fca5a5; background: rgba(252, 165, 165, 0.12); border-color: rgba(252, 165, 165, 0.28); } body.kolbeh-body .account-badge--default { color: rgba(255, 255, 255, 0.72); background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.12); } body.kolbeh-body .account-badge--pay-paid { color: #6ee7b7; background: rgba(110, 231, 183, 0.12); border-color: rgba(110, 231, 183, 0.28); } body.kolbeh-body .account-badge--pay-unpaid { color: rgba(255, 255, 255, 0.62); background: rgba(255, 255, 255, 0.05); border-color: rgba(255, 255, 255, 0.12); } body.kolbeh-body .account-badge--pay-default { color: rgba(255, 255, 255, 0.72); background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.12); } body.kolbeh-body .account-empty { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 3rem 1.5rem; } body.kolbeh-body .account-empty__icon { display: grid; place-items: center; width: 4.5rem; height: 4.5rem; margin-bottom: 1rem; border-radius: 50%; background: rgba(212, 175, 55, 0.1); border: 1px solid rgba(212, 175, 55, 0.28); color: var(--kolbeh-purple); font-size: 1.65rem; } body.kolbeh-body .account-empty__title { margin: 0 0 0.45rem; font-size: 1.05rem; font-weight: 600; color: #fff; } body.kolbeh-body .account-empty__text { margin: 0 0 1.25rem; font-size: 0.86rem; color: rgba(255, 255, 255, 0.52); max-width: 26rem; } body.kolbeh-body .account-empty__btn { min-width: 10rem; } body.kolbeh-body .account-empty__icon { background: linear-gradient(145deg, rgba(201, 162, 39, 0.22) 0%, rgba(255, 247, 214, 0.72) 100%); border: 2px solid rgba(12, 18, 36, 0.28); color: #0f1a32; box-shadow: 0 4px 16px rgba(201, 162, 39, 0.14); } body.kolbeh-body .account-empty__title { color: #0c1833; } body.kolbeh-body .account-empty__text { color: #5c6370; } body.kolbeh-body .account-recent-order-card { background: #fff; border-color: rgba(42, 52, 72, 0.1); box-shadow: inset 3px 0 0 var(--order-accent), 0 6px 20px rgba(12, 24, 48, 0.06); } body.kolbeh-body .account-order-cards .account-recent-order-card { box-shadow: inset 0 3px 0 var(--order-accent), 0 6px 20px rgba(12, 24, 48, 0.06); } body.kolbeh-body .account-recent-order-card:hover, body.kolbeh-body .account-recent-order-card:focus-visible { background: #fffdf7; border-color: rgba(201, 162, 39, 0.28); box-shadow: inset 3px 0 0 var(--order-accent), 0 10px 28px rgba(12, 24, 48, 0.1); } body.kolbeh-body .account-order-cards .account-recent-order-card:hover, body.kolbeh-body .account-order-cards .account-recent-order-card:focus-visible { box-shadow: inset 0 3px 0 var(--order-accent), 0 10px 28px rgba(12, 24, 48, 0.1); } body.kolbeh-body .account-order-card--payment-due { background: linear-gradient(165deg, #fff9eb 0%, #ffffff 100%); border-color: rgba(245, 158, 11, 0.28); } body.kolbeh-body .account-order-card__paybar { background: linear-gradient(135deg, rgba(245, 158, 11, 0.12) 0%, rgba(201, 162, 39, 0.08) 100%); border-bottom-color: rgba(201, 162, 39, 0.22); } body.kolbeh-body .account-order-card__paybar-label { color: #7a5c0f; } body.kolbeh-body .account-order-card__paybar-hint { color: #64748b; } body.kolbeh-body .account-order-card__countdown .pr-timer__track { stroke: rgba(42, 52, 72, 0.12); } body.kolbeh-body .account-order-card__countdown-time { color: #1a2234; } body.kolbeh-body .account-order-card__countdown.is-urgent .account-order-card__countdown-time { color: #c82333; } body.kolbeh-body .account-recent-order-card__no { color: #1a2234; } body.kolbeh-body .account-recent-order-card__date { color: #64748b; } body.kolbeh-body .account-order-card__items, body.kolbeh-body .account-order-card__hint { color: #64748b; } body.kolbeh-body .account-order-card__hint--payment { color: #7a5c0f; } body.kolbeh-body .account-order-card__total-label { color: #94a3b8; } body.kolbeh-body .account-recent-order-card__total { color: #1a2234; } body.kolbeh-body .account-order-card__detail-btn { color: #7a5c0f; background: rgba(201, 162, 39, 0.1); border-color: rgba(201, 162, 39, 0.28); } body.kolbeh-body .account-order-card__detail-btn:hover { color: #5c4508; background: rgba(201, 162, 39, 0.16); } body.kolbeh-body .account-order-card__foot { border-top-color: rgba(42, 52, 72, 0.08); } body.kolbeh-body .account-orders-filter { background: #fff; border-color: rgba(42, 52, 72, 0.08); } body.kolbeh-body .account-orders-filter__tab { color: #64748b; } body.kolbeh-body .account-orders-filter__tab:hover { color: #1a2234; background: rgba(42, 52, 72, 0.04); } body.kolbeh-body .account-orders-filter__tab--active { color: #7a5c0f; background: rgba(201, 162, 39, 0.12); border-color: rgba(201, 162, 39, 0.28); } body.kolbeh-body .account-orders-filter__count { background: rgba(42, 52, 72, 0.08); } body.kolbeh-body .account-orders-filter__tab--active .account-orders-filter__count { background: rgba(201, 162, 39, 0.18); } body.kolbeh-body .account-orders-section--attention .account-orders-section__head { background: linear-gradient(135deg, #fff9eb 0%, #fffdf7 100%); border-color: rgba(245, 158, 11, 0.28); } body.kolbeh-body .account-orders-section--settled .account-orders-section__head { background: #f8fafc; border-color: rgba(42, 52, 72, 0.08); } body.kolbeh-body .account-orders-section__title { color: #1a2234; } body.kolbeh-body .account-orders-section__hint { color: #64748b; } body.kolbeh-body .account-orders-section__count { background: rgba(42, 52, 72, 0.08); color: #1a2234; } body.kolbeh-body .account-orders-section--attention .account-orders-section__count { background: rgba(245, 158, 11, 0.16); color: #92400e; } body.kolbeh-body .account-page-subtitle--alert { color: #92400e; background: rgba(245, 158, 11, 0.12); border-color: rgba(245, 158, 11, 0.24); } body.kolbeh-body .account-orders-filter__tab--attention:not(.account-orders-filter__tab--active) { color: #92400e; background: rgba(245, 158, 11, 0.1); border-color: rgba(245, 158, 11, 0.22); } body.kolbeh-body .account-wishlist-panel { padding: 0.85rem 1rem 1rem; } body.kolbeh-body .account-wishlist-list { display: flex; flex-direction: column; gap: 0.65rem; } body.kolbeh-body .account-wishlist-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.75rem; padding: 0.75rem 0.8rem; border-radius: 14px; border: 1px solid rgba(212, 175, 55, 0.14); background: linear-gradient( 135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 100% ); transition: opacity 0.22s ease, transform 0.22s ease, border-color 0.2s ease, box-shadow 0.2s ease; } body.kolbeh-body .account-wishlist-card.is-removing { opacity: 0; transform: scale(0.98); pointer-events: none; } body.kolbeh-body .account-wishlist-card__media { display: block; width: 4.5rem; height: 4.5rem; flex-shrink: 0; border-radius: 12px; overflow: hidden; background: rgba(8, 14, 28, 0.45); border: 1px solid rgba(212, 175, 55, 0.12); } body.kolbeh-body .account-wishlist-card__media img { width: 100%; height: 100%; object-fit: contain; padding: 0.25rem; } body.kolbeh-body .account-wishlist-card__body { min-width: 0; } body.kolbeh-body .account-wishlist-card__name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 0 0 0.35rem; font-size: 0.84rem; font-weight: 700; line-height: 1.45; color: #fff; text-decoration: none; } body.kolbeh-body .account-wishlist-card__name:hover, body.kolbeh-body .account-wishlist-card__name:focus-visible { color: var(--kolbeh-purple); } body.kolbeh-body .account-wishlist-card__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.35rem 0.5rem; margin-bottom: 0.3rem; } body.kolbeh-body .account-wishlist-card__price-current { font-size: 0.82rem; font-weight: 700; color: var(--kolbeh-purple); } body.kolbeh-body .account-wishlist-card__price-old { font-size: 0.72rem; color: rgba(255, 255, 255, 0.42); text-decoration: line-through; } body.kolbeh-body .account-wishlist-card__view-link { display: inline-flex; align-items: center; gap: 0.2rem; font-size: 0.7rem; font-weight: 600; color: rgba(232, 204, 106, 0.78); text-decoration: none; } body.kolbeh-body .account-wishlist-card__view-link:hover, body.kolbeh-body .account-wishlist-card__view-link:focus-visible { color: var(--kolbeh-purple); } body.kolbeh-body .account-wishlist-card__actions { display: flex; flex-direction: column; align-items: center; gap: 0.45rem; flex-shrink: 0; } body.kolbeh-body .account-wishlist-card__view-btn, body.kolbeh-body .account-wishlist-card__remove { display: inline-grid; place-items: center; width: 2.35rem; height: 2.35rem; padding: 0; border-radius: 10px; border: 1px solid rgba(212, 175, 55, 0.22); background: rgba(255, 255, 255, 0.06); color: rgba(255, 255, 255, 0.88); font-size: 0.95rem; line-height: 1; text-decoration: none; cursor: pointer; transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.18s ease; } body.kolbeh-body .account-wishlist-card__view-btn:hover, body.kolbeh-body .account-wishlist-card__view-btn:focus-visible { border-color: rgba(212, 175, 55, 0.38); background: rgba(212, 175, 55, 0.12); color: var(--kolbeh-purple); outline: none; } body.kolbeh-body .account-wishlist-card__remove { border-color: rgba(239, 68, 68, 0.28); background: rgba(239, 68, 68, 0.1); color: #fca5a5; } body.kolbeh-body .account-wishlist-card__remove:hover, body.kolbeh-body .account-wishlist-card__remove:focus-visible { border-color: rgba(239, 68, 68, 0.45); background: rgba(239, 68, 68, 0.18); color: #fecaca; outline: none; } body.kolbeh-body .account-wishlist-card__remove:active, body.kolbeh-body .account-wishlist-card__view-btn:active { transform: scale(0.96); } @media (min-width: 768px) { body.kolbeh-body .account-wishlist-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.85rem; } body.kolbeh-body .account-wishlist-card { grid-template-columns: minmax(0, 1fr); align-items: stretch; gap: 0.55rem; padding: 0.8rem; } body.kolbeh-body .account-wishlist-card__media { width: 100%; height: 5.25rem; } body.kolbeh-body .account-wishlist-card__name { -webkit-line-clamp: 2; font-size: 0.8rem; } body.kolbeh-body .account-wishlist-card__price { margin-bottom: 0; } body.kolbeh-body .account-wishlist-card__view-link { display: none; } body.kolbeh-body .account-wishlist-card__actions { flex-direction: row; justify-content: flex-end; gap: 0.45rem; margin-top: 0.15rem; padding-top: 0.55rem; border-top: 1px dashed rgba(212, 175, 55, 0.14); } body.kolbeh-body .account-wishlist-card__view-btn, body.kolbeh-body .account-wishlist-card__remove { width: 2.15rem; height: 2.15rem; font-size: 0.88rem; } } @media (min-width: 1200px) { body.kolbeh-body .account-wishlist-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 767.98px) { body.kolbeh-body .account-wishlist-card__actions .account-wishlist-card__view-btn { display: none; } } body.kolbeh-body .account-profile-form { display: flex; flex-direction: column; gap: 1rem; } body.kolbeh-body .account-profile-hero { display: flex; align-items: center; gap: 1rem; padding: 1.1rem 1.2rem; } body.kolbeh-body .account-profile-hero__avatar { display: inline-grid; place-items: center; width: 4.5rem; height: 4.5rem; flex-shrink: 0; border-radius: 50%; overflow: hidden; background: rgba(212, 175, 55, 0.12); border: 2px solid rgba(212, 175, 55, 0.38); color: var(--kolbeh-purple); font-size: 1.45rem; font-weight: 700; } body.kolbeh-body .account-profile-hero__avatar.has-photo img { width: 100%; height: 100%; object-fit: cover; } body.kolbeh-body .account-profile-hero__name { display: block; font-size: 1.02rem; font-weight: 700; color: #fff; line-height: 1.35; } body.kolbeh-body .account-profile-hero__phone { display: block; margin-top: 0.2rem; font-size: 0.8rem; color: rgba(255, 255, 255, 0.52); } body.kolbeh-body .account-profile-section__head { display: flex; align-items: flex-start; gap: 0.75rem; padding: 0.95rem 1.15rem; border-bottom: 1px solid rgba(212, 175, 55, 0.14); } body.kolbeh-body .account-profile-section__icon { display: inline-grid; place-items: center; width: 2.5rem; height: 2.5rem; flex-shrink: 0; border-radius: 12px; background: rgba(212, 175, 55, 0.12); border: 1px solid rgba(212, 175, 55, 0.28); color: var(--kolbeh-purple); font-size: 1.1rem; } body.kolbeh-body .account-profile-section__icon--security { background: rgba(59, 111, 217, 0.12); border-color: rgba(59, 111, 217, 0.28); color: #93c5fd; } body.kolbeh-body .account-profile-section__title { margin: 0; font-size: 0.92rem; font-weight: 700; color: var(--kolbeh-purple); line-height: 1.35; } body.kolbeh-body .account-profile-section__hint { margin: 0.3rem 0 0; font-size: 0.74rem; line-height: 1.55; color: rgba(255, 255, 255, 0.48); } body.kolbeh-body .account-profile-section__body { padding: 1rem 1.15rem 1.1rem; } body.kolbeh-body .account-profile-label-optional { font-weight: 500; opacity: 0.72; } body.kolbeh-body .account-profile-control--readonly { opacity: 0.82; cursor: not-allowed; background: rgba(8, 14, 28, 0.38) !important; border-color: rgba(212, 175, 55, 0.14) !important; } body.kolbeh-body .account-profile-form__actions { display: flex; justify-content: flex-end; padding-top: 0.15rem; } body.kolbeh-body .account-profile-form__submit { display: inline-flex; align-items: center; justify-content: center; gap: 0.45rem; min-width: min(100%, 11rem); min-height: 46px; padding: 0.55rem 1.35rem; border-radius: 12px; font-size: 0.88rem; font-weight: 700; } body.kolbeh-body .account-profile-form__submit > *, body.kolbeh-body .account-profile-form__submit i { position: relative; z-index: 4; color: #14100a; } @media (max-width: 575.98px) { body.kolbeh-body .account-profile-form__actions { justify-content: stretch; } body.kolbeh-body .account-profile-form__submit { width: 100%; } } body.kolbeh-body .account-address-add-btn { display: inline-flex; align-items: center; gap: 0.4rem; min-height: 42px; padding: 0.5rem 1rem; border-radius: 999px; font-size: 0.82rem; font-weight: 700; white-space: nowrap; } body.kolbeh-body .account-address-add-btn > *, body.kolbeh-body .account-address-add-btn .btn-shine-inner { position: relative; z-index: 4; color: #14100a; } body.kolbeh-body .account-address-list { display: flex; flex-direction: column; gap: 0.85rem; overflow: visible; } body.kolbeh-body .account-address-card { display: grid; grid-template-columns: auto 1fr auto; align-items: start; gap: 1rem 1.15rem; padding: 1.15rem 1.2rem; border-radius: 18px; border: 1px solid rgba(212, 175, 55, 0.22); background: linear-gradient( 165deg, rgba(18, 28, 52, 0.94) 0%, rgba(10, 18, 36, 0.97) 100% ); box-shadow: 0 14px 36px rgba(0, 0, 0, 0.32); overflow: visible; transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease; } body.kolbeh-body .account-address-card:hover { border-color: rgba(212, 175, 55, 0.34); box-shadow: 0 0 24px rgba(212, 175, 55, 0.1), 0 16px 40px rgba(0, 0, 0, 0.36); } body.kolbeh-body .account-address-card.is-default { border-color: rgba(212, 175, 55, 0.42); box-shadow: 0 0 28px rgba(212, 175, 55, 0.12), 0 16px 40px rgba(0, 0, 0, 0.36); } body.kolbeh-body .account-address-card__icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; flex-shrink: 0; background: rgba(212, 175, 55, 0.1); border: 1px solid rgba(212, 175, 55, 0.32); color: var(--kolbeh-purple); font-size: 1.35rem; box-shadow: 0 0 18px rgba(212, 175, 55, 0.14); } body.kolbeh-body .account-address-card.is-default .account-address-card__icon { background: rgba(212, 175, 55, 0.16); border-color: rgba(248, 220, 140, 0.42); } body.kolbeh-body .account-address-card__body { min-width: 0; } body.kolbeh-body .account-address-card__head { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 0.65rem; } body.kolbeh-body .account-address-card__name { margin: 0; font-size: 0.98rem; font-weight: 700; color: #fff; line-height: 1.35; } body.kolbeh-body .account-address-card__badge { display: inline-flex; align-items: center; padding: 0.24rem 0.62rem; border-radius: 999px; font-size: 0.72rem; font-weight: 600; color: var(--kolbeh-purple); background: rgba(212, 175, 55, 0.14); border: 1px solid rgba(212, 175, 55, 0.32); white-space: nowrap; } body.kolbeh-body .account-address-card__meta { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.42rem; } body.kolbeh-body .account-address-card__meta li { display: flex; align-items: flex-start; gap: 0.55rem; font-size: 0.84rem; color: rgba(255, 255, 255, 0.72); line-height: 1.55; } body.kolbeh-body .account-address-card__meta i { flex-shrink: 0; width: 1rem; margin-top: 0.15rem; color: rgba(232, 204, 106, 0.78); font-size: 0.88rem; } body.kolbeh-body .account-address-card__actions { display: flex; align-items: center; align-self: stretch; justify-content: flex-end; gap: 0.45rem; overflow: visible; direction: ltr; } body.kolbeh-body .account-address-card__delete-form { margin: 0; overflow: visible; } body.kolbeh-body .account-address-card__delete-form .elco-delete-btn, body.kolbeh-body .account-address-card__actions .elco-edit-btn { flex-shrink: 0; } @media (max-width: 767.98px) { body.kolbeh-body .account-address-card { grid-template-columns: auto 1fr; } body.kolbeh-body .account-address-card__actions { grid-column: 1 / -1; justify-content: flex-end; padding-top: 0.15rem; border-top: 1px solid rgba(212, 175, 55, 0.1); } body.kolbeh-body .account-page-head--split { align-items: stretch; } body.kolbeh-body .account-address-add-btn { width: 100%; justify-content: center; } } body.kolbeh-body:has(.address-modal-premium.show) .modal-backdrop.show { background: rgba(4, 8, 18, 0.84); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); } .address-modal-premium__dialog { max-width: min(92vw, 520px); } body.kolbeh-body .address-modal-premium .address-modal-premium__panel { position: relative; overflow: hidden; color-scheme: dark; border: none; border-radius: 22px; background: radial-gradient(ellipse 72% 88% at 50% 108%, rgba(212, 175, 55, 0.16), transparent 68%), var(--elco-tile-line-layer-thin), linear-gradient( 160deg, rgba(24, 38, 72, 0.99) 0%, rgba(16, 28, 54, 0.99) 48%, rgba(10, 18, 36, 0.99) 100% ); background-clip: border-box; color: rgba(255, 255, 255, 0.9); border: 1px solid rgba(212, 175, 55, 0.44); box-shadow: 0 0 48px rgba(212, 175, 55, 0.2), 0 28px 72px rgba(0, 0, 0, 0.62), inset 0 1px 0 rgba(255, 255, 255, 0.06); backdrop-filter: blur(18px) saturate(1.12); -webkit-backdrop-filter: blur(18px) saturate(1.12); transform: scale(0.96) translateY(14px); opacity: 0; transition: transform 0.32s cubic-bezier(0.34, 1.25, 0.64, 1), opacity 0.28s ease; } body.kolbeh-body .address-modal-premium.show .address-modal-premium__panel { transform: scale(1) translateY(0); opacity: 1; } body.kolbeh-body .address-modal-premium .address-modal-premium__panel::before, body.kolbeh-body .address-modal-premium .address-modal-premium__panel::after { content: ""; position: absolute; width: 140px; height: 140px; border-radius: 50%; background: radial-gradient(circle, rgba(212, 175, 55, 0.16), transparent 70%); pointer-events: none; z-index: 0; } body.kolbeh-body .address-modal-premium .address-modal-premium__panel::before { top: -52px; inset-inline-start: -36px; } body.kolbeh-body .address-modal-premium .address-modal-premium__panel::after { top: -48px; inset-inline-end: -40px; } .address-modal-premium__head, .address-modal-premium__body, .address-modal-premium__foot { position: relative; z-index: 1; } .address-modal-premium__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.85rem; padding: 1.4rem 1.5rem 0.85rem; border-bottom: 1px solid rgba(212, 175, 55, 0.16); background: transparent; } .address-modal-premium__brand { display: flex; align-items: center; gap: 0.85rem; min-width: 0; } .address-modal-premium__icon { display: grid; place-items: center; width: 52px; height: 52px; flex-shrink: 0; border-radius: 16px; background: rgba(212, 175, 55, 0.12); border: 1px solid rgba(212, 175, 55, 0.38); color: var(--kolbeh-purple); font-size: 1.35rem; box-shadow: 0 0 20px rgba(212, 175, 55, 0.18); } .address-modal-premium__titles { min-width: 0; } .address-modal-premium__title { margin: 0; font-size: clamp(1rem, 2.5vw, 1.12rem); font-weight: 700; color: #fff; line-height: 1.35; } body.kolbeh-body[data-lang="fa"] .address-modal-premium__title { letter-spacing: 0; } .address-modal-premium__subtitle { margin: 0.28rem 0 0; font-size: 0.78rem; color: rgba(255, 255, 255, 0.52); line-height: 1.5; } .address-modal-premium__close { display: inline-grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 1px solid rgba(212, 175, 55, 0.35); border-radius: 50%; background: rgba(10, 18, 36, 0.65); font-size: 0.9rem; line-height: 1; cursor: pointer; color: var(--kolbeh-purple); transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease; } .address-modal-premium__close:hover { border-color: rgba(248, 220, 140, 0.65); background: rgba(212, 175, 55, 0.12); box-shadow: 0 0 14px rgba(212, 175, 55, 0.25); color: var(--kolbeh-purple); } .address-modal-premium__body { padding: 1.15rem 1.5rem 0.5rem; } .address-modal-premium__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.85rem 0.9rem; } .address-modal-premium__grid--stack { grid-template-columns: 1fr; } .address-modal-premium__field--full { grid-column: 1 / -1; } .address-modal-premium__field--default { grid-column: 1 / -1; } .address-modal-premium__label { display: inline-flex; align-items: center; gap: 0.35rem; margin-bottom: 0.42rem; font-size: 0.74rem; font-weight: 600; color: rgba(232, 204, 106, 0.82); letter-spacing: 0.02em; } .address-modal-premium__label i { font-size: 0.82rem; opacity: 0.85; } .address-modal-premium__control { width: 100%; padding: 0.68rem 0.85rem; border-radius: 12px; border: 1px solid rgba(72, 96, 140, 0.38); background: rgba(10, 18, 36, 0.62); color: rgba(255, 255, 255, 0.92); font-size: 0.88rem; transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease; } .address-modal-premium__control::placeholder { color: rgba(255, 255, 255, 0.32); } .address-modal-premium__control:focus { outline: none; border-color: rgba(212, 175, 55, 0.58); background: rgba(15, 26, 50, 0.88); box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.14); color: #fff; } .address-modal-premium__control--textarea { min-height: 5.5rem; resize: vertical; } .address-modal-premium__panel .form-select.address-modal-premium__control { padding-inline-end: 2.2rem; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23d4af37' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: left 0.75rem center; background-size: 14px 10px; } body[data-dir="ltr"] .address-modal-premium__panel .form-select.address-modal-premium__control { background-position: right 0.75rem center; } .address-modal-premium__default { display: flex; align-items: center; gap: 0.75rem; margin: 0; padding: 0.82rem 1rem; border-radius: 12px; border: 1px solid rgba(212, 175, 55, 0.24); background: rgba(212, 175, 55, 0.07); cursor: pointer; transition: border-color 0.2s ease, background 0.2s ease; } .address-modal-premium__default:has(.address-modal-premium__checkbox:checked) { border-color: rgba(212, 175, 55, 0.48); background: rgba(212, 175, 55, 0.12); } .address-modal-premium__checkbox { width: 1.25rem; height: 1.25rem; margin: 0; flex-shrink: 0; border: 2px solid rgba(212, 175, 55, 0.55); border-radius: 0.35rem; background-color: rgba(10, 18, 36, 0.85); background-image: none; background-repeat: no-repeat; background-position: center; background-size: 0.85rem 0.85rem; cursor: pointer; transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease; appearance: none; -webkit-appearance: none; print-color-adjust: exact; } .address-modal-premium__checkbox:focus { outline: none; border-color: rgba(248, 220, 140, 0.75); box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.2); } .address-modal-premium__checkbox:checked { background-color: var(--kolbeh-purple); border-color: var(--kolbeh-purple); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%2314100a' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e"); } body.kolbeh-body #main-content .address-modal-premium .address-modal-premium__checkbox.form-check-input { width: 1.25rem; height: 1.25rem; border: 2px solid rgba(212, 175, 55, 0.55); border-radius: 0.35rem; background-color: rgba(10, 18, 36, 0.85); background-image: none; } body.kolbeh-body #main-content .address-modal-premium .address-modal-premium__checkbox.form-check-input:checked { background-color: var(--kolbeh-purple); border-color: var(--kolbeh-purple); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%2314100a' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e"); background-size: 0.85rem 0.85rem; background-repeat: no-repeat; background-position: center; } .address-modal-premium__default-title { font-size: 0.86rem; font-weight: 600; color: rgba(255, 255, 255, 0.88); } .address-modal-premium__foot { display: flex; gap: 0.75rem; padding: 1rem 1.5rem 1.4rem; border-top: 1px solid rgba(212, 175, 55, 0.14); background: transparent; } .address-modal-premium__foot .btn { flex: 1; min-height: 46px; border-radius: 12px; font-size: 0.88rem; font-weight: 700; } body.kolbeh-body .address-modal-premium__cancel { border-color: rgba(212, 175, 55, 0.32); color: rgba(255, 255, 255, 0.82); background: rgba(10, 18, 36, 0.55); } body.kolbeh-body .address-modal-premium__cancel:hover, body.kolbeh-body .address-modal-premium__cancel:focus { color: #fff8e8 !important; border-color: rgba(212, 175, 55, 0.5); background: rgba(212, 175, 55, 0.1); } body.kolbeh-body .address-modal-premium__submit { color: #14100a; } body.kolbeh-body .address-modal-premium__submit::after { background: var(--btn-primary-bg); } body.kolbeh-body .address-modal-premium__submit .btn-shine-inner, body.kolbeh-body .address-modal-premium__submit > * { position: relative; z-index: 4; color: #14100a; } body.kolbeh-body .address-modal-premium__cancel .btn-shine-inner, body.kolbeh-body .address-modal-premium__cancel > * { position: relative; z-index: 4; } .address-modal-premium__sheet-handle { display: none; } @media (max-width: 991.98px) { .address-modal-premium.modal .address-modal-premium__dialog.modal-dialog-centered { align-items: flex-end; min-height: 100%; margin: 0; max-width: 100%; width: 100%; padding: 0; } body.kolbeh-body .address-modal-premium .address-modal-premium__panel { display: flex; flex-direction: column; width: 100%; max-height: min(92dvh, 720px); border-radius: 20px 20px 0 0; transform: translateY(100%); transition: transform 0.32s cubic-bezier(0.32, 0.72, 0, 1); } body.kolbeh-body .address-modal-premium.show .address-modal-premium__panel { transform: translateY(0); } body.kolbeh-body .address-modal-premium.is-dragging .address-modal-premium__panel { transition: none; } .address-modal-premium__sheet-handle { display: block; width: 2.6rem; height: 0.24rem; margin: 0.55rem auto 0; border-radius: 999px; background: rgba(12, 24, 51, 0.14); flex-shrink: 0; touch-action: none; } html[data-color-scheme="dark"] .address-modal-premium__sheet-handle { background: rgba(255, 255, 255, 0.18); } .address-modal-premium__head { touch-action: none; align-items: center; flex-shrink: 0; padding: 0.35rem 1rem 0.65rem; gap: 0.55rem; } .address-modal-premium__brand { gap: 0.6rem; } .address-modal-premium__icon { width: 2.35rem; height: 2.35rem; border-radius: 11px; font-size: 1rem; box-shadow: none; } .address-modal-premium__title { font-size: 0.92rem; } .address-modal-premium__subtitle { margin-top: 0.15rem; font-size: 0.68rem; line-height: 1.35; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; } .address-modal-premium__close { width: 2rem; height: 2rem; font-size: 0.78rem; } .address-modal-premium__body { flex: 1 1 auto; min-height: 0; padding: 0.65rem 1rem 0.35rem; overflow-y: auto; -webkit-overflow-scrolling: touch; } .address-modal-premium__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem 0.55rem; } .address-modal-premium__field--full, .address-modal-premium__field--default, .address-modal-premium__grid .address-modal-premium__field:has(.address-modal-premium__control--textarea) { grid-column: 1 / -1; } .address-modal-premium__label { margin-bottom: 0.28rem; font-size: 0.68rem; } .address-modal-premium__label i { font-size: 0.72rem; } .address-modal-premium__control { padding: 0.5rem 0.65rem; font-size: 0.8rem; border-radius: 10px; } .address-modal-premium__control--textarea { min-height: 3.25rem; } .address-modal-premium__default { gap: 0.55rem; padding: 0.55rem 0.7rem; border-radius: 10px; } .address-modal-premium__default-title { font-size: 0.78rem; } .address-modal-premium__checkbox, body.kolbeh-body #main-content .address-modal-premium .address-modal-premium__checkbox.form-check-input { width: 1.1rem; height: 1.1rem; } .address-modal-premium__foot { flex-shrink: 0; flex-direction: row; gap: 0.55rem; padding: 0.65rem 1rem calc(0.75rem + env(safe-area-inset-bottom, 0px)); } .address-modal-premium__foot .btn { min-height: 40px; font-size: 0.8rem; border-radius: 10px; } } @media (max-width: 575.98px) { .address-modal-premium__subtitle { display: none; } } body.kolbeh-body .account-address-add-btn > *, body.kolbeh-body .account-address-add-btn .btn-shine-inner, body.kolbeh-body .account-empty__btn > *, body.kolbeh-body .account-empty__btn .btn-shine-inner { color: #ffffff !important; } body.kolbeh-body:has(.address-modal-premium.show) .modal-backdrop.show { background: rgba(12, 24, 51, 0.52); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); } body.kolbeh-body .address-modal-premium .address-modal-premium__panel { color-scheme: light; color: #0c1833; overflow: hidden; background: #ffffff; border: 1px solid rgba(12, 18, 36, 0.16); box-shadow: 0 24px 56px rgba(12, 24, 48, 0.16), 0 8px 20px rgba(12, 24, 48, 0.08); } body.kolbeh-body .address-modal-premium .address-modal-premium__panel::before { top: 0; inset-inline-start: 0; inset-inline-end: 0; width: auto; height: 4px; border-radius: 0; background: linear-gradient( 90deg, rgba(201, 162, 39, 0.35), rgba(184, 134, 11, 0.92), rgba(201, 162, 39, 0.35) ); } body.kolbeh-body .address-modal-premium .address-modal-premium__panel::after { top: -60px; inset-inline-end: -50px; width: 160px; height: 160px; background: radial-gradient(circle, rgba(201, 162, 39, 0.12), transparent 70%); opacity: 0.85; } html[data-color-scheme="light"] .address-modal-premium__head { border-bottom-color: rgba(12, 18, 36, 0.1); background: linear-gradient(180deg, rgba(248, 250, 252, 0.95) 0%, rgba(255, 255, 255, 0) 100%); padding-top: 0.35rem; } html[data-color-scheme="light"] .address-modal-premium__icon { background: linear-gradient(145deg, rgba(201, 162, 39, 0.22) 0%, rgba(255, 247, 214, 0.72) 100%); border: 2px solid rgba(12, 18, 36, 0.28); color: #0f1a32; box-shadow: 0 4px 16px rgba(201, 162, 39, 0.14); } html[data-color-scheme="light"] .address-modal-premium__title { color: #0c1833; font-size: 1.08rem; } html[data-color-scheme="light"] .address-modal-premium__subtitle { color: #5c6370; font-size: 0.82rem; } html[data-color-scheme="light"] .address-modal-premium__close { background: #ffffff; border-color: rgba(12, 18, 36, 0.18); color: #5c6370; box-shadow: 0 2px 8px rgba(12, 24, 48, 0.06); } html[data-color-scheme="light"] .address-modal-premium__close:hover { border-color: rgba(12, 18, 36, 0.32); background: #f8fafc; color: #0c1833; box-shadow: 0 4px 12px rgba(12, 24, 48, 0.08); } html[data-color-scheme="light"] .address-modal-premium__body { background: #ffffff; } html[data-color-scheme="light"] .address-modal-premium__label { color: #5c6370; font-size: 0.78rem; } html[data-color-scheme="light"] .address-modal-premium__control { background: #f8fafc; border-color: rgba(12, 18, 36, 0.18); color: #0c1833; font-size: 0.9rem; } html[data-color-scheme="light"] .address-modal-premium__control::placeholder { color: rgba(12, 24, 51, 0.42); } html[data-color-scheme="light"] .address-modal-premium__control:focus { border-color: rgba(12, 18, 36, 0.42); box-shadow: 0 0 0 3px rgba(12, 18, 36, 0.1); background: #ffffff; } html[data-color-scheme="light"] .address-modal-premium__panel .form-select.address-modal-premium__control { background-color: #f8fafc; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%230c1833' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); } html[data-color-scheme="light"] .address-modal-premium__default { border-color: rgba(12, 18, 36, 0.16); background: rgba(248, 250, 252, 0.9); } html[data-color-scheme="light"] .address-modal-premium__default:has(.address-modal-premium__checkbox:checked) { border-color: rgba(12, 18, 36, 0.32); background: rgba(241, 245, 249, 0.95); } body.kolbeh-body #main-content .address-modal-premium .address-modal-premium__checkbox.form-check-input, html[data-color-scheme="light"] .address-modal-premium__checkbox { border: 2px solid rgba(12, 18, 36, 0.28); background-color: #ffffff; background-image: none; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.8); } body.kolbeh-body #main-content .address-modal-premium .address-modal-premium__checkbox.form-check-input:checked, html[data-color-scheme="light"] .address-modal-premium__checkbox:checked { background-color: #0f1a32; border-color: #0c1224; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e"); background-size: 0.85rem 0.85rem; background-repeat: no-repeat; background-position: center; box-shadow: 0 2px 8px rgba(12, 18, 36, 0.18); } body.kolbeh-body #main-content .address-modal-premium .address-modal-premium__checkbox.form-check-input:focus, html[data-color-scheme="light"] .address-modal-premium__checkbox:focus { border-color: rgba(12, 18, 36, 0.45); box-shadow: 0 0 0 3px rgba(12, 18, 36, 0.12); } html[data-color-scheme="light"] .address-modal-premium__default-title { color: #0c1833; } html[data-color-scheme="light"] .address-modal-premium__foot { border-top-color: rgba(72, 96, 140, 0.12); background: linear-gradient(0deg, rgba(248, 250, 252, 0.9) 0%, rgba(255, 255, 255, 0) 100%); } body.kolbeh-body .address-modal-premium__cancel { color: #0c1833; background: #ffffff; border-color: rgba(12, 18, 36, 0.2) !important; box-shadow: 0 2px 6px rgba(12, 24, 48, 0.05); } body.kolbeh-body .address-modal-premium__cancel:hover, body.kolbeh-body .address-modal-premium__cancel:focus { color: #0c1833 !important; background: #f8fafc !important; border-color: rgba(12, 18, 36, 0.32) !important; } body.kolbeh-body .address-modal-premium__submit > *, body.kolbeh-body .address-modal-premium__submit .btn-shine-inner { color: #ffffff !important; } body.kolbeh-body .account-address-list { gap: 1rem; } body.kolbeh-body .account-address-card { position: relative; background: #ffffff; border: 1px solid rgba(72, 96, 140, 0.2); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.95) inset, 0 10px 32px rgba(12, 24, 48, 0.09), 0 2px 6px rgba(12, 24, 48, 0.04); } body.kolbeh-body .account-address-card::before { content: ""; position: absolute; top: 0; right: 1.15rem; left: 1.15rem; height: 3px; border-radius: 0 0 4px 4px; background: linear-gradient( 90deg, rgba(201, 162, 39, 0.25), rgba(201, 162, 39, 0.75), rgba(201, 162, 39, 0.25) ); pointer-events: none; } body.kolbeh-body .account-address-card:hover { border-color: rgba(201, 162, 39, 0.34); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.95) inset, 0 16px 40px rgba(12, 24, 48, 0.11), 0 0 0 1px rgba(201, 162, 39, 0.08); } body.kolbeh-body .account-address-card.is-default { border-color: rgba(201, 162, 39, 0.42); background: linear-gradient(168deg, #fffef8 0%, #fff9eb 42%, #ffffff 100%); box-shadow: 0 0 0 1px rgba(201, 162, 39, 0.14), 0 14px 38px rgba(12, 24, 48, 0.1); } body.kolbeh-body .account-address-card.is-default::before { background: linear-gradient( 90deg, rgba(201, 162, 39, 0.45), rgba(184, 134, 11, 0.95), rgba(201, 162, 39, 0.45) ); } body.kolbeh-body .account-address-card__icon { background: linear-gradient(145deg, rgba(201, 162, 39, 0.16) 0%, rgba(201, 162, 39, 0.08) 100%); border-color: rgba(201, 162, 39, 0.35); color: #7a5c0f; box-shadow: 0 4px 14px rgba(201, 162, 39, 0.12); } body.kolbeh-body .account-address-card.is-default .account-address-card__icon { background: linear-gradient(145deg, rgba(201, 162, 39, 0.22) 0%, rgba(201, 162, 39, 0.12) 100%); border-color: rgba(184, 134, 11, 0.42); color: #6b4f0a; } body.kolbeh-body .account-address-card__name { color: #0c1833; font-size: 1.02rem; } body.kolbeh-body .account-address-card__badge { color: #5c4608; background: rgba(201, 162, 39, 0.16); border-color: rgba(201, 162, 39, 0.38); font-weight: 700; } body.kolbeh-body .account-address-card__meta li { color: #2a3448; font-size: 0.875rem; line-height: 1.6; } body.kolbeh-body .account-address-card__meta li + li { padding-top: 0.42rem; border-top: 1px solid rgba(72, 96, 140, 0.08); } body.kolbeh-body .account-address-card__meta i { color: #8a6a12; font-size: 0.92rem; } body.kolbeh-body .account-address-card__actions { border-top: none; } @media (max-width: 767.98px) { body.kolbeh-body .account-address-card__actions { border-top-color: rgba(72, 96, 140, 0.12); } } body.kolbeh-body .account-recent-order-card--ticket-open { --order-accent: #60a5fa; } body.kolbeh-body .account-recent-order-card--ticket-waiting { --order-accent: #fbbf24; } body.kolbeh-body .account-recent-order-card--ticket-answered { --order-accent: #34d399; } body.kolbeh-body .account-recent-order-card--ticket-closed { --order-accent: #94a3b8; } body.kolbeh-body .account-ticket-card__id { font-size: 0.78rem; font-weight: 700; letter-spacing: 0.03em; color: rgba(255, 255, 255, 0.72); } body.kolbeh-body .account-ticket-card__subject { margin: 0.38rem 0 0; font-size: 0.84rem; font-weight: 700; line-height: 1.45; color: #fff; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } body.kolbeh-body .account-ticket-card__go { min-height: 1.5rem; } body.kolbeh-body .account-ticket-subject-link { color: #fff; font-weight: 600; text-decoration: none; } body.kolbeh-body .account-ticket-subject-link:hover, body.kolbeh-body .account-ticket-subject-link:focus { color: var(--kolbeh-purple) !important; } body.kolbeh-body .account-ticket-subject-link { color: #0c1833; } body.kolbeh-body .account-ticket-subject-link:hover, body.kolbeh-body .account-ticket-subject-link:focus { color: #6b5418 !important; } body.kolbeh-body .account-ticket-detail { display: flex; flex-direction: column; gap: 1.15rem; } body.kolbeh-body .account-ticket-hero { position: relative; padding: 1.2rem 1.25rem 1.1rem; border-radius: 18px; border: 1px solid rgba(212, 175, 55, 0.28); background: linear-gradient(165deg, rgba(22, 34, 64, 0.96) 0%, rgba(12, 20, 38, 0.98) 100%); box-shadow: 0 0 24px rgba(212, 175, 55, 0.1), 0 16px 40px rgba(0, 0, 0, 0.35); overflow: hidden; } body.kolbeh-body .account-ticket-hero__main { display: flex; align-items: flex-start; gap: 1rem; flex-wrap: wrap; padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid rgba(212, 175, 55, 0.14); } body.kolbeh-body .account-ticket-hero__icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; flex-shrink: 0; background: rgba(212, 175, 55, 0.12); border: 1px solid rgba(212, 175, 55, 0.32); color: var(--kolbeh-purple); font-size: 1.35rem; box-shadow: 0 0 18px rgba(212, 175, 55, 0.14); } body.kolbeh-body .account-ticket-hero__info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0.2rem; } body.kolbeh-body .account-ticket-hero__label { font-size: 0.72rem; font-weight: 600; color: rgba(232, 204, 106, 0.72); } body.kolbeh-body .account-ticket-hero__subject { font-size: 1rem; font-weight: 700; color: #fff; line-height: 1.45; } body.kolbeh-body .account-ticket-hero__id { font-size: 0.76rem; color: rgba(255, 255, 255, 0.45); letter-spacing: 0.03em; } body.kolbeh-body .account-ticket-hero__badges { display: flex; align-items: center; gap: 0.45rem; flex-wrap: wrap; } body.kolbeh-body .account-ticket-hero__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.75rem; } body.kolbeh-body .account-ticket-stat { display: flex; align-items: flex-start; gap: 0.7rem; padding: 0.8rem 0.85rem; border-radius: 14px; background: rgba(10, 18, 36, 0.55); border: 1px solid rgba(212, 175, 55, 0.14); } body.kolbeh-body .account-ticket-stat--highlight { background: rgba(212, 175, 55, 0.1); border-color: rgba(212, 175, 55, 0.28); } body.kolbeh-body .account-ticket-stat__icon { display: grid; place-items: center; width: 2.1rem; height: 2.1rem; border-radius: 10px; flex-shrink: 0; background: rgba(212, 175, 55, 0.1); border: 1px solid rgba(212, 175, 55, 0.22); color: var(--kolbeh-purple); font-size: 0.95rem; } body.kolbeh-body .account-ticket-stat__body { min-width: 0; display: flex; flex-direction: column; gap: 0.1rem; } body.kolbeh-body .account-ticket-stat__label { font-size: 0.68rem; font-weight: 600; color: rgba(232, 204, 106, 0.68); } body.kolbeh-body .account-ticket-stat__value { font-size: 0.88rem; font-weight: 700; color: #fff; line-height: 1.35; } body.kolbeh-body .account-ticket-stat__sub { font-size: 0.7rem; color: rgba(255, 255, 255, 0.42); } body.kolbeh-body .account-badge--ticket-open { color: #93c5fd; background: rgba(147, 197, 253, 0.12); border-color: rgba(147, 197, 253, 0.28); } body.kolbeh-body .account-badge--ticket-waiting { color: #fcd34d; background: rgba(252, 211, 77, 0.12); border-color: rgba(252, 211, 77, 0.28); } body.kolbeh-body .account-badge--ticket-answered { color: #6ee7b7; background: rgba(110, 231, 183, 0.12); border-color: rgba(110, 231, 183, 0.28); } body.kolbeh-body .account-badge--ticket-closed { color: rgba(255, 255, 255, 0.62); background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.12); } body.kolbeh-body .account-badge--ticket-priority-high { color: #fca5a5; background: rgba(252, 165, 165, 0.12); border-color: rgba(252, 165, 165, 0.28); } body.kolbeh-body .account-badge--ticket-priority-medium { color: #fcd34d; background: rgba(252, 211, 77, 0.12); border-color: rgba(252, 211, 77, 0.28); } body.kolbeh-body .account-badge--ticket-priority-low { color: rgba(255, 255, 255, 0.72); background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.12); } body.kolbeh-body .account-wallet-balance { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; padding: 1.1rem 1.2rem; border-radius: 18px; border: 1px solid rgba(212, 175, 55, 0.32); background: radial-gradient(ellipse 80% 120% at 100% 0%, rgba(212, 175, 55, 0.14), transparent 58%), linear-gradient(165deg, rgba(22, 34, 64, 0.96) 0%, rgba(12, 20, 38, 0.98) 100%); box-shadow: 0 0 24px rgba(212, 175, 55, 0.1), 0 16px 40px rgba(0, 0, 0, 0.35); } body.kolbeh-body .account-wallet-balance__icon { display: grid; place-items: center; width: 3.25rem; height: 3.25rem; flex-shrink: 0; border-radius: 14px; background: rgba(212, 175, 55, 0.12); border: 1px solid rgba(212, 175, 55, 0.34); color: var(--kolbeh-purple); font-size: 1.35rem; box-shadow: 0 0 18px rgba(212, 175, 55, 0.14); } body.kolbeh-body .account-wallet-balance__info { display: flex; flex-direction: column; gap: 0.2rem; min-width: 0; } body.kolbeh-body .account-wallet-balance__label { font-size: 0.76rem; font-weight: 600; color: rgba(255, 255, 255, 0.52); } body.kolbeh-body .account-wallet-balance__value { font-size: clamp(1.35rem, 4.5vw, 1.75rem); font-weight: 800; line-height: 1.2; color: var(--kolbeh-purple); letter-spacing: 0.01em; } body.kolbeh-body .account-wallet-panel .account-panel__head { padding: 0.95rem 1.15rem; border-bottom: 1px solid rgba(212, 175, 55, 0.14); } body.kolbeh-body .account-wallet-transactions { padding: 0.75rem 0.9rem 0.9rem; } body.kolbeh-body .account-wallet-tx-card { --tx-accent: #d4af37; display: flex; align-items: flex-start; justify-content: space-between; gap: 0.65rem; padding: 0.75rem 0.85rem 0.75rem 0.95rem; border-radius: 14px; border: 1px solid rgba(212, 175, 55, 0.14); background: linear-gradient( 135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 100% ); box-shadow: inset 3px 0 0 var(--tx-accent); } body.kolbeh-body .account-wallet-tx-card--deposit { --tx-accent: #34d399; } body.kolbeh-body .account-wallet-tx-card--withdrawal { --tx-accent: #f87171; } body.kolbeh-body .account-wallet-tx-card__main { min-width: 0; flex: 1 1 auto; } body.kolbeh-body .account-wallet-tx-card__top { display: flex; align-items: center; flex-wrap: wrap; gap: 0.3rem 0.45rem; } body.kolbeh-body .account-wallet-tx-card__desc { margin: 0.35rem 0 0; font-size: 0.8rem; font-weight: 600; line-height: 1.45; color: rgba(255, 255, 255, 0.88); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } body.kolbeh-body .account-wallet-tx-card__date { display: block; margin-top: 0.28rem; font-size: 0.7rem; line-height: 1.35; color: rgba(255, 255, 255, 0.44); } body.kolbeh-body .account-wallet-tx-card__aside { flex-shrink: 0; padding-top: 0.1rem; } body.kolbeh-body .account-wallet-tx-card__amount { font-size: 0.84rem; font-weight: 800; white-space: nowrap; letter-spacing: 0.01em; } body.kolbeh-body .account-wallet-tx-card__amount--deposit { color: #6ee7b7; } body.kolbeh-body .account-wallet-tx-card__amount--withdrawal { color: #fca5a5; } body.kolbeh-body .account-badge--wallet-deposit { color: #6ee7b7; background: rgba(110, 231, 183, 0.12); border-color: rgba(110, 231, 183, 0.28); } body.kolbeh-body .account-badge--wallet-withdrawal { color: #fca5a5; background: rgba(252, 165, 165, 0.12); border-color: rgba(252, 165, 165, 0.28); } body.kolbeh-body .account-badge--wallet-completed { color: #6ee7b7; background: rgba(110, 231, 183, 0.12); border-color: rgba(110, 231, 183, 0.28); } body.kolbeh-body .account-badge--wallet-pending { color: #fcd34d; background: rgba(252, 211, 77, 0.12); border-color: rgba(252, 211, 77, 0.28); } body.kolbeh-body .account-wallet-panel__body { padding: 1.15rem 1.25rem 1.25rem; } body.kolbeh-body .account-wallet-info { display: flex; align-items: flex-start; gap: 0.85rem; margin-bottom: 1.25rem; padding: 0.95rem 1rem; border-radius: 14px; border: 1px solid rgba(212, 175, 55, 0.22); background: rgba(212, 175, 55, 0.08); } body.kolbeh-body .account-wallet-info__icon { display: grid; place-items: center; width: 2.35rem; height: 2.35rem; flex-shrink: 0; border-radius: 10px; background: rgba(212, 175, 55, 0.14); color: var(--kolbeh-purple); font-size: 1.1rem; } body.kolbeh-body .account-wallet-info__text { margin: 0; font-size: 0.84rem; line-height: 1.65; color: rgba(255, 255, 255, 0.82); } body.kolbeh-body .account-wallet-info__text strong { color: var(--kolbeh-purple); font-weight: 800; } body.kolbeh-body .account-wallet-alert { margin-bottom: 1rem; padding: 0.85rem 1rem; border-radius: 12px; font-size: 0.82rem; line-height: 1.55; } body.kolbeh-body .account-wallet-alert--warning { color: #fcd34d; background: rgba(252, 211, 77, 0.1); border: 1px solid rgba(252, 211, 77, 0.28); } body.kolbeh-body .account-wallet-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 1.1rem; } body.kolbeh-body .account-wallet-form__field { display: flex; flex-direction: column; gap: 0.4rem; min-width: 0; } body.kolbeh-body .account-wallet-form__field--full { grid-column: 1 / -1; } body.kolbeh-body .account-wallet-form__label { margin: 0; font-size: 0.78rem; font-weight: 700; color: rgba(255, 255, 255, 0.72); } body.kolbeh-body .account-wallet-form__label .text-danger { color: #fca5a5; } body.kolbeh-body .account-wallet-form__control, body.kolbeh-body .account-wallet-form .form-control { min-height: 2.65rem; padding: 0.55rem 0.85rem; border-radius: 12px; border: 1px solid rgba(212, 175, 55, 0.22); background: rgba(255, 255, 255, 0.05); color: rgba(255, 255, 255, 0.92); font-size: 0.88rem; transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease; } body.kolbeh-body .account-wallet-form__control:focus, body.kolbeh-body .account-wallet-form .form-control:focus { border-color: rgba(212, 175, 55, 0.48); background: rgba(255, 255, 255, 0.08); box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.12); color: #fff; } body.kolbeh-body .account-wallet-form__control:disabled, body.kolbeh-body .account-wallet-form .form-control:disabled { opacity: 0.65; cursor: not-allowed; } body.kolbeh-body .account-wallet-form__control--readonly { background: rgba(255, 255, 255, 0.03); color: rgba(255, 255, 255, 0.68); } body.kolbeh-body .account-wallet-sheba-group { display: flex; align-items: stretch; border-radius: 12px; overflow: hidden; border: 1px solid rgba(212, 175, 55, 0.22); background: rgba(255, 255, 255, 0.05); } body.kolbeh-body .account-wallet-sheba-group:focus-within { border-color: rgba(212, 175, 55, 0.48); box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.12); } body.kolbeh-body .account-wallet-sheba-group__prefix { display: flex; align-items: center; padding: 0 0.85rem; font-size: 0.84rem; font-weight: 700; color: var(--kolbeh-purple); background: rgba(212, 175, 55, 0.1); border-inline-end: 1px solid rgba(212, 175, 55, 0.18); white-space: nowrap; } body.kolbeh-body .account-wallet-sheba-group .form-control { border: 0; border-radius: 0; background: transparent; box-shadow: none; } body.kolbeh-body .account-wallet-sheba-group .form-control:focus { box-shadow: none; } body.kolbeh-body .account-wallet-amount-group { display: flex; align-items: stretch; gap: 0.45rem; } body.kolbeh-body .account-wallet-amount-group .form-control { flex: 1 1 auto; min-width: 0; } body.kolbeh-body .account-wallet-max-btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.35rem; flex-shrink: 0; min-height: 2.65rem; padding: 0 0.95rem; border-radius: 12px; border: 1px solid rgba(212, 175, 55, 0.28); background: rgba(212, 175, 55, 0.1); color: var(--kolbeh-purple); font-size: 0.78rem; font-weight: 700; white-space: nowrap; transition: background 0.2s ease, border-color 0.2s ease, transform 0.15s ease; } body.kolbeh-body .account-wallet-max-btn:hover:not(:disabled), body.kolbeh-body .account-wallet-max-btn:focus-visible:not(:disabled) { background: rgba(212, 175, 55, 0.18); border-color: rgba(212, 175, 55, 0.42); } body.kolbeh-body .account-wallet-max-btn:disabled { opacity: 0.55; cursor: not-allowed; } body.kolbeh-body .account-wallet-form__hint { margin: 0; font-size: 0.72rem; line-height: 1.5; color: rgba(255, 255, 255, 0.46); } body.kolbeh-body .account-wallet-form__actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; padding-top: 0.25rem; } body.kolbeh-body .account-wallet-submit { display: inline-flex; align-items: center; gap: 0.45rem; min-height: 2.75rem; padding: 0.65rem 1.35rem; border-radius: 999px; font-size: 0.86rem; font-weight: 700; } body.kolbeh-body .account-wallet-panel .account-panel__title i { margin-inline-end: 0.35rem; color: var(--kolbeh-purple); } @media (max-width: 767.98px) { body.kolbeh-body .account-wallet-balance { gap: 0.75rem; margin-bottom: 0.85rem; padding: 0.85rem 1rem; border-radius: 16px; } body.kolbeh-body .account-wallet-balance__icon { width: 2.65rem; height: 2.65rem; border-radius: 12px; font-size: 1.1rem; } body.kolbeh-body .account-wallet-balance__label { font-size: 0.7rem; } body.kolbeh-body .account-wallet-balance__value { font-size: 1.25rem; } body.kolbeh-body .account-wallet-panel .account-panel__head { padding: 0.8rem 1rem; } body.kolbeh-body .account-wallet-panel .account-panel__title { font-size: 0.88rem; } body.kolbeh-body .account-wallet-transactions { gap: 0.45rem; padding: 0.65rem 0.75rem 0.75rem; } body.kolbeh-body .account-wallet-tx-card { padding: 0.65rem 0.75rem 0.65rem 0.85rem; border-radius: 12px; } body.kolbeh-body .account-wallet-tx-card__desc { font-size: 0.76rem; } body.kolbeh-body .account-wallet-tx-card__amount { font-size: 0.78rem; } body.kolbeh-body .account-wallet-form { grid-template-columns: 1fr; } body.kolbeh-body .account-wallet-panel__body { padding: 0.95rem 1rem 1rem; } body.kolbeh-body .account-wallet-amount-group { flex-direction: column; } body.kolbeh-body .account-wallet-max-btn { width: 100%; } body.kolbeh-body .account-wallet-form__actions { justify-content: stretch; } body.kolbeh-body .account-wallet-submit { width: 100%; justify-content: center; } body.kolbeh-body .account-badge { padding: 0.22rem 0.5rem; font-size: 0.68rem; } } body.kolbeh-body .account-notifications-panel { padding: 0.75rem 0.9rem 0.9rem; } body.kolbeh-body .account-notification-list { display: flex; flex-direction: column; gap: 0.55rem; } body.kolbeh-body .account-notification-card { --notif-accent: rgba(212, 175, 55, 0.55); position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.75rem; padding: 0.85rem 0.95rem; border-radius: 14px; border: 1px solid rgba(212, 175, 55, 0.14); background: linear-gradient( 135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 100% ); color: inherit; text-decoration: none; transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease; } body.kolbeh-body .account-notification-card--linked { cursor: pointer; } body.kolbeh-body .account-notification-card--linked:hover, body.kolbeh-body .account-notification-card--linked:focus-visible { transform: translateY(-1px); border-color: rgba(212, 175, 55, 0.28); background: rgba(212, 175, 55, 0.06); outline: none; box-shadow: 0 8px 22px rgba(0, 0, 0, 0.18); } body.kolbeh-body .account-notification-card--unread { border-color: rgba(212, 175, 55, 0.32); background: linear-gradient(135deg, rgba(212, 175, 55, 0.1) 0%, rgba(255, 255, 255, 0.03) 100%); box-shadow: inset 3px 0 0 var(--notif-accent), 0 0 18px rgba(212, 175, 55, 0.08); } body.kolbeh-body .account-notification-card--unread.account-notification-card--linked:hover, body.kolbeh-body .account-notification-card--unread.account-notification-card--linked:focus-visible { box-shadow: inset 3px 0 0 var(--kolbeh-purple), 0 8px 22px rgba(0, 0, 0, 0.2); } body.kolbeh-body .account-notification-card__icon { display: grid; place-items: center; width: 2.65rem; height: 2.65rem; flex-shrink: 0; border-radius: 12px; background: rgba(212, 175, 55, 0.1); border: 1px solid rgba(212, 175, 55, 0.24); color: rgba(232, 204, 106, 0.82); font-size: 1.1rem; } body.kolbeh-body .account-notification-card--unread .account-notification-card__icon { background: rgba(212, 175, 55, 0.16); border-color: rgba(212, 175, 55, 0.38); color: var(--kolbeh-purple); box-shadow: 0 0 14px rgba(212, 175, 55, 0.16); } body.kolbeh-body .account-notification-card__main { min-width: 0; } body.kolbeh-body .account-notification-card__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.65rem; } body.kolbeh-body .account-notification-card__title { margin: 0; font-size: 0.86rem; font-weight: 700; line-height: 1.4; color: #fff; } body.kolbeh-body .account-notification-card__date { flex-shrink: 0; font-size: 0.68rem; line-height: 1.35; color: rgba(255, 255, 255, 0.42); white-space: nowrap; } body.kolbeh-body .account-notification-card__message { margin: 0.35rem 0 0; font-size: 0.78rem; line-height: 1.55; color: rgba(255, 255, 255, 0.62); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; } body.kolbeh-body .account-notification-card__action { display: inline-flex; align-items: center; gap: 0.25rem; margin-top: 0.45rem; font-size: 0.72rem; font-weight: 700; color: var(--kolbeh-purple); } body.kolbeh-body .account-notification-card--linked:hover .account-notification-card__action, body.kolbeh-body .account-notification-card--linked:focus-visible .account-notification-card__action { color: #fff; } body.kolbeh-body .account-notification-card__action i { font-size: 0.68rem; transition: transform 0.2s ease; } body.kolbeh-body .account-notification-card--linked:hover .account-notification-card__action i, body.kolbeh-body .account-notification-card--linked:focus-visible .account-notification-card__action i { transform: translateX(-2px); } body.kolbeh-body[data-dir="ltr"] .account-notification-card--linked:hover .account-notification-card__action i, body.kolbeh-body[data-dir="ltr"] .account-notification-card--linked:focus-visible .account-notification-card__action i { transform: translateX(2px); } body.kolbeh-body .account-notification-card__dot { position: absolute; top: 0.85rem; inset-inline-end: 0.85rem; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--kolbeh-purple); box-shadow: 0 0 10px rgba(212, 175, 55, 0.65); } @media (max-width: 767.98px) { body.kolbeh-body .account-notifications-panel { padding: 0.65rem 0.75rem 0.75rem; } body.kolbeh-body .account-notification-list { gap: 0.45rem; } body.kolbeh-body .account-notification-card { gap: 0.6rem; padding: 0.7rem 0.8rem; border-radius: 12px; } body.kolbeh-body .account-notification-card__icon { width: 2.35rem; height: 2.35rem; border-radius: 10px; font-size: 0.95rem; } body.kolbeh-body .account-notification-card__head { flex-direction: column; align-items: flex-start; gap: 0.2rem; } body.kolbeh-body .account-notification-card__title { font-size: 0.82rem; } body.kolbeh-body .account-notification-card__date { white-space: normal; } body.kolbeh-body .account-notification-card__message { font-size: 0.74rem; -webkit-line-clamp: 2; } body.kolbeh-body .account-notification-card__dot { top: 0.7rem; inset-inline-end: 0.7rem; width: 0.42rem; height: 0.42rem; } } body.kolbeh-body .account-ticket-chat__head { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; } body.kolbeh-body .account-ticket-chat__count { font-size: 0.74rem; font-weight: 600; color: rgba(255, 255, 255, 0.45); padding: 0.22rem 0.62rem; border-radius: 999px; background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.08); } body.kolbeh-body .account-ticket-chat__thread { padding: 1rem 1.15rem; display: flex; flex-direction: column; gap: 1rem; min-height: 12rem; max-height: min(58vh, 32rem); overflow-y: auto; background: radial-gradient(ellipse 80% 60% at 50% 0%, rgba(212, 175, 55, 0.04) 0%, transparent 70%), rgba(10, 18, 36, 0.35); border-top: 1px solid rgba(212, 175, 55, 0.1); border-bottom: 1px solid rgba(212, 175, 55, 0.1); } body.kolbeh-body .account-ticket-chat__empty { margin: auto; text-align: center; padding: 2rem 1rem; color: rgba(255, 255, 255, 0.5); } body.kolbeh-body .account-ticket-chat__empty-icon { display: grid; place-items: center; width: 3.5rem; height: 3.5rem; margin: 0 auto 0.75rem; border-radius: 50%; background: rgba(212, 175, 55, 0.08); border: 1px solid rgba(212, 175, 55, 0.2); color: var(--kolbeh-purple); font-size: 1.4rem; } body.kolbeh-body .account-ticket-bubble { display: flex; align-items: flex-start; gap: 0.75rem; max-width: 88%; direction: ltr; } body.kolbeh-body .account-ticket-bubble.is-staff { margin-right: auto; margin-left: 0; flex-direction: row; } body.kolbeh-body .account-ticket-bubble.is-user { margin-left: auto; margin-right: 0; flex-direction: row-reverse; } body.kolbeh-body .account-ticket-bubble__avatar { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 50%; flex-shrink: 0; font-size: 1rem; } body.kolbeh-body .account-ticket-bubble.is-user .account-ticket-bubble__avatar { background: rgba(147, 197, 253, 0.14); border: 1px solid rgba(147, 197, 253, 0.28); color: #93c5fd; } body.kolbeh-body .account-ticket-bubble.is-staff .account-ticket-bubble__avatar { background: rgba(212, 175, 55, 0.14); border: 1px solid rgba(212, 175, 55, 0.32); color: var(--kolbeh-purple); } body.kolbeh-body .account-ticket-bubble__content { min-width: 0; flex: 1; direction: rtl; text-align: right; } body.kolbeh-body .account-ticket-bubble__meta { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.45rem; margin-bottom: 0.35rem; } body.kolbeh-body .account-ticket-bubble__meta-main { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem 0.55rem; min-width: 0; } body.kolbeh-body .account-ticket-bubble__author { font-size: 0.78rem; font-weight: 700; color: var(--kolbeh-purple); } body.kolbeh-body .account-ticket-bubble__role { font-size: 0.68rem; font-weight: 600; padding: 0.12rem 0.45rem; border-radius: 999px; color: rgba(232, 204, 106, 0.9); background: rgba(212, 175, 55, 0.12); border: 1px solid rgba(212, 175, 55, 0.22); } body.kolbeh-body .account-ticket-bubble__time { font-size: 0.68rem; color: rgba(255, 255, 255, 0.42); margin-inline-start: auto; } body.kolbeh-body .account-ticket-bubble.is-user .account-ticket-bubble__meta { flex-direction: row-reverse; } body.kolbeh-body .account-ticket-bubble.is-user .account-ticket-bubble__time { margin-left: auto; margin-right: 0; } body.kolbeh-body .account-ticket-bubble__body { padding: 0.85rem 1rem; border-radius: 16px; font-size: 0.86rem; line-height: 1.75; word-break: break-word; color: rgba(255, 255, 255, 0.88); background: rgba(18, 28, 52, 0.75); border: 1px solid rgba(212, 175, 55, 0.14); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18); } body.kolbeh-body .account-ticket-bubble.is-user .account-ticket-bubble__body { background: rgba(30, 58, 95, 0.55); border-color: rgba(147, 197, 253, 0.2); border-bottom-right-radius: 6px; } body.kolbeh-body .account-ticket-bubble.is-staff .account-ticket-bubble__body { background: rgba(212, 175, 55, 0.1); border-color: rgba(212, 175, 55, 0.26); border-bottom-left-radius: 6px; } body.kolbeh-body .account-ticket-bubble__edited { font-size: 0.68rem; color: rgba(255, 255, 255, 0.42); } body.kolbeh-body .account-ticket-bubble__quote { display: flex; flex-direction: column; gap: 0.15rem; margin-bottom: 0.45rem; padding: 0.45rem 0.65rem; border-radius: 12px; border-inline-start: 3px solid rgba(212, 175, 55, 0.45); background: rgba(0, 0, 0, 0.18); font-size: 0.74rem; color: rgba(255, 255, 255, 0.58); text-decoration: none; } body.kolbeh-body .account-ticket-bubble__quote.is-link:hover, body.kolbeh-body .account-ticket-bubble__quote.is-link:focus-visible { background: rgba(212, 175, 55, 0.12); outline: none; } body.kolbeh-body .account-ticket-bubble__quote-label { font-size: 0.68rem; font-weight: 700; color: var(--kolbeh-purple); } body.kolbeh-body .account-ticket-bubble__quote-author { font-weight: 700; color: rgba(255, 255, 255, 0.78); } body.kolbeh-body .account-ticket-bubble__quote-text { line-height: 1.5; word-break: break-word; } body.kolbeh-body .account-ticket-bubble.is-reply-target .account-ticket-bubble__body { box-shadow: 0 0 0 2px rgba(212, 175, 55, 0.55); } .ticket-msg-ctx { position: absolute; width: 0; height: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; padding: 0; margin: 0; } .ticket-msg-ctx__menu { display: none; min-width: 9.5rem; padding: 0.35rem; border-radius: 12px; border: 1px solid rgba(72, 96, 140, 0.14); background: #fff; box-shadow: 0 12px 32px rgba(10, 18, 36, 0.16); z-index: 1200; } .ticket-msg-ctx__menu.is-open { display: block; position: fixed; } .ticket-msg-ctx__item { display: flex; align-items: center; gap: 0.45rem; width: 100%; padding: 0.5rem 0.65rem; border: 0; border-radius: 8px; background: transparent; font: inherit; font-size: 0.78rem; font-weight: 700; text-align: inherit; cursor: pointer; } .ticket-msg-ctx__item:hover, .ticket-msg-ctx__item:focus-visible { outline: none; } .ticket-msg-ctx__item.is-danger { color: #b4233a; } body.kolbeh-body .ticket-msg-ctx__menu { border-color: rgba(212, 175, 55, 0.18); background: rgba(12, 20, 38, 0.98); box-shadow: 0 14px 36px rgba(0, 0, 0, 0.35); } body.kolbeh-body .ticket-msg-ctx__item { color: rgba(255, 255, 255, 0.82); } body.kolbeh-body .ticket-msg-ctx__item:hover, body.kolbeh-body .ticket-msg-ctx__item:focus-visible { background: rgba(255, 255, 255, 0.06); } body.kolbeh-body .ticket-msg-ctx__item.is-danger { color: #ff8a9a; } body.kolbeh-body .account-ticket-composer__quote { display: none; align-items: flex-start; gap: 0.65rem; margin-bottom: 0.75rem; padding: 0.65rem 0.75rem; border-radius: 12px; border: 1px solid rgba(212, 175, 55, 0.24); background: rgba(212, 175, 55, 0.08); } body.kolbeh-body .account-ticket-composer__quote.is-visible, body.kolbeh-body .account-ticket-composer__quote:not([hidden]) { display: flex; } body.kolbeh-body .account-ticket-composer__quote-link { flex: 1; min-width: 0; color: inherit; text-decoration: none; } body.kolbeh-body .account-ticket-composer__quote-link:hover, body.kolbeh-body .account-ticket-composer__quote-link:focus-visible { color: inherit; outline: none; } body.kolbeh-body .account-ticket-composer__quote-inner { flex: 1; min-width: 0; } body.kolbeh-body .account-ticket-composer__quote-label { display: block; margin-bottom: 0.2rem; font-size: 0.72rem; font-weight: 700; color: var(--kolbeh-purple); } body.kolbeh-body .account-ticket-composer__quote-inner strong { display: block; font-size: 0.78rem; color: rgba(255, 255, 255, 0.88); } body.kolbeh-body .account-ticket-composer__quote-inner p { margin: 0.2rem 0 0; font-size: 0.76rem; line-height: 1.55; color: rgba(255, 255, 255, 0.58); word-break: break-word; } body.kolbeh-body .account-ticket-composer__quote-clear { flex-shrink: 0; width: 28px; height: 28px; display: grid; place-items: center; border: none; border-radius: 8px; background: rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.72); cursor: pointer; } body.kolbeh-body .account-ticket-composer__quote-clear:hover { background: rgba(255, 255, 255, 0.14); color: #fff; } body.kolbeh-body .account-ticket-chat__composer { padding: 1rem 1.15rem 1.15rem; background: rgba(10, 18, 36, 0.4); } body.kolbeh-body .account-ticket-composer__label { display: inline-flex; align-items: center; gap: 0.4rem; margin-bottom: 0.55rem; font-size: 0.82rem; font-weight: 700; color: var(--kolbeh-purple); } body.kolbeh-body .account-ticket-composer__input { border-radius: 14px; border: 1px solid rgba(212, 175, 55, 0.22); background: rgba(10, 18, 36, 0.55); color: #fff; resize: vertical; min-height: 6.5rem; } body.kolbeh-body .account-ticket-composer__input:focus { border-color: rgba(212, 175, 55, 0.42); box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.12); background: rgba(10, 18, 36, 0.7); color: #fff; } body.kolbeh-body .account-ticket-composer__actions { display: flex; justify-content: flex-end; margin-top: 0.75rem; } body.kolbeh-body .account-ticket-chat__closed { display: flex; align-items: center; justify-content: center; gap: 0.55rem; padding: 1rem 1.15rem 1.15rem; font-size: 0.84rem; font-weight: 600; color: rgba(255, 255, 255, 0.55); background: rgba(80, 16, 32, 0.2); border-top: 1px solid rgba(255, 120, 140, 0.14); } body.kolbeh-body .account-ticket-chat__closed i { color: #fca5a5; } body.kolbeh-body .account-ticket-hero { background: linear-gradient(168deg, #fffef8 0%, #fff9eb 28%, #ffffff 100%); border-color: rgba(201, 162, 39, 0.28); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.95) inset, 0 14px 38px rgba(12, 24, 48, 0.09), 0 0 0 1px rgba(201, 162, 39, 0.06); } body.kolbeh-body .account-ticket-hero::before { content: ""; position: absolute; top: 0; right: 1.15rem; left: 1.15rem; height: 3px; border-radius: 0 0 4px 4px; background: linear-gradient(90deg, rgba(201, 162, 39, 0.35), rgba(184, 134, 11, 0.9), rgba(201, 162, 39, 0.35)); pointer-events: none; } body.kolbeh-body .account-ticket-hero__main { border-bottom-color: rgba(72, 96, 140, 0.1); } body.kolbeh-body .account-ticket-hero__icon { background: linear-gradient(145deg, rgba(201, 162, 39, 0.18) 0%, rgba(201, 162, 39, 0.08) 100%); border-color: rgba(201, 162, 39, 0.35); color: #7a5c0f; box-shadow: 0 4px 14px rgba(201, 162, 39, 0.12); } body.kolbeh-body .account-ticket-hero__label, body.kolbeh-body .account-ticket-stat__label { color: rgba(107, 84, 24, 0.88); } body.kolbeh-body .account-ticket-hero__subject, body.kolbeh-body .account-ticket-stat__value { color: #0c1833; } body.kolbeh-body .account-ticket-hero__id, body.kolbeh-body .account-ticket-stat__sub { color: var(--elco-light-muted); } body.kolbeh-body .account-ticket-stat { background: #f8fafc; border-color: rgba(72, 96, 140, 0.12); } body.kolbeh-body .account-ticket-stat--highlight { background: linear-gradient(145deg, rgba(201, 162, 39, 0.12) 0%, rgba(201, 162, 39, 0.05) 100%); border-color: rgba(201, 162, 39, 0.28); } body.kolbeh-body .account-ticket-stat__icon { background: rgba(201, 162, 39, 0.12); border-color: rgba(201, 162, 39, 0.28); color: #8a6a12; } body.kolbeh-body .account-badge--ticket-open { color: #1e40af; background: #dbeafe; border-color: rgba(59, 130, 246, 0.3); } body.kolbeh-body .account-badge--ticket-waiting { color: #92400e; background: #fef3c7; border-color: rgba(245, 158, 11, 0.35); } body.kolbeh-body .account-badge--ticket-answered { color: #065f46; background: #d1fae5; border-color: rgba(16, 185, 129, 0.3); } body.kolbeh-body .account-badge--ticket-closed, body.kolbeh-body .account-badge--ticket-priority-low { color: #2a3448; background: #f4f6f9; border-color: rgba(72, 96, 140, 0.12); } body.kolbeh-body .account-badge--ticket-priority-high { color: #991b1b; background: #fee2e2; border-color: rgba(239, 68, 68, 0.3); } body.kolbeh-body .account-badge--ticket-priority-medium { color: #92400e; background: #fef3c7; border-color: rgba(245, 158, 11, 0.35); } body.kolbeh-body .account-wallet-balance { background: radial-gradient(ellipse 80% 120% at 100% 0%, rgba(201, 162, 39, 0.1), transparent 58%), linear-gradient(165deg, #ffffff 0%, #f8fafc 100%); border-color: rgba(201, 162, 39, 0.28); box-shadow: 0 8px 28px rgba(72, 96, 140, 0.1); } body.kolbeh-body .account-wallet-balance__icon { background: rgba(201, 162, 39, 0.12); border-color: rgba(201, 162, 39, 0.28); color: #8a6a12; box-shadow: none; } body.kolbeh-body .account-wallet-balance__label { color: var(--elco-light-muted); } body.kolbeh-body .account-wallet-balance__value { color: #8a6a12; } body.kolbeh-body .account-wallet-tx-card { background: #ffffff; border-color: rgba(72, 96, 140, 0.12); } body.kolbeh-body .account-wallet-tx-card__desc { color: #0c1833; } body.kolbeh-body .account-wallet-tx-card__date { color: var(--elco-light-muted); } body.kolbeh-body .account-wallet-tx-card__amount--deposit { color: #047857; } body.kolbeh-body .account-wallet-tx-card__amount--withdrawal { color: #b91c1c; } body.kolbeh-body .account-badge--wallet-deposit, body.kolbeh-body .account-badge--wallet-completed { color: #065f46; background: #d1fae5; border-color: rgba(16, 185, 129, 0.3); } body.kolbeh-body .account-badge--wallet-withdrawal { color: #991b1b; background: #fee2e2; border-color: rgba(239, 68, 68, 0.3); } body.kolbeh-body .account-badge--wallet-pending { color: #92400e; background: #fef3c7; border-color: rgba(245, 158, 11, 0.35); } body.kolbeh-body .account-notification-card { background: #ffffff; border-color: rgba(72, 96, 140, 0.12); } body.kolbeh-body .account-notification-card--linked:hover, body.kolbeh-body .account-notification-card--linked:focus-visible { background: #fffdf6; border-color: rgba(201, 162, 39, 0.28); box-shadow: 0 8px 22px rgba(72, 96, 140, 0.1); } body.kolbeh-body .account-notification-card--unread { background: linear-gradient(135deg, rgba(201, 162, 39, 0.1) 0%, #ffffff 100%); border-color: rgba(201, 162, 39, 0.28); box-shadow: inset 3px 0 0 #c9a227, 0 4px 16px rgba(201, 162, 39, 0.08); } body.kolbeh-body .account-notification-card__icon { background: rgba(201, 162, 39, 0.1); border-color: rgba(201, 162, 39, 0.22); color: #8a6a12; } body.kolbeh-body .account-notification-card--unread .account-notification-card__icon { background: rgba(201, 162, 39, 0.14); border-color: rgba(201, 162, 39, 0.32); color: #8a6a12; box-shadow: none; } body.kolbeh-body .account-notification-card__title { color: #0c1833; } body.kolbeh-body .account-notification-card__date, body.kolbeh-body .account-notification-card__message { color: var(--elco-light-muted); } body.kolbeh-body .account-notification-card__action { color: #8a6a12; } body.kolbeh-body .account-notification-card--linked:hover .account-notification-card__action, body.kolbeh-body .account-notification-card--linked:focus-visible .account-notification-card__action { color: #6b5418; } body.kolbeh-body .account-notification-card__dot { background: #c9a227; box-shadow: 0 0 8px rgba(201, 162, 39, 0.45); } body.kolbeh-body .account-ticket-chat__count { color: #5a6478; background: #f4f6f9; border-color: rgba(72, 96, 140, 0.1); } body.kolbeh-body .account-ticket-chat__thread { background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%); border-top-color: rgba(72, 96, 140, 0.08); border-bottom-color: rgba(72, 96, 140, 0.08); } body.kolbeh-body .account-ticket-chat__empty { color: var(--elco-light-muted); } body.kolbeh-body .account-ticket-chat__empty-icon { background: rgba(201, 162, 39, 0.12); border-color: rgba(201, 162, 39, 0.28); color: #8a6a12; } body.kolbeh-body .account-ticket-bubble.is-user .account-ticket-bubble__avatar { background: #dbeafe; border-color: rgba(59, 130, 246, 0.3); color: #1e40af; } body.kolbeh-body .account-ticket-bubble.is-staff .account-ticket-bubble__avatar { background: linear-gradient(145deg, rgba(201, 162, 39, 0.18) 0%, rgba(201, 162, 39, 0.08) 100%); border-color: rgba(201, 162, 39, 0.35); color: #7a5c0f; } body.kolbeh-body .account-ticket-bubble__author { color: #6b5418; } body.kolbeh-body .account-ticket-bubble__role { color: #5c4608; background: rgba(201, 162, 39, 0.14); border-color: rgba(201, 162, 39, 0.28); } body.kolbeh-body .account-ticket-bubble__time { color: var(--elco-light-muted); } body.kolbeh-body .account-ticket-bubble__body { color: #2a3448; background: #ffffff; border-color: rgba(72, 96, 140, 0.12); box-shadow: 0 4px 14px rgba(12, 18, 36, 0.06); } body.kolbeh-body .account-ticket-bubble.is-user .account-ticket-bubble__body { background: linear-gradient(145deg, #eff6ff 0%, #ffffff 100%); border-color: rgba(59, 130, 246, 0.2); } body.kolbeh-body .account-ticket-bubble.is-staff .account-ticket-bubble__body { background: linear-gradient(145deg, #fffef8 0%, #fff9eb 100%); border-color: rgba(201, 162, 39, 0.28); } body.kolbeh-body .account-ticket-bubble__quote { background: rgba(72, 96, 140, 0.06); border-inline-start-color: rgba(201, 162, 39, 0.55); color: #5a6478; } body.kolbeh-body .account-ticket-bubble__quote-label { color: #8a6a12; } body.kolbeh-body .account-ticket-bubble__quote-author { color: #3d4658; } body.kolbeh-body .account-ticket-bubble__quote-text { color: #5a6478; } body.kolbeh-body .account-ticket-bubble.is-reply-target .account-ticket-bubble__body { box-shadow: 0 0 0 2px rgba(201, 162, 39, 0.55); } body.kolbeh-body .account-ticket-composer__quote { background: #fff9eb; border-color: rgba(201, 162, 39, 0.32); } body.kolbeh-body .account-ticket-composer__quote-label { color: #8a6a12; } body.kolbeh-body .account-ticket-composer__quote-inner strong { color: #2a3448; } body.kolbeh-body .account-ticket-composer__quote-inner p { color: #5a6478; } body.kolbeh-body .account-ticket-composer__quote-clear { background: rgba(72, 96, 140, 0.08); color: #5a6478; } body.kolbeh-body .account-ticket-chat__composer { background: #f8fafc; } body.kolbeh-body .account-ticket-composer__label { color: #6b5418; } body.kolbeh-body .account-ticket-composer__input { background: #ffffff; border-color: rgba(72, 96, 140, 0.18); color: #0c1833; } body.kolbeh-body .account-ticket-composer__input:focus { border-color: rgba(201, 162, 39, 0.42); box-shadow: 0 0 0 3px rgba(201, 162, 39, 0.12); color: #0c1833; } body.kolbeh-body .account-ticket-chat__closed { color: #991b1b; background: #fef2f2; border-top-color: rgba(239, 68, 68, 0.18); } @media (max-width: 767.98px) { body.kolbeh-body .account-ticket-hero__stats { grid-template-columns: 1fr; } body.kolbeh-body .account-ticket-bubble { max-width: 100%; } body.kolbeh-body .account-ticket-chat__thread { max-height: none; } } body.kolbeh-body .account-order-groups { display: flex; flex-direction: column; gap: 1.25rem; } body.kolbeh-body .account-order-group__head { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; margin-bottom: 0.65rem; padding: 0.55rem 0.15rem 0; } body.kolbeh-body .account-order-group__title-wrap { display: flex; align-items: center; gap: 0.65rem; min-width: 0; } body.kolbeh-body .account-order-group__icon { display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: 11px; flex-shrink: 0; font-size: 1rem; } body.kolbeh-body .account-order-group__head--pending .account-order-group__icon { background: rgba(252, 211, 77, 0.14); border: 1px solid rgba(252, 211, 77, 0.28); color: #fcd34d; } body.kolbeh-body .account-order-group__head--paid .account-order-group__icon { background: rgba(110, 231, 183, 0.12); border: 1px solid rgba(110, 231, 183, 0.28); color: #6ee7b7; } body.kolbeh-body .account-order-group__head--cancelled .account-order-group__icon { background: rgba(252, 165, 165, 0.12); border: 1px solid rgba(252, 165, 165, 0.28); color: #fca5a5; } body.kolbeh-body .account-order-group__title { margin: 0; font-size: 0.95rem; font-weight: 700; color: #fff; line-height: 1.35; } body.kolbeh-body .account-order-group__count { display: inline-flex; align-items: center; justify-content: center; min-width: 1.65rem; height: 1.65rem; padding: 0 0.45rem; border-radius: 999px; font-size: 0.74rem; font-weight: 700; color: rgba(255, 255, 255, 0.82); background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.1); } body.kolbeh-body .account-order-group__title { color: #0c1833; } body.kolbeh-body .account-order-group__count { color: #2a3448; background: #f4f6f9; border-color: rgba(72, 96, 140, 0.12); } body.kolbeh-body .account-order-group__head--pending .account-order-group__icon { background: #fef3c7; border-color: rgba(245, 158, 11, 0.35); color: #92400e; } body.kolbeh-body .account-order-group__head--paid .account-order-group__icon { background: #d1fae5; border-color: rgba(16, 185, 129, 0.3); color: #065f46; } body.kolbeh-body .account-order-group__head--cancelled .account-order-group__icon { background: #fee2e2; border-color: rgba(239, 68, 68, 0.3); color: #991b1b; } body.kolbeh-body .account-order-detail.od-page { display: flex; flex-direction: column; gap: 1.25rem; } body.kolbeh-body .od-page-head__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 0.35rem 0.5rem; } body.kolbeh-body .od-page-head__dot { opacity: 0.45; } body.kolbeh-body .od-page-head__time { opacity: 0.72; } body.kolbeh-body .od-page-head__badges { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 0.45rem; } body.kolbeh-body .od-page-head__title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.45rem 0.65rem; } body.kolbeh-body .od-page-head__number { font-size: 0.92em; font-weight: 800; letter-spacing: 0.03em; color: var(--elco-gold-bright, #d4af37); } @media (max-width: 767.98px) { body.kolbeh-body .od-page-head .account-back-btn { align-self: flex-start; flex-shrink: 0; min-height: 0; height: auto; padding: 0.32rem 0.68rem; font-size: 0.72rem; line-height: 1.2; } body.kolbeh-body .od-page-head .account-back-btn i { font-size: 0.78rem; } } body.kolbeh-body .od-status-strip { padding: 1rem 1.1rem; border-radius: 16px; border: 1px solid rgba(212, 175, 55, 0.2); background: linear-gradient(165deg, rgba(18, 28, 52, 0.92) 0%, rgba(10, 18, 36, 0.96) 100%); box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24); } body.kolbeh-body .od-status-strip--delivered { border-color: rgba(52, 211, 153, 0.28); } body.kolbeh-body .od-status-strip__hint { margin: 0 0 0.85rem; font-size: 0.82rem; line-height: 1.55; color: rgba(255, 255, 255, 0.72); } body.kolbeh-body .od-status-strip__banner { display: flex; align-items: flex-start; gap: 0.65rem; padding: 0.75rem 0.85rem; margin-bottom: 0.85rem; border-radius: 12px; font-size: 0.8rem; } body.kolbeh-body .od-status-strip__banner > i { font-size: 1.25rem; flex-shrink: 0; } body.kolbeh-body .od-status-strip__banner strong { display: block; font-size: 0.84rem; margin-bottom: 0.15rem; } body.kolbeh-body .od-status-strip__banner p { margin: 0; line-height: 1.5; opacity: 0.92; } body.kolbeh-body .od-status-strip__banner time, body.kolbeh-body .od-status-strip__tracking { display: block; margin-top: 0.35rem; font-size: 0.72rem; opacity: 0.88; } body.kolbeh-body .od-status-strip__banner--complete { background: rgba(16, 185, 129, 0.12); border: 1px solid rgba(16, 185, 129, 0.24); color: #6ee7b7; } body.kolbeh-body .od-status-strip__banner--shipping { background: rgba(59, 130, 246, 0.1); border: 1px solid rgba(59, 130, 246, 0.22); color: #93c5fd; } body.kolbeh-body .od-status-strip__banner--cancelled { background: rgba(120, 24, 48, 0.2); border: 1px solid rgba(255, 120, 140, 0.24); color: #ffb8c6; align-items: center; } body.kolbeh-body .od-status-strip__progress { display: flex; align-items: flex-start; gap: 0; } body.kolbeh-body .od-status-strip__step { display: flex; flex-direction: column; align-items: center; gap: 0.35rem; flex: 1; min-width: 0; text-align: center; } body.kolbeh-body .od-status-strip__dot { width: 0.65rem; height: 0.65rem; border-radius: 999px; background: rgba(255, 255, 255, 0.2); flex-shrink: 0; } body.kolbeh-body .od-status-strip__dot--done { background: #34d399; box-shadow: 0 0 0 3px rgba(52, 211, 153, 0.2); } body.kolbeh-body .od-status-strip__dot--active { background: var(--elco-gold-bright, #d4af37); box-shadow: 0 0 0 4px rgba(212, 175, 55, 0.22); transform: scale(1.2); } body.kolbeh-body .od-status-strip__label { font-size: 0.62rem; font-weight: 600; line-height: 1.25; color: rgba(255, 255, 255, 0.42); max-width: 4.5rem; } body.kolbeh-body .od-status-strip__dot--done + .od-status-strip__label, body.kolbeh-body .od-status-strip__dot--active + .od-status-strip__label { color: rgba(232, 204, 106, 0.88); } body.kolbeh-body .od-status-strip__line { flex: 1; height: 2px; min-width: 0.35rem; margin-top: 0.3rem; background: rgba(255, 255, 255, 0.12); border-radius: 2px; } body.kolbeh-body .od-status-strip__line--done { background: rgba(52, 211, 153, 0.5); } body.kolbeh-body .od-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; align-items: start; } @media (min-width: 992px) { body.kolbeh-body .od-layout { grid-template-columns: minmax(0, 1fr) minmax(17rem, 22rem); gap: 1.15rem; } body.kolbeh-body .od-layout__aside { position: sticky; top: 1rem; display: flex; flex-direction: column; gap: 0.85rem; } } body.kolbeh-body .od-layout__main, body.kolbeh-body .od-layout__aside { min-width: 0; } body.kolbeh-body .od-invoice--aside, body.kolbeh-body .od-address--aside, body.kolbeh-body .od-meta-card { border-radius: 16px; border: 1px solid rgba(212, 175, 55, 0.2); background: linear-gradient(165deg, rgba(18, 28, 52, 0.94) 0%, rgba(10, 18, 36, 0.97) 100%); box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22); overflow: hidden; } body.kolbeh-body .od-meta-card__list { list-style: none; margin: 0; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.65rem; } body.kolbeh-body .od-meta-card__item { display: flex; align-items: flex-start; gap: 0.65rem; } body.kolbeh-body .od-meta-card__item > i { width: 2rem; height: 2rem; border-radius: 10px; display: grid; place-items: center; flex-shrink: 0; background: rgba(212, 175, 55, 0.1); border: 1px solid rgba(212, 175, 55, 0.2); color: var(--kolbeh-purple); font-size: 0.9rem; } body.kolbeh-body .od-meta-card__label { display: block; font-size: 0.66rem; font-weight: 600; color: rgba(255, 255, 255, 0.45); margin-bottom: 0.1rem; } body.kolbeh-body .od-meta-card__item strong { display: block; font-size: 0.8rem; color: #fff; } body.kolbeh-body .od-meta-card__item small { display: block; font-size: 0.68rem; color: rgba(255, 255, 255, 0.5); margin-top: 0.1rem; } body.kolbeh-body .od-products--detail { padding: 0.85rem 1rem 1rem; } body.kolbeh-body .od-product--detail { grid-template-columns: 88px minmax(0, 1fr) auto; align-items: center; padding: 0.85rem 0; border-bottom: 1px solid rgba(212, 175, 55, 0.1); } body.kolbeh-body .od-product--detail:last-child { border-bottom: 0; padding-bottom: 0; } body.kolbeh-body .od-product--detail:first-child { padding-top: 0; } body.kolbeh-body .od-product--detail .od-product__media { width: 88px; height: 88px; border-radius: 12px; } body.kolbeh-body .od-product__sku { display: block; margin-top: 0.2rem; font-size: 0.68rem; color: rgba(255, 255, 255, 0.45); } body.kolbeh-body .od-notice { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; padding: 1rem 1.15rem; border-radius: 16px; border: 1px solid rgba(212, 175, 55, 0.35); background: linear-gradient( 135deg, rgba(212, 175, 55, 0.14) 0%, rgba(22, 34, 64, 0.92) 55%, rgba(12, 20, 38, 0.96) 100% ); box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28); } body.kolbeh-body .od-notice__icon { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; flex-shrink: 0; background: rgba(212, 175, 55, 0.18); border: 1px solid rgba(212, 175, 55, 0.38); color: var(--kolbeh-purple); font-size: 1.2rem; } body.kolbeh-body .od-notice__body { flex: 1; min-width: 12rem; } body.kolbeh-body .od-notice__title { display: block; font-size: 0.92rem; font-weight: 700; color: #fff; margin-bottom: 0.2rem; } body.kolbeh-body .od-notice__text { margin: 0; font-size: 0.8rem; color: rgba(255, 255, 255, 0.62); line-height: 1.55; } body.kolbeh-body .od-notice__action { flex-shrink: 0; } body.kolbeh-body .od-pay-sheet { --od-pay-gold: var(--elco-gold-bright, #e8cc6a); --od-pay-line: rgba(212, 175, 55, 0.2); --od-pay-muted: rgba(255, 255, 255, 0.55); position: relative; border-radius: 18px; border: 1px solid var(--od-pay-line); background: linear-gradient(165deg, rgba(22, 34, 62, 0.98) 0%, rgba(10, 16, 30, 0.99) 100%); box-shadow: 0 16px 48px rgba(0, 0, 0, 0.28); overflow: hidden; } body.kolbeh-body .od-pay-sheet__accent { height: 3px; background: linear-gradient(90deg, transparent, var(--od-pay-gold), transparent); opacity: 0.9; } body.kolbeh-body .od-pay-sheet__head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem 1.25rem; padding: 1.25rem 1.25rem 1rem; align-items: start; } body.kolbeh-body .od-pay-sheet__timer-block { grid-column: 1 / -1; display: flex; align-items: center; gap: 1rem; padding: 0.85rem 1rem; border-radius: 14px; background: rgba(212, 175, 55, 0.08); border: 1px solid rgba(212, 175, 55, 0.22); } body.kolbeh-body .od-pay-sheet__timer { width: 64px; height: 64px; --pr-gold: var(--od-pay-gold); } body.kolbeh-body .od-pay-sheet__timer .pr-timer__time { font-size: 0.78rem; } body.kolbeh-body .od-pay-sheet__timer-label { display: block; font-size: 0.72rem; font-weight: 600; color: var(--od-pay-muted); margin-bottom: 0.15rem; } body.kolbeh-body .od-pay-sheet__timer-digital { display: block; font-size: 1.65rem; font-weight: 800; line-height: 1.1; color: #fff; font-variant-numeric: tabular-nums; letter-spacing: 0.04em; } body.kolbeh-body .od-pay-sheet__timer-block:has(.is-urgent) .od-pay-sheet__timer-digital { color: #ff8a96; } body.kolbeh-body .od-pay-sheet__timer-block:has(.is-expired) .od-pay-sheet__timer-digital { color: rgba(255, 255, 255, 0.35); } body.kolbeh-body .od-pay-sheet__timer-hint { margin: 0.35rem 0 0; font-size: 0.76rem; line-height: 1.5; color: rgba(255, 255, 255, 0.48); } body.kolbeh-body .od-pay-sheet__timer-hint--expired { color: #ff8a96; } body.kolbeh-body .od-pay-sheet__intro { min-width: 0; } body.kolbeh-body .od-pay-sheet__title { margin: 0 0 0.35rem; font-size: 1.05rem; font-weight: 800; color: #fff; line-height: 1.35; } body.kolbeh-body .od-pay-sheet__text { margin: 0; font-size: 0.82rem; line-height: 1.55; color: var(--od-pay-muted); } body.kolbeh-body .od-pay-sheet__amount { padding: 0.65rem 0.85rem; border-radius: 12px; background: rgba(212, 175, 55, 0.1); border: 1px solid rgba(212, 175, 55, 0.28); text-align: center; min-width: 7.5rem; } body.kolbeh-body .od-pay-sheet__amount-label { display: block; font-size: 0.65rem; color: rgba(255, 255, 255, 0.45); margin-bottom: 0.15rem; } body.kolbeh-body .od-pay-sheet__amount-value { display: block; font-size: 0.95rem; font-weight: 800; color: var(--od-pay-gold); } body.kolbeh-body .od-pay-sheet__chips { display: flex; flex-wrap: wrap; gap: 0.5rem; padding: 0 1.25rem 1rem; } body.kolbeh-body .od-pay-sheet__chip { flex: 1 1 10rem; min-width: 0; padding: 0.55rem 0.75rem; border-radius: 10px; background: rgba(255, 255, 255, 0.03); border: 1px solid rgba(255, 255, 255, 0.06); } body.kolbeh-body .od-pay-sheet__chip-label { display: block; font-size: 0.65rem; color: rgba(255, 255, 255, 0.38); margin-bottom: 0.1rem; } body.kolbeh-body .od-pay-sheet__chip-value { display: block; font-size: 0.82rem; font-weight: 700; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } body.kolbeh-body .od-pay-sheet__section { padding: 1rem 1.25rem 1.1rem; border-top: 1px solid rgba(255, 255, 255, 0.06); } body.kolbeh-body .od-pay-sheet__section--upload { background: rgba(212, 175, 55, 0.04); } body.kolbeh-body .od-pay-sheet__section-title { display: flex; align-items: center; flex-wrap: wrap; gap: 0.45rem; margin: 0 0 0.85rem; font-size: 0.84rem; font-weight: 700; color: rgba(255, 255, 255, 0.88); } body.kolbeh-body .od-pay-sheet__section-title > i { color: var(--od-pay-gold); font-size: 0.95rem; } body.kolbeh-body .od-pay-sheet__step { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font-size: 0.72rem; font-weight: 800; background: rgba(212, 175, 55, 0.15); border: 1px solid rgba(212, 175, 55, 0.35); color: var(--od-pay-gold); flex-shrink: 0; } body.kolbeh-body .od-pay-sheet__required { margin-inline-start: auto; padding: 0.12rem 0.5rem; border-radius: 999px; font-size: 0.62rem; font-weight: 800; color: #ff8a96; background: rgba(220, 53, 69, 0.12); border: 1px solid rgba(255, 107, 122, 0.3); } body.kolbeh-body .od-pay-sheet__note { display: flex; align-items: flex-start; gap: 0.45rem; margin: 0.75rem 0 0; padding: 0.55rem 0.7rem; border-radius: 10px; font-size: 0.76rem; line-height: 1.5; color: rgba(255, 255, 255, 0.55); background: rgba(255, 255, 255, 0.03); border: 1px solid rgba(255, 255, 255, 0.06); } body.kolbeh-body .od-pay-sheet__note > i { color: var(--od-pay-gold); flex-shrink: 0; margin-top: 0.1rem; } body.kolbeh-body .od-pay-sheet .pr-bank-card { --pr-gold: var(--od-pay-gold); } body.kolbeh-body .od-pay-sheet .pr-upload-widget__row { display: flex; flex-wrap: wrap; gap: 0.55rem; } body.kolbeh-body .od-pay-sheet .pr-upload-widget__picker { flex: 1 1 14rem; min-height: 46px; padding: 0.55rem 0.75rem; border-radius: 12px; border: 1.5px dashed rgba(212, 175, 55, 0.45); background: rgba(0, 0, 0, 0.15); cursor: pointer; transition: border-color 0.2s, background 0.2s; } body.kolbeh-body .od-pay-sheet .pr-upload-widget__picker:hover, body.kolbeh-body .od-pay-sheet .pr-upload-widget.is-dragover .pr-upload-widget__picker { border-color: rgba(212, 175, 55, 0.75); background: rgba(212, 175, 55, 0.08); } body.kolbeh-body .od-pay-sheet .pr-upload-widget__picker i { color: var(--od-pay-gold); font-size: 1.05rem; } body.kolbeh-body .od-pay-sheet .pr-upload-widget__picker-text { font-size: 0.8rem; color: rgba(255, 255, 255, 0.72); } body.kolbeh-body .od-pay-sheet .pr-upload-widget__submit { min-height: 46px; padding-inline: 1.1rem; border-radius: 12px; font-weight: 700; } body.kolbeh-body .od-pay-sheet .pr-upload-widget__hint { margin-top: 0.45rem; font-size: 0.72rem; color: rgba(255, 255, 255, 0.42); } body.kolbeh-body .od-pay-sheet--compact { border-radius: 14px; box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18); } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__toolbar { display: flex; align-items: center; gap: 0.85rem; padding: 0.85rem 1rem; border-bottom: 1px solid rgba(255, 255, 255, 0.06); } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__timer-wrap { flex-shrink: 0; } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__timer { width: 46px; height: 46px; } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__toolbar-main { min-width: 0; flex: 1; } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__title { margin: 0 0 0.2rem; font-size: 0.88rem; line-height: 1.35; } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__text { margin: 0 0 0.45rem; font-size: 0.74rem; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__text--expired { color: #ff8a96; } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__meta { display: flex; flex-wrap: wrap; gap: 0.35rem; } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__pill { display: inline-flex; align-items: center; padding: 0.18rem 0.5rem; border-radius: 999px; font-size: 0.68rem; font-weight: 700; color: rgba(255, 255, 255, 0.78); background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.08); } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__pill--gold { color: var(--od-pay-gold); background: rgba(212, 175, 55, 0.12); border-color: rgba(212, 175, 55, 0.28); } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__steps { display: grid; grid-template-columns: minmax(0, 1fr); } @media (min-width: 992px) { body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__section { padding: 0.85rem 1rem 0.95rem; } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__section-title { margin-bottom: 0.6rem; font-size: 0.78rem; } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__section-title > i { display: none; } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__step { width: 18px; height: 18px; font-size: 0.65rem; } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__note { margin-top: 0.55rem; padding: 0.45rem 0.55rem; font-size: 0.7rem; } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__note > i { display: none; } body.kolbeh-body .od-bank-rows { display: flex; flex-direction: column; gap: 0.45rem; } body.kolbeh-body .od-bank-row { display: flex; align-items: center; justify-content: space-between; gap: 0.65rem; padding: 0.5rem 0.65rem; border-radius: 10px; background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.07); } body.kolbeh-body .od-bank-row__label { flex-shrink: 0; font-size: 0.68rem; font-weight: 600; color: rgba(255, 255, 255, 0.45); } body.kolbeh-body .od-bank-row__value { display: flex; align-items: center; gap: 0.35rem; min-width: 0; justify-content: flex-end; } body.kolbeh-body .od-bank-row__value code { font-size: 0.76rem; font-weight: 700; color: #fff; background: none; padding: 0; } body.kolbeh-body .od-bank-row__holder { font-size: 0.78rem; font-weight: 700; color: #fff; text-align: end; } body.kolbeh-body .od-pay-sheet--compact .pr-upload-widget__picker { min-height: 40px; padding: 0.45rem 0.6rem; } body.kolbeh-body .od-pay-sheet--compact .pr-upload-widget__submit { min-height: 40px; padding-inline: 0.85rem; font-size: 0.76rem; } body.kolbeh-body .od-page--payment-compact { gap: 0.85rem; } body.kolbeh-body .od-page--payment-compact .od-page-head { margin-bottom: 0; } body.kolbeh-body .od-page--payment-compact .account-page-title { font-size: 1.15rem; } body.kolbeh-body .od-page--payment-compact .od-layout { gap: 0.85rem; } body.kolbeh-body .od-page--payment-compact .od-section--products { padding: 0.85rem 1rem; } body.kolbeh-body .od-page--payment-compact .od-invoice--aside, body.kolbeh-body .od-page--payment-compact .od-meta-card, body.kolbeh-body .od-page--payment-compact .od-address--aside { padding: 0.85rem 1rem; } body.kolbeh-body .od-notice--payment { flex-direction: column; align-items: stretch; } body.kolbeh-body .od-notice__main { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; width: 100%; } body.kolbeh-body .od-status-card { position: relative; padding: 1.25rem 1.35rem 1.2rem; border-radius: 20px; border: 1px solid rgba(212, 175, 55, 0.26); background: linear-gradient( 168deg, rgba(24, 36, 68, 0.97) 0%, rgba(12, 20, 38, 0.99) 100% ); box-shadow: 0 0 28px rgba(212, 175, 55, 0.08), 0 18px 44px rgba(0, 0, 0, 0.38); overflow: hidden; } body.kolbeh-body .od-status-card::before { content: ""; position: absolute; top: 0; right: 0; left: 0; height: 3px; background: linear-gradient( 90deg, transparent, rgba(212, 175, 55, 0.55), var(--kolbeh-purple), rgba(212, 175, 55, 0.55), transparent ); pointer-events: none; } body.kolbeh-body .od-status-card__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.15rem; } body.kolbeh-body .od-status-card__identity { display: flex; flex-direction: column; gap: 0.25rem; } body.kolbeh-body .od-status-card__label { font-size: 0.7rem; font-weight: 600; color: rgba(232, 204, 106, 0.68); letter-spacing: 0.03em; text-transform: uppercase; } body.kolbeh-body .od-status-card__number { font-size: clamp(1rem, 2.2vw, 1.2rem); font-weight: 800; color: #fff; letter-spacing: 0.04em; } body.kolbeh-body .od-status-card__badges { display: flex; align-items: center; gap: 0.45rem; flex-wrap: wrap; } body.kolbeh-body .od-status-card__cancelled { display: flex; align-items: center; gap: 0.55rem; padding: 0.75rem 0.95rem; margin-bottom: 1rem; border-radius: 12px; background: rgba(120, 24, 48, 0.22); border: 1px solid rgba(255, 120, 140, 0.28); color: #ffb8c6; font-size: 0.84rem; font-weight: 600; } body.kolbeh-body .od-status-card__complete, body.kolbeh-body .od-status-card__shipping { display: flex; align-items: flex-start; gap: 0.65rem; padding: 0.85rem 0.95rem; margin-bottom: 1rem; border-radius: 12px; font-size: 0.82rem; } body.kolbeh-body .od-status-card__complete > i, body.kolbeh-body .od-status-card__shipping > i { font-size: 1.35rem; flex-shrink: 0; margin-top: 0.05rem; } body.kolbeh-body .od-status-card__complete strong, body.kolbeh-body .od-status-card__shipping strong { display: block; font-size: 0.86rem; margin-bottom: 0.2rem; } body.kolbeh-body .od-status-card__complete p, body.kolbeh-body .od-status-card__shipping p { margin: 0; line-height: 1.55; opacity: 0.92; } body.kolbeh-body .od-status-card__complete { background: rgba(16, 185, 129, 0.14); border: 1px solid rgba(16, 185, 129, 0.28); color: #6ee7b7; } body.kolbeh-body .od-status-card__complete > i { color: #34d399; } body.kolbeh-body .od-status-card__shipping { background: rgba(59, 130, 246, 0.12); border: 1px solid rgba(59, 130, 246, 0.24); color: #93c5fd; } body.kolbeh-body .od-status-card__shipping > i { color: #60a5fa; } body.kolbeh-body .od-status-card__complete-date, body.kolbeh-body .od-status-card__tracking { display: block; margin-top: 0.45rem; font-size: 0.72rem; opacity: 0.88; } body.kolbeh-body .od-status-card__tracking strong { display: inline; font-size: inherit; margin: 0; } body.kolbeh-body .od-track { display: flex; align-items: flex-start; justify-content: space-between; gap: 0; margin-bottom: 1.15rem; padding: 0.35rem 0.15rem 0; } body.kolbeh-body .od-track__step { display: flex; flex-direction: column; align-items: center; gap: 0.45rem; flex: 1; min-width: 0; text-align: center; } body.kolbeh-body .od-track__node { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; border: 2px solid rgba(212, 175, 55, 0.22); background: rgba(10, 18, 36, 0.7); color: rgba(255, 255, 255, 0.35); font-size: 0.95rem; transition: all 0.25s ease; } body.kolbeh-body .od-track__step--done .od-track__node { border-color: rgba(212, 175, 55, 0.55); background: rgba(212, 175, 55, 0.16); color: var(--kolbeh-purple); } body.kolbeh-body .od-track__step--active .od-track__node { border-color: var(--kolbeh-purple); background: rgba(212, 175, 55, 0.22); color: #fff; box-shadow: 0 0 20px rgba(212, 175, 55, 0.35); transform: scale(1.06); } body.kolbeh-body .od-track__label { font-size: 0.68rem; font-weight: 600; color: rgba(255, 255, 255, 0.38); line-height: 1.3; max-width: 5.5rem; } body.kolbeh-body .od-track__step--done .od-track__label, body.kolbeh-body .od-track__step--active .od-track__label { color: rgba(232, 204, 106, 0.88); } body.kolbeh-body .od-track__line { flex: 1; height: 2px; margin-top: 1.2rem; min-width: 0.5rem; background: rgba(212, 175, 55, 0.14); border-radius: 2px; } body.kolbeh-body .od-track__line--done { background: linear-gradient( 90deg, rgba(212, 175, 55, 0.35), rgba(212, 175, 55, 0.75) ); } body.kolbeh-body .od-quick-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr)); gap: 0.65rem; padding-top: 1rem; border-top: 1px solid rgba(212, 175, 55, 0.12); } body.kolbeh-body .od-quick-stat { display: flex; align-items: flex-start; gap: 0.65rem; padding: 0.7rem 0.8rem; border-radius: 13px; background: rgba(8, 14, 28, 0.55); border: 1px solid rgba(212, 175, 55, 0.1); } body.kolbeh-body .od-quick-stat > i { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 10px; flex-shrink: 0; background: rgba(212, 175, 55, 0.1); border: 1px solid rgba(212, 175, 55, 0.2); color: var(--kolbeh-purple); font-size: 0.88rem; } body.kolbeh-body .od-quick-stat > div { min-width: 0; display: flex; flex-direction: column; gap: 0.1rem; } body.kolbeh-body .od-quick-stat__label { font-size: 0.66rem; font-weight: 600; color: rgba(232, 204, 106, 0.62); } body.kolbeh-body .od-quick-stat strong { font-size: 0.82rem; font-weight: 700; color: #fff; line-height: 1.35; } body.kolbeh-body .od-quick-stat small { font-size: 0.68rem; color: rgba(255, 255, 255, 0.42); } body.kolbeh-body .od-quick-stat--tracking strong { font-family: ui-monospace, monospace; letter-spacing: 0.04em; } body.kolbeh-body .od-cards-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; margin-top: 0.25rem; } @media (min-width: 992px) { body.kolbeh-body .od-cards-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; } body.kolbeh-body .od-cards-grid:not(:has(.od-address)) { grid-template-columns: repeat(2, minmax(0, 1fr)); } body.kolbeh-body .od-cards-grid .od-product { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto; justify-items: center; text-align: center; gap: 0.65rem; } body.kolbeh-body .od-cards-grid .od-product__media { width: 100%; max-width: 120px; height: 120px; } body.kolbeh-body .od-cards-grid .od-product__body { width: 100%; } body.kolbeh-body .od-cards-grid .od-product__pricing { justify-content: center; } body.kolbeh-body .od-cards-grid .od-product__total { width: 100%; padding-top: 0.55rem; border-top: 1px dashed rgba(212, 175, 55, 0.14); display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; text-align: start; } } body.kolbeh-body .od-cards-grid__col { min-width: 0; height: 100%; display: flex; flex-direction: column; } body.kolbeh-body .od-cards-grid .od-section, body.kolbeh-body .od-cards-grid .od-invoice, body.kolbeh-body .od-cards-grid .od-address { flex: 1 1 auto; display: flex; flex-direction: column; } body.kolbeh-body .od-cards-grid .od-products, body.kolbeh-body .od-cards-grid .od-invoice__rows { flex: 1 1 auto; } body.kolbeh-body .od-cards-grid .od-invoice__grand { margin-top: auto; } body.kolbeh-body .od-aside-actions { margin-top: 1rem; } body.kolbeh-body .od-section { border-radius: 18px; border: 1px solid rgba(212, 175, 55, 0.22); background: linear-gradient( 165deg, rgba(18, 28, 52, 0.94) 0%, rgba(10, 18, 36, 0.97) 100% ); box-shadow: 0 14px 36px rgba(0, 0, 0, 0.32); overflow: hidden; } body.kolbeh-body .od-section__head { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.95rem 1.15rem; border-bottom: 1px solid rgba(212, 175, 55, 0.12); } body.kolbeh-body .od-section__title { margin: 0; display: flex; align-items: center; gap: 0.5rem; font-size: 0.95rem; font-weight: 700; color: var(--kolbeh-purple); } body.kolbeh-body .od-section__title i { font-size: 1rem; opacity: 0.9; } body.kolbeh-body .od-section__badge { display: inline-grid; place-items: center; min-width: 1.65rem; height: 1.65rem; padding: 0 0.4rem; border-radius: 999px; font-size: 0.74rem; font-weight: 700; color: var(--kolbeh-purple); background: rgba(212, 175, 55, 0.12); border: 1px solid rgba(212, 175, 55, 0.28); } body.kolbeh-body .od-products { display: flex; flex-direction: column; gap: 0.65rem; padding: 0.85rem; } body.kolbeh-body .od-product { display: grid; grid-template-columns: 88px 1fr auto; align-items: center; gap: 0.9rem 1rem; padding: 0.85rem 0.95rem; border-radius: 16px; background: rgba(8, 14, 28, 0.5); border: 1px solid rgba(212, 175, 55, 0.12); transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease; } body.kolbeh-body .od-product:hover { border-color: rgba(212, 175, 55, 0.28); transform: translateY(-1px); box-shadow: 0 8px 22px rgba(0, 0, 0, 0.22); } body.kolbeh-body .od-product__media { display: block; width: 88px; height: 88px; border-radius: 14px; overflow: hidden; flex-shrink: 0; background: rgba(10, 18, 36, 0.75); border: 1px solid rgba(212, 175, 55, 0.16); text-decoration: none; } body.kolbeh-body .od-product__media img { width: 100%; height: 100%; object-fit: contain; padding: 0.4rem; } body.kolbeh-body .od-product__body { min-width: 0; } body.kolbeh-body .od-product__name { display: block; margin: 0 0 0.45rem; font-size: 0.9rem; font-weight: 600; color: #fff; text-decoration: none; line-height: 1.5; } a.od-product__name:hover, a.od-product__name:focus { color: var(--kolbeh-purple) !important; } body.kolbeh-body .od-product__pricing { display: flex; align-items: center; gap: 0.45rem; flex-wrap: wrap; } body.kolbeh-body .od-product__qty-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 1.75rem; padding: 0.15rem 0.45rem; border-radius: 8px; font-size: 0.72rem; font-weight: 700; color: var(--kolbeh-purple); background: rgba(212, 175, 55, 0.12); border: 1px solid rgba(212, 175, 55, 0.24); } body.kolbeh-body .od-product__unit { font-size: 0.78rem; color: rgba(255, 255, 255, 0.5); } body.kolbeh-body .od-product__total { display: flex; flex-direction: column; align-items: flex-end; gap: 0.15rem; text-align: end; } body.kolbeh-body .od-product__total-label { font-size: 0.66rem; font-weight: 600; color: rgba(232, 204, 106, 0.55); } body.kolbeh-body .od-product__total strong { font-size: 0.95rem; font-weight: 800; color: var(--kolbeh-purple); white-space: nowrap; } body.kolbeh-body .od-aside { position: sticky; top: 5.5rem; display: flex; flex-direction: column; gap: 1rem; } body.kolbeh-body .od-invoice, body.kolbeh-body .od-address { border-radius: 18px; border: 1px solid rgba(212, 175, 55, 0.22); background: linear-gradient( 165deg, rgba(18, 28, 52, 0.94) 0%, rgba(10, 18, 36, 0.97) 100% ); box-shadow: 0 14px 36px rgba(0, 0, 0, 0.32); overflow: hidden; } body.kolbeh-body .od-invoice__head { display: flex; align-items: center; gap: 0.55rem; padding: 0.95rem 1.1rem; border-bottom: 1px solid rgba(212, 175, 55, 0.12); } body.kolbeh-body .od-invoice__head i { color: var(--kolbeh-purple); font-size: 1.1rem; } body.kolbeh-body .od-invoice__head h2 { margin: 0; font-size: 0.92rem; font-weight: 700; color: var(--kolbeh-purple); } body.kolbeh-body .od-invoice__rows { display: flex; flex-direction: column; gap: 0.55rem; padding: 0.9rem 1.1rem 0.5rem; } body.kolbeh-body .od-invoice__row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; font-size: 0.82rem; color: rgba(255, 255, 255, 0.68); } body.kolbeh-body .od-invoice__row--discount span:last-child { color: #6ee7b7; } body.kolbeh-body .od-invoice__grand { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 0.35rem 0.85rem 0.85rem; padding: 0.95rem 1rem; border-radius: 14px; background: linear-gradient( 135deg, rgba(212, 175, 55, 0.16) 0%, rgba(212, 175, 55, 0.06) 100% ); border: 1px solid rgba(212, 175, 55, 0.3); } body.kolbeh-body .od-invoice__grand span { font-size: 0.88rem; font-weight: 700; color: #fff; } body.kolbeh-body .od-invoice__grand strong { font-size: 1.12rem; font-weight: 800; color: var(--kolbeh-purple); } body.kolbeh-body .od-invoice__row--wallet { margin-top: 0.5rem; padding-top: 0.65rem; border-top: 1px solid rgba(124, 58, 237, 0.14); } body.kolbeh-body .od-invoice__grand--remaining { margin-top: 0.5rem; background: rgba(220, 53, 69, 0.08); border-color: rgba(220, 53, 69, 0.2); color: #b42318; } body.kolbeh-body .od-invoice__grand--remaining strong { color: #b42318; } body.kolbeh-body .od-notice.od-notice--payment .od-payment-countdown { width: 100%; margin-bottom: 0.15rem; } body.kolbeh-body .od-payment-countdown { display: flex; align-items: center; gap: 0.85rem; padding: 0.75rem 0.85rem; border-radius: 12px; background: rgba(124, 58, 237, 0.06); border: 1px solid rgba(124, 58, 237, 0.14); } body.kolbeh-body .od-payment-countdown__timer { flex-shrink: 0; } body.kolbeh-body .od-payment-countdown__label { display: block; font-size: 0.88rem; font-weight: 700; color: var(--kolbeh-purple-dark); } body.kolbeh-body .od-payment-countdown__hint { margin: 0.2rem 0 0; font-size: 0.8rem; color: var(--kolbeh-text-muted); line-height: 1.5; } body.kolbeh-body .pr-sheet__section--retry .od-payment-countdown { margin-bottom: 0.85rem; } body.kolbeh-body .order-wallet-pay-form { display: flex; flex-direction: column; gap: 0.75rem; } body.kolbeh-body .order-wallet-pay-form__toggle .form-check-label { font-size: 0.88rem; font-weight: 600; cursor: pointer; } body.kolbeh-body .order-wallet-pay-form__breakdown { display: flex; flex-direction: column; gap: 0.45rem; padding: 0.65rem 0.75rem; border-radius: 12px; background: rgba(124, 58, 237, 0.05); border: 1px solid rgba(124, 58, 237, 0.12); } body.kolbeh-body .order-wallet-pay-form__row { display: flex; justify-content: space-between; gap: 0.75rem; font-size: 0.86rem; } body.kolbeh-body .order-wallet-pay-form__row--total { font-weight: 700; color: var(--kolbeh-purple-dark); } body.kolbeh-body .order-wallet-pay-form__row--wallet { padding-bottom: 0.55rem; border-bottom: 1px solid rgba(124, 58, 237, 0.14); } body.kolbeh-body .order-wallet-pay-form__row--remaining strong { color: #b42318; } body.kolbeh-body .od-notice__action .order-wallet-pay-form, body.kolbeh-body .account-recent-order-card__actions .order-wallet-pay-form { min-width: 220px; } body.kolbeh-body .od-pay-sheet__wallet { padding: 0 1rem 1rem; } body.kolbeh-body .pr-sheet__section--retry .order-wallet-pay-form { margin-top: 0.25rem; } body.kolbeh-body .od-address { padding: 1rem 1.1rem 1.1rem; } body.kolbeh-body .od-address__head { display: flex; align-items: flex-start; gap: 0.7rem; margin-bottom: 0.75rem; } body.kolbeh-body .od-address__icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; flex-shrink: 0; background: rgba(212, 175, 55, 0.12); border: 1px solid rgba(212, 175, 55, 0.28); color: var(--kolbeh-purple); font-size: 1.05rem; } body.kolbeh-body .od-address__title { margin: 0; font-size: 0.9rem; font-weight: 700; color: var(--kolbeh-purple); line-height: 1.35; } body.kolbeh-body .od-address__box { padding: 0.8rem 0.9rem; border-radius: 12px; background: rgba(8, 14, 28, 0.55); border: 1px solid rgba(212, 175, 55, 0.1); } body.kolbeh-body .od-address__line { margin: 0; color: rgba(255, 255, 255, 0.74); line-height: 1.75; font-size: 0.84rem; } body.kolbeh-body .od-address__line + .od-address__line { margin-top: 0.4rem; padding-top: 0.4rem; border-top: 1px dashed rgba(212, 175, 55, 0.1); } body.kolbeh-body .od-address__line:first-child { font-weight: 600; color: rgba(255, 255, 255, 0.88); } body.kolbeh-body .od-address__postal { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; margin-top: 0.65rem; padding-top: 0.65rem; border-top: 1px dashed rgba(212, 175, 55, 0.14); font-size: 0.78rem; color: rgba(255, 255, 255, 0.52); } body.kolbeh-body .od-address__postal strong { color: #fff; font-weight: 700; } body.kolbeh-body .od-aside-actions { display: flex; justify-content: stretch; } body.kolbeh-body .od-aside-actions form { width: 100%; } body.kolbeh-body .od-cancel-btn { width: 100%; justify-content: center; gap: 0.4rem; } body.kolbeh-body .od-notice .account-order-pay-btn { width: auto; } body.kolbeh-body .od-notice { background: linear-gradient(135deg, #fff9eb 0%, #ffffff 60%, #f8fafc 100%); border-color: rgba(201, 162, 39, 0.35); box-shadow: 0 10px 28px rgba(12, 24, 48, 0.08); } body.kolbeh-body .od-notice__icon { background: rgba(201, 162, 39, 0.14); border-color: rgba(201, 162, 39, 0.35); color: #7a5c0f; } body.kolbeh-body .od-notice__title { color: #1a2234; } body.kolbeh-body .od-notice__text { color: #64748b; } body.kolbeh-body .od-pay-sheet--compact { background: #fff; border-color: rgba(201, 162, 39, 0.28); box-shadow: 0 8px 24px rgba(12, 24, 48, 0.08); } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__toolbar { border-bottom-color: rgba(42, 52, 72, 0.08); background: linear-gradient(180deg, #fff9eb 0%, #fff 100%); } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__title { color: #1a2234; } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__text { color: #64748b; } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__pill { color: #475569; background: #f8fafc; border-color: rgba(42, 52, 72, 0.08); } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__pill--gold { color: #7a5c0f; background: rgba(201, 162, 39, 0.12); border-color: rgba(201, 162, 39, 0.28); } body.kolbeh-body .od-bank-row { background: #f8fafc; border-color: rgba(42, 52, 72, 0.08); } body.kolbeh-body .od-bank-row__label { color: #94a3b8; } body.kolbeh-body .od-bank-row__value code, body.kolbeh-body .od-bank-row__holder { color: #1a2234; } body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__section--upload { background: rgba(201, 162, 39, 0.04); } body.kolbeh-body .od-pay-sheet { background: linear-gradient(165deg, #ffffff 0%, #f8fafc 55%, #fff9eb 100%); border-color: rgba(201, 162, 39, 0.32); box-shadow: 0 14px 40px rgba(12, 24, 48, 0.1); } body.kolbeh-body .od-pay-sheet__timer-block { background: rgba(201, 162, 39, 0.1); border-color: rgba(201, 162, 39, 0.28); } body.kolbeh-body .od-pay-sheet__timer-label { color: #64748b; } body.kolbeh-body .od-pay-sheet__timer-digital { color: #1a2234; } body.kolbeh-body .od-pay-sheet__timer-block:has(.is-urgent) .od-pay-sheet__timer-digital { color: #c82333; } body.kolbeh-body .od-pay-sheet__timer-hint { color: #64748b; } body.kolbeh-body .od-pay-sheet__title { color: #1a2234; } body.kolbeh-body .od-pay-sheet__text { color: #64748b; } body.kolbeh-body .od-pay-sheet__amount { background: rgba(201, 162, 39, 0.1); border-color: rgba(201, 162, 39, 0.28); } body.kolbeh-body .od-pay-sheet__amount-label { color: #64748b; } body.kolbeh-body .od-pay-sheet__amount-value { color: #7a5c0f; } body.kolbeh-body .od-pay-sheet__chip { background: #fff; border-color: rgba(42, 52, 72, 0.08); } body.kolbeh-body .od-pay-sheet__chip-label { color: #94a3b8; } body.kolbeh-body .od-pay-sheet__chip-value { color: #1a2234; } body.kolbeh-body .od-pay-sheet__section { border-top-color: rgba(42, 52, 72, 0.08); } body.kolbeh-body .od-pay-sheet__section--upload { background: rgba(201, 162, 39, 0.06); } body.kolbeh-body .od-pay-sheet__section-title { color: #1a2234; } body.kolbeh-body .od-pay-sheet__note { color: #64748b; background: #fff; border-color: rgba(42, 52, 72, 0.08); } body.kolbeh-body .od-pay-sheet .pr-upload-widget__picker { background: #fff; border-color: rgba(201, 162, 39, 0.4); } body.kolbeh-body .od-pay-sheet .pr-upload-widget__picker-text { color: #475569; } body.kolbeh-body .od-pay-sheet .pr-upload-widget__hint { color: #94a3b8; } body.kolbeh-body .account-table__pay-btn, body.kolbeh-body .account-order-pay-btn { color: #ffffff; background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%); box-shadow: 0 4px 14px rgba(124, 58, 237, 0.28); } body.kolbeh-body .account-table__pay-btn > *, body.kolbeh-body .account-order-pay-btn > *, body.kolbeh-body .account-table__pay-btn i, body.kolbeh-body .account-order-pay-btn i { color: #ffffff; } body.kolbeh-body .account-table__pay-btn:hover, body.kolbeh-body .account-table__pay-btn:focus, body.kolbeh-body .account-order-pay-btn:hover, body.kolbeh-body .account-order-pay-btn:focus { color: #ffffff; background: linear-gradient(135deg, #6d28d9 0%, #5b21b6 100%); box-shadow: 0 6px 18px rgba(124, 58, 237, 0.34); } body.kolbeh-body .od-status-card { background: linear-gradient(168deg, #fffef8 0%, #fff9eb 22%, #ffffff 100%); border-color: rgba(201, 162, 39, 0.28); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.95) inset, 0 14px 38px rgba(12, 24, 48, 0.09); } body.kolbeh-body .od-status-card__label, body.kolbeh-body .od-quick-stat__label, body.kolbeh-body .od-product__total-label { color: #7a5c0f; } body.kolbeh-body .od-status-card__number, body.kolbeh-body .od-quick-stat strong, body.kolbeh-body .od-invoice__grand span { color: #1a2234; } body.kolbeh-body .od-status-card__cancelled { background: #fef2f2; border-color: rgba(239, 68, 68, 0.28); color: #b91c1c; } body.kolbeh-body .od-status-card__complete { background: #ecfdf5; border-color: rgba(16, 185, 129, 0.28); color: #047857; } body.kolbeh-body .od-status-card__complete > i { color: #059669; } body.kolbeh-body .od-status-card__shipping { background: #eff6ff; border-color: rgba(59, 130, 246, 0.24); color: #1d4ed8; } body.kolbeh-body .od-status-card__shipping > i { color: #2563eb; } body.kolbeh-body .od-status-strip { background: linear-gradient(165deg, #ffffff 0%, #f5f8fc 100%); border-color: rgba(72, 96, 140, 0.12); box-shadow: 0 4px 16px rgba(12, 24, 51, 0.06); } body.kolbeh-body .od-status-strip__hint, body.kolbeh-body .od-status-strip__label { color: #6b7a94; } body.kolbeh-body .od-status-strip__dot--done + .od-status-strip__label, body.kolbeh-body .od-status-strip__dot--active + .od-status-strip__label { color: #6b5418; } body.kolbeh-body .od-status-strip__banner--complete { background: #ecfdf5; border-color: rgba(16, 185, 129, 0.24); color: #047857; } body.kolbeh-body .od-status-strip__banner--shipping { background: #eff6ff; border-color: rgba(59, 130, 246, 0.22); color: #1d4ed8; } body.kolbeh-body .od-status-strip__banner--cancelled { background: #fef2f2; border-color: rgba(239, 68, 68, 0.22); color: #b91c1c; } body.kolbeh-body .od-status-strip__dot { background: rgba(124, 58, 237, 0.18); } body.kolbeh-body .od-status-strip__dot--active { background: var(--kolbeh-purple); box-shadow: 0 0 0 4px rgba(124, 58, 237, 0.18); } body.kolbeh-body .od-status-strip__line { background: rgba(124, 58, 237, 0.14); } body.kolbeh-body .od-status-strip__line--done { background: rgba(124, 58, 237, 0.42); } body.kolbeh-body .od-invoice--aside, body.kolbeh-body .od-address--aside, body.kolbeh-body .od-meta-card { background: #fff; border-color: rgba(72, 96, 140, 0.12); box-shadow: 0 4px 16px rgba(12, 24, 51, 0.05); } body.kolbeh-body .od-meta-card__label, body.kolbeh-body .od-product__sku { color: #6b7a94; } body.kolbeh-body .od-meta-card__item strong { color: #0c1833; } body.kolbeh-body .od-page-head__number { color: #8a6a12; } body.kolbeh-body .od-track__node { background: #f8fafc; border-color: rgba(15, 26, 50, 0.16); color: #94a3b8; } body.kolbeh-body .od-track__step--done .od-track__node { background: rgba(15, 26, 50, 0.06); border-color: rgba(15, 26, 50, 0.35); color: #0f1a32; box-shadow: none; transform: none; } body.kolbeh-body .od-track__step--active .od-track__node { background: #0f1a32; border-color: #0f1a32; color: #fff; box-shadow: 0 8px 20px rgba(15, 26, 50, 0.22); transform: scale(1.06); } body.kolbeh-body .od-track__label { color: #94a3b8; } body.kolbeh-body .od-track__step--done .od-track__label, body.kolbeh-body .od-track__step--active .od-track__label { color: #0f1a32; font-weight: 700; } body.kolbeh-body .od-track__line { background: rgba(15, 26, 50, 0.12); } body.kolbeh-body .od-track__line--done { background: linear-gradient( 90deg, rgba(15, 26, 50, 0.28), rgba(15, 26, 50, 0.72) ); } body.kolbeh-body .od-quick-stat { background: #f8fafc; border-color: rgba(72, 96, 140, 0.1); } body.kolbeh-body .od-quick-stat > i { background: rgba(201, 162, 39, 0.12); border-color: rgba(201, 162, 39, 0.28); color: #7a5c0f; } body.kolbeh-body .od-quick-stat small { color: #64748b; } body.kolbeh-body .od-cards-grid .od-product__total { border-top-color: rgba(15, 26, 50, 0.12); } body.kolbeh-body .od-section, body.kolbeh-body .od-invoice, body.kolbeh-body .od-address { background: #ffffff; border-color: rgba(72, 96, 140, 0.12); box-shadow: 0 10px 28px rgba(12, 24, 48, 0.07); } body.kolbeh-body .od-product { background: #f8fafc; border-color: rgba(72, 96, 140, 0.1); } body.kolbeh-body .od-product:hover { border-color: rgba(201, 162, 39, 0.28); box-shadow: 0 8px 22px rgba(12, 24, 48, 0.08); } body.kolbeh-body .od-product__media { background: #fff; border-color: rgba(72, 96, 140, 0.12); } body.kolbeh-body .od-product__name { color: #1a2234; } body.kolbeh-body a.od-product__name:hover, body.kolbeh-body a.od-product__name:focus { color: #7a5c0f !important; } body.kolbeh-body .od-product__unit { color: #64748b; } body.kolbeh-body .od-product__total strong, body.kolbeh-body .od-invoice__grand strong { color: #7a5c0f; } body.kolbeh-body .od-invoice__row { color: #475569; } body.kolbeh-body .od-invoice__grand { background: linear-gradient(145deg, #fff9eb 0%, #fffef8 100%); border-color: rgba(201, 162, 39, 0.28); } body.kolbeh-body .od-address__box { background: #f8fafc; border-color: rgba(72, 96, 140, 0.1); } body.kolbeh-body .od-address__line { color: #2a3448; } body.kolbeh-body .od-address__line:first-child { color: #0c1833; } body.kolbeh-body .od-address__line + .od-address__line { border-top-color: rgba(72, 96, 140, 0.1); } body.kolbeh-body .od-address__postal { color: #64748b; } body.kolbeh-body .od-address__postal strong { color: #1a2234; } body.kolbeh-body .account-badge--pending { color: #92400e !important; background: #fef3c7 !important; border-color: rgba(245, 158, 11, 0.35) !important; } body.kolbeh-body .account-badge--processing { color: #1e40af !important; background: #dbeafe !important; border-color: rgba(59, 130, 246, 0.3) !important; } body.kolbeh-body .account-badge--confirmed { color: #15803d !important; background: #dcfce7 !important; border-color: rgba(21, 128, 61, 0.28) !important; } body.kolbeh-body .account-badge--shipped { color: #5b21b6 !important; background: #ede9fe !important; border-color: rgba(139, 92, 246, 0.3) !important; } body.kolbeh-body .account-badge--delivered { color: #065f46 !important; background: #d1fae5 !important; border-color: rgba(16, 185, 129, 0.3) !important; } body.kolbeh-body .account-badge--cancelled { color: #991b1b !important; background: #fee2e2 !important; border-color: rgba(239, 68, 68, 0.3) !important; } body.kolbeh-body .account-badge--pay-paid { color: #065f46 !important; background: #d1fae5 !important; border-color: rgba(16, 185, 129, 0.3) !important; } body.kolbeh-body .account-badge--pay-unpaid { color: #9a3412 !important; background: #ffedd5 !important; border-color: rgba(249, 115, 22, 0.3) !important; } body.kolbeh-body .account-cancel-btn { color: #b91c1c; background: #fef2f2; border-color: rgba(239, 68, 68, 0.35); } body.kolbeh-body .account-cancel-btn:hover, body.kolbeh-body .account-cancel-btn:focus { color: #991b1b; background: #fee2e2; border-color: rgba(239, 68, 68, 0.45); } @media (max-width: 991.98px) { body.kolbeh-body .od-aside-actions { margin-top: 0.5rem; } } @media (max-width: 767.98px) { body.kolbeh-body .od-pay-sheet--compact .od-pay-sheet__toolbar { align-items: flex-start; } body.kolbeh-body .od-pay-sheet--compact .pr-upload-widget__submit { width: 100%; } body.kolbeh-body .od-pay-sheet__head { grid-template-columns: 1fr; } body.kolbeh-body .od-pay-sheet__amount { width: 100%; display: flex; align-items: center; justify-content: space-between; text-align: start; } body.kolbeh-body .od-pay-sheet__amount-label { margin-bottom: 0; } body.kolbeh-body .od-pay-sheet__timer-digital { font-size: 1.45rem; } body.kolbeh-body .od-pay-sheet .pr-upload-widget__submit { width: 100%; } body.kolbeh-body .od-notice { flex-direction: column; align-items: stretch; } body.kolbeh-body .od-notice__action .account-order-pay-btn { width: 100%; } body.kolbeh-body .od-status-strip__label { font-size: 0.58rem; max-width: 3.6rem; } body.kolbeh-body .od-product--detail { grid-template-columns: 72px minmax(0, 1fr); } body.kolbeh-body .od-product--detail .od-product__media { width: 72px; height: 72px; } body.kolbeh-body .od-product--detail .od-product__total { grid-column: 1 / -1; flex-direction: row; align-items: center; justify-content: space-between; padding-top: 0.45rem; border-top: 1px dashed rgba(212, 175, 55, 0.14); } body.kolbeh-body .od-product { grid-template-columns: 72px 1fr; } body.kolbeh-body .od-product__media { width: 72px; height: 72px; } body.kolbeh-body .od-product__total { grid-column: 1 / -1; flex-direction: row; align-items: center; justify-content: space-between; padding-top: 0.45rem; border-top: 1px dashed rgba(212, 175, 55, 0.14); } body.kolbeh-body .od-product__total, body.kolbeh-body .od-product--detail .od-product__total { border-top-color: rgba(72, 96, 140, 0.1); } } body.kolbeh-body .account-content .pagination { margin-top: 1.25rem; } @media (max-width: 991.98px) { body.kolbeh-body .account-layout > .row > .col-lg-3, body.kolbeh-body .container > .row > .col-lg-3.mb-4 { display: none; } body.kolbeh-body .account-layout > .row > .col-lg-9, body.kolbeh-body .container > .row > .col-lg-9 { flex: 0 0 100%; max-width: 100%; } body.kolbeh-body .account-sidebar { position: static; } body.kolbeh-body .account-order-meta__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 575.98px) { body.kolbeh-body .account-order-meta__grid { grid-template-columns: 1fr; } body.kolbeh-body .account-order-summary__rows { width: 100%; } } @media (max-width: 767.98px) { body.kolbeh-body .account-table thead { display: none; } body.kolbeh-body .account-table tbody tr { display: block; padding: 0.85rem 1rem; border-bottom: 1px solid rgba(212, 175, 55, 0.1); } body.kolbeh-body .account-table tbody tr:last-child { border-bottom: 0; } body.kolbeh-body .account-table tbody td { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 0.35rem; padding: 0.42rem 0; border: 0; } body.kolbeh-body .account-table tbody td::before { content: attr(data-label); display: block; font-size: 0.72rem; font-weight: 600; color: rgba(232, 204, 106, 0.7); flex-shrink: 0; margin-bottom: 0.1rem; } body.kolbeh-body .account-table__actions-head { display: none; } body.kolbeh-body .account-table__actions { justify-content: flex-end; padding-top: 0.65rem; } body.kolbeh-body .account-table__actions::before { display: none; } } .payment-receipt-upload__controls { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; } .payment-receipt-upload__controls .form-control { flex: 1 1 220px; } .payment-receipt-upload__status { display: flex; gap: 0.75rem; align-items: flex-start; } .payment-receipt-drop { position: relative; } .payment-receipt-drop__input { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; } .payment-receipt-drop__label { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.45rem; position: relative; min-height: 130px; padding: 1.25rem 1rem; border-radius: 16px; border: 2px dashed rgba(212, 175, 55, 0.45); background: rgba(212, 175, 55, 0.07); cursor: pointer; text-align: center; transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease; } .payment-receipt-drop__label:hover, .payment-receipt-drop.is-dragover .payment-receipt-drop__label { border-color: rgba(212, 175, 55, 0.7); background: rgba(212, 175, 55, 0.12); box-shadow: 0 0 0 4px rgba(212, 175, 55, 0.1); } .payment-receipt-drop__label i { font-size: 1.6rem; color: var(--elco-gold-bright, #e8cc6a); } .payment-receipt-drop__text { font-size: 0.86rem; color: rgba(255, 255, 255, 0.72); } .payment-receipt-drop__filename { font-size: 0.78rem; color: var(--elco-gold-bright, #e8cc6a); font-weight: 600; min-height: 1.2em; } .payment-receipt-drop__hint { font-size: 0.78rem; color: rgba(255, 255, 255, 0.42); margin: 0; } .payment-receipt-upload__submit { width: 100%; } .payment-receipt-upload--required { display: flex; flex-direction: column; gap: 1rem; } .payment-receipt-upload__callout { display: flex; gap: 0.85rem; align-items: flex-start; padding: 1rem 1.1rem; border-radius: 14px; border: 1px solid rgba(255, 193, 7, 0.42); background: linear-gradient(135deg, rgba(255, 193, 7, 0.14) 0%, rgba(212, 175, 55, 0.08) 100%); } .payment-receipt-upload__callout-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; flex-shrink: 0; background: rgba(255, 193, 7, 0.18); border: 1px solid rgba(255, 193, 7, 0.35); color: #ffc107; font-size: 1.1rem; } .payment-receipt-upload__badge { display: inline-flex; align-items: center; padding: 0.15rem 0.55rem; margin-bottom: 0.35rem; border-radius: 999px; font-size: 0.7rem; font-weight: 800; background: rgba(220, 53, 69, 0.18); border: 1px solid rgba(255, 107, 122, 0.45); color: #ff8a96; } .payment-receipt-upload__callout-title { display: block; font-size: 0.95rem; font-weight: 800; color: #fff; margin-bottom: 0.3rem; } .payment-receipt-upload__callout-text { margin: 0; font-size: 0.84rem; line-height: 1.65; color: rgba(255, 255, 255, 0.72); } .payment-receipt-upload__steps { display: flex; flex-direction: column; gap: 0.55rem; list-style: none; margin: 0; padding: 0; } .payment-receipt-upload__step { display: flex; align-items: center; gap: 0.65rem; font-size: 0.84rem; color: rgba(255, 255, 255, 0.55); } .payment-receipt-upload__step--done { color: rgba(93, 211, 158, 0.85); } .payment-receipt-upload__step--active { color: #fff; } .payment-receipt-upload__step-num { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0; font-size: 0.78rem; font-weight: 800; border: 1px solid rgba(255, 255, 255, 0.14); background: rgba(255, 255, 255, 0.05); } .payment-receipt-upload__step--done .payment-receipt-upload__step-num { background: rgba(25, 135, 84, 0.18); border-color: rgba(93, 211, 158, 0.35); color: #5dd39e; } .payment-receipt-upload__step--active .payment-receipt-upload__step-num { background: rgba(212, 175, 55, 0.2); border-color: rgba(212, 175, 55, 0.5); color: var(--elco-gold-bright, #e8cc6a); box-shadow: 0 0 0 4px rgba(212, 175, 55, 0.12); } .payment-receipt-drop__required-dot { position: absolute; top: 0.75rem; inset-inline-end: 0.85rem; width: 10px; height: 10px; border-radius: 50%; background: #ff6b7a; box-shadow: 0 0 0 4px rgba(255, 107, 122, 0.25); } .payment-receipt-drop__title { font-size: 0.92rem; font-weight: 800; color: #fff; } .payment-receipt-upload__submit { font-weight: 800; } .payment-receipt-upload__status-text { font-size: 0.82rem; color: rgba(255, 255, 255, 0.58); margin-top: 0.2rem; } .od-notice__upload .pr-upload-widget__row { display: flex; flex-wrap: wrap; gap: 0.5rem; } .od-notice__upload .pr-upload-widget__picker { flex: 1 1 12rem; display: flex; align-items: center; gap: 0.45rem; min-height: 40px; padding: 0.4rem 0.65rem; border-radius: 10px; border: 1px dashed rgba(212, 175, 55, 0.35); background: rgba(0, 0, 0, 0.12); cursor: pointer; margin: 0; } .od-notice__upload .pr-upload-widget__picker i { color: var(--elco-gold-bright, #e8cc6a); } .od-notice__upload .pr-upload-widget__picker-text { flex: 1; min-width: 0; font-size: 0.76rem; color: rgba(255, 255, 255, 0.6); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .od-notice__upload .pr-upload-widget__submit { font-size: 0.78rem; font-weight: 700; border-radius: 10px; white-space: nowrap; } .od-notice__upload .pr-upload-widget__hint { font-size: 0.68rem; color: rgba(255, 255, 255, 0.38); margin: 0.4rem 0 0; } .od-notice__upload .pr-upload-widget__alert { margin-bottom: 0.6rem; padding: 0.5rem 0.65rem; border-radius: 8px; border: 1px solid rgba(255, 193, 7, 0.25); background: rgba(255, 193, 7, 0.06); font-size: 0.76rem; color: rgba(255, 255, 255, 0.55); } .od-notice__upload .pr-upload-widget__input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; } .od-notice__upload .pr-upload-widget__done { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.7rem; border-radius: 10px; border: 1px solid rgba(93, 211, 158, 0.3); background: rgba(25, 135, 84, 0.08); } .od-notice__upload .pr-upload-widget__done i { color: #5dd39e; } .od-notice__upload .pr-upload-widget__view { font-size: 0.76rem; color: var(--elco-gold-bright, #e8cc6a); } body.kolbeh-body .account-ticket-attach { margin-top: 0.65rem; } body.kolbeh-body .account-ticket-attach__picker { display: flex; flex-wrap: wrap; align-items: center; gap: 0.45rem 0.65rem; padding: 0.55rem 0.75rem; border-radius: 12px; border: 1px dashed rgba(201, 162, 39, 0.35); background: rgba(201, 162, 39, 0.06); cursor: pointer; transition: border-color 0.15s, background 0.15s; } body.kolbeh-body .account-ticket-attach__picker:hover { border-color: rgba(201, 162, 39, 0.55); background: rgba(201, 162, 39, 0.1); } body.kolbeh-body .account-ticket-attach__input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; clip: rect(0, 0, 0, 0); } body.kolbeh-body .account-ticket-attach__picker-icon { color: var(--elco-gold-bright, #e8cc6a); font-size: 1rem; } body.kolbeh-body .account-ticket-attach__picker-text { font-size: 0.82rem; font-weight: 600; color: rgba(255, 255, 255, 0.88); } body.kolbeh-body .account-ticket-attach__filename { font-size: 0.74rem; color: rgba(255, 255, 255, 0.55); max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } body.kolbeh-body .account-ticket-attach__hint { margin: 0.35rem 0 0; font-size: 0.72rem; color: rgba(255, 255, 255, 0.45); } body.kolbeh-body .account-ticket-attach-preview { margin-top: 0.55rem; } body.kolbeh-body .account-ticket-attach-preview__image { display: block; max-width: min(100%, 280px); max-height: 200px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, 0.12); object-fit: cover; } body.kolbeh-body .account-ticket-attach-preview__file { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.45rem 0.65rem; border-radius: 10px; border: 1px solid rgba(201, 162, 39, 0.28); background: rgba(201, 162, 39, 0.1); color: var(--elco-gold-bright, #e8cc6a); font-size: 0.78rem; font-weight: 600; text-decoration: none; } body.kolbeh-body .account-ticket-attach-preview__file:hover { background: rgba(201, 162, 39, 0.16); color: #fff; } body.kolbeh-body .account-ticket-attach__picker { border-color: rgba(201, 162, 39, 0.35); background: rgba(201, 162, 39, 0.08); } body.kolbeh-body .account-ticket-attach__picker-text { color: #0c1833; } body.kolbeh-body .account-ticket-attach__filename, body.kolbeh-body .account-ticket-attach__hint { color: rgba(12, 24, 51, 0.55); } body.kolbeh-body .account-layout { max-width: 1200px; } body.kolbeh-body .account-page-title { color: var(--kolbeh-purple-dark) !important; } body.kolbeh-body .account-page-subtitle { color: var(--kolbeh-text-muted) !important; } body.kolbeh-body .account-panel { background: var(--kolbeh-white) !important; border: 1px solid rgba(124, 58, 237, 0.14) !important; box-shadow: var(--kolbeh-shadow-card) !important; color: var(--kolbeh-text) !important; } body.kolbeh-body .account-panel__title, body.kolbeh-body .account-orders-section__title { color: var(--kolbeh-purple-dark) !important; } body.kolbeh-body .account-panel__more { color: var(--kolbeh-purple) !important; border-color: rgba(124, 58, 237, 0.22) !important; background: var(--kolbeh-purple-light) !important; } body.kolbeh-body .account-recent-order-card, body.kolbeh-body .account-order-card { background: var(--kolbeh-white) !important; border-color: rgba(124, 58, 237, 0.14) !important; box-shadow: inset 3px 0 0 var(--kolbeh-purple) !important; color: var(--kolbeh-text) !important; } body.kolbeh-body .account-recent-order-card__no, body.kolbeh-body .account-order-card__hint, body.kolbeh-body .account-order-card__items, body.kolbeh-body .account-recent-order-card__date { color: var(--kolbeh-text-muted) !important; } body.kolbeh-body .account-recent-order-card__total, body.kolbeh-body .account-order-card__total-label { color: var(--kolbeh-purple-dark) !important; } body.kolbeh-body .account-orders-filter { background: var(--kolbeh-white) !important; border-color: rgba(124, 58, 237, 0.12) !important; } body.kolbeh-body .account-orders-filter__tab { color: var(--kolbeh-text-muted) !important; } body.kolbeh-body .account-orders-filter__tab--active { color: var(--kolbeh-purple-dark) !important; background: var(--kolbeh-purple-light) !important; border-color: rgba(124, 58, 237, 0.28) !important; } body.kolbeh-body .account-empty__title { color: var(--kolbeh-purple-dark) !important; } body.kolbeh-body .account-empty__text, body.kolbeh-body .account-recent-orders__empty { color: var(--kolbeh-text-muted) !important; } body.kolbeh-body .account-empty__icon { background: var(--kolbeh-purple-light) !important; border-color: rgba(124, 58, 237, 0.2) !important; color: var(--kolbeh-purple) !important; } body.kolbeh-body .account-back-btn { color: var(--kolbeh-purple-dark) !important; background: var(--kolbeh-purple-light) !important; border: 1px solid rgba(124, 58, 237, 0.2) !important; box-shadow: none !important; } body.kolbeh-body .account-table thead th { color: var(--kolbeh-purple-dark) !important; background: var(--kolbeh-purple-light) !important; } body.kolbeh-body .account-table tbody td { color: var(--kolbeh-text) !important; border-bottom-color: rgba(124, 58, 237, 0.08) !important; } body.kolbeh-body .account-wallet-balance { background: linear-gradient(135deg, #7C3AED 0%, #6D28D9 100%) !important; } body.kolbeh-body .account-profile-hero__name { color: var(--kolbeh-purple-dark) !important; } body.kolbeh-body .account-address-card, body.kolbeh-body .account-wishlist-card, body.kolbeh-body .account-notification-card, body.kolbeh-body .account-ticket-card { background: var(--kolbeh-white) !important; border-color: rgba(124, 58, 237, 0.12) !important; } body.kolbeh-body .account-mobile-nav { display: none; } @media (max-width: 991.98px) { body.kolbeh-body .account-layout { padding-top: 1rem !important; padding-bottom: 2rem !important; } body.kolbeh-body .account-layout > .row > .col-lg-3 { flex: 0 0 100%; max-width: 100%; margin-bottom: 0.25rem; } body.kolbeh-body .account-layout > .row > .col-lg-9 { flex: 0 0 100%; max-width: 100%; } body.kolbeh-body .account-sidebar { display: none !important; } body.kolbeh-body .account-mobile-nav { display: block; margin-bottom: 1rem; } body.kolbeh-body .account-mobile-nav__scroll { display: flex; gap: 0.45rem; overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; padding: 0.35rem 0.15rem 0.5rem; scrollbar-width: none; } body.kolbeh-body .account-mobile-nav__scroll::-webkit-scrollbar { display: none; } body.kolbeh-body .account-mobile-nav__link { display: inline-flex; align-items: center; gap: 0.4rem; flex-shrink: 0; padding: 0.5rem 0.85rem; border-radius: var(--kolbeh-radius-pill); border: 1px solid rgba(124, 58, 237, 0.16); background: var(--kolbeh-white); color: var(--kolbeh-text); font-size: 0.78rem; font-weight: 700; text-decoration: none; white-space: nowrap; box-shadow: var(--kolbeh-shadow-card); } body.kolbeh-body .account-mobile-nav__link.is-active { background: var(--kolbeh-purple-light); border-color: rgba(124, 58, 237, 0.3); color: var(--kolbeh-purple-dark); } body.kolbeh-body .account-mobile-nav__icon { font-size: 0.95rem; color: var(--kolbeh-purple); } body.kolbeh-body .account-page-head--split { flex-direction: column; align-items: stretch !important; } body.kolbeh-body .account-page-head--split .account-back-btn { align-self: flex-start; } body.kolbeh-body .account-orders-filter { flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; scrollbar-width: none; } body.kolbeh-body .account-orders-filter::-webkit-scrollbar { display: none; } body.kolbeh-body .account-orders-filter__tab { flex-shrink: 0; } body.kolbeh-body .account-recent-orders.account-order-cards { grid-template-columns: 1fr !important; padding: 0.75rem !important; } body.kolbeh-body .account-order-card__foot { flex-direction: column; align-items: stretch !important; } body.kolbeh-body .account-order-card__actions, body.kolbeh-body .account-recent-order-card__actions { width: 100%; } body.kolbeh-body .account-order-card__detail-btn, body.kolbeh-body .account-order-card__paybar-btn { width: 100%; justify-content: center; } body.kolbeh-body .account-address-card { flex-direction: column; } body.kolbeh-body .account-address-card__actions { width: 100%; flex-wrap: wrap; } body.kolbeh-body .account-wishlist-card { grid-template-columns: 72px 1fr !important; } body.kolbeh-body .account-profile-form__submit { width: 100%; } body.kolbeh-body .address-modal-premium__grid { grid-template-columns: 1fr !important; } body.kolbeh-body .account-wallet-tx-card { flex-direction: column; align-items: stretch !important; } body.kolbeh-body .account-ticket-bubble { max-width: 100% !important; } } @media (max-width: 575.98px) { body.kolbeh-body .account-layout .row.g-3 > [class*="col-md-4"] { flex: 0 0 100%; max-width: 100%; } body.kolbeh-body .account-page-title { font-size: 1.15rem !important; } body.kolbeh-body .account-order-card__badges { width: 100%; justify-content: flex-start !important; } body.kolbeh-body .account-order-card__head { flex-direction: column; } } @media (min-width: 992px) { body.kolbeh-body .account-sidebar { display: flex !important; } body.kolbeh-body .account-mobile-nav { display: none !important; } }