/* ======================================================
   UndigPress Base Styles
   ====================================================== */
body.undig-modal-open { overflow: hidden !important; }
.undigpress-copy-container { width: 100%; }
.undigpress-heading { margin-bottom: 15px; }
.undigpress-image { margin-bottom: 15px; display: inline-block; }
.undigpress-image img { max-width: 100%; height: auto; display: block; }
.undigpress-copy-btn { border: none; padding: 12px 24px; border-radius: 6px; cursor: pointer; font-size: 15px; font-weight: 500; transition: all 0.3s ease; display: inline-flex; align-items: center; justify-content: center; background-color: #333; color: #fff; }
.undigpress-copy-btn:hover { opacity: 0.9; }
.undigpress-copy-btn i { line-height: 1; }
.undigpress-qr-wrapper { margin: 15px 0; }

/* Carousel Styles */
.undigpress-carousel-wrapper { width: 100%; position: relative; }
.undigpress-swiper-image-wrap { display: flex; justify-content: center; align-items: center; overflow: hidden; }
.undigpress-swiper-image-wrap.stretch-image img { width: 100%; height: 100%; object-fit: cover; }
.undigpress-swiper-image { max-width: 100%; height: auto; display: block; }
.undigpress-swiper .swiper-pagination { position: relative; margin-top: 15px; }
.undigpress-swiper .swiper-button-next, .undigpress-swiper .swiper-button-prev { color: #333; transform: scale(0.7); }

/* ======================================================
   Wishes & RSVP Styles (v2.1)
   ====================================================== */
.undig-wishes-rsvp-wrapper { width: 100%; box-sizing: border-box; }
.undig-combo-form { background: #fff; padding: 25px; border-radius: 16px; font-family: inherit; box-sizing: border-box; }
.undig-field-group { margin-bottom: 18px; position: relative; }
.undig-input { width: 100%; padding: 14px; border: 1px solid #e0e0e0; border-radius: 10px; background: #fff; font-size: 14px; box-sizing: border-box; transition: border-color 0.2s ease, box-shadow 0.2s ease; }
.undig-input:focus { outline: none; border-color: #333; box-shadow: 0 0 0 2px rgba(0,0,0,0.05); }

/* Radio Kehadiran (Pill Buttons) */
.undig-attendance-group { display: flex; gap: 10px; flex-wrap: wrap; transition: transform 0.2s ease; }
.undig-attendance-group.undig-invalid-shake { animation: undigShake 0.45s ease-in-out; }
.undig-attendance-group.undig-invalid-shake .undig-radio-btn span { border-color: #e53935; box-shadow: 0 0 0 2px rgba(229, 57, 53, 0.15); }
.undig-radio-btn { flex: 1; text-align: center; cursor: pointer; min-width: 80px; }
.undig-radio-btn input { display: none; }
.undig-radio-btn span { display: block; padding: 12px 6px; border: 1px solid #e0e0e0; border-radius: 20px; background: #fff; transition: all 0.2s ease; font-size: 13px; font-weight: 500; user-select: none; }
.undig-radio-btn input:checked + span { background: #333; color: #fff; border-color: #333; }

/* Mode Compact 2x2 Grid with Magic Inline Guest Input */
.undig-attendance-layout-compact_grid .undig-attendance-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    width: 100%;
    box-sizing: border-box;
    transition: all 0.25s ease;
}
.undig-attendance-grid.undig-invalid-shake { animation: undigShake 0.45s ease-in-out; }
.undig-attendance-grid.undig-invalid-shake .btn-box { border-color: #e53935; box-shadow: 0 0 0 2px rgba(229, 57, 53, 0.15); }

.undig-confirm-btn {
    cursor: pointer;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    outline: none;
    margin: 0;
    display: flex;
}
.undig-confirm-btn input { display: none; }
.undig-confirm-btn .btn-box {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 11px 12px;
    border-radius: 12px;
    border: 1px solid #e0e0e0;
    background: #ffffff;
    color: #333333;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.2;
    transition: all 0.25s ease;
    text-align: center;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    min-height: 44px;
}
.undig-confirm-btn .att-icon { font-size: 14px; line-height: 1; }

/* 3 Tombol (Ada Masih Ragu): Hadir span 2 secara default */
.undig-attendance-grid.has-notsure .btn-present { grid-column: span 2; }
.undig-attendance-grid.has-notsure.hadir-active .btn-present { grid-column: span 1 !important; }
.undig-attendance-grid.has-notsure .btn-notsure { grid-column: span 1; }
.undig-attendance-grid.has-notsure .btn-notpresent { grid-column: span 1; }

/* 2 Tombol (Masih Ragu Disembunyikan): Hadir & Tidak Hadir 50%-50% saat tidak aktif */
.undig-attendance-grid.has-no-notsure .btn-present { grid-column: span 1; }
.undig-attendance-grid.has-no-notsure .btn-notpresent { grid-column: span 1; }
.undig-attendance-grid.has-no-notsure.hadir-active .btn-notpresent { grid-column: span 2 !important; }

/* Warna Status Aktif Mode Compact */
.undig-attendance-grid .btn-present input:checked + .btn-box {
    background-color: var(--undig-att-present-bg, #21c05e) !important;
    border-color: var(--undig-att-present-bg, #21c05e) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(33, 192, 94, 0.22);
}
.undig-attendance-grid .btn-notsure input:checked + .btn-box {
    background-color: var(--undig-att-notsure-bg, #6c757d) !important;
    border-color: var(--undig-att-notsure-bg, #6c757d) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(108, 117, 125, 0.22);
}
.undig-attendance-grid .btn-notpresent input:checked + .btn-box {
    background-color: var(--undig-att-notpresent-bg, #dc3545) !important;
    border-color: var(--undig-att-notpresent-bg, #dc3545) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(220, 53, 69, 0.22);
}

/* Inline Guest Wrapper */
.undig-inline-guest-wrap {
    grid-column: span 1;
    animation: undigGuestFadeIn 0.28s cubic-bezier(0.16, 1, 0.3, 1);
    height: 100%;
}
.undig-inline-guest-select {
    width: 100%;
    height: 100%;
    min-height: 44px;
    padding: 10px 14px;
    padding-right: 36px;
    border-radius: 12px;
    border: 1px solid #e0e0e0;
    font-size: 13.5px;
    color: #333;
    background-color: #fff;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23555555' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 15px auto;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    box-sizing: border-box;
    cursor: pointer;
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    -webkit-tap-highlight-color: transparent;
}
.undig-inline-guest-select:focus {
    border-color: var(--undig-att-present-bg, #21c05e);
    box-shadow: 0 0 0 2px rgba(33, 192, 94, 0.15);
}
.undig-inline-stepper {
    width: 100% !important;
    height: 100% !important;
    min-height: 44px !important;
    margin: 0 !important;
    border-radius: 12px !important;
}

@keyframes undigGuestFadeIn {
    from { opacity: 0; transform: translateX(8px); }
    to { opacity: 1; transform: translateX(0); }
}

/* Quantity Stepper Capsule */
.undig-stepper-capsule { display: flex; align-items: center; justify-content: space-between; border: 1px solid #e0e0e0; border-radius: 20px; padding: 3px 6px; background: #fafafa; width: 100%; height: 42px; box-sizing: border-box; }
.undig-stepper-btn { width: 32px; height: 32px; min-width: 32px; border-radius: 50%; background: #fff; border: 1px solid #e0e0e0; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 11px; color: #333; transition: all 0.2s ease; box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
.undig-stepper-btn:hover:not(:disabled) { background: #333; color: #fff; border-color: #333; }
.undig-stepper-btn:disabled { opacity: 0.35; cursor: not-allowed; box-shadow: none; }
.undig-stepper-display { display: flex; align-items: center; justify-content: center; gap: 5px; font-weight: 700; font-size: 14px; color: #222; user-select: none; flex: 1; text-align: center; }
.undig-stepper-count { font-size: 15px; font-weight: 700; color: #111; }
.undig-stepper-unit { font-size: 13px; font-weight: 500; color: #666; }

/* Sesi Acara: Modern Pill Checkbox */
.undig-label-title { display: block; font-size: 14px; font-weight: 600; margin-bottom: 10px; color: #555; }
.undig-events-pill-group { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.undig-event-pill { cursor: pointer; user-select: none; }
.undig-event-pill input { display: none; }
.undig-event-pill-label { display: inline-flex; align-items: center; gap: 6px; padding: 9px 16px; border: 1px solid #e0e0e0; border-radius: 20px; background: #fff; font-size: 13px; font-weight: 500; color: #555; transition: all 0.2s ease; }
.undig-event-pill-label .undig-event-check-icon { font-size: 11px; opacity: 0; transform: scale(0.6); transition: all 0.2s ease; }
.undig-event-pill input:checked + .undig-event-pill-label { background: #333; color: #fff; border-color: #333; }
.undig-event-pill input:checked + .undig-event-pill-label .undig-event-check-icon { opacity: 1; transform: scale(1); }

/* Stiker Section & Preview */
.undig-sticker-section { margin-bottom: 18px; }
.undig-sticker-controls { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.undig-btn-sticker-trigger { background: #fafafa; border: 1px solid #e0e0e0; padding: 9px 16px; border-radius: 20px; cursor: pointer; font-size: 13px; font-weight: 500; display: inline-flex; align-items: center; gap: 7px; color: #444; transition: all 0.2s ease; }
.undig-btn-sticker-trigger:hover { background: #f0f0f0; border-color: #bbb; }
.undig-sticker-preview-box { display: inline-flex; align-items: center; gap: 10px; padding: 6px 12px 6px 8px; background: #f5f5f5; border: 1px solid #e0e0e0; border-radius: 12px; }
.undig-sticker-preview-box img { width: 44px; height: 44px; object-fit: contain; display: block; border-radius: 6px; }
#undig_clear_sticker { background: transparent; border: none; color: #e53935; font-size: 12px; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; padding: 4px 6px; border-radius: 6px; transition: background 0.2s; }
#undig_clear_sticker:hover { background: #ffebee; }

/* Modal Stiker Multi-Tab */
.undig-sticker-modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.55); z-index: 999999; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(4px); }
.undig-sticker-modal-content { background: #ffffff !important; width: 90%; max-width: 420px; border-radius: 20px !important; padding: 22px !important; box-shadow: 0 15px 40px rgba(0,0,0,0.2) !important; animation: undigScaleIn 0.25s ease-out; box-sizing: border-box; }
.undig-sticker-modal-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; border-bottom: 1px solid #f1f5f9; padding-bottom: 12px; }
.undig-sticker-modal-header h4 { margin: 0; font-size: 16px; font-weight: 700; color: #1e293b !important; }
.undig-sticker-close-modal { background: #f1f5f9 !important; border: none !important; outline: none !important; width: 32px !important; height: 32px !important; border-radius: 50% !important; cursor: pointer; font-size: 18px !important; line-height: 1 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; color: #64748b !important; padding: 0 !important; box-shadow: none !important; transition: all 0.2s ease !important; }
.undig-sticker-close-modal:hover { background: #e2e8f0 !important; color: #0f172a !important; }

.undig-sticker-tabs { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 8px; margin-bottom: 14px; border-bottom: 1px solid #f1f5f9; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.undig-sticker-tabs::-webkit-scrollbar { display: none; }
.undig-sticker-tab-btn { padding: 7px 16px !important; border: 1px solid #e2e8f0 !important; border-radius: 20px !important; background: #f8f9fa !important; font-size: 12.5px !important; font-weight: 600 !important; color: #475569 !important; cursor: pointer !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; white-space: nowrap !important; transition: all 0.2s ease !important; flex-shrink: 0 !important; outline: none !important; box-shadow: none !important; }
.undig-sticker-tab-btn:hover:not(.active) { background: #f1f5f9 !important; border-color: #cbd5e1 !important; color: #0f172a !important; }
.undig-sticker-tab-btn.active { background: #111111 !important; color: #ffffff !important; border-color: #111111 !important; }
.undig-tab-icon { width: 16px; height: 16px; object-fit: contain; border-radius: 3px; }

.undig-sticker-panes-wrap { width: 100%; box-sizing: border-box; }
.undig-sticker-tab-pane { display: none; }
.undig-sticker-tab-pane.active { display: block !important; animation: undigFadeIn 0.2s ease; }
.undig-sticker-tab-pane:only-child { display: block !important; }

.undig-sticker-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; max-height: 270px; overflow-y: auto; padding: 4px; box-sizing: border-box; }
.undig-sticker-option { cursor: pointer; padding: 6px; border-radius: 12px; border: 2px solid transparent; background: #fafafa; transition: all 0.2s ease; display: flex; align-items: center; justify-content: center; aspect-ratio: 1/1; box-sizing: border-box; }
.undig-sticker-option:hover { border-color: #e2e8f0; background: #f1f5f9; transform: scale(1.06); }
.undig-sticker-option img { max-width: 100%; max-height: 100%; object-fit: contain; }

/* Summary / Edit Mode Card & Success State Card */
.undig-summary-card, .undig-success-card { background: #fcfcfc; border: 1px solid #e8e8e8; padding: 22px; border-radius: 16px; margin-bottom: 20px; box-sizing: border-box; }
.undig-summary-header { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; border-bottom: 1px solid #eee; padding-bottom: 12px; }
.undig-summary-icon, .undig-success-icon { font-size: 26px; color: #2e7d32; line-height: 1; }
.undig-summary-header h4, .undig-success-card h4 { margin: 0 0 3px 0; font-size: 16px; font-weight: 700; color: #222; }
.undig-summary-header p, .undig-success-card p { margin: 0; font-size: 12.5px; color: #666; }
.undig-success-card { text-align: center; padding: 25px 20px; }
.undig-success-icon { font-size: 32px; margin-bottom: 8px; display: inline-block; }
.undig-summary-details { display: flex; flex-direction: column; gap: 8px; font-size: 13.5px; margin-bottom: 18px; }
.undig-summary-row { display: flex; gap: 8px; color: #333; }
.undig-summary-row .label { font-weight: 600; min-width: 80px; color: #666; }
.undig-summary-row .val { font-weight: 500; word-break: break-word; }
.undig-summary-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.undig-btn-action { padding: 9px 16px; border-radius: 20px; font-size: 13px; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; transition: all 0.2s ease; border: 1px solid transparent; }
.undig-btn-edit { background: #fff; border-color: #ccc; color: #333; }
.undig-btn-edit:hover { background: #f5f5f5; border-color: #999; }

/* Closed Notice Card */
.undig-closed-card { background: #fafafa; border: 1px solid #e0e0e0; padding: 25px; border-radius: 16px; text-align: center; margin-bottom: 20px; }
.undig-closed-icon { font-size: 32px; color: #888; margin-bottom: 10px; }
.undig-closed-card h4 { margin: 0 0 8px 0; font-size: 17px; font-weight: 700; color: #333; }
.undig-closed-card p { margin: 0; font-size: 13.5px; color: #666; line-height: 1.5; }

/* Counter Total Ucapan */
.undig-wishes-counter { margin: 20px 0 15px 0; font-size: 14px; font-weight: 600; color: #444; display: flex; align-items: center; gap: 8px; width: 100%; box-sizing: border-box; }
.undig-wishes-counter.counter-above-form { margin: 0 0 15px 0; }
.undig-wishes-counter i { font-size: 16px; color: #666; }

/* Feed Base */
.undig-empty-feed { text-align: center; padding: 30px 15px; color: #888; background: rgba(0,0,0,0.02); border-radius: 12px; border: 1px dashed #e0e0e0; }
.undig-empty-feed i { font-size: 28px; margin-bottom: 8px; color: #bbb; display: block; }
.undig-empty-feed p { margin: 0; font-size: 13.5px; }

.undig-feed-container { margin-top: 15px; display: flex; flex-direction: column; gap: 16px; width: 100%; box-sizing: border-box; border-radius: 12px; }
.undig-feed-container.is-scrollable { padding-right: 8px; overflow-y: auto; scroll-behavior: smooth; }
.undig-feed-container.is-scrollable::-webkit-scrollbar { width: 6px; }
.undig-feed-container.is-scrollable::-webkit-scrollbar-track { background: rgba(0,0,0,0.03); border-radius: 10px; }
.undig-feed-container.is-scrollable::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.18); border-radius: 10px; }
.undig-feed-container.is-scrollable::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,0.3); }

.undig-feed-item { display: flex; gap: 12px; align-items: flex-start; }
.undig-feed-avatar { width: 40px; height: 40px; background: #e8e8e8; color: #444; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; flex-shrink: 0; font-size: 14px; text-transform: uppercase; }
.undig-feed-content { flex: 1; min-width: 0; }
.undig-feed-header { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
.undig-feed-name { font-weight: 700; font-size: 14px; color: #222; word-break: break-word; }

.undig-feed-badge { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 12px; font-size: 11px; font-weight: 600; line-height: 1.3; }
.undig-feed-badge.status-present { background: #e8f5e9; color: #2e7d32; }
.undig-feed-badge.status-notsure { background: #fff3e0; color: #ef6c00; }
.undig-feed-badge.status-not_present { background: #ffebee; color: #c62828; }
.undig-feed-badge i { font-size: 10.5px; }

.undig-feed-time { font-size: 11px; color: #999; margin-top: 6px; text-align: right; }
.undig-feed-sticker { width: 80px; height: 80px; object-fit: contain; display: block; margin: 8px 0; border-radius: 8px; flex-shrink: 0; }

.undig-feed-layout-bubble .undig-feed-bubble { background: #f4f5f7; padding: 12px 16px; border-radius: 0 16px 16px 16px; display: inline-block; max-width: 100%; box-sizing: border-box; word-break: break-word; }
.undig-feed-layout-bubble .undig-feed-bubble p { margin: 0; font-size: 13.5px; color: #333; line-height: 1.5; }

.undig-feed-layout-list .undig-feed-container { gap: 0; }
.undig-feed-layout-list .undig-feed-item { padding: 14px 0; border-bottom: 1px solid #eee; }
.undig-feed-layout-list .undig-feed-item:last-child { border-bottom: none; }
.undig-feed-layout-list .undig-feed-text { margin-top: 2px; }
.undig-feed-layout-list .undig-feed-text p { margin: 0; font-size: 13.5px; color: #333; line-height: 1.5; word-break: break-word; }
.undig-feed-layout-list .undig-feed-time { text-align: left; margin-top: 4px; }

.undig-feed-layout-card .undig-feed-container { gap: 14px; }
.undig-feed-layout-card .undig-feed-item { background: #fff; padding: 16px; border-radius: 14px; border: 1px solid #ebebeb; box-shadow: 0 2px 8px rgba(0,0,0,0.03); }
.undig-feed-layout-card .undig-feed-bubble p { margin: 0; font-size: 13.5px; color: #333; line-height: 1.5; word-break: break-word; }

/* Anti-Theme Border Leakage Guard */
.undig-gift-action-btn,
.undig-btn-submit,
.undig-btn-sticker-trigger,
.undig-gift-close-modal,
.undig-qris-close-modal,
.undig-sticker-close-modal,
.undig-stepper-btn,
.undig-btn-edit {
    outline: none;
    box-sizing: border-box;
}

.undig-submit-wrapper { width: 100%; box-sizing: border-box; margin-top: 15px; text-align: center; }
.undig-btn-submit { background: #111111; color: #ffffff; padding: 14px 20px; border: 0 solid transparent; border-radius: 12px; width: 100%; cursor: pointer; font-weight: 600; font-size: 15px; transition: all 0.3s ease; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; box-shadow: 0 4px 14px rgba(0,0,0,0.06); }
.undig-btn-submit:hover { background: #222222; opacity: 0.95; transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.1); }
.undig-btn-submit:disabled { background: #888888; cursor: not-allowed; opacity: 0.7; transform: none; }

/* Alignment Responsive Rules */
.elementor-align-justify .undig-submit-wrapper .undig-btn-submit,
.elementor-align-justify .undig-btn-submit,
.undig-submit-wrapper .undig-btn-submit { width: 100%; display: flex; justify-content: center; }
.elementor-align-left .undig-submit-wrapper { text-align: left !important; }
.elementor-align-left .undig-submit-wrapper .undig-btn-submit { width: auto !important; display: inline-flex !important; }
.elementor-align-center .undig-submit-wrapper { text-align: center !important; }
.elementor-align-center .undig-submit-wrapper .undig-btn-submit { width: auto !important; display: inline-flex !important; margin: 0 auto !important; }
.elementor-align-right .undig-submit-wrapper { text-align: right !important; }
.elementor-align-right .undig-submit-wrapper .undig-btn-submit { width: auto !important; display: inline-flex !important; margin-left: auto !important; }

.undig-msg-box { margin-top: 15px; padding: 12px; border-radius: 8px; font-size: 13px; text-align: center; }
.msg-success { background: #e8f5e9; color: #2e7d32; border: 1px solid #c8e6c9; }
.msg-error { background: #ffebee; color: #c62828; border: 1px solid #ffcdd2; }

.undig-load-more-wrap { text-align: center; margin-top: 20px; margin-bottom: 10px; }
.undig-btn-load-more { background: #f1f5f9; color: #334155; border: 1px solid #e2e8f0; padding: 10px 24px; border-radius: 20px; font-size: 13px; font-weight: 600; cursor: pointer; transition: all 0.2s ease; display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.undig-btn-load-more:hover { background: #e2e8f0; border-color: #cbd5e1; color: #0f172a; }
.undig-btn-load-more:disabled { opacity: 0.6; cursor: not-allowed; }


/* ======================================================
   WIDGET 1: UNDIG GIFT CARD / AMPLOP DIGITAL
   ====================================================== */
.undig-gift-wrapper { width: 100%; box-sizing: border-box; }
.undig-btn-trigger-gift-modal { background: #111111; color: #ffffff; padding: 12px 24px; border: none; border-radius: 25px; cursor: pointer; font-weight: 600; font-size: 14.5px; display: inline-flex; align-items: center; gap: 8px; transition: all 0.3s ease; box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.undig-btn-trigger-gift-modal:hover { background: #222222; transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,0.15); }

/* Modal Gift */
.undig-gift-modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); z-index: 999999; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(4px); }
.undig-gift-modal-box { background: #fff; width: 92%; max-width: 480px; max-height: 85vh; border-radius: 20px; padding: 24px; overflow-y: auto; box-shadow: 0 15px 40px rgba(0,0,0,0.25); animation: undigScaleIn 0.25s ease-out; box-sizing: border-box; }
.undig-gift-modal-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #eee; padding-bottom: 12px; margin-bottom: 16px; }
.undig-gift-modal-header h4 { margin: 0; font-size: 17px; font-weight: 700; color: #222; }
.undig-gift-close-modal { background: #f1f5f9; border: none !important; outline: none !important; width: 32px; height: 32px; border-radius: 50%; font-size: 20px; line-height: 1; cursor: pointer; color: #555; display: inline-flex; align-items: center; justify-content: center; transition: background 0.2s; }
.undig-gift-close-modal:hover { background: #e2e8f0; color: #111; }

/* Tabs Navigation Gift */
.undig-gift-tabs-nav { display: flex; gap: 8px; margin-bottom: 18px; border-bottom: 1px solid #eee; padding-bottom: 8px; }
.undig-gift-tab-btn { padding: 9px 18px; border: 1px solid #e0e0e0; border-radius: 12px; background: #f8f9fa; font-size: 13px; font-weight: 600; color: #555; cursor: pointer; transition: all 0.2s ease; text-align: center; }
.undig-gift-tab-btn.active { background: #111111; color: #ffffff; border-color: #111111; }
[class*="undig-gift-tabs"][class*="-align-stretch"] .undig-gift-tab-btn { flex: 1; }

/* Cards Grid */
.undig-gift-cards-grid { display: grid; grid-template-columns: 1fr; gap: 16px; width: 100%; box-sizing: border-box; }
.undig-gift-card { background: #fff; border: 1px solid #e8e8e8; border-radius: 16px; padding: 20px; box-shadow: 0 4px 14px rgba(0,0,0,0.03); transition: all 0.25s ease; box-sizing: border-box; }
.undig-gift-card:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(0,0,0,0.06); }
.undig-gift-card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.undig-bank-logo-wrap { height: 32px; display: flex; align-items: center; }
.undig-bank-logo-svg { height: 28px; width: auto; display: block; }
.undig-custom-bank-logo { max-height: 30px; width: auto; object-fit: contain; }
.undig-bank-custom-pill { display: inline-flex; align-items: center; gap: 6px; background: #f0f0f0; color: #333; padding: 5px 10px; border-radius: 8px; font-size: 11px; font-weight: 700; letter-spacing: 0.5px; border: 1px solid #ddd; }
.undig-bank-title { font-size: 12.5px; font-weight: 700; color: #888; text-transform: uppercase; letter-spacing: 0.5px; }

.undig-gift-card-body { margin-bottom: 16px; }
.undig-acc-number { font-size: 20px; font-weight: 800; color: #111; letter-spacing: 0.5px; margin-bottom: 4px; font-family: -apple-system, BlinkMacSystemFont, monospace, sans-serif; word-break: break-all; }
.undig-acc-holder { font-size: 13.5px; font-weight: 500; color: #666; }

/* Button Layouts (Grid 2 Kolom Responsif & Seimbang) */
.undig-gift-card-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; width: 100%; box-sizing: border-box; }
.undig-gift-card-actions .undig-gift-action-btn { width: 100%; justify-content: center; text-align: center; }
/* Jika hanya 1 tombol: ambil lebar penuh 100% */
.undig-gift-card-actions .undig-gift-action-btn:only-child,
.undig-gift-card-actions:has(.undig-gift-action-btn:only-child) .undig-gift-action-btn { grid-column: 1 / -1; }
/* Jika ada 3 tombol: tombol ke-3 (WA) otomatis turun ke baris bawah dengan lebar penuh 100% */
.undig-gift-card-actions .undig-gift-action-btn:nth-child(3):last-child { grid-column: 1 / -1; }

.undig-gift-action-btn { padding: 9px 14px; border-radius: 10px; font-size: 12.5px; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 6px; text-decoration: none; border: 1px solid transparent; transition: all 0.2s ease; box-sizing: border-box; white-space: nowrap; }
.undig-gift-btn-copy { background: #f1f5f9; color: #1e293b; border-color: #e2e8f0; }
.undig-gift-btn-copy:hover { background: #e2e8f0; color: #0f172a; }
.undig-gift-btn-qris { background: #fff7ed; color: #c2410c; border-color: #fed7aa; }
.undig-gift-btn-qris:hover { background: #ffedd5; color: #9a3412; }
.undig-gift-btn-wa { background: #f0fdf4; color: #15803d; border-color: #bbf7d0; }
.undig-gift-btn-wa:hover { background: #dcfce7; color: #166534; }

/* Physical Gift Card */
.undig-gift-physical-card { background: #fafafa; border: 1px dashed #ccc; border-radius: 16px; padding: 20px; }
.undig-physical-header { display: flex; gap: 12px; align-items: center; margin-bottom: 12px; border-bottom: 1px solid #eee; padding-bottom: 10px; }
.undig-physical-icon { font-size: 26px; color: #2271b1; }
.undig-physical-header h4 { margin: 0 0 2px 0; font-size: 16px; font-weight: 700; color: #222; }
.undig-physical-phone { margin: 0; font-size: 13px; color: #666; font-weight: 500; }
.undig-physical-address p { margin: 0 0 6px 0; font-size: 13.5px; color: #444; line-height: 1.5; }
.undig-physical-notes { color: #888; font-size: 12px; display: block; margin-bottom: 14px; }
.undig-physical-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; width: 100%; box-sizing: border-box; }
.undig-physical-actions .undig-gift-action-btn:only-child { grid-column: 1 / -1; }

/* QRIS Modal Viewer */
.undig-qris-modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); z-index: 9999999; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(4px); }
.undig-qris-modal-box { background: #fff; width: 90%; max-width: 360px; border-radius: 16px; padding: 20px; text-align: center; box-shadow: 0 15px 40px rgba(0,0,0,0.3); animation: undigScaleIn 0.2s ease; }
.undig-qris-modal-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; }
.undig-qris-modal-header h4 { margin: 0; font-size: 16px; font-weight: 700; }
.undig-qris-close-modal { background: #f0f0f0; border: none !important; outline: none !important; width: 30px; height: 30px; border-radius: 50%; font-size: 18px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: background 0.2s; }
.undig-qris-close-modal:hover { background: #e0e0e0; color: #111; }
.undig-qris-img-wrap { width: 100%; padding: 10px; background: #fff; border: 1px solid #eee; border-radius: 10px; box-sizing: border-box; }
.undig-qris-modal-img { max-width: 100%; height: auto; display: block; margin: 0 auto; border-radius: 6px; }


/* ======================================================
   WIDGET 2: UNDIG LOVE STORY TIMELINE
   ====================================================== */
.undig-timeline-wrapper { width: 100%; position: relative; box-sizing: border-box; }
.undig-timeline-vertical-wrap { position: relative; padding: 20px 0; }
.undig-timeline-line { position: absolute; top: 0; bottom: 0; width: 2px; background-color: #ddd; left: 50%; transform: translateX(-50%); z-index: 1; }
.undig-timeline-left .undig-timeline-line { left: 24px; transform: none; }

.undig-timeline-items { display: flex; flex-direction: column; gap: 30px; position: relative; z-index: 2; }
.undig-timeline-item { display: flex; width: 100%; position: relative; box-sizing: border-box; }
.undig-timeline-item.item-side-left { justify-content: flex-start; padding-right: 50%; }
.undig-timeline-item.item-side-right { justify-content: flex-end; padding-left: 50%; }
.undig-timeline-left .undig-timeline-item { padding-left: 54px; padding-right: 0 !important; justify-content: flex-start !important; }

/* Scroll Reveal Transition (Smooth Float & Scale) */
.undig-timeline-wrapper.has-reveal .undig-timeline-item {
    opacity: 0;
    transform: translateY(45px) scale(0.96);
    transition: opacity 0.85s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.85s cubic-bezier(0.2, 0.8, 0.2, 1);
    will-change: opacity, transform;
}
.undig-timeline-wrapper.has-reveal .undig-timeline-item.is-revealed {
    opacity: 1;
    transform: translateY(0) scale(1);
}

/* Node Circle */
.undig-timeline-node { position: absolute; left: 50%; top: 20px; transform: translate(-50%, -50%); width: 34px; height: 34px; border-radius: 50%; background-color: #333; color: #fff; display: flex; align-items: center; justify-content: center; z-index: 3; font-size: 13px; box-shadow: 0 0 0 4px #fff, 0 2px 8px rgba(0,0,0,0.12); }
.undig-timeline-left .undig-timeline-node { left: 24px; transform: translate(-50%, -50%); }

.undig-timeline-node.has-pulse { --undig-pulse-color: rgba(51,51,51,0.4); animation: undigNodePulse 2s infinite; }
@keyframes undigNodePulse {
    0% { box-shadow: 0 0 0 4px #fff, 0 0 0 0 var(--undig-pulse-color); }
    70% { box-shadow: 0 0 0 4px #fff, 0 0 0 10px transparent; }
    100% { box-shadow: 0 0 0 4px #fff, 0 0 0 0 transparent; }
}

/* Story Card Presets */
.undig-story-card { background: #fff; border: 1px solid #e8e8e8; border-radius: 16px; padding: 20px; box-shadow: 0 4px 16px rgba(0,0,0,0.04); max-width: 90%; width: 100%; box-sizing: border-box; transition: transform 0.3s ease; }
.undig-timeline-item.item-side-left .undig-story-card { margin-right: 25px; text-align: right; }
.undig-timeline-item.item-side-right .undig-story-card { margin-left: 25px; text-align: left; }
.undig-timeline-left .undig-story-card { margin-left: 0 !important; text-align: left !important; max-width: 100%; }

/* Preset Minimalist Clean */
.undig-timeline-preset-minimalist .undig-story-card { background: transparent !important; border: none !important; box-shadow: none !important; padding: 10px 0 !important; }
.undig-timeline-preset-minimalist .undig-story-date { font-size: 13px; font-weight: 700; color: #666; }
.undig-timeline-preset-minimalist .undig-story-title { font-size: 18px; font-weight: 700; color: #111; }

/* Preset Luxury Editorial */
.undig-timeline-preset-editorial .undig-story-card { background: #fff; border: 1px solid #eee; border-radius: 4px; padding: 25px; box-shadow: 0 2px 10px rgba(0,0,0,0.02); }
.undig-timeline-preset-editorial .undig-story-date { font-family: Georgia, serif; font-size: 18px; font-style: italic; color: #444; }
.undig-timeline-preset-editorial .undig-story-title { font-family: Georgia, serif; font-size: 20px; font-weight: 700; color: #111; }

/* Preset Glassmorphism */
.undig-timeline-preset-glass .undig-story-card { background: rgba(255,255,255,0.7); backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.5); border-radius: 18px; }

/* Mode Tanpa Garis / Tanpa Nodes */
.undig-timeline-wrapper.no-line .undig-timeline-line, .undig-timeline-wrapper.no-line .undig-timeline-horizontal-line { display: none !important; }
.undig-timeline-wrapper.no-nodes .undig-timeline-node { display: none !important; }
.undig-timeline-wrapper.no-nodes .undig-timeline-item { padding: 0 !important; margin-bottom: 20px; justify-content: center !important; }
.undig-timeline-wrapper.no-nodes .undig-story-card { margin: 0 auto !important; max-width: 100% !important; text-align: center; }

.undig-story-img { width: 100%; height: 190px; object-fit: cover; border-radius: 12px; margin-bottom: 14px; display: block; }
.undig-story-date { font-size: 12px; font-weight: 700; color: #888; text-transform: uppercase; margin-bottom: 4px; letter-spacing: 0.5px; }
.undig-story-title { font-size: 16.5px; font-weight: 700; margin: 0 0 6px 0; color: #222; }
.undig-story-desc { font-size: 13.5px; color: #555; line-height: 1.55; margin: 0; }

/* Swiper Horizontal Timeline */
.undig-timeline-swiper-container { position: relative; overflow-x: auto; padding: 30px 10px 10px 10px; scrollbar-width: none; }
.undig-timeline-swiper-container::-webkit-scrollbar { display: none; }
.undig-timeline-horizontal-line { position: absolute; top: 48px; left: 0; right: 0; height: 2px; background: #ddd; z-index: 1; }
.undig-timeline-swiper-track { display: flex; gap: 20px; position: relative; z-index: 2; }
.undig-timeline-h-card-item { flex: 0 0 260px; display: flex; flex-direction: column; align-items: center; }
.undig-timeline-h-card-item .undig-timeline-node { position: static; transform: none; margin-bottom: 15px; }
.undig-timeline-h-card-item .undig-story-card { text-align: center; max-width: 100%; margin: 0; }

/* Responsive Timeline */
@media (max-width: 767px) {
    .undig-timeline-zigzag .undig-timeline-line { left: 24px; transform: none; }
    .undig-timeline-zigzag .undig-timeline-node { left: 24px; transform: translate(-50%, -50%); }
    .undig-timeline-zigzag .undig-timeline-item { padding-left: 54px !important; padding-right: 0 !important; justify-content: flex-start !important; }
    .undig-timeline-zigzag .undig-story-card { margin-left: 0 !important; margin-right: 0 !important; text-align: left !important; max-width: 100%; }
}


/* ======================================================
   WIDGET 3: UNDIG BACKGROUND AUDIO PLAYER
   ====================================================== */
.undig-audio-wrapper { position: relative; z-index: 9999; }
.undig-audio-fixed-bottom-right { position: fixed; bottom: 20px; right: 20px; }
.undig-audio-fixed-bottom-left { position: fixed; bottom: 20px; left: 20px; }
.undig-audio-fixed-top-right { position: fixed; top: 20px; right: 20px; }
.undig-audio-fixed-top-left { position: fixed; top: 20px; left: 20px; }

/* 1. Vinyl Disc Player */
.undig-vinyl-disc { width: 50px; height: 50px; border-radius: 50%; background: #111; position: relative; cursor: pointer; box-shadow: 0 4px 15px rgba(0,0,0,0.3); display: flex; align-items: center; justify-content: center; transition: transform 0.2s ease; border: 2px solid #222; }
.undig-vinyl-disc:hover { transform: scale(1.08); }
.undig-vinyl-grooves { position: absolute; inset: 4px; border-radius: 50%; border: 1px dashed rgba(255,255,255,0.15); }
.undig-vinyl-center { width: 22px; height: 22px; border-radius: 50%; background: #fff; overflow: hidden; display: flex; align-items: center; justify-content: center; position: relative; z-index: 2; box-shadow: inset 0 0 4px rgba(0,0,0,0.3); }
.undig-vinyl-center-img { width: 100%; height: 100%; object-fit: cover; }
.undig-vinyl-center i { font-size: 10px; color: #111; }

.undig-vinyl-disc.is-playing { animation: undigSpin 4s linear infinite; }
.undig-vinyl-disc.is-paused { animation-play-state: paused; opacity: 0.85; }

/* 2. Wave Equalizer Player */
.undig-btn-wave { width: 46px; height: 46px; border-radius: 50%; background: #111; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 14px rgba(0,0,0,0.25); }
.undig-wave-bars { display: flex; align-items: center; gap: 3px; height: 18px; }
.undig-wave-bar { width: 3px; height: 100%; background: #fff; border-radius: 3px; transform: scaleY(0.3); transition: transform 0.2s ease; }
.undig-btn-wave.is-playing .undig-wave-bar { animation: undigWave 1s ease-in-out infinite alternate; }
.undig-btn-wave.is-playing .bar-1 { animation-delay: 0.1s; }
.undig-btn-wave.is-playing .bar-2 { animation-delay: 0.4s; }
.undig-btn-wave.is-playing .bar-3 { animation-delay: 0.2s; }
.undig-btn-wave.is-playing .bar-4 { animation-delay: 0.5s; }

/* 3. Floating Pill Button */
.undig-btn-pill { display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 25px; background: #111; color: #fff; border: none; cursor: pointer; box-shadow: 0 4px 14px rgba(0,0,0,0.25); font-size: 13px; font-weight: 600; }
.undig-btn-pill .icon-pause { display: none; }
.undig-btn-pill.is-playing .icon-play { display: none; }
.undig-btn-pill.is-playing .icon-pause { display: inline-block; }

/* 4. Circular Icon Button */
.undig-btn-circle { width: 46px; height: 46px; border-radius: 50%; background: #111; color: #fff; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 15px; box-shadow: 0 4px 14px rgba(0,0,0,0.25); }
.undig-btn-circle .icon-pause { display: none; }
.undig-btn-circle.is-playing .icon-play { display: none; }
.undig-btn-circle.is-playing .icon-pause { display: inline-block; }

@keyframes undigSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes undigWave { from { transform: scaleY(0.2); } to { transform: scaleY(1); } }


/* ======================================================
   WIDGET 4: UNDIG CALENDAR GRID
   ====================================================== */
.undig-cal-container { --undig-cal-color: #9a4c4c; max-width: 340px; margin: 0 auto; font-family: inherit; color: var(--undig-cal-color); box-sizing: border-box; }
.undig-cal-header { display: flex; align-items: baseline; gap: 10px; margin-bottom: 16px; }
.undig-cal-header h2 { font-size: 28px; margin: 0; font-weight: 700; color: var(--undig-cal-color); line-height: 1.1; }
.undig-cal-slash { font-size: 20px; font-weight: 700; color: var(--undig-cal-color); }
.undig-cal-year { font-size: 20px; font-weight: 700; color: var(--undig-cal-color); letter-spacing: 2px; }

.undig-cal-weekdays { display: grid; grid-template-columns: repeat(7, 1fr); text-align: center; font-weight: 700; font-size: 14px; padding-bottom: 8px; border-bottom: 1.5px solid var(--undig-cal-color); margin-bottom: 16px; color: var(--undig-cal-color); }
.undig-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); text-align: center; row-gap: 12px; }
.undig-cal-date { font-size: 15px; font-weight: 700; position: relative; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin: 0 auto; border-radius: 50%; }

/* Highlight Event Date */
.undig-cal-date.highlight { font-size: 18px; width: 38px; height: 38px; border: 1.5px solid var(--undig-cal-color); }
.undig-cal-event-icon { position: absolute; top: -11px; left: -7px; transform: rotate(-15deg); width: 18px; height: 18px; }

/* Pulse Ring Animation */
.undig-cal-date.highlight.anim-pulse-ring { animation: undigCalPulse 2s infinite; }
@keyframes undigCalPulse {
    0% { box-shadow: 0 0 0 0 var(--undig-cal-color); }
    70% { box-shadow: 0 0 0 10px transparent; }
    100% { box-shadow: 0 0 0 0 transparent; }
}

/* Glow Animation */
.undig-cal-date.highlight.anim-glow { animation: undigCalGlow 1.5s infinite alternate; }
@keyframes undigCalGlow {
    from { box-shadow: 0 0 4px var(--undig-cal-color); }
    to { box-shadow: 0 0 14px var(--undig-cal-color); }
}

/* Bounce Animation */
.undig-cal-date.highlight.anim-bounce { animation: undigCalBounce 2s infinite; }
@keyframes undigCalBounce {
    0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
    40% { transform: translateY(-6px); }
    60% { transform: translateY(-3px); }
}

.undig-cal-actions { margin-top: 20px; text-align: center; }
.undig-cal-dual-buttons { display: flex; flex-direction: column; gap: 8px; align-items: center; justify-content: center; width: 100%; box-sizing: border-box; }
@media (min-width: 480px) { .undig-cal-dual-buttons { flex-direction: row; flex-wrap: wrap; } }
.undig-btn-add-calendar { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 10px 20px; border-radius: 20px; background: var(--undig-cal-color); color: #fff; text-decoration: none; font-size: 13px; font-weight: 600; transition: all 0.2s ease; box-sizing: border-box; }
.undig-btn-add-calendar:hover { opacity: 0.9; color: #fff; transform: translateY(-1px); }
.undig-cal-btn-ics { background: transparent; color: var(--undig-cal-color); border: 1.5px solid var(--undig-cal-color); }
.undig-cal-btn-ics:hover { background: var(--undig-cal-color); color: #fff; }


/* ======================================================
   WIDGET 5: UNDIG COUNTDOWN TIMER
   ====================================================== */
.undig-countdown-container { width: 100%; box-sizing: border-box; }
.undig-countdown-wrap { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; box-sizing: border-box; }

.undig-countdown-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    box-sizing: border-box;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.undig-countdown-digits {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.1;
    color: #111111;
    font-variant-numeric: tabular-nums;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.undig-countdown-label {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 4px;
    color: #666666;
}

.undig-countdown-separator {
    font-size: 24px;
    font-weight: 700;
    color: #444444;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 12px;
}

/* Layout 1: Grid 2x2 (2 Kolom x 2 Baris) */
.undig-countdown-layout-grid_2x2 .undig-countdown-wrap {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    max-width: 250px;
    margin: 0 auto;
    gap: 10px;
}
.undig-countdown-layout-grid_2x2 .undig-countdown-item {
    width: 100%;
    min-width: 0 !important;
}
.undig-countdown-layout-grid_2x2 .undig-countdown-separator {
    display: none !important;
}

/* Layout 2: Vertikal Stack (1 Kolom Menurun) */
.undig-countdown-layout-vertical .undig-countdown-wrap {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px;
    max-width: 180px;
    margin: 0 auto;
}
.undig-countdown-layout-vertical .undig-countdown-item {
    width: 100%;
    min-width: 0 !important;
}
.undig-countdown-layout-vertical .undig-countdown-separator {
    display: none !important;
}

/* Layout 3: Compact Teks (Pipih Ringkas) */
.undig-countdown-layout-compact_text .undig-countdown-wrap {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
}
.undig-countdown-layout-compact_text .undig-countdown-item {
    flex-direction: row;
    align-items: baseline;
    gap: 4px;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    min-width: auto !important;
}
.undig-countdown-layout-compact_text .undig-countdown-label {
    margin-top: 0;
}
.undig-countdown-layout-compact_text .undig-countdown-separator {
    padding-bottom: 0;
}

/* Preset 1: Modern Boxed Cards */
.undig-countdown-preset-boxed .undig-countdown-item {
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    padding: 12px 14px;
    box-shadow: 0 4px 14px rgba(0,0,0,0.05);
}

/* Preset 2: Minimalist Floating Pill */
.undig-countdown-preset-pill .undig-countdown-item {
    background: #f7f7f7;
    border: 1px solid #eaeaea;
    border-radius: 30px;
    padding: 10px 18px;
}

/* Preset 3: Circular Ring */
.undig-countdown-preset-circle .undig-countdown-item {
    background: #ffffff;
    border: 2px solid #222222;
    border-radius: 50%;
    width: 75px;
    height: 75px;
    min-width: 75px !important;
    padding: 0;
    box-shadow: 0 4px 16px rgba(0,0,0,0.06);
}
.undig-countdown-preset-circle .undig-countdown-digits { font-size: 20px; }
.undig-countdown-preset-circle .undig-countdown-label { font-size: 9px; margin-top: 2px; }

/* Preset 4: Editorial Typography */
.undig-countdown-preset-clean .undig-countdown-item {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 6px 8px;
}

.undig-countdown-expired-msg {
    text-align: center;
    padding: 16px 20px;
    background: #f8f9fa;
    border-radius: 12px;
    border: 1px dashed #ccc;
    margin-top: 10px;
}
.undig-countdown-expired-msg p { margin: 0; font-size: 14.5px; font-weight: 600; color: #333; }


/* ======================================================
   WIDGET 6: UNDIG GALLERY & LIGHTBOX
   ====================================================== */
/* ======================================================
   WIDGET 6: UNDIG GALLERY & LIGHTBOX
   ====================================================== */
.undig-gallery-wrapper {
    width: 100%;
    box-sizing: border-box;
    --undig-gap-x: 12px;
    --undig-gap-y: 12px;
    --undig-polaroid-tilt: 2deg;
}

/* Gallery Item Base */
.undig-gallery-item {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    box-sizing: border-box;
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease;
}

.undig-gallery-img-wrap {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.undig-gallery-img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 0.45s ease;
}

/* Hover Zoom Effect */
.has-hover-zoom .undig-gallery-item:hover .undig-gallery-img {
    transform: scale(1.06);
}

/* Overlay & Zoom Icon */
.undig-gallery-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.25s ease;
    color: #ffffff;
    font-size: 20px;
}
.undig-gallery-item:hover .undig-gallery-overlay {
    opacity: 1;
}


/* 1. MASONRY & POLAROID MULTI-COLUMN TRACKS (Zero Gap - Snug Flow) */
.undig-columns-container {
    display: flex !important;
    width: 100%;
    box-sizing: border-box;
    gap: var(--undig-gap-x, 12px);
    align-items: flex-start;
}

.undig-column-track {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--undig-gap-y, 12px);
}

.undig-gallery-masonry .undig-gallery-item {
    width: 100%;
    height: auto !important;
}
.undig-gallery-masonry .undig-gallery-img-wrap {
    height: auto !important;
    aspect-ratio: auto !important;
}
.undig-gallery-masonry .undig-gallery-img {
    height: auto !important;
    object-fit: contain;
}


/* 2. ARTISTIC POLAROID (Zero-Glitch Stable Cards) */
.undig-polaroid-card {
    background: #ffffff !important;
    padding: 10px 10px 18px 10px;
    border-radius: 6px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.07);
    width: 100%;
    height: auto !important;
    transform-origin: center center;
    transition: transform 0.35s ease, box-shadow 0.35s ease !important;
}
.undig-polaroid-card.tilt-left {
    transform: rotate(calc(-1 * var(--undig-polaroid-tilt, 2deg)));
}
.undig-polaroid-card.tilt-right {
    transform: rotate(var(--undig-polaroid-tilt, 2deg));
}
.undig-polaroid-card:hover {
    transform: rotate(0deg) translateY(-4px) scale(1.02) !important;
    box-shadow: 0 14px 34px rgba(0,0,0,0.12) !important;
    z-index: 10;
}
.undig-gallery-polaroid.undig-polaroid-ratio-auto .undig-gallery-img-wrap {
    height: auto !important;
    aspect-ratio: auto !important;
    border-radius: 4px;
}
.undig-gallery-polaroid.undig-polaroid-ratio-auto .undig-gallery-img {
    height: auto !important;
    object-fit: contain;
}
.undig-gallery-polaroid.undig-polaroid-ratio-square .undig-gallery-img-wrap {
    aspect-ratio: 1 / 1;
    border-radius: 4px;
    overflow: hidden;
}
.undig-gallery-polaroid.undig-polaroid-ratio-square .undig-gallery-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.undig-gallery-polaroid.undig-polaroid-ratio-4-5 .undig-gallery-img-wrap {
    aspect-ratio: 4 / 5;
    border-radius: 4px;
    overflow: hidden;
}
.undig-gallery-polaroid.undig-polaroid-ratio-4-5 .undig-gallery-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.undig-polaroid-caption {
    font-size: 13px;
    color: #444;
    text-align: center;
    margin-top: 8px;
    font-family: Georgia, serif;
    font-style: italic;
}


/* 3. BENTO / COLLAGE EDITORIAL (Majalah) */
.undig-bento-grid {
    display: grid !important;
    width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-auto-rows: 160px;
    column-gap: var(--undig-gap-x, 12px);
    row-gap: var(--undig-gap-y, 12px);
}
.undig-bento-grid .undig-gallery-item:first-child {
    grid-column: span 2;
    grid-row: span 2;
}
.undig-bento-grid .undig-gallery-img-wrap {
    width: 100%;
    height: 100%;
}
.undig-bento-grid .undig-gallery-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
@media (max-width: 767px) {
    .undig-bento-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: 135px;
    }
    .undig-bento-grid .undig-gallery-item:first-child {
        grid-column: span 2;
        grid-row: span 2;
    }
}


/* 4. JUSTIFIED / CLEAN ASPECT RATIO GRID */
.undig-justified-grid {
    display: grid !important;
    width: 100%;
    column-gap: var(--undig-gap-x, 12px);
    row-gap: var(--undig-gap-y, 12px);
}
.undig-cols-1 .undig-justified-grid { grid-template-columns: 1fr; }
.undig-cols-2 .undig-justified-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.undig-cols-3 .undig-justified-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.undig-cols-4 .undig-justified-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 1024px) {
    .undig-cols-tab-1 .undig-justified-grid { grid-template-columns: 1fr; }
    .undig-cols-tab-2 .undig-justified-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .undig-cols-tab-3 .undig-justified-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    .undig-cols-mob-1 .undig-justified-grid { grid-template-columns: 1fr; }
    .undig-cols-mob-2 .undig-justified-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.undig-aspect-1-1 .undig-justified-grid .undig-gallery-img-wrap { aspect-ratio: 1 / 1; width: 100%; }
.undig-aspect-3-4 .undig-justified-grid .undig-gallery-img-wrap { aspect-ratio: 3 / 4; width: 100%; }
.undig-aspect-4-5 .undig-justified-grid .undig-gallery-img-wrap { aspect-ratio: 4 / 5; width: 100%; }
.undig-aspect-16-9 .undig-justified-grid .undig-gallery-img-wrap { aspect-ratio: 16 / 9; width: 100%; }
.undig-aspect-9-16 .undig-justified-grid .undig-gallery-img-wrap { aspect-ratio: 9 / 16; width: 100%; }

.undig-justified-grid .undig-gallery-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/* 5. CAROUSEL SYNC STAGE & THUMBNAILS */
.undig-gallery-sync-stage { width: 100%; margin-bottom: 10px; }
.undig-gallery-main-frame {
    position: relative;
    width: 100%;
    max-height: 480px;
    overflow: hidden;
    border-radius: 12px;
    cursor: pointer;
    touch-action: pan-y;
}
.undig-gallery-main-img {
    width: 100%;
    height: auto;
    max-height: 480px;
    object-fit: cover;
    display: block;
    transition: opacity 0.3s ease;
}
.undig-gallery-main-nav {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 10px;
    box-sizing: border-box;
}
.undig-main-prev, .undig-main-next {
    pointer-events: auto;
    background: rgba(0,0,0,0.4);
    color: #ffffff;
    border: none;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 14px;
    transition: background 0.2s ease, transform 0.2s ease;
}
.undig-main-prev:hover, .undig-main-next:hover {
    background: rgba(0,0,0,0.7);
    transform: scale(1.08);
}
.undig-gallery-zoom-badge {
    position: absolute;
    bottom: 12px;
    right: 12px;
    background: rgba(0,0,0,0.6);
    color: #fff;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
}
.undig-gallery-sync-thumbs {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 6px;
    scrollbar-width: thin;
    scroll-behavior: smooth;
}
.undig-gallery-thumb-item {
    flex: 0 0 auto;
    width: 75px;
    height: 65px;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    border: 2px solid transparent;
    opacity: 0.6;
    transition: all 0.2s ease;
}
.undig-gallery-thumb-item.is-active {
    opacity: 1;
    border-color: #111111 !important;
}
.undig-gallery-thumb-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}


/* ======================================================
   SCROLL REVEAL ANIMATIONS (4 Pilihan Sinematik)
   ====================================================== */
.has-anim .undig-gallery-item {
    opacity: 0;
    transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1), transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

.has-anim.anim-speed-fast .undig-gallery-item { transition-duration: 0.5s; }
.has-anim.anim-speed-normal .undig-gallery-item { transition-duration: 0.9s; }
.has-anim.anim-speed-slow .undig-gallery-item { transition-duration: 1.3s; }

/* 1. Slide Alternate (Kiri & Kanan) */
.anim-slide_alternate .undig-gallery-item.side-left {
    transform: translateX(-40px);
}
.anim-slide_alternate .undig-gallery-item.side-right {
    transform: translateX(40px);
}
.anim-slide_alternate .undig-gallery-item.is-revealed {
    opacity: 1;
    transform: translateX(0);
}

/* 2. Fade Up & Scale */
.anim-fade_up .undig-gallery-item {
    transform: translateY(45px) scale(0.96);
}
.anim-fade_up .undig-gallery-item.is-revealed {
    opacity: 1;
    transform: translateY(0) scale(1);
}

/* 3. Zoom Pop */
.anim-zoom_pop .undig-gallery-item {
    transform: scale(0.82);
}
.anim-zoom_pop .undig-gallery-item.is-revealed {
    opacity: 1;
    transform: scale(1);
}

/* 4. Flip 3D */
.anim-flip_3d .undig-gallery-item {
    transform: perspective(600px) rotateY(20deg) translateY(25px);
}
.anim-flip_3d .undig-gallery-item.is-revealed {
    opacity: 1;
    transform: perspective(600px) rotateY(0deg) translateY(0);
}


/* ======================================================
   BUILT-IN MOBILE SWIPE LIGHTBOX
   ====================================================== */
.undig-lightbox-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 99999999;
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
    touch-action: none;
}
.undig-lightbox-backdrop {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.92);
    backdrop-filter: blur(8px);
}
.undig-lightbox-stage {
    position: relative;
    z-index: 2;
    max-width: 92vw;
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.undig-lightbox-img {
    max-width: 100%;
    max-height: 82vh;
    object-fit: contain;
    border-radius: 6px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.5);
    animation: undigZoomIn 0.2s ease;
}
@keyframes undigZoomIn {
    from { opacity: 0; transform: scale(0.92); }
    to { opacity: 1; transform: scale(1); }
}
.undig-lightbox-caption {
    color: #ffffff;
    font-size: 14px;
    margin-top: 10px;
    text-align: center;
    font-weight: 500;
}
.undig-lightbox-counter {
    position: absolute;
    top: 18px;
    left: 20px;
    z-index: 3;
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    background: rgba(0,0,0,0.4);
    padding: 4px 10px;
    border-radius: 12px;
}
.undig-lightbox-close-btn {
    position: absolute;
    top: 18px;
    right: 20px;
    z-index: 3;
    background: rgba(255,255,255,0.2);
    color: #ffffff;
    border: none;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    font-size: 20px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.undig-lightbox-nav-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    background: rgba(255,255,255,0.15);
    color: #ffffff;
    border: none;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    font-size: 18px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease;
}
.undig-lightbox-nav-btn:hover { background: rgba(255,255,255,0.3); }
.undig-lightbox-prev { left: 15px; }
.undig-lightbox-next { right: 15px; }

/* ==========================================
   UNDIG SMOOTH SCROLL & SCROLLSPY HELPERS
   ========================================== */
html {
    scroll-behavior: auto !important;
}
.mPS2id-target,
.undig-target-active {
    scroll-margin-top: 10px;
}

/* ==========================================================================
   1. UNDIG SCROLL REVEAL ANIMATION UTILITIES (undigal-* & wdpal-*)
   ========================================================================== */
.undigal-fade-in, .wdpal-fade-in {
    opacity: 0;
    transition: opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    will-change: opacity;
}
.undigal-fade-in.active, .wdpal-fade-in.active { opacity: 1; }

.undigal-muncul-atas, .wdpal-muncul-atas {
    transform: translateY(100%);
    opacity: 0;
    transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1), opacity 1s ease !important;
    will-change: transform, opacity;
}
.undigal-muncul-atas.active, .wdpal-muncul-atas.active { transform: translateY(0); opacity: 1; }

.undigal-muncul-bawah, .wdpal-muncul-bawah {
    transform: translateY(-100%);
    opacity: 0;
    transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1), opacity 1s ease !important;
    will-change: transform, opacity;
}
.undigal-muncul-bawah.active, .wdpal-muncul-bawah.active { transform: translateY(0); opacity: 1; }

.undigal-muncul-kiri, .wdpal-muncul-kiri {
    transform: translateX(-100%) scale(0.95);
    opacity: 0;
    transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.6s ease !important;
    will-change: transform, opacity;
}
.undigal-muncul-kiri.active, .wdpal-muncul-kiri.active { transform: translateX(0) scale(1); opacity: 1; }

.undigal-muncul-kanan, .wdpal-muncul-kanan {
    transform: translateX(100%) scale(0.95);
    opacity: 0;
    transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.6s ease !important;
    will-change: transform, opacity;
}
.undigal-muncul-kanan.active, .wdpal-muncul-kanan.active { transform: translateX(0) scale(1); opacity: 1; }

.undigal-rotate-in, .wdpal-rotate-in {
    transform: rotate(-180deg) scale(0.8);
    opacity: 0;
    transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1), opacity 1s ease !important;
    will-change: transform, opacity;
}
.undigal-rotate-in.active, .wdpal-rotate-in.active { transform: rotate(0deg) scale(1); opacity: 1; }

.undigal-flip-x, .wdpal-flip-x {
    transform: perspective(800px) rotateX(90deg);
    opacity: 0;
    transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1), opacity 1s ease !important;
    backface-visibility: hidden;
    will-change: transform, opacity;
}
.undigal-flip-x.active, .wdpal-flip-x.active { transform: perspective(800px) rotateX(0deg); opacity: 1; }

.undigal-flip-y, .wdpal-flip-y {
    transform: perspective(800px) rotateY(90deg);
    opacity: 0;
    transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1), opacity 1s ease !important;
    backface-visibility: hidden;
    will-change: transform, opacity;
}
.undigal-flip-y.active, .wdpal-flip-y.active { transform: perspective(800px) rotateY(0deg); opacity: 1; }

.undigal-zoom-in, .wdpal-zoom-in {
    transform: scale(0.5);
    opacity: 0;
    transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1), opacity 1s ease !important;
    will-change: transform, opacity;
}
.undigal-zoom-in.active, .wdpal-zoom-in.active { transform: scale(1); opacity: 1; }

.undigal-zoom-out, .wdpal-zoom-out {
    transform: scale(1.4);
    opacity: 0;
    transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1), opacity 1s ease !important;
    will-change: transform, opacity;
}
.undigal-zoom-out.active, .wdpal-zoom-out.active { transform: scale(1); opacity: 1; }

.undigal-blur-in, .wdpal-blur-in {
    opacity: 0;
    filter: blur(20px);
    transition: opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94), filter 1s ease !important;
    will-change: opacity, filter;
}
.undigal-blur-in.active, .wdpal-blur-in.active { opacity: 1; filter: blur(0px); }

.undigal-zoom-blur-in, .wdpal-zoom-blur-in {
    transform: scale(0.75);
    opacity: 0;
    filter: blur(20px);
    transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1), opacity 1.2s ease, filter 1.2s ease !important;
    will-change: transform, opacity, filter;
}
.undigal-zoom-blur-in.active, .wdpal-zoom-blur-in.active { transform: scale(1); opacity: 1; filter: blur(0px); }

/* Animation Delays (0.1s - 2.0s) */
.undigal-delay-1, .undigal-delay-100, .wdpal-delay-1, .wdpal-delay-100 { transition-delay: 0.1s !important; animation-delay: 0.1s !important; }
.undigal-delay-2, .undigal-delay-200, .wdpal-delay-2, .wdpal-delay-200 { transition-delay: 0.2s !important; animation-delay: 0.2s !important; }
.undigal-delay-3, .undigal-delay-300, .wdpal-delay-3, .wdpal-delay-300 { transition-delay: 0.3s !important; animation-delay: 0.3s !important; }
.undigal-delay-4, .undigal-delay-400, .wdpal-delay-4, .wdpal-delay-400 { transition-delay: 0.4s !important; animation-delay: 0.4s !important; }
.undigal-delay-5, .undigal-delay-500, .wdpal-delay-5, .wdpal-delay-500 { transition-delay: 0.5s !important; animation-delay: 0.5s !important; }
.undigal-delay-6, .undigal-delay-600, .wdpal-delay-6, .wdpal-delay-600 { transition-delay: 0.6s !important; animation-delay: 0.6s !important; }
.undigal-delay-7, .undigal-delay-700, .wdpal-delay-7, .wdpal-delay-700 { transition-delay: 0.7s !important; animation-delay: 0.7s !important; }
.undigal-delay-8, .undigal-delay-800, .wdpal-delay-8, .wdpal-delay-800 { transition-delay: 0.8s !important; animation-delay: 0.8s !important; }
.undigal-delay-9, .undigal-delay-900, .wdpal-delay-9, .wdpal-delay-900 { transition-delay: 0.9s !important; animation-delay: 0.9s !important; }
.undigal-delay-10, .undigal-delay-1000, .wdpal-delay-10, .wdpal-delay-1000 { transition-delay: 1.0s !important; animation-delay: 1.0s !important; }
.undigal-delay-12, .undigal-delay-1200, .wdpal-delay-12, .wdpal-delay-1200 { transition-delay: 1.2s !important; animation-delay: 1.2s !important; }
.undigal-delay-15, .undigal-delay-1500, .wdpal-delay-15, .wdpal-delay-1500 { transition-delay: 1.5s !important; animation-delay: 1.5s !important; }
.undigal-delay-20, .undigal-delay-2000, .wdpal-delay-20, .wdpal-delay-2000 { transition-delay: 2.0s !important; animation-delay: 2.0s !important; }

/* Animation Durations (Speed Modifiers) */
.undigal-dur-fast, .wdpal-dur-fast { transition-duration: 0.5s !important; animation-duration: 0.5s !important; }
.undigal-dur-normal, .wdpal-dur-normal { transition-duration: 1.0s !important; animation-duration: 1.0s !important; }
.undigal-dur-slow, .wdpal-dur-slow { transition-duration: 1.5s !important; animation-duration: 1.5s !important; }
.undigal-dur-superslow, .wdpal-dur-superslow { transition-duration: 2.0s !important; animation-duration: 2.0s !important; }

/* Compatibility in Elementor Editor */
.elementor-editor-active [class*="undigal-"],
.elementor-editor-active [class*="wdpal-"] {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    visibility: visible !important;
}

/* ==========================================================================
   2. UNDIG COVER OPENING ANIMATION MULTI-VARIANTS (undig-open-* & afr-open-*)
   ========================================================================== */
@keyframes undig-zoom-blur-in-kf {
    0% { transform: scale(0.7); opacity: 0; filter: blur(20px); }
    100% { transform: scale(1); opacity: 1; filter: blur(0px); }
}

[class*="undig-open-"] .info_modalx,
[class*="undig-open-"] .wdp-mempelai,
[class*="undig-open-"] .wdp-dear,
[class*="undig-open-"] .wdp-dear:after,
[class*="undig-open-"] .wdp-name,
[class*="afr-open-"] .info_modalx,
[class*="afr-open-"] .wdp-mempelai,
[class*="afr-open-"] .wdp-dear,
[class*="afr-open-"] .wdp-dear:after,
[class*="afr-open-"] .wdp-name {
    animation: undig-zoom-blur-in-kf 1.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    animation-fill-mode: both;
    will-change: transform, opacity, filter;
}

/* Variant 1: Slide Right */
.undig-open-slide-right .removeModals, .afr-open-slide-right .removeModals {
    transform: translateX(-150%);
    opacity: 0;
    transition: transform 3.5s ease-in-out, opacity 3.5s ease-in-out;
    will-change: transform, opacity;
}

/* Variant 2: Fade Scale */
.undig-open-fade-scale .removeModals, .afr-open-fade-scale .removeModals {
    transform: scale(0.8);
    opacity: 0;
    transition: transform 3.5s ease-in-out, opacity 3.5s ease-in-out;
    will-change: transform, opacity;
}

/* Variant 3: Slide Bottom */
.undig-open-slide-bottom .removeModals, .afr-open-slide-bottom .removeModals {
    transform: translateY(-200%);
    opacity: 0;
    transition: transform 3.5s ease-in-out, opacity 3.5s ease-in-out;
    will-change: transform, opacity;
}

/* Variant 4: Bounce Zoom */
.undig-open-bounce-zoom .removeModals, .afr-open-bounce-zoom .removeModals {
    transform: scale(0);
    opacity: 0;
    transition: transform 3.5s cubic-bezier(0.6, -0.28, 0.735, 0.045), opacity 3.5s ease-in-out;
    will-change: transform, opacity;
}

/* Variant 5: Flip Fade */
.undig-open-flip-fade .removeModals, .afr-open-flip-fade .removeModals {
    transform: perspective(1000px) rotateY(90deg);
    opacity: 0;
    transition: transform 3.5s ease-in-out, opacity 3.5s ease-in-out;
    will-change: transform, opacity;
}

/* Variant 6: Zoom Blur Exit */
.undig-open-zoom .removeModals, .afr-open-zoom .removeModals {
    transform: scale(0);
    opacity: 0;
    transition: transform 1.5s cubic-bezier(0.55, 0.085, 0.68, 0.53), opacity 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    will-change: transform, opacity;
}

/* Preloader Sync */
body:not(.undig-loaded):not(.wv-loaded) [class*="undig-open-"] .info_modalx,
body:not(.undig-loaded):not(.wv-loaded) [class*="undig-open-"] .wdp-mempelai,
body:not(.undig-loaded):not(.wv-loaded) [class*="undig-open-"] .wdp-dear,
body:not(.undig-loaded):not(.wv-loaded) [class*="afr-open-"] .info_modalx,
body:not(.undig-loaded):not(.wv-loaded) [class*="afr-open-"] .wdp-mempelai,
body:not(.undig-loaded):not(.wv-loaded) [class*="afr-open-"] .wdp-dear {
    animation-play-state: paused !important;
    opacity: 0 !important;
}

/* ==========================================================================
   3. UNDIG MOTION CONTROL SEQUENCE (undig-seq-* & sequence*)
   ========================================================================== */
[id^="undig-seq-"], [id^="sequence"] {
    transform: scale(0.7);
    opacity: 0;
    filter: blur(20px);
    transition: transform 1.5s ease, opacity 1.5s ease, filter 1.5s ease !important;
    pointer-events: none;
    will-change: transform, opacity, filter;
}

.undig-seq-active, .mc-active {
    transform: scale(1) !important;
    opacity: 1 !important;
    filter: blur(0px) !important;
    pointer-events: auto;
}

body.undig-no-scroll, body.no-scroll {
    overflow: hidden !important;
    height: 100vh !important;
}

.elementor-editor-active [id^="undig-seq-"],
.elementor-editor-active [id^="sequence"] {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    visibility: visible !important;
}
.elementor-editor-active body.undig-no-scroll,
.elementor-editor-active body.no-scroll {
    overflow: visible !important;
    height: auto !important;
}

/* ==========================================================================
   4. UNDIG PRELOADER SCREEN WIDGET
   ========================================================================== */
#undig-preloader, #wv-preloader {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100vh;
    background: var(--undig-preload-bg, #66758f);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999999;
    transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1), filter 0.8s cubic-bezier(0.4, 0, 0.2, 1), transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
    opacity: 1;
    filter: blur(0px);
    transform: scale(1) translateY(0);
}

@keyframes undigFadeIn {
    0% { opacity: 0; transform: translateY(6px); }
    100% { opacity: 1; transform: translateY(0); }
}

#undig-preloader.undig-hide, #wv-preloader.wv-hide {
    opacity: 0;
    filter: blur(14px);
    transform: scale(1.08) translateY(-30px);
    pointer-events: none;
}

.undig-preloader-inner, .wv-inner {
    text-align: center;
    color: var(--undig-preload-text, #f7f5f1);
    font-family: var(--undig-preload-font, 'Playfair Display', serif);
}

.undig-preloader-top-text {
    font-size: var(--undig-preload-top-size, 0.85rem);
    font-weight: 500;
    letter-spacing: var(--undig-preload-top-ls, 4px);
    text-transform: uppercase;
    color: var(--undig-preload-top-color, rgba(255, 255, 255, 0.85));
    margin-bottom: var(--undig-preload-top-mb, 10px);
    opacity: 0;
    animation: undigFadeIn 0.8s ease 0.2s forwards;
}

.undig-preloader-initial, .wv-initial {
    font-size: var(--undig-preload-size, 5.5rem);
    font-weight: 600;
    letter-spacing: 12px;
    margin-bottom: 12px;
    opacity: 0;
    transform: scale(0.9);
    filter: blur(5px);
    animation: undig-init-reveal 1s cubic-bezier(0.19, 1, 0.22, 1) forwards;
}
.undig-preloader-initial span, .wv-initial span { display: inline-block; padding: 0 4px; }

@keyframes undig-init-reveal {
    0% { opacity: 0; letter-spacing: 22px; transform: scale(0.9); filter: blur(5px); }
    60% { opacity: 1; text-shadow: 0 0 18px rgba(212, 175, 55, 0.35); }
    100% { opacity: 1; letter-spacing: 8px; transform: scale(1); filter: blur(0px); text-shadow: 0 0 6px rgba(212, 175, 55, 0.15); }
}

.undig-preloader-progress-wrap, .wv-progress-wrap {
    position: relative;
    width: var(--undig-preload-bar-width, min(240px, 72vw));
    margin: 0 auto;
    opacity: 0;
    animation: undigFadeIn 0.6s ease 0.5s forwards;
}

.undig-preloader-progress-head, .wv-progress-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.undig-preloader-loading-text, .wv-loading-text {
    font-size: 0.74rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.75);
}

.undig-preloader-percent, .wv-percent {
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 1px;
}

.undig-preloader-bar, .wv-bar {
    position: relative;
    width: 100%;
    height: var(--undig-preload-bar-height, 4px);
}

.undig-preloader-bar-track, .wv-bar-track,
.undig-preloader-bar-fill, .wv-bar-fill {
    position: absolute;
    inset: 0;
    border-radius: 999px;
}
.undig-preloader-bar-track, .wv-bar-track { background: rgba(255, 255, 255, 0.18); }
.undig-preloader-bar-fill, .wv-bar-fill {
    width: 0%;
    background: var(--undig-preload-accent, linear-gradient(90deg, #d4af37, #f7f5f1));
    box-shadow: 0 0 12px rgba(212, 175, 55, 0.3);
    transition: width 0.1s linear;
}

.undig-preloader-dots, .wv-dots {
    margin-top: 14px;
    display: flex;
    justify-content: center;
    gap: 6px;
    opacity: 0;
    animation: undigFadeIn 0.5s ease 0.7s forwards;
}
.undig-preloader-dots span, .wv-dots span {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--undig-preload-accent, #f7f5f1);
    animation: undig-dot-bounce 1.2s ease-in-out infinite;
}
.undig-preloader-dots span:nth-child(2), .wv-dots span:nth-child(2) { animation-delay: 0.2s; }
.undig-preloader-dots span:nth-child(3), .wv-dots span:nth-child(3) { animation-delay: 0.4s; }

@keyframes undig-dot-bounce {
    0%, 80%, 100% { transform: translateY(0); opacity: 0.4; }
    40% { transform: translateY(-5px); opacity: 1; }
}

.elementor-editor-active #undig-preloader:not(.undig-editor-live-preview),
.elementor-editor-active #wv-preloader:not(.undig-editor-live-preview) {
    display: none !important;
}

/* Live Preview in Editor */
.elementor-editor-active #undig-preloader.undig-editor-live-preview {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: 380px !important;
    border-radius: 12px;
    box-shadow: 0 6px 24px rgba(0,0,0,0.15);
    margin: 15px 0;
}
.elementor-editor-active #undig-preloader.undig-editor-live-preview .undig-preloader-progress-wrap,
.elementor-editor-active #undig-preloader.undig-editor-live-preview .undig-preloader-dots,
.elementor-editor-active #undig-preloader.undig-editor-live-preview .undig-preloader-initial,
.elementor-editor-active #undig-preloader.undig-editor-live-preview .undig-preloader-top-text {
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
}
.elementor-editor-active #undig-preloader.undig-editor-live-preview .undig-preloader-bar-fill {
    width: 65% !important;
}
.elementor-editor-active #undig-preloader.undig-editor-live-preview .undig-preloader-percent::after {
    content: "65%";
}
.elementor-editor-active #undig-preloader.undig-editor-live-preview .undig-preloader-percent {
    font-size: 0.78rem;
}


/* ==========================================================================
   5. FLOATING BOTTOM NAVBAR GLASSMORPHISM PRESET
   ========================================================================== */
.undig-floating-nav, .mobile-nav.popup-nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    padding: 8px 12px;
    position: fixed;
    bottom: 22px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 998;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
    transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}
.undig-floating-nav.popup-hidden, .mobile-nav.popup-hidden {
    opacity: 0;
    pointer-events: none;
    transform: translateX(-50%) translateY(80px);
}
.undig-floating-nav.popup-visible, .mobile-nav.popup-visible {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
}
.elementor-editor-active .undig-floating-nav,
.elementor-editor-active .mobile-nav.popup-nav {
    opacity: 1 !important;
    transform: translateX(-50%) translateY(0) !important;
    pointer-events: auto !important;
}

/* ==========================================================================
   6. UNDIG AMBIENT ORNAMENT & FLOATING ANIMATIONS (Goyang, Denyut, Putar, Melayang)
   ========================================================================== */

/* Keyframes */
@keyframes undig-goyang1 {
    0% { transform: rotate(0deg) scale(1); }
    50% { transform: rotate(6deg) scale(1.18); }
    100% { transform: rotate(0deg) scale(1); }
}

@keyframes undig-goyang2 {
    0% { transform: rotate(0deg) scale(1); }
    25% { transform: rotate(-4deg) scale(1.05); }
    50% { transform: rotate(-8deg) scale(1.1); }
    75% { transform: rotate(-4deg) scale(1.05); }
    100% { transform: rotate(0deg) scale(1); }
}

@keyframes undig-goyang3 {
    0% { transform: rotate(0deg) scale(1); }
    25% { transform: rotate(-4deg) scale(1.1); }
    50% { transform: rotate(0deg) scale(1); }
    75% { transform: rotate(4deg) scale(1.1); }
    100% { transform: rotate(0deg) scale(1); }
}

@keyframes undig-goyang4 {
    0% { transform: rotate(0deg); }
    25% { transform: rotate(-4deg); }
    75% { transform: rotate(4deg); }
    100% { transform: rotate(0deg); }
}

@keyframes undig-zoom-pulse {
    0% { transform: scale(0.95); }
    60% { transform: scale(1); }
    100% { transform: scale(0.95); }
}

@keyframes undig-naikturun {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
    100% { transform: translateY(0px); }
}

@keyframes undig-naikturungoyang {
    0% { transform: scale(1.1); }
    25% { transform: scale(1.15) translateY(-10px); }
    75% { transform: scale(1.1) translateY(5px); }
    100% { transform: scale(1.1); }
}

@keyframes undig-kirikanan {
    0% { transform: translateX(0px); }
    50% { transform: translateX(-10px); }
    100% { transform: translateX(0px); }
}

@keyframes undig-ayun-gantung {
    0% { transform: rotate(0deg); }
    25% { transform: rotate(5deg); }
    75% { transform: rotate(-5deg); }
    100% { transform: rotate(0deg); }
}

@keyframes undig-putar-360 {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes undig-heartbeat {
    0% { transform: scale(1); }
    14% { transform: scale(1.18); }
    28% { transform: scale(1); }
    42% { transform: scale(1.18); }
    70% { transform: scale(1); }
    100% { transform: scale(1); }
}

@keyframes undig-glow-shimmer {
    0%, 100% { filter: drop-shadow(0 0 4px rgba(212, 175, 55, 0.3)) brightness(1); }
    50% { filter: drop-shadow(0 0 16px rgba(212, 175, 55, 0.85)) brightness(1.12); }
}

/* Also alias old keyframes for backward compatibility */
@keyframes goyang1 {
    0% { transform: rotate(0deg) scale(1); }
    50% { transform: rotate(6deg) scale(1.18); }
    100% { transform: rotate(0deg) scale(1); }
}
@keyframes goyang2 {
    0% { transform: rotate(0deg) scale(1); }
    25% { transform: rotate(-4deg) scale(1.05); }
    50% { transform: rotate(-8deg) scale(1.1); }
    75% { transform: rotate(-4deg) scale(1.05); }
    100% { transform: rotate(0deg) scale(1); }
}
@keyframes goyang3 {
    0% { transform: rotate(0deg) scale(1); }
    25% { transform: rotate(-4deg) scale(1.1); }
    50% { transform: rotate(0deg) scale(1); }
    75% { transform: rotate(4deg) scale(1.1); }
    100% { transform: rotate(0deg) scale(1); }
}
@keyframes goyang4 {
    0% { transform: rotate(0deg); }
    25% { transform: rotate(-4deg); }
    75% { transform: rotate(4deg); }
    100% { transform: rotate(0deg); }
}
@keyframes zoom {
    0% { transform: scale(0.95); }
    60% { transform: scale(1); }
    100% { transform: scale(0.95); }
}
@keyframes naikturun {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
    100% { transform: translateY(0px); }
}
@keyframes naikturungoyang {
    0% { transform: scale(1.1); }
    25% { transform: scale(1.15) translateY(-10px); }
    75% { transform: scale(1.1) translateY(5px); }
    100% { transform: scale(1.1); }
}

/* Ambient Classes */
.undig-goyang-1, .goyang-1,
.undig-goyang-1 img, .goyang-1 img {
    animation: undig-goyang1 7s infinite linear !important;
    transform-origin: center center;
    will-change: transform;
}

.undig-goyang-2, .goyang-2,
.undig-goyang-2 img, .goyang-2 img {
    animation: undig-goyang1 5s infinite linear !important;
    transform-origin: center center;
    will-change: transform;
}

.undig-goyang-3, .goyang-3,
.undig-goyang-3 img, .goyang-3 img {
    animation: undig-goyang1 3s infinite linear !important;
    transform-origin: center center;
    will-change: transform;
}

.undig-goyang-4, .goyang-4,
.undig-goyang-4 img, .goyang-4 img {
    animation: undig-goyang4 5s infinite linear !important;
    transform-origin: center center;
    will-change: transform;
}

.undig-zoom-pulse-1, .zoom-1,
.undig-zoom-pulse-1 img, .zoom-1 img {
    animation: undig-zoom-pulse 3s infinite ease-in-out !important;
    will-change: transform;
}

.undig-zoom-pulse-2, .zoom-2,
.undig-zoom-pulse-2 img, .zoom-2 img {
    animation: undig-zoom-pulse 2s infinite ease-in-out !important;
    will-change: transform;
}

.undig-naik-turun, .naik-turun,
.undig-naik-turun img, .naik-turun img {
    animation: undig-naikturun 2s infinite linear !important;
    will-change: transform;
}

.undig-naik-turun-goyang, .naik-turun-goyang,
.undig-naik-turun-goyang img, .naik-turun-goyang img {
    animation: undig-naikturungoyang 4s infinite linear !important;
    will-change: transform;
}

.undig-kiri-kanan, .undig-float-x,
.undig-kiri-kanan img, .undig-float-x img {
    animation: undig-kirikanan 3s infinite ease-in-out !important;
    will-change: transform;
}

.undig-ayun-gantung, .undig-swing,
.undig-ayun-gantung img, .undig-swing img {
    animation: undig-ayun-gantung 4s infinite ease-in-out !important;
    transform-origin: top center !important;
    will-change: transform;
}

.undig-putar-lambat, .undig-putar-lambat img {
    animation: undig-putar-360 20s infinite linear !important;
    transform-origin: center center !important;
    will-change: transform;
}

.undig-putar-sedang, .undig-putar-sedang img {
    animation: undig-putar-360 10s infinite linear !important;
    transform-origin: center center !important;
    will-change: transform;
}

.undig-heartbeat, .undig-denyut,
.undig-heartbeat img, .undig-denyut img {
    animation: undig-heartbeat 1.4s infinite ease-in-out !important;
    transform-origin: center center;
    will-change: transform;
}

.undig-kilau, .undig-glow-pulse,
.undig-kilau img, .undig-glow-pulse img {
    animation: undig-glow-shimmer 3s infinite ease-in-out !important;
    will-change: filter;
}

/* ======================================================
   WIDGET 12: UNDIG FALLING PARTICLES & PETALS EFFECT
   ====================================================== */
.undig-particles-wrapper {
    pointer-events: none !important;
    user-select: none !important;
    overflow: hidden;
    left: 0;
    top: 0;
    box-sizing: border-box;
}

.undig-particles-scope-fullscreen {
    position: fixed !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 9999;
}

.undig-particles-scope-section {
    position: absolute !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 1;
}

@media (max-width: 767px) {
    .undig-particles-wrapper.undig-hide-on-mobile {
        display: none !important;
    }
}

.undig-particles-container {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
}

.undig-particle-item {
    position: absolute;
    top: -50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    will-change: transform, opacity;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
}

/* Speed Presets */
.undig-particles-speed-slow .undig-particle-item {
    animation-duration: calc(14s + var(--undig-dur-offset, 0s));
}
.undig-particles-speed-normal .undig-particle-item {
    animation-duration: calc(9s + var(--undig-dur-offset, 0s));
}
.undig-particles-speed-fast .undig-particle-item {
    animation-duration: calc(6s + var(--undig-dur-offset, 0s));
}

/* Sway Keyframe Variations */
.undig-particles-wind-sway .undig-sway-1 {
    animation-name: undigParticleSway1;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
.undig-particles-wind-sway .undig-sway-2 {
    animation-name: undigParticleSway2;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
.undig-particles-wind-sway .undig-sway-3 {
    animation-name: undigParticleSway3;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.undig-particles-wind-straight .undig-particle-item {
    animation-name: undigParticleStraight;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.undig-particles-wind-right .undig-particle-item {
    animation-name: undigParticleDriftRight;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.undig-particles-wind-left .undig-particle-item {
    animation-name: undigParticleDriftLeft;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

/* Keyframes with 3D Transforms */
@keyframes undigParticleStraight {
    0% {
        transform: translate3d(0, -40px, 0) rotate(0deg) scale(var(--undig-scale, 1));
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    90% {
        opacity: 0.9;
    }
    100% {
        transform: translate3d(0, 105vh, 0) rotate(360deg) scale(var(--undig-scale, 1));
        opacity: 0;
    }
}

@keyframes undigParticleSway1 {
    0% {
        transform: translate3d(0, -40px, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(var(--undig-scale, 1));
        opacity: 0;
    }
    12% {
        opacity: 1;
    }
    30% {
        transform: translate3d(35px, 32vh, 0) rotateX(75deg) rotateY(35deg) rotateZ(60deg) scale(var(--undig-scale, 1));
    }
    60% {
        transform: translate3d(-35px, 65vh, 0) rotateX(150deg) rotateY(80deg) rotateZ(160deg) scale(var(--undig-scale, 1));
    }
    85% {
        opacity: 0.85;
    }
    100% {
        transform: translate3d(20px, 105vh, 0) rotateX(230deg) rotateY(140deg) rotateZ(320deg) scale(var(--undig-scale, 1));
        opacity: 0;
    }
}

@keyframes undigParticleSway2 {
    0% {
        transform: translate3d(0, -40px, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(var(--undig-scale, 1));
        opacity: 0;
    }
    15% {
        opacity: 1;
    }
    35% {
        transform: translate3d(-40px, 35vh, 0) rotateX(60deg) rotateY(45deg) rotateZ(-70deg) scale(var(--undig-scale, 1));
    }
    65% {
        transform: translate3d(30px, 68vh, 0) rotateX(130deg) rotateY(90deg) rotateZ(-180deg) scale(var(--undig-scale, 1));
    }
    88% {
        opacity: 0.85;
    }
    100% {
        transform: translate3d(-15px, 105vh, 0) rotateX(210deg) rotateY(160deg) rotateZ(-340deg) scale(var(--undig-scale, 1));
        opacity: 0;
    }
}

@keyframes undigParticleSway3 {
    0% {
        transform: translate3d(0, -40px, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(var(--undig-scale, 1));
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    45% {
        transform: translate3d(25px, 45vh, 0) rotateX(90deg) rotateY(60deg) rotateZ(110deg) scale(var(--undig-scale, 1));
    }
    75% {
        transform: translate3d(-20px, 78vh, 0) rotateX(170deg) rotateY(120deg) rotateZ(240deg) scale(var(--undig-scale, 1));
    }
    90% {
        opacity: 0.8;
    }
    100% {
        transform: translate3d(10px, 105vh, 0) rotateX(250deg) rotateY(180deg) rotateZ(360deg) scale(var(--undig-scale, 1));
        opacity: 0;
    }
}

@keyframes undigParticleDriftRight {
    0% {
        transform: translate3d(-20px, -40px, 0) rotate(0deg) scale(var(--undig-scale, 1));
        opacity: 0;
    }
    10% { opacity: 1; }
    90% { opacity: 0.85; }
    100% {
        transform: translate3d(120px, 105vh, 0) rotate(320deg) scale(var(--undig-scale, 1));
        opacity: 0;
    }
}

@keyframes undigParticleDriftLeft {
    0% {
        transform: translate3d(20px, -40px, 0) rotate(0deg) scale(var(--undig-scale, 1));
        opacity: 0;
    }
    10% { opacity: 1; }
    90% { opacity: 0.85; }
    100% {
        transform: translate3d(-120px, 105vh, 0) rotate(-320deg) scale(var(--undig-scale, 1));
        opacity: 0;
    }
}

/* Base Particle Shapes (Vectors via CSS data URI) */
.undig-particle-shape {
    display: block;
    width: var(--undig-particle-base-size, 24px);
    height: var(--undig-particle-base-size, 24px);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.undig-particle-img {
    width: var(--undig-particle-base-size, 24px);
    height: auto;
    max-width: 60px;
    object-fit: contain;
    display: block;
}

/* 1. Rose Petal SVG */
.undig-shape-rose_petals {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23d32f2f' d='M16 2 C8 2 3 10 3 18 C3 25 9 30 16 30 C23 30 29 25 29 18 C29 10 24 2 16 2 Z' opacity='0.9'/%3E%3Cpath fill='%23b71c1c' d='M16 4 C10 4 6 11 6 18 C6 23 10 27 16 28 Z' opacity='0.4'/%3E%3C/svg%3E");
    filter: drop-shadow(0 2px 4px rgba(183, 28, 28, 0.25));
}

/* 2. Sakura Petal SVG */
.undig-shape-sakura {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23f48fb1' d='M16 3 C10 3 5 9 5 17 C5 24 10 29 16 29 C22 29 27 24 27 17 C27 9 22 3 16 3 Z' opacity='0.9'/%3E%3Cpath fill='%23f06292' d='M16 3 C13 7 12 12 12 18 C12 24 14 27 16 29 C18 27 20 24 20 18 C20 12 19 7 16 3 Z' opacity='0.5'/%3E%3C/svg%3E");
    filter: drop-shadow(0 2px 4px rgba(240, 98, 146, 0.25));
}

/* 3. Golden Glitter Sparkle SVG */
.undig-shape-golden_glitter {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23ffd700' d='M16 0 L19 12 L31 16 L19 20 L16 32 L13 20 L1 16 L13 12 Z'/%3E%3Ccircle cx='16' cy='16' r='4' fill='%23fff' opacity='0.9'/%3E%3C/svg%3E");
    filter: drop-shadow(0 0 6px rgba(255, 215, 0, 0.7));
}

/* 4. Autumn Leaves SVG */
.undig-shape-autumn_leaves {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23e65100' d='M16 2 C22 8 28 14 28 20 C28 26 23 30 16 30 C9 30 4 26 4 20 C4 14 10 8 16 2 Z'/%3E%3Cpath fill='%23ff9800' d='M16 2 L16 30 M16 10 L24 16 M16 18 L24 24 M16 10 L8 16 M16 18 L8 24' stroke='%23bf360c' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
    filter: drop-shadow(0 2px 4px rgba(230, 81, 0, 0.3));
}

/* 5. Confetti SVG */
.undig-shape-confetti {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='4' width='16' height='10' rx='2' fill='%23e91e63' transform='rotate(25 12 12)'/%3E%3C/svg%3E");
    filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.15));
}
.undig-sway-1 .undig-shape-confetti {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='4' width='16' height='10' rx='2' fill='%232196f3' transform='rotate(-20 12 12)'/%3E%3C/svg%3E");
}
.undig-sway-2 .undig-shape-confetti {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='4' width='16' height='10' rx='2' fill='%23ffeb3b' transform='rotate(45 12 12)'/%3E%3C/svg%3E");
}
.undig-sway-3 .undig-shape-confetti {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='4' width='16' height='10' rx='2' fill='%234caf50' transform='rotate(15 12 12)'/%3E%3C/svg%3E");
}